@qingmingmu/components 0.1.0-beta.0

package/es/shared/components.CJqqdhuY.d.cts

@@ -0,0 +1,86 @@
+import { PropType, defineComponent, computed, openBlock, createElementBlock, normalizeStyle, normalizeClass, renderSlot } from 'vue';
+import { _ as _export_sfc } from './components.OJRSZE6i.cjs';
+
+/**
+ * QmSpace 组件类型定义（组件体系设计 §6.4：类型先行）
+ * 布局-03：flex 间距容器，子元素间自动 gap；方向 / 间距 / 换行 / 对齐 / 填满。
+ */
+
+/** 排列方向 */
+type SpaceDirection = 'horizontal' | 'vertical';
+/** 间距档位（§6.3：尺寸枚举统一 small | medium | large）+ 自定义 number */
+type SpaceSize = 'small' | 'medium' | 'large';
+/** 垂直对齐（align-items 语义） */
+type SpaceAlign = 'start' | 'end' | 'center' | 'baseline';
+/** props 声明（纯类型 + 默认值，供 SFC 与文档复用） */
+declare const spaceProps: {
+    /** 排列方向：horizontal / vertical */
+    readonly direction: {
+        readonly type: PropType<SpaceDirection>;
+        readonly default: "horizontal";
+    };
+    /** 间距：small / medium / large（消费分档 Token）；number 自定义（px） */
+    readonly size: {
+        readonly type: PropType<SpaceSize | number>;
+        readonly default: "medium";
+    };
+    /** 自动换行（换行后行距走 --qm-space-wrap-gap） */
+    readonly wrap: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    /** 垂直对齐：start / end / center / baseline */
+    readonly align: {
+        readonly type: PropType<SpaceAlign>;
+        readonly default: "center";
+    };
+    /** 填满：子元素 flex: 1 均分 */
+    readonly fill: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+};
+
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "QmSpace" },
+  __name: "space",
+  props: spaceProps,
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const enumSize = computed(
+      () => props.size === "small" || props.size === "medium" || props.size === "large" ? props.size : null
+    );
+    const modifierClass = computed(() => {
+      const classes = [`qm-space--${props.direction}`, `qm-space--align-${props.align}`];
+      if (enumSize.value) classes.push(`qm-space--${enumSize.value}`);
+      if (props.wrap) classes.push("qm-space--wrap");
+      if (props.fill) classes.push("qm-space--fill");
+      return classes;
+    });
+    const rootStyle = computed(() => ({
+      gap: typeof props.size === "number" ? `${props.size}px` : void 0
+    }));
+    const __returned__ = { props, enumSize, modifierClass, rootStyle };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	return openBlock(), createElementBlock(
+		"div",
+		{
+			class: normalizeClass(["qm-space", $setup.modifierClass]),
+			style: normalizeStyle($setup.rootStyle),
+			"data-qm": "space"
+		},
+		[renderSlot(_ctx.$slots, "default")],
+		6
+		/* CLASS, STYLE */
+	);
+}
+var Space = /*#__PURE__*/ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "F:\\软件开发\\青冥组件系统\\packages\\components\\src\\components\\space\\space.vue"]]);
+
+export { Space as S, spaceProps as s };
+export type { SpaceAlign as a, SpaceDirection as b, SpaceSize as c };

package/es/shared/components.CKbZKaMO.mjs

