@cynnie/ui-shadcn 0.1.0

package/dist/ProConfirmButton-zcvp7NcN.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProConfirmButton-zcvp7NcN.js","names":["$attrs","title","cancelText","danger","okText"],"sources":["../src/components/ui/popover/Popover.vue","../src/components/ui/popover/Popover.vue","../src/components/ui/popover/PopoverContent.vue","../src/components/ui/popover/PopoverContent.vue","../src/components/ui/popover/PopoverTrigger.vue","../src/components/ui/popover/PopoverTrigger.vue","../src/components/ProConfirmButton/index.vue","../src/components/ProConfirmButton/index.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PopoverRoot, type PopoverRootEmits, type PopoverRootProps, useForwardPropsEmits } from \"reka-ui\";\n\nconst props = defineProps<PopoverRootProps>();\nconst emits = defineEmits<PopoverRootEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverRoot data-slot=\"popover\" v-bind=\"forwarded\">\n    <slot />\n  </PopoverRoot>\n</template>\n","<script lang=\"ts\" setup>\nimport { PopoverRoot, type PopoverRootEmits, type PopoverRootProps, useForwardPropsEmits } from \"reka-ui\";\n\nconst props = defineProps<PopoverRootProps>();\nconst emits = defineEmits<PopoverRootEmits>();\n\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverRoot data-slot=\"popover\" v-bind=\"forwarded\">\n    <slot />\n  </PopoverRoot>\n</template>\n","<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from \"vue\";\nimport { PopoverContent, type PopoverContentEmits, type PopoverContentProps, PopoverPortal, useForwardPropsEmits } from \"reka-ui\";\nimport { cn } from \"../../../lib/utils\";\n\nconst props = withDefaults(defineProps<PopoverContentProps & { class?: HTMLAttributes[\"class\"] }>(), {\n  sideOffset: 4,\n});\nconst emits = defineEmits<PopoverContentEmits>();\n\nconst delegatedProps = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverPortal>\n    <PopoverContent\n      data-slot=\"popover-content\"\n      v-bind=\"delegatedProps\"\n      :class=\"\n        cn(\n          'bg-popover text-popover-foreground 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-[1100] w-72 origin-(--reka-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n          props.class,\n        )\n      \"\n    >\n      <slot />\n    </PopoverContent>\n  </PopoverPortal>\n</template>\n","<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from \"vue\";\nimport { PopoverContent, type PopoverContentEmits, type PopoverContentProps, PopoverPortal, useForwardPropsEmits } from \"reka-ui\";\nimport { cn } from \"../../../lib/utils\";\n\nconst props = withDefaults(defineProps<PopoverContentProps & { class?: HTMLAttributes[\"class\"] }>(), {\n  sideOffset: 4,\n});\nconst emits = defineEmits<PopoverContentEmits>();\n\nconst delegatedProps = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n  <PopoverPortal>\n    <PopoverContent\n      data-slot=\"popover-content\"\n      v-bind=\"delegatedProps\"\n      :class=\"\n        cn(\n          'bg-popover text-popover-foreground 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-[1100] w-72 origin-(--reka-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n          props.class,\n        )\n      \"\n    >\n      <slot />\n    </PopoverContent>\n  </PopoverPortal>\n</template>\n","<script lang=\"ts\" setup>\nimport { PopoverTrigger, type PopoverTriggerProps } from \"reka-ui\";\n\nconst props = defineProps<PopoverTriggerProps>();\n</script>\n\n<template>\n  <PopoverTrigger data-slot=\"popover-trigger\" v-bind=\"props\">\n    <slot />\n  </PopoverTrigger>\n</template>\n","<script lang=\"ts\" setup>\nimport { PopoverTrigger, type PopoverTriggerProps } from \"reka-ui\";\n\nconst props = defineProps<PopoverTriggerProps>();\n</script>\n\n<template>\n  <PopoverTrigger data-slot=\"popover-trigger\" v-bind=\"props\">\n    <slot />\n  </PopoverTrigger>\n</template>\n","<script lang=\"ts\">\nimport { CircleAlertIcon } from \"lucide-vue-next\";\nexport default { components: { CircleAlertIcon } };\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { Button } from \"../ui/button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../ui/popover\";\nimport { Loader } from \"../ui/loader\";\n\ndefineOptions({\n  name: \"ProConfirmButton\",\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    /** 气泡确认框标题 */\n    title?: string;\n    /** 确认执行函数：返回 Promise 时确认按钮自动进入 loading */\n    onConfirm?: () => Promise<any> | any;\n    /** 按钮风格，对齐 antd 的 type */\n    type?: \"primary\" | \"default\" | \"dashed\" | \"text\" | \"link\";\n    /** 危险按钮（红色） */\n    danger?: boolean;\n    /** 确认按钮文案 */\n    okText?: string;\n    /** 取消按钮文案 */\n    cancelText?: string;\n  }>(),\n  {\n    title: \"确定执行此操作吗？\",\n    type: \"default\",\n    danger: false,\n    okText: \"确 定\",\n    cancelText: \"取 消\",\n  },\n);\n\nconst isLoading = ref(false);\nconst popOpen = ref(false);\n\nconst variant = props.danger ? \"destructive\" : props.type === \"primary\" ? \"default\" : \"outline\";\n\nasync function handleConfirm() {\n  if (!props.onConfirm) {\n    popOpen.value = false;\n    return;\n  }\n  const result = props.onConfirm();\n  if (result instanceof Promise) {\n    isLoading.value = true;\n    try {\n      await result;\n    } finally {\n      isLoading.value = false;\n      popOpen.value = false;\n    }\n  } else {\n    popOpen.value = false;\n  }\n}\n</script>\n\n<template>\n  <Popover v-model:open=\"popOpen\">\n    <PopoverTrigger as-child>\n      <Button :variant=\"variant\" v-bind=\"{ ...$attrs, class: undefined }\" :class=\"($attrs.class as any)\">\n        <slot></slot>\n      </Button>\n    </PopoverTrigger>\n    <PopoverContent class=\"w-auto max-w-[280px] p-4\">\n      <div class=\"flex items-start gap-2\">\n        <CircleAlertIcon class=\"mt-0.5 size-4 text-amber-500 shrink-0\" />\n        <div class=\"text-sm\">{{ title }}</div>\n      </div>\n      <div class=\"mt-4 flex justify-end gap-2\">\n        <Button size=\"sm\" variant=\"outline\" @click=\"popOpen = false\">{{ cancelText }}</Button>\n        <Button size=\"sm\" :variant=\"danger ? 'destructive' : 'default'\" :disabled=\"isLoading || undefined\" @click=\"handleConfirm\">\n          <Loader v-if=\"isLoading\" class=\"text-current\" />\n          {{ okText }}\n        </Button>\n      </div>\n    </PopoverContent>\n  </Popover>\n</template>\n","<script lang=\"ts\">\nimport { CircleAlertIcon } from \"lucide-vue-next\";\nexport default { components: { CircleAlertIcon } };\n</script>\n\n<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { Button } from \"../ui/button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../ui/popover\";\nimport { Loader } from \"../ui/loader\";\n\ndefineOptions({\n  name: \"ProConfirmButton\",\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    /** 气泡确认框标题 */\n    title?: string;\n    /** 确认执行函数：返回 Promise 时确认按钮自动进入 loading */\n    onConfirm?: () => Promise<any> | any;\n    /** 按钮风格，对齐 antd 的 type */\n    type?: \"primary\" | \"default\" | \"dashed\" | \"text\" | \"link\";\n    /** 危险按钮（红色） */\n    danger?: boolean;\n    /** 确认按钮文案 */\n    okText?: string;\n    /** 取消按钮文案 */\n    cancelText?: string;\n  }>(),\n  {\n    title: \"确定执行此操作吗？\",\n    type: \"default\",\n    danger: false,\n    okText: \"确 定\",\n    cancelText: \"取 消\",\n  },\n);\n\nconst isLoading = ref(false);\nconst popOpen = ref(false);\n\nconst variant = props.danger ? \"destructive\" : props.type === \"primary\" ? \"default\" : \"outline\";\n\nasync function handleConfirm() {\n  if (!props.onConfirm) {\n    popOpen.value = false;\n    return;\n  }\n  const result = props.onConfirm();\n  if (result instanceof Promise) {\n    isLoading.value = true;\n    try {\n      await result;\n    } finally {\n      isLoading.value = false;\n      popOpen.value = false;\n    }\n  } else {\n    popOpen.value = false;\n  }\n}\n</script>\n\n<template>\n  <Popover v-model:open=\"popOpen\">\n    <PopoverTrigger as-child>\n      <Button :variant=\"variant\" v-bind=\"{ ...$attrs, class: undefined }\" :class=\"($attrs.class as any)\">\n        <slot></slot>\n      </Button>\n    </PopoverTrigger>\n    <PopoverContent class=\"w-auto max-w-[280px] p-4\">\n      <div class=\"flex items-start gap-2\">\n        <CircleAlertIcon class=\"mt-0.5 size-4 text-amber-500 shrink-0\" />\n        <div class=\"text-sm\">{{ title }}</div>\n      </div>\n      <div class=\"mt-4 flex justify-end gap-2\">\n        <Button size=\"sm\" variant=\"outline\" @click=\"popOpen = false\">{{ cancelText }}</Button>\n        <Button size=\"sm\" :variant=\"danger ? 'destructive' : 'default'\" :disabled=\"isLoading || undefined\" @click=\"handleConfirm\">\n          <Loader v-if=\"isLoading\" class=\"text-current\" />\n          {{ okText }}\n        </Button>\n      </div>\n    </PopoverContent>\n  </Popover>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;ECMA,MAAM,YAAY,qBAHJ,SACA,OAEsC;;uBAIlD,YAEc,MAAA,YAAA,EAFd,WAEc,EAFD,aAAU,WAAS,EAAS,MAAA,UAAS,CAAA,EAAA;2BACxC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EENZ,MAAM,QAAQ;EAKd,MAAM,iBAAiB,qBAAqB,OAF9B,OAE2C;;uBAIvD,YAagB,MAAA,cAAA,EAAA,MAAA;2BADG,CAXjB,YAWiB,MAAA,eAAA,EAXjB,WAWiB,EAVf,aAAU,mBAAiB,EACnB,MAAA,eAAc,EAAA,EACrB,OAAgB,MAAA,GAAE,CAAA,qeAA2f,MAAM,MAAA,EAAA,CAAA,EAAA;4BAO5gB,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;;;;;;;;;;;;EEtBd,MAAM,QAAQ;;uBAIZ,YAEiB,MAAA,eAAA,EAFjB,WAEiB,EAFD,aAAU,mBAAiB,EAAS,MAAK,EAAA;2BAC/C,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;;;;;;;CENK,YAAY,EAAE,iBAAiB;;;;;;;;;;;;;;;;EAchD,MAAM,QAAQ;EAwBd,MAAM,YAAY,IAAI,MAAM;EAC5B,MAAM,UAAU,IAAI,MAAM;EAE1B,MAAM,UAAU,MAAM,SAAS,gBAAgB,MAAM,SAAS,YAAY,YAAY;EAEtF,eAAe,gBAAgB;AAC7B,OAAI,CAAC,MAAM,WAAW;AACpB,YAAQ,QAAQ;AAChB;;GAEF,MAAM,SAAS,MAAM,WAAW;AAChC,OAAI,kBAAkB,SAAS;AAC7B,cAAU,QAAQ;AAClB,QAAI;AACF,WAAM;cACE;AACR,eAAU,QAAQ;AAClB,aAAQ,QAAQ;;SAGlB,SAAQ,QAAQ;;;uBAMlB,YAmBU,MAAA,gBAAA,EAAA;IAnBO,MAAM,QAAA;mEAAO,QAAA;;2BAKX,CAJjB,YAIiB,MAAA,uBAAA,EAAA,EAJD,YAAA,IAAQ,EAAA;4BAGb,CAFT,YAES,MAAA,eAAA,EAFT,WAES,EAFA,SAAS,MAAA,QAAO,EAAA,EAAA;MAAA,GAAeA,KAAAA;MAAM,OAAS,KAAA;MAAS,EAAA,EAAK,OAAQA,KAAAA,OAAO,OAAA,CAAA,EAAA;6BACrE,CAAb,WAAa,KAAA,QAAA,UAAA,CAAA,CAAA;;;;QAGjB,YAYiB,MAAA,uBAAA,EAAA,EAZD,OAAM,4BAA0B,EAAA;4BAIxC,CAHN,mBAGM,OAHN,YAGM,CAFJ,YAAiE,MAAA,gBAAA,EAAA,EAAhD,OAAM,yCAAuC,CAAA,EAC9D,mBAAsC,OAAtC,YAAsC,gBAAdC,KAAAA,MAAK,EAAA,EAAA,CAAA,CAAA,EAE/B,mBAMM,OANN,YAMM,CALJ,YAAsF,MAAA,eAAA,EAAA;MAA9E,MAAK;MAAK,SAAQ;MAAW,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,QAAO;;6BAA0B,CAAA,gBAAA,gBAAbC,KAAAA,WAAU,EAAA,EAAA,CAAA,CAAA;;SAC1E,YAGS,MAAA,eAAA,EAAA;MAHD,MAAK;MAAM,SAASC,KAAAA,SAAM,gBAAA;MAA+B,UAAU,UAAA,SAAa,KAAA;MAAY,SAAO;;6BACzD,CAAlC,UAAA,SAAA,WAAA,EAAd,YAAgD,MAAA,eAAA,EAAA;;OAAvB,OAAM;0DAAiB,MAChD,gBAAGC,KAAAA,OAAM,EAAA,EAAA,CAAA,CAAA"}