@@ -0,0 +1,221 @@
+import { defineComponent, reactive, provide, computed, openBlock, createElementBlock, normalizeClass, createElementVNode, Fragment, renderList, normalizeStyle, toDisplayString, renderSlot, createTextVNode, createCommentVNode, inject, onMounted, onBeforeUnmount, watch } from 'vue';
+import { _ as _export_sfc } from './components.pcqpp-6-.mjs';
+
+const tableProps = {
+  /** 表格数据 */
+  data: { type: Array, default: () => [] },
+  /** 列配置（prop/label/width/slotName），与默认插槽 QmTableColumn 二选一 */
+  columns: { type: Array, default: () => [] },
+  /** 是否显示边框 */
+  border: { type: Boolean, default: false },
+  /** 斑马纹 */
+  stripe: { type: Boolean, default: false },
+  /** 行 hover 高亮 */
+  hover: { type: Boolean, default: true },
+  /** 空态文案（empty 插槽可覆盖） */
+  emptyText: { type: String, default: "\u6682\u65E0\u6570\u636E" },
+  /** 行唯一标识字段（用于 :key；缺省用索引） */
+  rowKey: { type: String, default: "" }
+};
+const tableColumnContextKey = Symbol("qm-table-column");
+
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...{ name: "QmTable" },
+  __name: "table",
+  props: tableProps,
+  emits: ["rowClick"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const registeredColumns = reactive([]);
+    provide(tableColumnContextKey, {
+      register: (col) => {
+        registeredColumns.push(col);
+      },
+      unregister: (col) => {
+        const i = registeredColumns.indexOf(col);
+        if (i >= 0)
+          registeredColumns.splice(i, 1);
+      }
+    });
+    const columns = computed(
+      () => props.columns.length > 0 ? props.columns : registeredColumns
+    );
+    const modifierClass = computed(() => ({
+      "qm-table--border": props.border,
+      "qm-table--stripe": props.stripe,
+      "qm-table--hover": props.hover
+    }));
+    function columnWidthStyle(col) {
+      if (!col.width)
+        return void 0;
+      return { width: typeof col.width === "number" ? `${col.width}px` : col.width };
+    }
+    function rowKeyOf(row, index) {
+      if (props.rowKey && row[props.rowKey] != null)
+        return String(row[props.rowKey]);
+      return index;
+    }
+    function onRowClick(row, index) {
+      emit("rowClick", row, index);
+    }
+    const __returned__ = { props, emit, registeredColumns, columns, modifierClass, columnWidthStyle, rowKeyOf, onRowClick };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _hoisted_1 = {
+	key: 0,
+	class: "qm-table__inner"
+};
+const _hoisted_2 = { class: "qm-table__head" };
+const _hoisted_3 = { class: "qm-table__head-row" };
+const _hoisted_4 = { class: "qm-table__body" };
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = {
+	key: 1,
+	class: "qm-table__empty"
+};
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+	return openBlock(), createElementBlock(
+		"div",
+		{
+			class: normalizeClass(["qm-table", $setup.modifierClass]),
+			"data-qm": "table"
+		},
+		[
+			_ctx.data.length ? (openBlock(), createElementBlock("table", _hoisted_1, [createElementVNode("thead", _hoisted_2, [createElementVNode("tr", _hoisted_3, [(openBlock(true), createElementBlock(
+				Fragment,
+				null,
+				renderList($setup.columns, (col) => {
+					return openBlock(), createElementBlock(
+						"th",
+						{
+							key: col.prop,
+							class: "qm-table__cell qm-table__cell--head",
+							style: normalizeStyle($setup.columnWidthStyle(col)),
+							scope: "col"
+						},
+						toDisplayString(col.label),
+						5
+						/* TEXT, STYLE */
+					);
+				}),
+				128
+				/* KEYED_FRAGMENT */
+			))])]), createElementVNode("tbody", _hoisted_4, [(openBlock(true), createElementBlock(
+				Fragment,
+				null,
+				renderList(_ctx.data, (row, index) => {
+					return openBlock(), createElementBlock("tr", {
+						key: $setup.rowKeyOf(row, index),
+						class: "qm-table__row",
+						onClick: ($event) => $setup.onRowClick(row, index)
+					}, [(openBlock(true), createElementBlock(
+						Fragment,
+						null,
+						renderList($setup.columns, (col) => {
+							return openBlock(), createElementBlock(
+								"td",
+								{
+									key: col.prop,
+									class: "qm-table__cell",
+									style: normalizeStyle($setup.columnWidthStyle(col))
+								},
+								[col.slotName && _ctx.$slots[col.slotName] ? renderSlot(_ctx.$slots, col.slotName, {
+									row,
+									column: col,
+									index
+								}, undefined, undefined, 0) : (openBlock(), createElementBlock(
+									Fragment,
+									{ key: 1 },
+									[createTextVNode(
+										toDisplayString(row[col.prop]),
+										1
+										/* TEXT */
+									)],
+									64
+									/* STABLE_FRAGMENT */
+								))],
+								4
+								/* STYLE */
+							);
+						}),
+						128
+						/* KEYED_FRAGMENT */
+					))], 8, _hoisted_5);
+				}),
+				128
+				/* KEYED_FRAGMENT */
+			))])])) : (openBlock(), createElementBlock("div", _hoisted_6, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(
+				toDisplayString(_ctx.emptyText),
+				1
+				/* TEXT */
+			)])])),
+			createCommentVNode(" QmTableColumn 子项挂载点（renderless，仅向父级注册列配置） "),
+			renderSlot(_ctx.$slots, "default")
+		],
+		2
+		/* CLASS */
+	);
+}
+const Table = /*#__PURE__*/ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__file", "F:\\软件开发\\青冥组件系统\\packages\\components\\src\\components\\table\\table.vue"]]);
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "QmTableColumn" },
+  __name: "table-column",
+  props: {
+    /** 数据字段名（行对象取值键） */
+    prop: { type: String, required: true },
+    /** 列标题 */
+    label: { type: String, default: "" },
+    /** 列宽（number → px，string 原样） */
+    width: { type: [String, Number], default: void 0 },
+    /** 自定义单元格渲染：对应具名插槽 */
+    slotName: { type: String, default: "" }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const context = inject(tableColumnContextKey, null);
+    const state = reactive({
+      prop: props.prop,
+      label: props.label,
+      width: props.width,
+      slotName: props.slotName
+    });
+    onMounted(() => {
+      context?.register(state);
+    });
+    onBeforeUnmount(() => {
+      context?.unregister(state);
+    });
+    watch(
+      () => [props.prop, props.label, props.width, props.slotName],
+      () => {
+        state.prop = props.prop;
+        state.label = props.label;
+        state.width = props.width;
+        state.slotName = props.slotName;
+      }
+    );
+    const __returned__ = { props, context, state };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	return openBlock(), createElementBlock(
+		Fragment,
+		null,
+		[createCommentVNode(" renderless：仅注册列配置；v-if=false 保证模板根节点合法且不渲染 DOM "), createCommentVNode("v-if", true)],
+		2112
+		/* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+	);
+}
+const tableColumn = /*#__PURE__*/ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "F:\\软件开发\\青冥组件系统\\packages\\components\\src\\components\\table\\table-column.vue"]]);
+
+export { Table as T, tableColumnContextKey as a, tableProps as b, tableColumn as t };