package/dist/ProDescriptions-B1znLzkY.js

@@ -0,0 +1,45 @@
+import { t as cn } from "./utils-Dg1mr-yh.js";
+import { Fragment, computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, unref } from "vue";
+var ProDescriptions_default = /* @__PURE__ */ defineComponent({
+	name: "ProDescriptions",
+	inheritAttrs: false,
+	__name: "index",
+	props: {
+		items: {},
+		data: {},
+		emptyText: {},
+		bordered: { type: Boolean },
+		column: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const rows = computed(() => props.items.map((item) => ({
+			label: item.label,
+			value: renderValue(item)
+		})));
+		function renderValue(item) {
+			const value = props.data?.[item.key];
+			if (item.render) return item.render(value, props.data);
+			if (value === void 0 || value === null || value === "") return props.emptyText ?? "-";
+			return value;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				..._ctx.$attrs,
+				class: void 0,
+				style: void 0
+			}, {
+				class: unref(cn)("grid gap-x-8 gap-y-0 text-sm", _ctx.$attrs.class),
+				style: _ctx.$attrs.style
+			}), [(openBlock(true), createElementBlock(Fragment, null, renderList(rows.value, (row) => {
+				return openBlock(), createElementBlock(Fragment, { key: row.label }, [createElementVNode("div", { class: normalizeClass(["py-3 text-muted-foreground text-sm", _ctx.bordered ? "border-b px-4 bg-muted/40" : "border-b"]) }, toDisplayString(row.label), 3), createElementVNode("div", { class: normalizeClass(["py-3 border-b", _ctx.bordered ? "px-4" : ""]) }, [renderSlot(_ctx.$slots, "value", {
+					label: row.label,
+					value: row.value
+				}, () => [createTextVNode(toDisplayString(row.value), 1)])], 2)], 64);
+			}), 128))], 16);
+		};
+	}
+});
+export { ProDescriptions_default as t };
+
+//# sourceMappingURL=ProDescriptions-B1znLzkY.js.map

package/dist/ProDescriptions-B1znLzkY.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProDescriptions-B1znLzkY.js","names":["$attrs","bordered"],"sources":["../src/components/ProDescriptions/index.vue","../src/components/ProDescriptions/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { cn } from \"../../lib/utils\";\n\ndefineOptions({\n  name: \"ProDescriptions\",\n  inheritAttrs: false,\n});\n\nexport interface DescriptionItem {\n  /** 标签 */\n  label: string;\n  /** 字段名 */\n  key: string;\n  /** 自定义渲染，返回字符串或 vnode */\n  render?: (value: any, record: Record<string, any>) => any;\n}\n\nconst props = defineProps<{\n  /** 描述项配置 */\n  items: DescriptionItem[];\n  /** 数据对象 */\n  data: Record<string, any>;\n  /** 空值占位符 */\n  emptyText?: string;\n  /** 是否带边框（对齐 antd 的 bordered） */\n  bordered?: boolean;\n  /** 每行列数 */\n  column?: string | number;\n}>();\n\nconst rows = computed(() =>\n  props.items.map((item) => ({\n    label: item.label,\n    value: renderValue(item),\n  })),\n);\n\nfunction renderValue(item: DescriptionItem) {\n  const value = props.data?.[item.key];\n  if (item.render) return item.render(value, props.data);\n  if (value === undefined || value === null || value === \"\") return props.emptyText ?? \"-\";\n  return value;\n}\n</script>\n\n<template>\n  <div v-bind=\"{ ...$attrs, class: undefined, style: undefined }\" :class=\"cn('grid gap-x-8 gap-y-0 text-sm', ($attrs.class as any))\" :style=\"($attrs.style as any)\">\n    <template v-for=\"row in rows\" :key=\"row.label\">\n      <div\n        class=\"py-3 text-muted-foreground text-sm\"\n        :class=\"bordered ? 'border-b px-4 bg-muted/40' : 'border-b'\"\n      >\n        {{ row.label }}\n      </div>\n      <div class=\"py-3 border-b\" :class=\"bordered ? 'px-4' : ''\">\n        <slot name=\"value\" :label=\"row.label\" :value=\"row.value\">\n          {{ row.value }}\n        </slot>\n      </div>\n    </template>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { cn } from \"../../lib/utils\";\n\ndefineOptions({\n  name: \"ProDescriptions\",\n  inheritAttrs: false,\n});\n\nexport interface DescriptionItem {\n  /** 标签 */\n  label: string;\n  /** 字段名 */\n  key: string;\n  /** 自定义渲染，返回字符串或 vnode */\n  render?: (value: any, record: Record<string, any>) => any;\n}\n\nconst props = defineProps<{\n  /** 描述项配置 */\n  items: DescriptionItem[];\n  /** 数据对象 */\n  data: Record<string, any>;\n  /** 空值占位符 */\n  emptyText?: string;\n  /** 是否带边框（对齐 antd 的 bordered） */\n  bordered?: boolean;\n  /** 每行列数 */\n  column?: string | number;\n}>();\n\nconst rows = computed(() =>\n  props.items.map((item) => ({\n    label: item.label,\n    value: renderValue(item),\n  })),\n);\n\nfunction renderValue(item: DescriptionItem) {\n  const value = props.data?.[item.key];\n  if (item.render) return item.render(value, props.data);\n  if (value === undefined || value === null || value === \"\") return props.emptyText ?? \"-\";\n  return value;\n}\n</script>\n\n<template>\n  <div v-bind=\"{ ...$attrs, class: undefined, style: undefined }\" :class=\"cn('grid gap-x-8 gap-y-0 text-sm', ($attrs.class as any))\" :style=\"($attrs.style as any)\">\n    <template v-for=\"row in rows\" :key=\"row.label\">\n      <div\n        class=\"py-3 text-muted-foreground text-sm\"\n        :class=\"bordered ? 'border-b px-4 bg-muted/40' : 'border-b'\"\n      >\n        {{ row.label }}\n      </div>\n      <div class=\"py-3 border-b\" :class=\"bordered ? 'px-4' : ''\">\n        <slot name=\"value\" :label=\"row.label\" :value=\"row.value\">\n          {{ row.value }}\n        </slot>\n      </div>\n    </template>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;ECkBA,MAAM,QAAQ;EAad,MAAM,OAAO,eACX,MAAM,MAAM,KAAK,UAAU;GACzB,OAAO,KAAK;GACZ,OAAO,YAAY,KAAK;GACzB,EAAE,CACJ;EAED,SAAS,YAAY,MAAuB;GAC1C,MAAM,QAAQ,MAAM,OAAO,KAAK;AAChC,OAAI,KAAK,OAAQ,QAAO,KAAK,OAAO,OAAO,MAAM,KAAK;AACtD,OAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GAAI,QAAO,MAAM,aAAa;AACrF,UAAO;;;uBAKP,mBAcM,OAdN,WAcM;IAAA,GAdYA,KAAAA;IAAM,OAAS,KAAA;IAAS,OAAS,KAAA;IAAS,EAAA;IAAK,OAAO,MAAA,GAAE,CAAA,gCAAkCA,KAAAA,OAAO,MAAK;IAAY,OAAQA,KAAAA,OAAO;0BACjJ,mBAYW,UAAA,MAAA,WAZa,KAAA,QAAP,QAAG;4DAAgB,IAAI,OAAA,EAAA,CACtC,mBAKM,OAAA,EAJJ,OAAK,eAAA,CAAC,sCACEC,KAAAA,WAAQ,8BAAA,WAAA,CAAA,EAAA,EAAA,gBAEb,IAAI,MAAK,EAAA,EAAA,EAEd,mBAIM,OAAA,EAJD,OAAK,eAAA,CAAC,iBAAwBA,KAAAA,WAAQ,SAAA,GAAA,CAAA,EAAA,EAAA,CACzC,WAEO,KAAA,QAAA,SAAA;KAFa,OAAO,IAAI;KAAQ,OAAO,IAAI;aAE3C,CAAA,gBAAA,gBADF,IAAI,MAAK,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA"}