package/es/shared/components.CLBPin--.cjs

@@ -0,0 +1,306 @@
+'use strict';
+
+const vue = require('vue');
+const exportHelper = require('./components.DUidQ77e.cjs');
+
+const checkboxProps = {
+  /** 受控值：独立使用为 boolean；组内由 QmCheckboxGroup 接管（子项读组上下文） */
+  modelValue: {
+    type: [Boolean, String, Number],
+    default: false
+  },
+  /** 选项值（组模式下用于数组增删；独立使用时忽略） */
+  value: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  /** 禁用单项 */
+  disabled: { type: Boolean, default: false },
+  /** 半选态（仅视觉横线图标，不影响 checked 值；aria-checked=mixed） */
+  indeterminate: { type: Boolean, default: false },
+  /** 标签文案（缺省时用默认插槽） */
+  label: { type: String, default: "" },
+  /** 尺寸（组内由 QmCheckboxGroup 覆盖） */
+  size: {
+    type: String,
+    default: "medium"
+  }
+};
+const checkboxGroupProps = {
+  /** 受控值（v-model，数组） */
+  modelValue: {
+    type: Array,
+    default: () => []
+  },
+  /** 整组禁用（子项仍可单项 disabled） */
+  disabled: { type: Boolean, default: false },
+  /** 统一尺寸（覆盖子项 size） */
+  size: {
+    type: String,
+    default: "medium"
+  },
+  /** 布局方向 */
+  direction: {
+    type: String,
+    default: "horizontal"
+  },
+  /** 最大可选数（达到后未选项禁用，aria-disabled） */
+  max: { type: Number, default: void 0 }
+};
+const checkboxGroupKey = Symbol("qm-checkbox-group");
+
+function isValueInArray(arr, value) {
+  return value !== void 0 && arr.includes(value);
+}
+function isMaxBlocked(selectedCount, max, currentlyChecked) {
+  if (max === void 0 || currentlyChecked)
+    return false;
+  return selectedCount >= max;
+}
+function useCheckbox(options) {
+  const { modelValue, value, disabled, indeterminate, size, emitUpdate, emitChange } = options;
+  const group = vue.inject(checkboxGroupKey, null);
+  const isChecked = vue.computed(() => {
+    if (group) {
+      return isValueInArray(group.modelValue.value, value.value);
+    }
+    return Boolean(modelValue.value);
+  });
+  const isIndeterminate = vue.computed(() => indeterminate.value);
+  const ariaChecked = vue.computed(() => {
+    if (isIndeterminate.value)
+      return "mixed";
+    return isChecked.value ? "true" : "false";
+  });
+  const isDisabled = vue.computed(() => {
+    if (disabled.value)
+      return true;
+    return group ? group.disabled.value : false;
+  });
+  const maxBlocked = vue.computed(() => {
+    if (!group)
+      return false;
+    return isMaxBlocked(group.selectedCount.value, group.max.value, isChecked.value);
+  });
+  const isEffectivelyDisabled = vue.computed(() => isDisabled.value || maxBlocked.value);
+  const effectiveSize = vue.computed(() => {
+    return group ? group.size.value : size.value;
+  });
+  function toggle() {
+    if (isEffectivelyDisabled.value)
+      return false;
+    if (group) {
+      const v = value.value;
+      if (v === void 0)
+        return false;
+      return group.toggleValue(v);
+    }
+    const next = !isChecked.value;
+    emitUpdate(next);
+    emitChange(next);
+    return true;
+  }
+  function handleInputChange(event) {
+    const input = event.target;
+    const changed = toggle();
+    if (!changed) {
+      input.checked = isChecked.value;
+    }
+  }
+  return {
+    isChecked,
+    isIndeterminate,
+    ariaChecked,
+    isDisabled,
+    maxBlocked,
+    isEffectivelyDisabled,
+    effectiveSize,
+    toggle,
+    handleInputChange
+  };
+}
+
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  ...{ name: "QmCheckbox" },
+  __name: "checkbox",
+  props: checkboxProps,
+  emits: ["update:modelValue", "change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const modelValue = vue.computed(() => props.modelValue);
+    const value = vue.computed(() => props.value);
+    const disabled = vue.computed(() => props.disabled);
+    const indeterminate = vue.computed(() => props.indeterminate);
+    const size = vue.computed(() => props.size);
+    const cb = useCheckbox({
+      modelValue,
+      value,
+      disabled,
+      indeterminate,
+      size,
+      emitUpdate: (v) => emit("update:modelValue", v),
+      emitChange: (v) => emit("change", v)
+    });
+    const {
+      isChecked,
+      isIndeterminate,
+      ariaChecked,
+      isDisabled,
+      maxBlocked,
+      effectiveSize,
+      handleInputChange
+    } = cb;
+    const rootClass = vue.computed(() => ({
+      "qm-checkbox--checked": isChecked.value && !isIndeterminate.value,
+      "qm-checkbox--indeterminate": isIndeterminate.value,
+      "qm-checkbox--disabled": isDisabled.value,
+      "qm-checkbox--max-blocked": maxBlocked.value,
+      [`qm-checkbox--${effectiveSize.value}`]: true
+    }));
+    const inputRef = vue.ref(null);
+    vue.watch(
+      isIndeterminate,
+      (val) => {
+        if (inputRef.value)
+          inputRef.value.indeterminate = val;
+      },
+      { immediate: true }
+    );
+    vue.onMounted(() => {
+      if (inputRef.value)
+        inputRef.value.indeterminate = isIndeterminate.value;
+    });
+    const __returned__ = { props, emit, modelValue, value, disabled, indeterminate, size, cb, isChecked, isIndeterminate, ariaChecked, isDisabled, maxBlocked, effectiveSize, handleInputChange, rootClass, inputRef };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _hoisted_1$1 = [
+	"checked",
+	"disabled",
+	"aria-checked",
+	"aria-disabled"
+];
+const _hoisted_2 = {
+	class: "qm-checkbox__box",
+	"aria-hidden": "true"
+};
+const _hoisted_3 = { class: "qm-checkbox__label" };
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+	const _component_QmIcon = vue.resolveComponent("QmIcon");
+	return vue.openBlock(), vue.createElementBlock(
+		"label",
+		{ class: vue.normalizeClass(["qm-checkbox", $setup.rootClass]) },
+		[
+			vue.createCommentVNode(" 原生 input（视觉隐藏，保留表单语义 + Space/点击） "),
+			vue.createElementVNode("input", {
+				ref: "inputRef",
+				type: "checkbox",
+				class: "qm-checkbox__input",
+				checked: $setup.isChecked,
+				disabled: $setup.isDisabled,
+				"aria-checked": $setup.ariaChecked,
+				"aria-disabled": $setup.maxBlocked || undefined,
+				onChange: _cache[0] || (_cache[0] = (...args) => $setup.handleInputChange && $setup.handleInputChange(...args))
+			}, null, 40, _hoisted_1$1),
+			vue.createCommentVNode(" 自定义方框（视觉） "),
+			vue.createElementVNode("span", _hoisted_2, [vue.createCommentVNode(" 选中对勾 "), $setup.isChecked && !$setup.isIndeterminate ? (vue.openBlock(), vue.createBlock(_component_QmIcon, {
+				key: 0,
+				name: "check",
+				class: "qm-checkbox__check"
+			})) : $setup.isIndeterminate ? (vue.openBlock(), vue.createElementBlock(
+				vue.Fragment,
+				{ key: 1 },
+				[vue.createCommentVNode(" 半选横线 "), vue.createVNode(_component_QmIcon, {
+					name: "minus",
+					class: "qm-checkbox__check"
+				})],
+				2112
+				/* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+			)) : vue.createCommentVNode("v-if", true)]),
+			vue.createCommentVNode(" 标签 "),
+			vue.createElementVNode("span", _hoisted_3, [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createTextVNode(
+				vue.toDisplayString(_ctx.label),
+				1
+				/* TEXT */
+			)])])
+		],
+		2
+		/* CLASS */
+	);
+}
+const Checkbox = /*#__PURE__*/ exportHelper._export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__file", "F:\\软件开发\\青冥组件系统\\packages\\components\\src\\components\\checkbox\\checkbox.vue"]]);
+
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{ name: "QmCheckboxGroup" },
+  __name: "checkbox-group",
+  props: checkboxGroupProps,
+  emits: ["update:modelValue", "change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const modelValue = vue.computed(() => props.modelValue);
+    const disabled = vue.computed(() => props.disabled);
+    const size = vue.computed(() => props.size);
+    const max = vue.computed(() => props.max);
+    const selectedCount = vue.computed(() => props.modelValue.length);
+    function toggleValue(value) {
+      const cur = [...props.modelValue];
+      const idx = cur.indexOf(value);
+      if (idx >= 0) {
+        cur.splice(idx, 1);
+        emit("update:modelValue", cur);
+        emit("change", cur);
+        return true;
+      }
+      if (props.max !== void 0 && cur.length >= props.max) {
+        return false;
+      }
+      cur.push(value);
+      emit("update:modelValue", cur);
+      emit("change", cur);
+      return true;
+    }
+    const context = {
+      name: "QmCheckboxGroup",
+      modelValue,
+      disabled,
+      size,
+      max,
+      selectedCount,
+      toggleValue
+    };
+    vue.provide(checkboxGroupKey, context);
+    const rootClass = vue.computed(() => ({
+      "qm-checkbox-group--vertical": props.direction === "vertical",
+      "qm-checkbox-group--disabled": props.disabled
+    }));
+    const __returned__ = { props, emit, modelValue, disabled, size, max, selectedCount, toggleValue, context, rootClass };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _hoisted_1 = ["aria-disabled"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	return vue.openBlock(), vue.createElementBlock("div", {
+		class: vue.normalizeClass(["qm-checkbox-group", $setup.rootClass]),
+		role: "group",
+		"aria-label": "多选组",
+		"aria-disabled": $setup.disabled || undefined
+	}, [vue.renderSlot(_ctx.$slots, "default")], 10, _hoisted_1);
+}
+const checkboxGroup = /*#__PURE__*/ exportHelper._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "F:\\软件开发\\青冥组件系统\\packages\\components\\src\\components\\checkbox\\checkbox-group.vue"]]);
+
+exports.Checkbox = Checkbox;
+exports.checkboxGroup = checkboxGroup;
+exports.checkboxGroupKey = checkboxGroupKey;
+exports.checkboxGroupProps = checkboxGroupProps;
+exports.checkboxProps = checkboxProps;
+exports.isMaxBlocked = isMaxBlocked;
+exports.isValueInArray = isValueInArray;
+exports.useCheckbox = useCheckbox;