@xihan-ui/vue 3.1.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/CHANGELOG.md +160 -0
  2. package/dist/components/carousel/carousel.d.ts +7 -1
  3. package/dist/components/carousel/carousel.d.ts.map +1 -1
  4. package/dist/components/carousel/carousel.js +1 -0
  5. package/dist/components/carousel/carousel.js.map +1 -1
  6. package/dist/components/cartesian-chart/cartesian-chart.d.ts.map +1 -1
  7. package/dist/components/cartesian-chart/cartesian-chart.js +2 -2
  8. package/dist/components/cartesian-chart/cartesian-chart.js.map +1 -1
  9. package/dist/components/cascader/cascader.js +2 -1
  10. package/dist/components/cascader/cascader.js.map +1 -1
  11. package/dist/components/citation/citation.d.ts.map +1 -1
  12. package/dist/components/citation/citation.js +8 -6
  13. package/dist/components/citation/citation.js.map +1 -1
  14. package/dist/components/color-picker/color-picker.js +2 -1
  15. package/dist/components/color-picker/color-picker.js.map +1 -1
  16. package/dist/components/combobox/combobox.js +3 -3
  17. package/dist/components/combobox/combobox.js.map +1 -1
  18. package/dist/components/command/command.d.ts +3 -3
  19. package/dist/components/context-menu/context-menu.js +2 -1
  20. package/dist/components/context-menu/context-menu.js.map +1 -1
  21. package/dist/components/date-picker/date-picker.d.ts +4 -1
  22. package/dist/components/date-picker/date-picker.d.ts.map +1 -1
  23. package/dist/components/date-picker/date-picker.js +9 -1
  24. package/dist/components/date-picker/date-picker.js.map +1 -1
  25. package/dist/components/date-range-picker/date-range-picker.d.ts +4 -1
  26. package/dist/components/date-range-picker/date-range-picker.d.ts.map +1 -1
  27. package/dist/components/date-range-picker/date-range-picker.js +9 -1
  28. package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
  29. package/dist/components/dialog/dialog.d.ts +12 -1
  30. package/dist/components/dialog/dialog.d.ts.map +1 -1
  31. package/dist/components/dialog/dialog.js +14 -4
  32. package/dist/components/dialog/dialog.js.map +1 -1
  33. package/dist/components/drawer/drawer.d.ts +12 -1
  34. package/dist/components/drawer/drawer.d.ts.map +1 -1
  35. package/dist/components/drawer/drawer.js +14 -4
  36. package/dist/components/drawer/drawer.js.map +1 -1
  37. package/dist/components/fieldset/context.d.ts +1 -0
  38. package/dist/components/fieldset/context.d.ts.map +1 -1
  39. package/dist/components/fieldset/context.js +9 -1
  40. package/dist/components/fieldset/context.js.map +1 -1
  41. package/dist/components/fieldset/fieldset.d.ts.map +1 -1
  42. package/dist/components/fieldset/fieldset.js +8 -3
  43. package/dist/components/fieldset/fieldset.js.map +1 -1
  44. package/dist/components/floating-panel/floating-panel.js +4 -1
  45. package/dist/components/floating-panel/floating-panel.js.map +1 -1
  46. package/dist/components/form/form.d.ts +8 -0
  47. package/dist/components/form/form.d.ts.map +1 -1
  48. package/dist/components/form/form.js +4 -1
  49. package/dist/components/form/form.js.map +1 -1
  50. package/dist/components/funnel-chart/funnel-chart.d.ts.map +1 -1
  51. package/dist/components/funnel-chart/funnel-chart.js +2 -2
  52. package/dist/components/funnel-chart/funnel-chart.js.map +1 -1
  53. package/dist/components/graph-chart/graph-chart.d.ts.map +1 -1
  54. package/dist/components/graph-chart/graph-chart.js +2 -2
  55. package/dist/components/graph-chart/graph-chart.js.map +1 -1
  56. package/dist/components/hierarchy-chart/hierarchy-chart.d.ts.map +1 -1
  57. package/dist/components/hierarchy-chart/hierarchy-chart.js +2 -2
  58. package/dist/components/hierarchy-chart/hierarchy-chart.js.map +1 -1
  59. package/dist/components/hover-card/hover-card.js +2 -1
  60. package/dist/components/hover-card/hover-card.js.map +1 -1
  61. package/dist/components/image-viewer/image-viewer.d.ts +7 -1
  62. package/dist/components/image-viewer/image-viewer.d.ts.map +1 -1
  63. package/dist/components/image-viewer/image-viewer.js +1 -0
  64. package/dist/components/image-viewer/image-viewer.js.map +1 -1
  65. package/dist/components/mention/mention.d.ts +1 -1
  66. package/dist/components/mention/mention.js +5 -4
  67. package/dist/components/mention/mention.js.map +1 -1
  68. package/dist/components/menu/menu.js +2 -1
  69. package/dist/components/menu/menu.js.map +1 -1
  70. package/dist/components/menubar/context.d.ts.map +1 -1
  71. package/dist/components/menubar/context.js.map +1 -1
  72. package/dist/components/menubar/menubar.d.ts.map +1 -1
  73. package/dist/components/menubar/menubar.js +16 -2
  74. package/dist/components/menubar/menubar.js.map +1 -1
  75. package/dist/components/pagination/pagination.js +4 -2
  76. package/dist/components/pagination/pagination.js.map +1 -1
  77. package/dist/components/pie-chart/pie-chart.d.ts.map +1 -1
  78. package/dist/components/pie-chart/pie-chart.js +2 -2
  79. package/dist/components/pie-chart/pie-chart.js.map +1 -1
  80. package/dist/components/popconfirm/popconfirm.js +2 -1
  81. package/dist/components/popconfirm/popconfirm.js.map +1 -1
  82. package/dist/components/popover/popover.d.ts +1 -1
  83. package/dist/components/popover/popover.js +2 -1
  84. package/dist/components/popover/popover.js.map +1 -1
  85. package/dist/components/radar-chart/radar-chart.d.ts.map +1 -1
  86. package/dist/components/radar-chart/radar-chart.js +2 -2
  87. package/dist/components/radar-chart/radar-chart.js.map +1 -1
  88. package/dist/components/sankey-chart/sankey-chart.d.ts.map +1 -1
  89. package/dist/components/sankey-chart/sankey-chart.js +2 -2
  90. package/dist/components/sankey-chart/sankey-chart.js.map +1 -1
  91. package/dist/components/select/select.d.ts +11 -0
  92. package/dist/components/select/select.d.ts.map +1 -1
  93. package/dist/components/select/select.js +12 -3
  94. package/dist/components/select/select.js.map +1 -1
  95. package/dist/components/side-nav/side-nav.d.ts.map +1 -1
  96. package/dist/components/side-nav/side-nav.js +8 -2
  97. package/dist/components/side-nav/side-nav.js.map +1 -1
  98. package/dist/components/spinner/spinner.d.ts +9 -1
  99. package/dist/components/spinner/spinner.d.ts.map +1 -1
  100. package/dist/components/spinner/spinner.js +2 -0
  101. package/dist/components/spinner/spinner.js.map +1 -1
  102. package/dist/components/time-picker/time-picker.d.ts +4 -1
  103. package/dist/components/time-picker/time-picker.d.ts.map +1 -1
  104. package/dist/components/time-picker/time-picker.js +10 -2
  105. package/dist/components/time-picker/time-picker.js.map +1 -1
  106. package/dist/components/time-range-picker/time-range-picker.js +2 -1
  107. package/dist/components/time-range-picker/time-range-picker.js.map +1 -1
  108. package/dist/components/tooltip/tooltip.js +2 -1
  109. package/dist/components/tooltip/tooltip.js.map +1 -1
  110. package/dist/components/tour/tour.js +12 -3
  111. package/dist/components/tour/tour.js.map +1 -1
  112. package/dist/components/tree-select/tree-select.js +3 -3
  113. package/dist/components/tree-select/tree-select.js.map +1 -1
  114. package/dist/config/config.js +1 -0
  115. package/dist/config/config.js.map +1 -1
  116. package/dist/index.d.ts +4 -4
  117. package/dist/index.js +4 -4
  118. package/dist/locale.d.ts +2 -0
  119. package/dist/locale.js +2 -0
  120. package/dist/package.js +1 -1
  121. package/dist/runtime/as-child.js +7 -2
  122. package/dist/runtime/as-child.js.map +1 -1
  123. package/dist/runtime/portal.js +11 -1
  124. package/dist/runtime/portal.js.map +1 -1
  125. package/dist/runtime/use-overlay-exit.js +6 -1
  126. package/dist/runtime/use-overlay-exit.js.map +1 -1
  127. package/dist/services/dialog-service.d.ts +3 -3
  128. package/dist/services/dialog-service.d.ts.map +1 -1
  129. package/dist/services/dialog-service.js +8 -6
  130. package/dist/services/dialog-service.js.map +1 -1
  131. package/dist/services/service-config.js +2 -1
  132. package/dist/services/service-config.js.map +1 -1
  133. package/package.json +19 -15
@@ -1,3 +1,4 @@
1
+ import { OVERLAY_STOWED_PROPS } from "../../runtime/use-overlay-exit.js";
1
2
  import { withXhConfig } from "../../config/config.js";
2
3
  import { mergePartProps } from "../../runtime/merge-props.js";
3
4
  import { mergeIntoChild } from "../../runtime/as-child.js";
@@ -42,6 +43,11 @@ const XhDialogRoot = /* @__PURE__ */ defineComponent({
42
43
  type: Boolean,
43
44
  default: void 0
44
45
  },
46
+ /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */
47
+ unmountOnExit: {
48
+ type: Boolean,
49
+ default: void 0
50
+ },
45
51
  translations: { type: Object }
46
52
  },
47
53
  emits: {
@@ -91,17 +97,21 @@ container: { type: Object } },
91
97
  setup(props, { slots, attrs }) {
92
98
  const ctx = useDialogContext();
93
99
  return () => {
94
- if (!ctx.rendered.value) return null;
95
100
  const api = ctx.api.value;
101
+ const shown = ctx.rendered.value;
102
+ if (!api.isContentMounted(shown)) return null;
96
103
  const backdrop = api.getBackdropProps();
97
- return h(XhPortal, { to: props.container ?? ctx.portalTarget.value }, () => [!backdrop.hidden ? h("div", {
104
+ return h(XhPortal, {
105
+ to: props.container ?? ctx.portalTarget.value,
106
+ present: shown
107
+ }, () => [shown && !backdrop.hidden ? h("div", {
98
108
  ...backdrop,
99
109
  ref: (el) => {
100
110
  ctx.backdropRef.value = el;
101
111
  }
102
- }) : null, h("div", api.getPositionerProps(), [h("div", {
112
+ }) : null, h("div", mergeProps(api.getPositionerProps(), shown ? {} : OVERLAY_STOWED_PROPS), [h("div", {
103
113
  ...mergeProps(api.getContentProps(), attrs),
104
- hidden: !ctx.rendered.value || void 0,
114
+ hidden: !shown || void 0,
105
115
  ref: (el) => {
106
116
  ctx.contentRef.value = el;
107
117
  }
@@ -1 +1 @@
1
- {"version":3,"file":"dialog.js","names":[],"sources":["../../../src/components/dialog/dialog.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 dialog 相关实现。\n\nimport type { OverlayBackdropVariant, Size } from '@xihan-ui/core'\nimport type { DialogApi, DialogSchema } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { mergeIntoChild } from '../../runtime/as-child'\nimport { mergePartProps } from '../../runtime/merge-props'\nimport { XhPortal } from '../../runtime/portal'\nimport { provideDialog, useDialogContext } from './context'\nimport { useDialog } from './use-dialog'\n\ntype DialogProps = DialogSchema['props']\n\n/** 默认插槽的载荷:展开态与修改展开的动作。 */\nexport type DialogRootSlotProps = Pick<DialogApi, 'open' | 'setOpen'>\n\nexport const XhDialogRoot = /* @__PURE__ */ defineComponent({\n name: 'XhDialogRoot',\n props: {\n open: { type: Boolean, default: undefined },\n defaultOpen: Boolean,\n modal: { type: Boolean, default: true },\n role: { type: String as PropType<'dialog' | 'alertdialog'>, default: 'dialog' },\n closeOnEscape: { type: Boolean, default: true },\n closeOnInteractOutside: { type: Boolean, default: undefined },\n restoreFocus: { type: Boolean, default: true },\n initialFocus: { type: String },\n size: { type: String as PropType<Size> },\n variant: { type: String as PropType<OverlayBackdropVariant> },\n /** 可拖动:按住标题栏或拖动把手挪走面板,方向键在把手上挪一步;面板始终夹在视口内。 */\n draggable: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<DialogProps['translations']> },\n },\n // open-change 携带 { open },update:open 携带裸布尔\n emits: {\n 'open-change': (_details: PayloadOf<DialogProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<DialogProps, 'onOpenChange'>['open']) => true,\n 'exit-complete': () => true,\n },\n slots: Object as SlotsType<{\n default?: (props: DialogRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const notify: DialogProps['onOpenChange'] = (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n }\n const ctx = useDialog(withXhConfig('dialog', props) as DialogProps, notify, () => emit('exit-complete'))\n provideDialog(ctx)\n return () => slots.default?.({ open: ctx.api.value.open, setOpen: ctx.api.value.setOpen })\n },\n})\n\nexport const XhDialogTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogTrigger',\n // 直通属性自己合:Vue 默认把作者的处理器排在部件的后面,这里改成作者先跑\n inheritAttrs: false,\n props: {\n /** 借用作者的子节点作为触发器,不再渲染自己的包裹元素;子节点须恰好一个。 */\n asChild: Boolean,\n },\n setup(props, { slots, attrs }) {\n const ctx = useDialogContext()\n return () => {\n const part = mergePartProps(ctx.api.value.getTriggerProps() as Record<string, unknown>, attrs)\n const children = slots.default?.()\n // asChild:把触发器属性合到作者的节点上,不再自己渲染包裹元素\n if (props.asChild) {\n const merged = mergeIntoChild(children, part, 'dialog')\n if (merged)\n return merged\n }\n return h('button', part, children)\n }\n },\n})\n\nexport const XhDialogContent = /* @__PURE__ */ defineComponent({\n name: 'XhDialogContent',\n props: {\n /** 本实例的 Portal 容器;优先于应用级配置。 */\n container: { type: Object as PropType<Element> },\n },\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 content 上\n inheritAttrs: false,\n setup(props, { slots, attrs }) {\n const ctx = useDialogContext()\n return () => {\n if (!ctx.rendered.value)\n return null\n const api = ctx.api.value\n const backdrop = api.getBackdropProps() as Record<string, unknown>\n return h(XhPortal, { to: props.container ?? ctx.portalTarget.value }, () => [\n !backdrop.hidden\n ? h('div', {\n ...backdrop,\n ref: (el: unknown) => { ctx.backdropRef.value = el as HTMLElement },\n })\n : null,\n h('div', api.getPositionerProps() as Record<string, unknown>, [\n h('div', {\n ...mergeProps(api.getContentProps() as Record<string, unknown>, attrs),\n hidden: !ctx.rendered.value || undefined,\n ref: (el: unknown) => { ctx.contentRef.value = el as HTMLElement },\n }, slots.default?.()),\n ]),\n ])\n }\n },\n})\n\nexport const XhDialogHeader = /* @__PURE__ */ defineComponent({\n name: 'XhDialogHeader',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('header', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 拖动把手:键盘挪动面板的入口;放在 XhDialogHeader 里时铺满标题栏。 */\nexport const XhDialogDragTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogDragTrigger',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('button', ctx.api.value.getDragTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 语气徽记:未提供内容时由皮肤按节点上的 data-tone 绘制兜底字形,放入节点即整个替换。 */\nexport const XhDialogIndicator = /* @__PURE__ */ defineComponent({\n name: 'XhDialogIndicator',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('span', ctx.api.value.getIndicatorProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogTitle = /* @__PURE__ */ defineComponent({\n name: 'XhDialogTitle',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogDescription = /* @__PURE__ */ defineComponent({\n name: 'XhDialogDescription',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogBody = /* @__PURE__ */ defineComponent({\n name: 'XhDialogBody',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogFooter = /* @__PURE__ */ defineComponent({\n name: 'XhDialogFooter',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('footer', ctx.api.value.getFooterProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogCloseTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogCloseTrigger',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":"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"}
1
+ {"version":3,"file":"dialog.js","names":[],"sources":["../../../src/components/dialog/dialog.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 dialog 相关实现。\n\nimport type { OverlayBackdropVariant, Size } from '@xihan-ui/core'\nimport type { DialogApi, DialogSchema } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { mergeIntoChild } from '../../runtime/as-child'\nimport { mergePartProps } from '../../runtime/merge-props'\nimport { XhPortal } from '../../runtime/portal'\nimport { OVERLAY_STOWED_PROPS } from '../../runtime/use-overlay-exit'\nimport { provideDialog, useDialogContext } from './context'\nimport { useDialog } from './use-dialog'\n\ntype DialogProps = DialogSchema['props']\n\n/** 默认插槽的载荷:展开态与修改展开的动作。 */\nexport type DialogRootSlotProps = Pick<DialogApi, 'open' | 'setOpen'>\n\nexport const XhDialogRoot = /* @__PURE__ */ defineComponent({\n name: 'XhDialogRoot',\n props: {\n open: { type: Boolean, default: undefined },\n defaultOpen: Boolean,\n modal: { type: Boolean, default: true },\n role: { type: String as PropType<'dialog' | 'alertdialog'>, default: 'dialog' },\n closeOnEscape: { type: Boolean, default: true },\n closeOnInteractOutside: { type: Boolean, default: undefined },\n restoreFocus: { type: Boolean, default: true },\n initialFocus: { type: String },\n size: { type: String as PropType<Size> },\n variant: { type: String as PropType<OverlayBackdropVariant> },\n /** 可拖动:按住标题栏或拖动把手挪走面板,方向键在把手上挪一步;面板始终夹在视口内。 */\n draggable: { type: Boolean, default: undefined },\n /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */\n unmountOnExit: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<DialogProps['translations']> },\n },\n // open-change 携带 { open },update:open 携带裸布尔\n emits: {\n 'open-change': (_details: PayloadOf<DialogProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<DialogProps, 'onOpenChange'>['open']) => true,\n 'exit-complete': () => true,\n },\n slots: Object as SlotsType<{\n default?: (props: DialogRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const notify: DialogProps['onOpenChange'] = (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n }\n const ctx = useDialog(withXhConfig('dialog', props) as DialogProps, notify, () => emit('exit-complete'))\n provideDialog(ctx)\n return () => slots.default?.({ open: ctx.api.value.open, setOpen: ctx.api.value.setOpen })\n },\n})\n\nexport const XhDialogTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogTrigger',\n // 直通属性自己合:Vue 默认把作者的处理器排在部件的后面,这里改成作者先跑\n inheritAttrs: false,\n props: {\n /** 借用作者的子节点作为触发器,不再渲染自己的包裹元素;子节点须恰好一个。 */\n asChild: Boolean,\n },\n setup(props, { slots, attrs }) {\n const ctx = useDialogContext()\n return () => {\n const part = mergePartProps(ctx.api.value.getTriggerProps() as Record<string, unknown>, attrs)\n const children = slots.default?.()\n // asChild:把触发器属性合到作者的节点上,不再自己渲染包裹元素\n if (props.asChild) {\n const merged = mergeIntoChild(children, part, 'dialog')\n if (merged)\n return merged\n }\n return h('button', part, children)\n }\n },\n})\n\nexport const XhDialogContent = /* @__PURE__ */ defineComponent({\n name: 'XhDialogContent',\n props: {\n /** 本实例的 Portal 容器;优先于应用级配置。 */\n container: { type: Object as PropType<Element> },\n },\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 content 上\n inheritAttrs: false,\n setup(props, { slots, attrs }) {\n const ctx = useDialogContext()\n return () => {\n const api = ctx.api.value\n const shown = ctx.rendered.value\n // 没打开过、或退场播完且要卸载时整棵不渲染\n if (!api.isContentMounted(shown))\n return null\n const backdrop = api.getBackdropProps() as Record<string, unknown>\n // 收起后常驻(unmountOnExit 为 false):遮罩不留,定位层以内联 display 收起,视觉桥随之断开\n return h(XhPortal, { to: props.container ?? ctx.portalTarget.value, present: shown }, () => [\n shown && !backdrop.hidden\n ? h('div', {\n ...backdrop,\n ref: (el: unknown) => { ctx.backdropRef.value = el as HTMLElement },\n })\n : null,\n h('div', mergeProps(api.getPositionerProps() as Record<string, unknown>, shown ? {} : OVERLAY_STOWED_PROPS), [\n h('div', {\n ...mergeProps(api.getContentProps() as Record<string, unknown>, attrs),\n hidden: !shown || undefined,\n ref: (el: unknown) => { ctx.contentRef.value = el as HTMLElement },\n }, slots.default?.()),\n ]),\n ])\n }\n },\n})\n\nexport const XhDialogHeader = /* @__PURE__ */ defineComponent({\n name: 'XhDialogHeader',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('header', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 拖动把手:键盘挪动面板的入口;放在 XhDialogHeader 里时铺满标题栏。 */\nexport const XhDialogDragTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogDragTrigger',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('button', ctx.api.value.getDragTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 语气徽记:未提供内容时由皮肤按节点上的 data-tone 绘制兜底字形,放入节点即整个替换。 */\nexport const XhDialogIndicator = /* @__PURE__ */ defineComponent({\n name: 'XhDialogIndicator',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('span', ctx.api.value.getIndicatorProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogTitle = /* @__PURE__ */ defineComponent({\n name: 'XhDialogTitle',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogDescription = /* @__PURE__ */ defineComponent({\n name: 'XhDialogDescription',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogBody = /* @__PURE__ */ defineComponent({\n name: 'XhDialogBody',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogFooter = /* @__PURE__ */ defineComponent({\n name: 'XhDialogFooter',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('footer', ctx.api.value.getFooterProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDialogCloseTrigger = /* @__PURE__ */ defineComponent({\n name: 'XhDialogCloseTrigger',\n setup(_, { slots }) {\n const ctx = useDialogContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":"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"}
@@ -76,6 +76,11 @@ declare const XhDrawerRoot: import("vue").DefineComponent<import("vue").ExtractP
76
76
  maxPanelSize: {
77
77
  type: NumberConstructor;
78
78
  };
79
+ /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */
80
+ unmountOnExit: {
81
+ type: BooleanConstructor;
82
+ default: undefined;
83
+ };
79
84
  translations: {
80
85
  type: PropType<DrawerProps["translations"]>;
81
86
  };
@@ -157,6 +162,11 @@ declare const XhDrawerRoot: import("vue").DefineComponent<import("vue").ExtractP
157
162
  maxPanelSize: {
158
163
  type: NumberConstructor;
159
164
  };
165
+ /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */
166
+ unmountOnExit: {
167
+ type: BooleanConstructor;
168
+ default: undefined;
169
+ };
160
170
  translations: {
161
171
  type: PropType<DrawerProps["translations"]>;
162
172
  };
@@ -167,13 +177,14 @@ declare const XhDrawerRoot: import("vue").DefineComponent<import("vue").ExtractP
167
177
  "onPanel-size-change"?: ((_details: import("@xihan-ui/headless").DrawerPanelSizeChangeDetails) => any) | undefined;
168
178
  "onUpdate:panelSize"?: ((_size: number) => any) | undefined;
169
179
  }>, {
180
+ unmountOnExit: boolean;
170
181
  open: boolean;
171
182
  defaultOpen: boolean;
172
183
  resizable: boolean;
184
+ modal: boolean;
173
185
  closeOnEscape: boolean;
174
186
  closeOnInteractOutside: boolean;
175
187
  restoreFocus: boolean;
176
- modal: boolean;
177
188
  contained: boolean;
178
189
  }, SlotsType<{
179
190
  default?: (props: DrawerRootSlotProps) => VNode[];
@@ -1 +1 @@
1
- {"version":3,"file":"drawer.d.ts","names":[],"sources":["../../../src/components/drawer/drawer.ts"],"mappings":";;;;;KAmBK,cAAc;;KAGP,sBAAsB,KAAK;cAE1B,4BAAY,8BAAA;;;;;;;;;;;IAOG,MAAA,SAAS;;;IACT,MAAA;;;;;;;;;;;;;;;IAIA,MAAA,SAAS;;;IACN,MAAA,SAAS;;;;;;;;;;IAQG,MAAA,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAazB,MAAA,SAAS;;;;;EAIf,gBAAA,UAAA,UAAU;EACb,gBAAA,OAAA,UAAU;;EAED,sBAAA,UAAA,UAAU;EACd,qBAAA,OAAA,UAAU;;;;;;;;;;;;IAnCd,MAAA,SAAS;;;IACT,MAAA;;;;;;;;;;;;;;;IAIA,MAAA,SAAS;;;IACN,MAAA,SAAS;;;;;;;;;;IAQG,MAAA,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAazB,MAAA,SAAS;;;;;;;;;;;;;;;;;;EAW/B,WAAC,OAAO,wBAAwB;kCAsB5C;cAEW,+BAAe,8BAAA;;;;;;;;;;qCAsB1B;cAEW,+BAAe,0BAAA,oBAAA,4BAAA;;qCA6B1B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,8BAAc,0BAAA,oBAAA,4BAAA;;8BAMzB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,6BAAa,0BAAA,oBAAA,4BAAA;;8BAMxB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,mCAAmB,0BAAA,oBAAA,4BAAA;;8BAM9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,4BAAY,0BAAA,oBAAA,4BAAA;;8BAMvB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,8BAAc,0BAAA,oBAAA,4BAAA;;8BAMzB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAMhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
1
+ {"version":3,"file":"drawer.d.ts","names":[],"sources":["../../../src/components/drawer/drawer.ts"],"mappings":";;;;;KAoBK,cAAc;;KAGP,sBAAsB,KAAK;cAE1B,4BAAY,8BAAA;;;;;;;;;;;IAOG,MAAA,SAAS;;;IACT,MAAA;;;;;;;;;;;;;;;IAIA,MAAA,SAAS;;;IACN,MAAA,SAAS;;;;;;;;;;IAQG,MAAA,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAezB,MAAA,SAAS;;;;;EAIf,gBAAA,UAAA,UAAU;EACb,gBAAA,OAAA,UAAU;;EAED,sBAAA,UAAA,UAAU;EACd,qBAAA,OAAA,UAAU;;;;;;;;;;;;IArCd,MAAA,SAAS;;;IACT,MAAA;;;;;;;;;;;;;;;IAIA,MAAA,SAAS;;;IACN,MAAA,SAAS;;;;;;;;;;IAQG,MAAA,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAezB,MAAA,SAAS;;;;;;;;;;;;;;;;;;;EAW/B,WAAC,OAAO,wBAAwB;kCAsB5C;cAEW,+BAAe,8BAAA;;;;;;;;;;qCAsB1B;cAEW,+BAAe,0BAAA,oBAAA,4BAAA;;qCA+B1B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,8BAAc,0BAAA,oBAAA,4BAAA;;8BAMzB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,6BAAa,0BAAA,oBAAA,4BAAA;;8BAMxB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,mCAAmB,0BAAA,oBAAA,4BAAA;;8BAM9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,4BAAY,0BAAA,oBAAA,4BAAA;;8BAMvB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,8BAAc,0BAAA,oBAAA,4BAAA;;8BAMzB,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAMhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
@@ -1,3 +1,4 @@
1
+ import { OVERLAY_STOWED_PROPS } from "../../runtime/use-overlay-exit.js";
1
2
  import { withXhConfig } from "../../config/config.js";
2
3
  import { mergePartProps } from "../../runtime/merge-props.js";
3
4
  import { mergeIntoChild } from "../../runtime/as-child.js";
@@ -60,6 +61,11 @@ const XhDrawerRoot = defineComponent({
60
61
  defaultPanelSize: { type: Number },
61
62
  minPanelSize: { type: Number },
62
63
  maxPanelSize: { type: Number },
64
+ /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */
65
+ unmountOnExit: {
66
+ type: Boolean,
67
+ default: void 0
68
+ },
63
69
  translations: { type: Object }
64
70
  },
65
71
  emits: {
@@ -113,17 +119,21 @@ const XhDrawerContent = defineComponent({
113
119
  setup(_, { slots, attrs }) {
114
120
  const ctx = useDrawerContext();
115
121
  return () => {
116
- if (!ctx.rendered.value) return null;
117
122
  const api = ctx.api.value;
123
+ const shown = ctx.rendered.value;
124
+ if (!api.isContentMounted(shown)) return null;
118
125
  const backdrop = api.getBackdropProps();
119
- return h(XhPortal, { to: ctx.portalTarget.value }, () => [!backdrop.hidden ? h("div", {
126
+ return h(XhPortal, {
127
+ to: ctx.portalTarget.value,
128
+ present: shown
129
+ }, () => [shown && !backdrop.hidden ? h("div", {
120
130
  ...backdrop,
121
131
  ref: (el) => {
122
132
  ctx.backdropRef.value = el;
123
133
  }
124
- }) : null, h("div", api.getPositionerProps(), [h("div", {
134
+ }) : null, h("div", mergeProps(api.getPositionerProps(), shown ? {} : OVERLAY_STOWED_PROPS), [h("div", {
125
135
  ...mergeProps(api.getContentProps(), attrs),
126
- hidden: !ctx.rendered.value || void 0,
136
+ hidden: !shown || void 0,
127
137
  ref: (el) => {
128
138
  ctx.contentRef.value = el;
129
139
  }
@@ -1 +1 @@
1
- {"version":3,"file":"drawer.js","names":[],"sources":["../../../src/components/drawer/drawer.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 drawer 相关实现。\n\nimport type { OverlayBackdropVariant, Size } from '@xihan-ui/core'\nimport type { DrawerApi, DrawerSchema, DrawerSide } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { mergeIntoChild } from '../../runtime/as-child'\nimport { mergePartProps } from '../../runtime/merge-props'\nimport { XhPortal } from '../../runtime/portal'\nimport { provideDrawer, useDrawerContext } from './context'\nimport { useDrawer } from './use-drawer'\n\ntype DrawerProps = DrawerSchema['props']\n\n/** 默认插槽的载荷:展开状态、已解析的滑出边,与开合命令。 */\nexport type DrawerRootSlotProps = Pick<DrawerApi, 'open' | 'side' | 'setOpen'>\n\nexport const XhDrawerRoot = defineComponent({\n name: 'XhDrawerRoot',\n props: {\n // 缺省值由 connect 给出;普通类型省略 default,Boolean 显式保留 undefined\n open: { type: Boolean, default: undefined },\n defaultOpen: Boolean,\n modal: { type: Boolean, default: undefined },\n side: { type: String as PropType<DrawerSide> },\n role: { type: String as PropType<'dialog' | 'alertdialog'> },\n closeOnEscape: { type: Boolean, default: undefined },\n closeOnInteractOutside: { type: Boolean, default: undefined },\n restoreFocus: { type: Boolean, default: undefined },\n size: { type: String as PropType<Size> },\n variant: { type: String as PropType<OverlayBackdropVariant> },\n /**\n * 挂载的容器(CSS 选择器或元素)。提供后即为局部抽屉:\n * 浮层迁移进该容器,遮罩与定位层从 fixed 换为 absolute,只覆盖它而不是整屏。\n *\n * 该容器要自带 position(relative 等),否则 absolute 会向上找到其他定位祖先。\n * 未提供时查询全局配置的 portalContainer,再没有才落到 body。\n */\n container: { type: [String, Object] as PropType<string | Element> },\n /**\n * 只把绘制方式改为局部(遮罩与定位层从 fixed 换为 absolute),不改变迁移位置。\n * 提供 container 后默认为真,不必再写一遍;两个都未提供即铺满视口。\n */\n contained: { type: Boolean, default: undefined },\n /** 可调厚度:朝向页面那条边上的把手拖动或用方向键推。 */\n resizable: { type: Boolean, default: undefined },\n /** 受控厚度(像素),支持 v-model:panel-size;未提供即非受控。 */\n panelSize: { type: Number },\n defaultPanelSize: { type: Number },\n minPanelSize: { type: Number },\n maxPanelSize: { type: Number },\n translations: { type: Object as PropType<DrawerProps['translations']> },\n },\n // open-change 携带 { open },update:open 携带裸布尔;panel-size-change 携带 { panelSize }\n emits: {\n 'open-change': (_details: PayloadOf<DrawerProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<DrawerProps, 'onOpenChange'>['open']) => true,\n 'exit-complete': () => true,\n 'panel-size-change': (_details: PayloadOf<DrawerProps, 'onPanelSizeChange'>) => true,\n 'update:panelSize': (_size: PayloadOf<DrawerProps, 'onPanelSizeChange'>['panelSize']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: DrawerRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const notify: DrawerProps['onOpenChange'] = (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n }\n // 容器一处给定,两件事都从它派生:contained 交给机器(皮肤据此把遮罩与定位层\n // 从 fixed 换成 absolute),同一个值又是 Teleport 的落点,两边不会各说各话\n const notifySize: DrawerProps['onPanelSizeChange'] = (details) => {\n emit('panel-size-change', details)\n emit('update:panelSize', details.panelSize)\n }\n const ctx = useDrawer(withXhConfig('drawer', props) as DrawerProps, notify, () => props.container, () => emit('exit-complete'), notifySize)\n provideDrawer(ctx)\n // root 是真实节点,content 会被 portal 到 body,data-side 挂在这里供页面内的部分读取\n return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n open: ctx.api.value.open,\n side: ctx.api.value.side,\n setOpen: ctx.api.value.setOpen,\n }))\n },\n})\n\nexport const XhDrawerTrigger = defineComponent({\n name: 'XhDrawerTrigger',\n // 直通属性自己合:Vue 默认把作者的处理器排在部件的后面,这里改成作者先跑\n inheritAttrs: false,\n props: {\n /** 借用作者的子节点作为触发器,不再渲染自己的包裹元素;子节点须恰好一个。 */\n asChild: Boolean,\n },\n setup(props, { slots, attrs }) {\n const ctx = useDrawerContext()\n return () => {\n const part = mergePartProps(ctx.api.value.getTriggerProps() as Record<string, unknown>, attrs)\n const children = slots.default?.()\n // asChild:把触发器属性合到作者的节点上,不再自己渲染包裹元素\n if (props.asChild) {\n const merged = mergeIntoChild(children, part, 'drawer')\n if (merged)\n return merged\n }\n return h('button', part, children)\n }\n },\n})\n\nexport const XhDrawerContent = defineComponent({\n name: 'XhDrawerContent',\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 content 上\n inheritAttrs: false,\n setup(_, { slots, attrs }) {\n const ctx = useDrawerContext()\n return () => {\n // presence 判定不在场则整棵不渲染,退场动画播完才翻假\n if (!ctx.rendered.value)\n return null\n const api = ctx.api.value\n const backdrop = api.getBackdropProps() as Record<string, unknown>\n return h(XhPortal, { to: ctx.portalTarget.value }, () => [\n !backdrop.hidden\n ? h('div', {\n ...backdrop,\n ref: (el: unknown) => { ctx.backdropRef.value = el as HTMLElement },\n })\n : null,\n h('div', api.getPositionerProps() as Record<string, unknown>, [\n h('div', {\n ...mergeProps(api.getContentProps() as Record<string, unknown>, attrs),\n hidden: !ctx.rendered.value || undefined,\n ref: (el: unknown) => { ctx.contentRef.value = el as HTMLElement },\n }, slots.default?.()),\n ]),\n ])\n }\n },\n})\n\nexport const XhDrawerHeader = defineComponent({\n name: 'XhDrawerHeader',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('header', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerTitle = defineComponent({\n name: 'XhDrawerTitle',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerDescription = defineComponent({\n name: 'XhDrawerDescription',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerBody = defineComponent({\n name: 'XhDrawerBody',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerFooter = defineComponent({\n name: 'XhDrawerFooter',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('footer', ctx.api.value.getFooterProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerCloseTrigger = defineComponent({\n name: 'XhDrawerCloseTrigger',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 改尺把手:role=separator,落在朝向页面的那条边上;放在 XhDrawerContent 里。 */\nexport const XhDrawerResizeTrigger = defineComponent({\n name: 'XhDrawerResizeTrigger',\n setup() {\n const ctx = useDrawerContext()\n return () => h('div', ctx.api.value.getResizeTriggerProps() as Record<string, unknown>)\n },\n})\n"],"mappings":";;;;;;;;AAwBA,MAAa,eAAe,gBAAgB;CAC1C,MAAM;CACN,OAAO;EAEL,MAAM;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC1C,aAAa;EACb,OAAO;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC3C,MAAM,EAAE,MAAM,OAA+B;EAC7C,MAAM,EAAE,MAAM,OAA6C;EAC3D,eAAe;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EACnD,wBAAwB;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC5D,cAAc;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAClD,MAAM,EAAE,MAAM,OAAyB;EACvC,SAAS,EAAE,MAAM,OAA2C;;;;;;;;EAQ5D,WAAW,EAAE,MAAM,CAAC,QAAQ,MAAM,EAAgC;;;;;EAKlE,WAAW;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;;EAE/C,WAAW;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;;EAE/C,WAAW,EAAE,MAAM,OAAO;EAC1B,kBAAkB,EAAE,MAAM,OAAO;EACjC,cAAc,EAAE,MAAM,OAAO;EAC7B,cAAc,EAAE,MAAM,OAAO;EAC7B,cAAc,EAAE,MAAM,OAAgD;CACxE;CAEA,OAAO;EACL,gBAAgB,aAAqD;EACrE,gBAAgB,UAA0D;EAC1E,uBAAuB;EACvB,sBAAsB,aAA0D;EAChF,qBAAqB,UAAoE;CAC3F;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAC5B,MAAM,UAAuC,YAAY;GACvD,KAAK,eAAe,OAAO;GAC3B,KAAK,eAAe,QAAQ,IAAI;EAClC;EAGA,MAAM,cAAgD,YAAY;GAChE,KAAK,qBAAqB,OAAO;GACjC,KAAK,oBAAoB,QAAQ,SAAS;EAC5C;EACA,MAAM,MAAM,UAAU,aAAa,UAAU,KAAK,GAAkB,cAAc,MAAM,iBAAiB,KAAK,eAAe,GAAG,UAAU;EAC1I,cAAc,GAAG;EAEjB,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU;GAC7F,MAAM,IAAI,IAAI,MAAM;GACpB,MAAM,IAAI,IAAI,MAAM;GACpB,SAAS,IAAI,IAAI,MAAM;EACzB,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,kBAAkB,gBAAgB;CAC7C,MAAM;CAEN,cAAc;CACd,OAAO;;AAEL,SAAS,QACX;CACA,MAAM,OAAO,EAAE,OAAO,SAAS;EAC7B,MAAM,MAAM,iBAAiB;EAC7B,aAAa;GACX,MAAM,OAAO,eAAe,IAAI,IAAI,MAAM,gBAAgB,GAA8B,KAAK;GAC7F,MAAM,WAAW,MAAM,UAAU;GAEjC,IAAI,MAAM,SAAS;IACjB,MAAM,SAAS,eAAe,UAAU,MAAM,QAAQ;IACtD,IAAI,QACF,OAAO;GACX;GACA,OAAO,EAAE,UAAU,MAAM,QAAQ;EACnC;CACF;AACF,CAAC;AAED,MAAa,kBAAkB,gBAAgB;CAC7C,MAAM;CAEN,cAAc;CACd,MAAM,GAAG,EAAE,OAAO,SAAS;EACzB,MAAM,MAAM,iBAAiB;EAC7B,aAAa;GAEX,IAAI,CAAC,IAAI,SAAS,OAChB,OAAO;GACT,MAAM,MAAM,IAAI,IAAI;GACpB,MAAM,WAAW,IAAI,iBAAiB;GACtC,OAAO,EAAE,UAAU,EAAE,IAAI,IAAI,aAAa,MAAM,SAAS,CACvD,CAAC,SAAS,SACN,EAAE,OAAO;IACP,GAAG;IACH,MAAM,OAAgB;KAAE,IAAI,YAAY,QAAQ;IAAkB;GACpE,CAAC,IACD,MACJ,EAAE,OAAO,IAAI,mBAAmB,GAA8B,CAC5D,EAAE,OAAO;IACP,GAAG,WAAW,IAAI,gBAAgB,GAA8B,KAAK;IACrE,QAAQ,CAAC,IAAI,SAAS,SAAS,KAAA;IAC/B,MAAM,OAAgB;KAAE,IAAI,WAAW,QAAQ;IAAkB;GACnE,GAAG,MAAM,UAAU,CAAC,CACtB,CAAC,CACH,CAAC;EACH;CACF;AACF,CAAC;AAED,MAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,eAAe,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,gBAAgB,gBAAgB;CAC3C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,MAAM,IAAI,IAAI,MAAM,cAAc,GAA8B,MAAM,UAAU,CAAC;CAClG;AACF,CAAC;AAED,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,KAAK,IAAI,IAAI,MAAM,oBAAoB,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,eAAe,gBAAgB;CAC1C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CAClG;AACF,CAAC;AAED,MAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,eAAe,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,qBAAqB,GAA8B,MAAM,UAAU,CAAC;CAC7G;AACF,CAAC;;AAGD,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,QAAQ;EACN,MAAM,MAAM,iBAAiB;EAC7B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,sBAAsB,CAA4B;CACxF;AACF,CAAC"}
1
+ {"version":3,"file":"drawer.js","names":[],"sources":["../../../src/components/drawer/drawer.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 drawer 相关实现。\n\nimport type { OverlayBackdropVariant, Size } from '@xihan-ui/core'\nimport type { DrawerApi, DrawerSchema, DrawerSide } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { mergeIntoChild } from '../../runtime/as-child'\nimport { mergePartProps } from '../../runtime/merge-props'\nimport { XhPortal } from '../../runtime/portal'\nimport { OVERLAY_STOWED_PROPS } from '../../runtime/use-overlay-exit'\nimport { provideDrawer, useDrawerContext } from './context'\nimport { useDrawer } from './use-drawer'\n\ntype DrawerProps = DrawerSchema['props']\n\n/** 默认插槽的载荷:展开状态、已解析的滑出边,与开合命令。 */\nexport type DrawerRootSlotProps = Pick<DrawerApi, 'open' | 'side' | 'setOpen'>\n\nexport const XhDrawerRoot = defineComponent({\n name: 'XhDrawerRoot',\n props: {\n // 缺省值由 connect 给出;普通类型省略 default,Boolean 显式保留 undefined\n open: { type: Boolean, default: undefined },\n defaultOpen: Boolean,\n modal: { type: Boolean, default: undefined },\n side: { type: String as PropType<DrawerSide> },\n role: { type: String as PropType<'dialog' | 'alertdialog'> },\n closeOnEscape: { type: Boolean, default: undefined },\n closeOnInteractOutside: { type: Boolean, default: undefined },\n restoreFocus: { type: Boolean, default: undefined },\n size: { type: String as PropType<Size> },\n variant: { type: String as PropType<OverlayBackdropVariant> },\n /**\n * 挂载的容器(CSS 选择器或元素)。提供后即为局部抽屉:\n * 浮层迁移进该容器,遮罩与定位层从 fixed 换为 absolute,只覆盖它而不是整屏。\n *\n * 该容器要自带 position(relative 等),否则 absolute 会向上找到其他定位祖先。\n * 未提供时查询全局配置的 portalContainer,再没有才落到 body。\n */\n container: { type: [String, Object] as PropType<string | Element> },\n /**\n * 只把绘制方式改为局部(遮罩与定位层从 fixed 换为 absolute),不改变迁移位置。\n * 提供 container 后默认为真,不必再写一遍;两个都未提供即铺满视口。\n */\n contained: { type: Boolean, default: undefined },\n /** 可调厚度:朝向页面那条边上的把手拖动或用方向键推。 */\n resizable: { type: Boolean, default: undefined },\n /** 受控厚度(像素),支持 v-model:panel-size;未提供即非受控。 */\n panelSize: { type: Number },\n defaultPanelSize: { type: Number },\n minPanelSize: { type: Number },\n maxPanelSize: { type: Number },\n /** 收起动画播完后卸载内容,默认 true;false 时第一次打开才挂载、此后收起只隐藏,再打开不重挂。 */\n unmountOnExit: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<DrawerProps['translations']> },\n },\n // open-change 携带 { open },update:open 携带裸布尔;panel-size-change 携带 { panelSize }\n emits: {\n 'open-change': (_details: PayloadOf<DrawerProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<DrawerProps, 'onOpenChange'>['open']) => true,\n 'exit-complete': () => true,\n 'panel-size-change': (_details: PayloadOf<DrawerProps, 'onPanelSizeChange'>) => true,\n 'update:panelSize': (_size: PayloadOf<DrawerProps, 'onPanelSizeChange'>['panelSize']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: DrawerRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const notify: DrawerProps['onOpenChange'] = (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n }\n // 容器一处给定,两件事都从它派生:contained 交给机器(皮肤据此把遮罩与定位层\n // 从 fixed 换成 absolute),同一个值又是 Teleport 的落点,两边不会各说各话\n const notifySize: DrawerProps['onPanelSizeChange'] = (details) => {\n emit('panel-size-change', details)\n emit('update:panelSize', details.panelSize)\n }\n const ctx = useDrawer(withXhConfig('drawer', props) as DrawerProps, notify, () => props.container, () => emit('exit-complete'), notifySize)\n provideDrawer(ctx)\n // root 是真实节点,content 会被 portal 到 body,data-side 挂在这里供页面内的部分读取\n return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n open: ctx.api.value.open,\n side: ctx.api.value.side,\n setOpen: ctx.api.value.setOpen,\n }))\n },\n})\n\nexport const XhDrawerTrigger = defineComponent({\n name: 'XhDrawerTrigger',\n // 直通属性自己合:Vue 默认把作者的处理器排在部件的后面,这里改成作者先跑\n inheritAttrs: false,\n props: {\n /** 借用作者的子节点作为触发器,不再渲染自己的包裹元素;子节点须恰好一个。 */\n asChild: Boolean,\n },\n setup(props, { slots, attrs }) {\n const ctx = useDrawerContext()\n return () => {\n const part = mergePartProps(ctx.api.value.getTriggerProps() as Record<string, unknown>, attrs)\n const children = slots.default?.()\n // asChild:把触发器属性合到作者的节点上,不再自己渲染包裹元素\n if (props.asChild) {\n const merged = mergeIntoChild(children, part, 'drawer')\n if (merged)\n return merged\n }\n return h('button', part, children)\n }\n },\n})\n\nexport const XhDrawerContent = defineComponent({\n name: 'XhDrawerContent',\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 content 上\n inheritAttrs: false,\n setup(_, { slots, attrs }) {\n const ctx = useDrawerContext()\n return () => {\n const api = ctx.api.value\n // presence 判定不在场即退场动画播完;没打开过、或播完且要卸载时整棵不渲染\n const shown = ctx.rendered.value\n if (!api.isContentMounted(shown))\n return null\n const backdrop = api.getBackdropProps() as Record<string, unknown>\n // 收起后常驻(unmountOnExit 为 false):遮罩不留,定位层以内联 display 收起,视觉桥随之断开\n return h(XhPortal, { to: ctx.portalTarget.value, present: shown }, () => [\n shown && !backdrop.hidden\n ? h('div', {\n ...backdrop,\n ref: (el: unknown) => { ctx.backdropRef.value = el as HTMLElement },\n })\n : null,\n h('div', mergeProps(api.getPositionerProps() as Record<string, unknown>, shown ? {} : OVERLAY_STOWED_PROPS), [\n h('div', {\n ...mergeProps(api.getContentProps() as Record<string, unknown>, attrs),\n hidden: !shown || undefined,\n ref: (el: unknown) => { ctx.contentRef.value = el as HTMLElement },\n }, slots.default?.()),\n ]),\n ])\n }\n },\n})\n\nexport const XhDrawerHeader = defineComponent({\n name: 'XhDrawerHeader',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('header', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerTitle = defineComponent({\n name: 'XhDrawerTitle',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerDescription = defineComponent({\n name: 'XhDrawerDescription',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerBody = defineComponent({\n name: 'XhDrawerBody',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerFooter = defineComponent({\n name: 'XhDrawerFooter',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('footer', ctx.api.value.getFooterProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhDrawerCloseTrigger = defineComponent({\n name: 'XhDrawerCloseTrigger',\n setup(_, { slots }) {\n const ctx = useDrawerContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 改尺把手:role=separator,落在朝向页面的那条边上;放在 XhDrawerContent 里。 */\nexport const XhDrawerResizeTrigger = defineComponent({\n name: 'XhDrawerResizeTrigger',\n setup() {\n const ctx = useDrawerContext()\n return () => h('div', ctx.api.value.getResizeTriggerProps() as Record<string, unknown>)\n },\n})\n"],"mappings":"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"}
@@ -1,4 +1,5 @@
1
1
  import { FieldsetContext } from "./use-fieldset.js";
2
+ import { ComputedRef } from "vue";
2
3
  //#region src/components/fieldset/context.d.ts
3
4
  declare function useFieldsetContext(): FieldsetContext;
4
5
  //#endregion
@@ -1 +1 @@
1
- {"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/components/fieldset/context.ts"],"mappings":";;iBAiBgB,sBAAsB"}
1
+ {"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/components/fieldset/context.ts"],"mappings":";;;iBA2BgB,sBAAsB"}
@@ -1,6 +1,14 @@
1
1
  import { inject, provide } from "vue";
2
2
  //#region src/components/fieldset/context.ts
3
3
  const KEY = Symbol.for("xh-fieldset");
4
+ const OUTER_DISABLED_KEY = Symbol.for("xh-fieldset-outer-disabled");
5
+ /** 字段集外面那一层的作用域禁用:legend 里的控件不吃本组的禁用,恢复成它。 */
6
+ function provideFieldsetOuterDisabled(outer) {
7
+ provide(OUTER_DISABLED_KEY, outer);
8
+ }
9
+ function useFieldsetOuterDisabled() {
10
+ return inject(OUTER_DISABLED_KEY, void 0);
11
+ }
4
12
  function provideFieldset(ctx) {
5
13
  provide(KEY, ctx);
6
14
  }
@@ -10,6 +18,6 @@ function useFieldsetContext() {
10
18
  return ctx;
11
19
  }
12
20
  //#endregion
13
- export { provideFieldset, useFieldsetContext };
21
+ export { provideFieldset, provideFieldsetOuterDisabled, useFieldsetContext, useFieldsetOuterDisabled };
14
22
 
15
23
  //# sourceMappingURL=context.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"context.js","names":[],"sources":["../../../src/components/fieldset/context.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 context 相关实现。\n\nimport type { InjectionKey } from 'vue'\nimport type { FieldsetContext } from './use-fieldset'\nimport { inject, provide } from 'vue'\n\nconst KEY: InjectionKey<FieldsetContext> = Symbol.for('xh-fieldset')\n\nexport function provideFieldset(ctx: FieldsetContext): void {\n provide(KEY, ctx)\n}\n\nexport function useFieldsetContext(): FieldsetContext {\n const ctx = inject(KEY, null)\n if (!ctx)\n throw new Error('[xh] Fieldset 部件必须用在 XhFieldsetRoot 内')\n return ctx\n}\n"],"mappings":";;AAWA,MAAM,MAAqC,OAAO,IAAI,aAAa;AAEnE,SAAgB,gBAAgB,KAA4B;CAC1D,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,qBAAsC;CACpD,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,uCAAuC;CACzD,OAAO;AACT"}
1
+ {"version":3,"file":"context.js","names":[],"sources":["../../../src/components/fieldset/context.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 context 相关实现。\n\nimport type { ComputedRef, InjectionKey } from 'vue'\nimport type { FieldsetContext } from './use-fieldset'\nimport { inject, provide } from 'vue'\n\nconst KEY: InjectionKey<FieldsetContext> = Symbol.for('xh-fieldset')\nconst OUTER_DISABLED_KEY: InjectionKey<ComputedRef<boolean>> = Symbol.for('xh-fieldset-outer-disabled')\n\n/** 字段集外面那一层的作用域禁用:legend 里的控件不吃本组的禁用,恢复成它。 */\nexport function provideFieldsetOuterDisabled(outer: ComputedRef<boolean>): void {\n provide(OUTER_DISABLED_KEY, outer)\n}\n\nexport function useFieldsetOuterDisabled(): ComputedRef<boolean> | undefined {\n return inject(OUTER_DISABLED_KEY, undefined)\n}\n\nexport function provideFieldset(ctx: FieldsetContext): void {\n provide(KEY, ctx)\n}\n\nexport function useFieldsetContext(): FieldsetContext {\n const ctx = inject(KEY, null)\n if (!ctx)\n throw new Error('[xh] Fieldset 部件必须用在 XhFieldsetRoot 内')\n return ctx\n}\n"],"mappings":";;AAWA,MAAM,MAAqC,OAAO,IAAI,aAAa;AACnE,MAAM,qBAAyD,OAAO,IAAI,4BAA4B;;AAGtG,SAAgB,6BAA6B,OAAmC;CAC9E,QAAQ,oBAAoB,KAAK;AACnC;AAEA,SAAgB,2BAA6D;CAC3E,OAAO,OAAO,oBAAoB,KAAA,CAAS;AAC7C;AAEA,SAAgB,gBAAgB,KAA4B;CAC1D,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,qBAAsC;CACpD,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,uCAAuC;CACzD,OAAO;AACT"}
@@ -1 +1 @@
1
- {"version":3,"file":"fieldset.d.ts","names":[],"sources":["../../../src/components/fieldset/fieldset.ts"],"mappings":";;;cAca,8BAAc,8BAAA;;;;;;;;;;;;;;IAOS,MAAA,SAAS,QAAQ;;;;;;;;;;;;;;;;;;IAAjB,MAAA,SAAS,QAAQ;;;;;;qCAQnD;cAEW,gCAAgB,wCAAA,oBAAA,4BAAA;;8BAO3B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,qCAAqB,wCAAA,oBAAA,4BAAA;;8BAMhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,oCAAoB,wCAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,wCAAA,oBAAA,4BAAA;;8BAM5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,mCAAmB,wCAAA,oBAAA,4BAAA;;8BAO9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
1
+ {"version":3,"file":"fieldset.d.ts","names":[],"sources":["../../../src/components/fieldset/fieldset.ts"],"mappings":";;;cAca,8BAAc,8BAAA;;;;;;;;;;;;;;IAOS,MAAA,SAAS,QAAQ;;;;;;;;;;;;;;;;;;IAAjB,MAAA,SAAS,QAAQ;;;;;;qCAanD;cAEW,gCAAgB,wCAAA,oBAAA,4BAAA;;8BAU3B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,qCAAqB,wCAAA,oBAAA,4BAAA;;8BAMhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,oCAAoB,wCAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,wCAAA,oBAAA,4BAAA;;8BAM5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,mCAAmB,wCAAA,oBAAA,4BAAA;;8BAO9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
@@ -1,7 +1,7 @@
1
- import { withXhConfig } from "../../config/config.js";
2
- import { provideFieldset, useFieldsetContext } from "./context.js";
1
+ import { provideXhConfig, useXhConfig, withXhConfig } from "../../config/config.js";
2
+ import { provideFieldset, provideFieldsetOuterDisabled, useFieldsetContext, useFieldsetOuterDisabled } from "./context.js";
3
3
  import { useFieldset } from "./use-fieldset.js";
4
- import { defineComponent, h } from "vue";
4
+ import { computed, defineComponent, h } from "vue";
5
5
  //#region src/components/fieldset/fieldset.ts
6
6
  const XhFieldsetRoot = defineComponent({
7
7
  name: "XhFieldsetRoot",
@@ -21,8 +21,11 @@ const XhFieldsetRoot = defineComponent({
21
21
  translations: { type: Object }
22
22
  },
23
23
  setup(props, { slots }) {
24
+ const outer = useXhConfig();
24
25
  const ctx = useFieldset(withXhConfig("fieldset", props));
25
26
  provideFieldset(ctx);
27
+ provideXhConfig(() => ({ disabled: ctx.api.value.disabled || void 0 }));
28
+ provideFieldsetOuterDisabled(computed(() => outer.value.disabled === true));
26
29
  return () => h("fieldset", ctx.api.value.getRootProps(), slots.default?.());
27
30
  }
28
31
  });
@@ -30,6 +33,8 @@ const XhFieldsetLegend = defineComponent({
30
33
  name: "XhFieldsetLegend",
31
34
  setup(_, { slots }) {
32
35
  const ctx = useFieldsetContext();
36
+ const outer = useFieldsetOuterDisabled();
37
+ provideXhConfig(() => ({ disabled: outer?.value ?? false }));
33
38
  return () => h("legend", ctx.api.value.getLegendProps(), slots.default?.());
34
39
  }
35
40
  });
@@ -1 +1 @@
1
- {"version":3,"file":"fieldset.js","names":[],"sources":["../../../src/components/fieldset/fieldset.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 fieldset 相关实现。\n\nimport type { FieldsetProps, FieldsetTranslations } from '@xihan-ui/headless'\nimport type { PropType } from 'vue'\nimport { defineComponent, h } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { provideFieldset, useFieldsetContext } from './context'\nimport { useFieldset } from './use-fieldset'\n\nexport const XhFieldsetRoot = defineComponent({\n name: 'XhFieldsetRoot',\n // 三个布尔缺省 undefined:缺省值的事实源在 connect,写死 false 会挡住将来从上下文取值\n props: {\n disabled: { type: Boolean, default: undefined },\n invalid: { type: Boolean, default: undefined },\n required: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<Partial<FieldsetTranslations>> },\n },\n setup(props, { slots }) {\n const ctx = useFieldset(withXhConfig('fieldset', props) as FieldsetProps)\n provideFieldset(ctx)\n // 必须是原生 <fieldset>:整组禁用连坐组内控件是浏览器给的,换成 div 就只剩一层灰样式\n return () => h('fieldset', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetLegend = defineComponent({\n name: 'XhFieldsetLegend',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n // 原生 <legend> 只有作为 <fieldset> 的首个子节点时才充当这一组的名字\n return () => h('legend', ctx.api.value.getLegendProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetDescription = defineComponent({\n name: 'XhFieldsetDescription',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 把并排的几个字段圈为一段;纯排版。 */\nexport const XhFieldsetFieldGroup = defineComponent({\n name: 'XhFieldsetFieldGroup',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('div', ctx.api.value.getFieldGroupProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 组末尾的按钮行;纯排版。 */\nexport const XhFieldsetActions = defineComponent({\n name: 'XhFieldsetActions',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('div', ctx.api.value.getActionsProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetErrorText = defineComponent({\n name: 'XhFieldsetErrorText',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n // 节点常挂,靠 hidden 显隐:活区要先在场才播报得出来,卸载重挂读屏读不到\n return () => h('p', ctx.api.value.getErrorTextProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":";;;;;AAcA,MAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CAEN,OAAO;EACL,UAAU;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC9C,SAAS;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC7C,UAAU;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC9C,cAAc,EAAE,MAAM,OAAkD;CAC1E;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,YAAY,aAAa,YAAY,KAAK,CAAkB;EACxE,gBAAgB,GAAG;EAEnB,aAAa,EAAE,YAAY,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,mBAAmB,gBAAgB;CAC9C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAE/B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,eAAe,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,KAAK,IAAI,IAAI,MAAM,oBAAoB,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;;AAGD,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,mBAAmB,GAA8B,MAAM,UAAU,CAAC;CACxG;AACF,CAAC;;AAGD,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,gBAAgB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC;AAED,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAE/B,aAAa,EAAE,KAAK,IAAI,IAAI,MAAM,kBAAkB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC"}
1
+ {"version":3,"file":"fieldset.js","names":[],"sources":["../../../src/components/fieldset/fieldset.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 fieldset 相关实现。\n\nimport type { FieldsetProps, FieldsetTranslations } from '@xihan-ui/headless'\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, h } from 'vue'\nimport { provideXhConfig, useXhConfig, withXhConfig } from '../../config/config'\nimport { provideFieldset, provideFieldsetOuterDisabled, useFieldsetContext, useFieldsetOuterDisabled } from './context'\nimport { useFieldset } from './use-fieldset'\n\nexport const XhFieldsetRoot = defineComponent({\n name: 'XhFieldsetRoot',\n // 三个布尔缺省 undefined:缺省值的事实源在 connect,写死 false 会挡住将来从上下文取值\n props: {\n disabled: { type: Boolean, default: undefined },\n invalid: { type: Boolean, default: undefined },\n required: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<Partial<FieldsetTranslations>> },\n },\n setup(props, { slots }) {\n const outer = useXhConfig()\n const ctx = useFieldset(withXhConfig('fieldset', props) as FieldsetProps)\n provideFieldset(ctx)\n // 整组禁用经作用域配置压进子树:组内组件库的控件各自拿到 disabled,行为与禁用面一起到位。\n // 原生 fieldset[disabled] 只管得住原生表单控件,滑块、取色区这类非原生交互节点与各家族的禁用面它够不着\n provideXhConfig(() => ({ disabled: ctx.api.value.disabled || undefined }))\n provideFieldsetOuterDisabled(computed(() => outer.value.disabled === true))\n // 必须是原生 <fieldset>:整组禁用连坐组内控件是浏览器给的,换成 div 就只剩一层灰样式\n return () => h('fieldset', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetLegend = defineComponent({\n name: 'XhFieldsetLegend',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n // legend 里的控件不吃本组的禁用(原生语义:首个 legend 内的控件不受所在 fieldset 禁用),恢复成外层的\n const outer = useFieldsetOuterDisabled()\n provideXhConfig(() => ({ disabled: outer?.value ?? false }))\n // 原生 <legend> 只有作为 <fieldset> 的首个子节点时才充当这一组的名字\n return () => h('legend', ctx.api.value.getLegendProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetDescription = defineComponent({\n name: 'XhFieldsetDescription',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('p', ctx.api.value.getDescriptionProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 把并排的几个字段圈为一段;纯排版。 */\nexport const XhFieldsetFieldGroup = defineComponent({\n name: 'XhFieldsetFieldGroup',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('div', ctx.api.value.getFieldGroupProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\n/** 组末尾的按钮行;纯排版。 */\nexport const XhFieldsetActions = defineComponent({\n name: 'XhFieldsetActions',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n return () => h('div', ctx.api.value.getActionsProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFieldsetErrorText = defineComponent({\n name: 'XhFieldsetErrorText',\n setup(_, { slots }) {\n const ctx = useFieldsetContext()\n // 节点常挂,靠 hidden 显隐:活区要先在场才播报得出来,卸载重挂读屏读不到\n return () => h('p', ctx.api.value.getErrorTextProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":";;;;;AAcA,MAAa,iBAAiB,gBAAgB;CAC5C,MAAM;CAEN,OAAO;EACL,UAAU;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC9C,SAAS;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC7C,UAAU;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC9C,cAAc,EAAE,MAAM,OAAkD;CAC1E;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,QAAQ,YAAY;EAC1B,MAAM,MAAM,YAAY,aAAa,YAAY,KAAK,CAAkB;EACxE,gBAAgB,GAAG;EAGnB,uBAAuB,EAAE,UAAU,IAAI,IAAI,MAAM,YAAY,KAAA,EAAU,EAAE;EACzE,6BAA6B,eAAe,MAAM,MAAM,aAAa,IAAI,CAAC;EAE1E,aAAa,EAAE,YAAY,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,mBAAmB,gBAAgB;CAC9C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAE/B,MAAM,QAAQ,yBAAyB;EACvC,uBAAuB,EAAE,UAAU,OAAO,SAAS,MAAM,EAAE;EAE3D,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,eAAe,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;AAED,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,KAAK,IAAI,IAAI,MAAM,oBAAoB,GAA8B,MAAM,UAAU,CAAC;CACvG;AACF,CAAC;;AAGD,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,mBAAmB,GAA8B,MAAM,UAAU,CAAC;CACxG;AACF,CAAC;;AAGD,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAC/B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,gBAAgB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC;AAED,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,mBAAmB;EAE/B,aAAa,EAAE,KAAK,IAAI,IAAI,MAAM,kBAAkB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC"}
@@ -99,7 +99,10 @@ container: { type: Object } },
99
99
  inheritAttrs: false,
100
100
  setup(props, { slots, attrs }) {
101
101
  const ctx = useFloatingPanelContext();
102
- return () => h(XhPortal, { to: props.container ?? ctx.portalTarget.value }, () => [h("div", {
102
+ return () => h(XhPortal, {
103
+ to: props.container ?? ctx.portalTarget.value,
104
+ present: ctx.visible.value
105
+ }, () => [h("div", {
103
106
  ...mergeProps(ctx.api.value.getPositionerProps(), attrs, ctx.visible.value ? {} : { style: { display: "none" } }),
104
107
  ref: (el) => {
105
108
  ctx.positionerRef.value = el;
@@ -1 +1 @@
1
- {"version":3,"file":"floating-panel.js","names":[],"sources":["../../../src/components/floating-panel/floating-panel.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 floating panel 相关实现。\n\nimport type {\n FloatingPanelApi,\n FloatingPanelPosition,\n FloatingPanelResizeEdge,\n FloatingPanelSchema,\n FloatingPanelSize,\n FloatingPanelWindowState,\n} from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { XhPortal } from '../../runtime/portal'\nimport { provideFloatingPanel, useFloatingPanelContext } from './context'\nimport { useFloatingPanel } from './use-floating-panel'\n\ntype FloatingPanelProps = FloatingPanelSchema['props']\n\n/** 默认插槽的载荷:开合、形态与矩形,以及修改这四项的动作。 */\nexport type FloatingPanelRootSlotProps = Pick<\n FloatingPanelApi,\n 'open' | 'windowState' | 'position' | 'dimensions' | 'dragging' | 'resizing' | 'canDrag' | 'canResize'\n | 'setOpen' | 'setPosition' | 'setDimensions' | 'setWindowState'\n>\n\nexport const XhFloatingPanelRoot = defineComponent({\n name: 'XhFloatingPanelRoot',\n // 缺省值由 connect 与机器决定;普通类型省略 default,Boolean 显式保留 undefined\n props: {\n open: { type: Boolean, default: undefined },\n defaultOpen: { type: Boolean, default: undefined },\n position: { type: Object as PropType<FloatingPanelPosition> },\n defaultPosition: { type: Object as PropType<FloatingPanelPosition> },\n dimensions: { type: Object as PropType<FloatingPanelSize> },\n defaultDimensions: { type: Object as PropType<FloatingPanelSize> },\n minSize: { type: Object as PropType<FloatingPanelSize> },\n maxSize: { type: Object as PropType<FloatingPanelSize> },\n windowState: { type: String as PropType<FloatingPanelWindowState> },\n defaultWindowState: { type: String as PropType<FloatingPanelWindowState> },\n // 缺省为真的两个开关:写成裸 Boolean 会被 Vue 的布尔 casting 永久关死\n draggable: { type: Boolean, default: undefined },\n resizable: { type: Boolean, default: undefined },\n disabled: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<FloatingPanelProps['translations']> },\n },\n // 语义事件收整个 details,update: 收裸值\n emits: {\n 'open-change': (_details: PayloadOf<FloatingPanelProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<FloatingPanelProps, 'onOpenChange'>['open']) => true,\n 'position-change': (_details: PayloadOf<FloatingPanelProps, 'onPositionChange'>) => true,\n 'update:position': (_position: PayloadOf<FloatingPanelProps, 'onPositionChange'>['position']) => true,\n 'dimensions-change': (_details: PayloadOf<FloatingPanelProps, 'onDimensionsChange'>) => true,\n 'update:dimensions': (_dimensions: PayloadOf<FloatingPanelProps, 'onDimensionsChange'>['dimensions']) => true,\n 'window-state-change': (_details: PayloadOf<FloatingPanelProps, 'onWindowStateChange'>) => true,\n 'update:windowState': (_windowState: PayloadOf<FloatingPanelProps, 'onWindowStateChange'>['windowState']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: FloatingPanelRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const ctx = useFloatingPanel(withXhConfig('floating-panel', props) as FloatingPanelProps, {\n onOpenChange: (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n },\n onPositionChange: (details) => {\n emit('position-change', details)\n emit('update:position', details.position)\n },\n onDimensionsChange: (details) => {\n emit('dimensions-change', details)\n emit('update:dimensions', details.dimensions)\n },\n onWindowStateChange: (details) => {\n emit('window-state-change', details)\n emit('update:windowState', details.windowState)\n },\n })\n provideFloatingPanel(ctx)\n return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n open: ctx.api.value.open,\n windowState: ctx.api.value.windowState,\n position: ctx.api.value.position,\n dimensions: ctx.api.value.dimensions,\n dragging: ctx.api.value.dragging,\n resizing: ctx.api.value.resizing,\n canDrag: ctx.api.value.canDrag,\n canResize: ctx.api.value.canResize,\n setOpen: ctx.api.value.setOpen,\n setPosition: ctx.api.value.setPosition,\n setDimensions: ctx.api.value.setDimensions,\n setWindowState: ctx.api.value.setWindowState,\n }))\n },\n})\n\nexport const XhFloatingPanelTrigger = defineComponent({\n name: 'XhFloatingPanelTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n // 用原生 button,激活交给平台\n return () => h('button', ctx.api.value.getTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelPositioner = defineComponent({\n name: 'XhFloatingPanelPositioner',\n props: {\n /** 本实例的 Portal 容器;优先于应用级配置。 */\n container: { type: Object as PropType<Element> },\n },\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 positioner 上\n inheritAttrs: false,\n setup(props, { slots, attrs }) {\n const ctx = useFloatingPanelContext()\n // 定位层搬到 portal 落点,逃开祖先的层叠上下文\n return () => h(XhPortal, { to: props.container ?? ctx.portalTarget.value }, () => [\n h(\n 'div',\n {\n ...mergeProps(\n ctx.api.value.getPositionerProps() as Record<string, unknown>,\n attrs,\n // 收起跟着退场闸门走:皮肤刻意没给 positioner 补 [hidden]{display:none}(补了\n // 退场就一帧都播不出来),所以真正的收起落成内联 display\n ctx.visible.value ? {} : { style: { display: 'none' } },\n ),\n ref: (el: unknown) => { ctx.positionerRef.value = el as HTMLElement },\n },\n slots.default?.(),\n ),\n ])\n },\n})\n\nexport const XhFloatingPanelContent = defineComponent({\n name: 'XhFloatingPanelContent',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n // 节点交给机器:跟手期间的指针监听要挂在它所在的那个文档上\n return () => h(\n 'div',\n { ...ctx.api.value.getContentProps() as Record<string, unknown>, ref: ctx.contentRef },\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelHeader = defineComponent({\n name: 'XhFloatingPanelHeader',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('div', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelTitle = defineComponent({\n name: 'XhFloatingPanelTitle',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelDragTrigger = defineComponent({\n name: 'XhFloatingPanelDragTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('button', ctx.api.value.getDragTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelResizeTrigger = defineComponent({\n name: 'XhFloatingPanelResizeTrigger',\n props: {\n /** 该把手负责哪条边:n / e / s / w 四条边与 ne / nw / se / sw 四个角。 */\n edge: { type: String as PropType<FloatingPanelResizeEdge>, required: true },\n },\n setup(props, { slots }) {\n const ctx = useFloatingPanelContext()\n // 把手是 role=separator 的元素而不是按钮:方向键推边,按钮的激活键在这里没有语义\n return () => h(\n 'div',\n ctx.api.value.getResizeTriggerProps({ edge: props.edge }) as Record<string, unknown>,\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelWindowStateTrigger = defineComponent({\n name: 'XhFloatingPanelWindowStateTrigger',\n props: {\n /** 按下它切换到哪个形态;已处于该形态时再按一次回到常规。 */\n windowState: { type: String as PropType<FloatingPanelWindowState>, required: true },\n },\n setup(props, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h(\n 'button',\n ctx.api.value.getWindowStateTriggerProps({ windowState: props.windowState }) as Record<string, unknown>,\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelCloseTrigger = defineComponent({\n name: 'XhFloatingPanelCloseTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelBody = defineComponent({\n name: 'XhFloatingPanelBody',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":"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"}
1
+ {"version":3,"file":"floating-panel.js","names":[],"sources":["../../../src/components/floating-panel/floating-panel.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 floating panel 相关实现。\n\nimport type {\n FloatingPanelApi,\n FloatingPanelPosition,\n FloatingPanelResizeEdge,\n FloatingPanelSchema,\n FloatingPanelSize,\n FloatingPanelWindowState,\n} from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, mergeProps } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { XhPortal } from '../../runtime/portal'\nimport { provideFloatingPanel, useFloatingPanelContext } from './context'\nimport { useFloatingPanel } from './use-floating-panel'\n\ntype FloatingPanelProps = FloatingPanelSchema['props']\n\n/** 默认插槽的载荷:开合、形态与矩形,以及修改这四项的动作。 */\nexport type FloatingPanelRootSlotProps = Pick<\n FloatingPanelApi,\n 'open' | 'windowState' | 'position' | 'dimensions' | 'dragging' | 'resizing' | 'canDrag' | 'canResize'\n | 'setOpen' | 'setPosition' | 'setDimensions' | 'setWindowState'\n>\n\nexport const XhFloatingPanelRoot = defineComponent({\n name: 'XhFloatingPanelRoot',\n // 缺省值由 connect 与机器决定;普通类型省略 default,Boolean 显式保留 undefined\n props: {\n open: { type: Boolean, default: undefined },\n defaultOpen: { type: Boolean, default: undefined },\n position: { type: Object as PropType<FloatingPanelPosition> },\n defaultPosition: { type: Object as PropType<FloatingPanelPosition> },\n dimensions: { type: Object as PropType<FloatingPanelSize> },\n defaultDimensions: { type: Object as PropType<FloatingPanelSize> },\n minSize: { type: Object as PropType<FloatingPanelSize> },\n maxSize: { type: Object as PropType<FloatingPanelSize> },\n windowState: { type: String as PropType<FloatingPanelWindowState> },\n defaultWindowState: { type: String as PropType<FloatingPanelWindowState> },\n // 缺省为真的两个开关:写成裸 Boolean 会被 Vue 的布尔 casting 永久关死\n draggable: { type: Boolean, default: undefined },\n resizable: { type: Boolean, default: undefined },\n disabled: { type: Boolean, default: undefined },\n translations: { type: Object as PropType<FloatingPanelProps['translations']> },\n },\n // 语义事件收整个 details,update: 收裸值\n emits: {\n 'open-change': (_details: PayloadOf<FloatingPanelProps, 'onOpenChange'>) => true,\n 'update:open': (_open: PayloadOf<FloatingPanelProps, 'onOpenChange'>['open']) => true,\n 'position-change': (_details: PayloadOf<FloatingPanelProps, 'onPositionChange'>) => true,\n 'update:position': (_position: PayloadOf<FloatingPanelProps, 'onPositionChange'>['position']) => true,\n 'dimensions-change': (_details: PayloadOf<FloatingPanelProps, 'onDimensionsChange'>) => true,\n 'update:dimensions': (_dimensions: PayloadOf<FloatingPanelProps, 'onDimensionsChange'>['dimensions']) => true,\n 'window-state-change': (_details: PayloadOf<FloatingPanelProps, 'onWindowStateChange'>) => true,\n 'update:windowState': (_windowState: PayloadOf<FloatingPanelProps, 'onWindowStateChange'>['windowState']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: FloatingPanelRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const ctx = useFloatingPanel(withXhConfig('floating-panel', props) as FloatingPanelProps, {\n onOpenChange: (details) => {\n emit('open-change', details)\n emit('update:open', details.open)\n },\n onPositionChange: (details) => {\n emit('position-change', details)\n emit('update:position', details.position)\n },\n onDimensionsChange: (details) => {\n emit('dimensions-change', details)\n emit('update:dimensions', details.dimensions)\n },\n onWindowStateChange: (details) => {\n emit('window-state-change', details)\n emit('update:windowState', details.windowState)\n },\n })\n provideFloatingPanel(ctx)\n return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n open: ctx.api.value.open,\n windowState: ctx.api.value.windowState,\n position: ctx.api.value.position,\n dimensions: ctx.api.value.dimensions,\n dragging: ctx.api.value.dragging,\n resizing: ctx.api.value.resizing,\n canDrag: ctx.api.value.canDrag,\n canResize: ctx.api.value.canResize,\n setOpen: ctx.api.value.setOpen,\n setPosition: ctx.api.value.setPosition,\n setDimensions: ctx.api.value.setDimensions,\n setWindowState: ctx.api.value.setWindowState,\n }))\n },\n})\n\nexport const XhFloatingPanelTrigger = defineComponent({\n name: 'XhFloatingPanelTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n // 用原生 button,激活交给平台\n return () => h('button', ctx.api.value.getTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelPositioner = defineComponent({\n name: 'XhFloatingPanelPositioner',\n props: {\n /** 本实例的 Portal 容器;优先于应用级配置。 */\n container: { type: Object as PropType<Element> },\n },\n // 根是 Teleport,Vue 不会把直通属性合上去,作者写的 class 与 style 得自己接住落到 positioner 上\n inheritAttrs: false,\n setup(props, { slots, attrs }) {\n const ctx = useFloatingPanelContext()\n // 定位层搬到 portal 落点,逃开祖先的层叠上下文\n return () => h(XhPortal, { to: props.container ?? ctx.portalTarget.value, present: ctx.visible.value }, () => [\n h(\n 'div',\n {\n ...mergeProps(\n ctx.api.value.getPositionerProps() as Record<string, unknown>,\n attrs,\n // 收起跟着退场闸门走:皮肤刻意没给 positioner 补 [hidden]{display:none}(补了\n // 退场就一帧都播不出来),所以真正的收起落成内联 display\n ctx.visible.value ? {} : { style: { display: 'none' } },\n ),\n ref: (el: unknown) => { ctx.positionerRef.value = el as HTMLElement },\n },\n slots.default?.(),\n ),\n ])\n },\n})\n\nexport const XhFloatingPanelContent = defineComponent({\n name: 'XhFloatingPanelContent',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n // 节点交给机器:跟手期间的指针监听要挂在它所在的那个文档上\n return () => h(\n 'div',\n { ...ctx.api.value.getContentProps() as Record<string, unknown>, ref: ctx.contentRef },\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelHeader = defineComponent({\n name: 'XhFloatingPanelHeader',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('div', ctx.api.value.getHeaderProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelTitle = defineComponent({\n name: 'XhFloatingPanelTitle',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('h2', ctx.api.value.getTitleProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelDragTrigger = defineComponent({\n name: 'XhFloatingPanelDragTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('button', ctx.api.value.getDragTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelResizeTrigger = defineComponent({\n name: 'XhFloatingPanelResizeTrigger',\n props: {\n /** 该把手负责哪条边:n / e / s / w 四条边与 ne / nw / se / sw 四个角。 */\n edge: { type: String as PropType<FloatingPanelResizeEdge>, required: true },\n },\n setup(props, { slots }) {\n const ctx = useFloatingPanelContext()\n // 把手是 role=separator 的元素而不是按钮:方向键推边,按钮的激活键在这里没有语义\n return () => h(\n 'div',\n ctx.api.value.getResizeTriggerProps({ edge: props.edge }) as Record<string, unknown>,\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelWindowStateTrigger = defineComponent({\n name: 'XhFloatingPanelWindowStateTrigger',\n props: {\n /** 按下它切换到哪个形态;已处于该形态时再按一次回到常规。 */\n windowState: { type: String as PropType<FloatingPanelWindowState>, required: true },\n },\n setup(props, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h(\n 'button',\n ctx.api.value.getWindowStateTriggerProps({ windowState: props.windowState }) as Record<string, unknown>,\n slots.default?.(),\n )\n },\n})\n\nexport const XhFloatingPanelCloseTrigger = defineComponent({\n name: 'XhFloatingPanelCloseTrigger',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('button', ctx.api.value.getCloseTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFloatingPanelBody = defineComponent({\n name: 'XhFloatingPanelBody',\n setup(_, { slots }) {\n const ctx = useFloatingPanelContext()\n return () => h('div', ctx.api.value.getBodyProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":";;;;;;AAgCA,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CAEN,OAAO;EACL,MAAM;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC1C,aAAa;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EACjD,UAAU,EAAE,MAAM,OAA0C;EAC5D,iBAAiB,EAAE,MAAM,OAA0C;EACnE,YAAY,EAAE,MAAM,OAAsC;EAC1D,mBAAmB,EAAE,MAAM,OAAsC;EACjE,SAAS,EAAE,MAAM,OAAsC;EACvD,SAAS,EAAE,MAAM,OAAsC;EACvD,aAAa,EAAE,MAAM,OAA6C;EAClE,oBAAoB,EAAE,MAAM,OAA6C;EAEzE,WAAW;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC/C,WAAW;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC/C,UAAU;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAC9C,cAAc,EAAE,MAAM,OAAuD;CAC/E;CAEA,OAAO;EACL,gBAAgB,aAA4D;EAC5E,gBAAgB,UAAiE;EACjF,oBAAoB,aAAgE;EACpF,oBAAoB,cAA6E;EACjG,sBAAsB,aAAkE;EACxF,sBAAsB,gBAAmF;EACzG,wBAAwB,aAAmE;EAC3F,uBAAuB,iBAAsF;CAC/G;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAC5B,MAAM,MAAM,iBAAiB,aAAa,kBAAkB,KAAK,GAAyB;GACxF,eAAe,YAAY;IACzB,KAAK,eAAe,OAAO;IAC3B,KAAK,eAAe,QAAQ,IAAI;GAClC;GACA,mBAAmB,YAAY;IAC7B,KAAK,mBAAmB,OAAO;IAC/B,KAAK,mBAAmB,QAAQ,QAAQ;GAC1C;GACA,qBAAqB,YAAY;IAC/B,KAAK,qBAAqB,OAAO;IACjC,KAAK,qBAAqB,QAAQ,UAAU;GAC9C;GACA,sBAAsB,YAAY;IAChC,KAAK,uBAAuB,OAAO;IACnC,KAAK,sBAAsB,QAAQ,WAAW;GAChD;EACF,CAAC;EACD,qBAAqB,GAAG;EACxB,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU;GAC7F,MAAM,IAAI,IAAI,MAAM;GACpB,aAAa,IAAI,IAAI,MAAM;GAC3B,UAAU,IAAI,IAAI,MAAM;GACxB,YAAY,IAAI,IAAI,MAAM;GAC1B,UAAU,IAAI,IAAI,MAAM;GACxB,UAAU,IAAI,IAAI,MAAM;GACxB,SAAS,IAAI,IAAI,MAAM;GACvB,WAAW,IAAI,IAAI,MAAM;GACzB,SAAS,IAAI,IAAI,MAAM;GACvB,aAAa,IAAI,IAAI,MAAM;GAC3B,eAAe,IAAI,IAAI,MAAM;GAC7B,gBAAgB,IAAI,IAAI,MAAM;EAChC,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,yBAAyB,gBAAgB;CACpD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EAEpC,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,gBAAgB,GAA8B,MAAM,UAAU,CAAC;CACxG;AACF,CAAC;AAED,MAAa,4BAA4B,gBAAgB;CACvD,MAAM;CACN,OAAO;;AAEL,WAAW,EAAE,MAAM,OAA4B,EACjD;CAEA,cAAc;CACd,MAAM,OAAO,EAAE,OAAO,SAAS;EAC7B,MAAM,MAAM,wBAAwB;EAEpC,aAAa,EAAE,UAAU;GAAE,IAAI,MAAM,aAAa,IAAI,aAAa;GAAO,SAAS,IAAI,QAAQ;EAAM,SAAS,CAC5G,EACE,OACA;GACE,GAAG,WACD,IAAI,IAAI,MAAM,mBAAmB,GACjC,OAGA,IAAI,QAAQ,QAAQ,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,OAAO,EAAE,CACxD;GACA,MAAM,OAAgB;IAAE,IAAI,cAAc,QAAQ;GAAkB;EACtE,GACA,MAAM,UAAU,CAClB,CACF,CAAC;CACH;AACF,CAAC;AAED,MAAa,yBAAyB,gBAAgB;CACpD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EAEpC,aAAa,EACX,OACA;GAAE,GAAG,IAAI,IAAI,MAAM,gBAAgB;GAA8B,KAAK,IAAI;EAAW,GACrF,MAAM,UAAU,CAClB;CACF;AACF,CAAC;AAED,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,eAAe,GAA8B,MAAM,UAAU,CAAC;CACpG;AACF,CAAC;AAED,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EAAE,MAAM,IAAI,IAAI,MAAM,cAAc,GAA8B,MAAM,UAAU,CAAC;CAClG;AACF,CAAC;AAED,MAAa,6BAA6B,gBAAgB;CACxD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,oBAAoB,GAA8B,MAAM,UAAU,CAAC;CAC5G;AACF,CAAC;AAED,MAAa,+BAA+B,gBAAgB;CAC1D,MAAM;CACN,OAAO;;AAEL,MAAM;EAAE,MAAM;EAA6C,UAAU;CAAK,EAC5E;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,wBAAwB;EAEpC,aAAa,EACX,OACA,IAAI,IAAI,MAAM,sBAAsB,EAAE,MAAM,MAAM,KAAK,CAAC,GACxD,MAAM,UAAU,CAClB;CACF;AACF,CAAC;AAED,MAAa,oCAAoC,gBAAgB;CAC/D,MAAM;CACN,OAAO;;AAEL,aAAa;EAAE,MAAM;EAA8C,UAAU;CAAK,EACpF;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EACX,UACA,IAAI,IAAI,MAAM,2BAA2B,EAAE,aAAa,MAAM,YAAY,CAAC,GAC3E,MAAM,UAAU,CAClB;CACF;AACF,CAAC;AAED,MAAa,8BAA8B,gBAAgB;CACzD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,qBAAqB,GAA8B,MAAM,UAAU,CAAC;CAC7G;AACF,CAAC;AAED,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,wBAAwB;EACpC,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CAClG;AACF,CAAC"}
@@ -43,6 +43,10 @@ declare const XhFormRoot: import("vue").DefineComponent<import("vue").ExtractPro
43
43
  validateMessages: {
44
44
  type: PropType<FormProps["validateMessages"]>;
45
45
  };
46
+ /** 校验报错的文案模板;全局语言包经它到达,validateMessages 再逐条压在上面。 */
47
+ translations: {
48
+ type: PropType<FormProps["translations"]>;
49
+ };
46
50
  validateOn: {
47
51
  type: PropType<FormValidateOn>;
48
52
  };
@@ -100,6 +104,10 @@ declare const XhFormRoot: import("vue").DefineComponent<import("vue").ExtractPro
100
104
  validateMessages: {
101
105
  type: PropType<FormProps["validateMessages"]>;
102
106
  };
107
+ /** 校验报错的文案模板;全局语言包经它到达,validateMessages 再逐条压在上面。 */
108
+ translations: {
109
+ type: PropType<FormProps["translations"]>;
110
+ };
103
111
  validateOn: {
104
112
  type: PropType<FormValidateOn>;
105
113
  };
@@ -1 +1 @@
1
- {"version":3,"file":"form.d.ts","names":[],"sources":["../../../src/components/form/form.ts"],"mappings":";;;;KAcK,YAAY;;KAGL,oBAAoB,KAC9B;;UA0Be;EACf,MAAM;EACN;EACA;EACA;EACA;EACA,WAAW;;;KAID,4BAA4B,KAAK;;UAG5B;EACf,MAAM;EACN;;cAGW,0BAAU,8BAAA;;IAIO,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IAChB,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IACZ,MAAA,SAAS;;;IACd,MAAA,SAAS;;;IACE,MAAA,SAAS;;;IACf,MAAA,SAAS;;;IACb,MAAA,SAAS;;;;IAEE,MAAA,SAAS;;;;;;IAEhB,MAAA,SAAS;;;;;;;;;IAOT,MAAA,SAAS;;;;;EAIX,kBAAA,UAAA,UAAU;EACV,kBAAA,UAAA,UAAU;EAChB,UAAA,UAAA,UAAU;EACL,iBAAA,UAAA,UAAU;EACN,qBAAA,UAAA,UAAU;EACd,kBAAA,SAAA,UAAU;EACV,kBAAA,SAAA,UAAU;;;IA7BX,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IAChB,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IACZ,MAAA,SAAS;;;IACd,MAAA,SAAS;;;IACE,MAAA,SAAS;;;IACf,MAAA,SAAS;;;IACb,MAAA,SAAS;;;;IAEE,MAAA,SAAS;;;;;;IAEhB,MAAA,SAAS;;;;;;;;;IAOT,MAAA,SAAS;;;;;;;;;;;;;;EAa7B,WAAC,OAAO,sBAAsB;kCAiD1C;cAEW,gCAAgB,8BAAA;;;IAIQ,MAAA,SAAS;;;;;IAER,MAAA,SAAS;;;;;;;IAFV,MAAA,SAAS;;;;;IAER,MAAA,SAAS;;;EAGjC,WAAC,OAAO,4BAA4B;kCAoBhD;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;;EAGjB,WAAC,OAAO,8BAA8B;kCAWlD;cAEW,sCAAsB,8BAAA;;;IAIE,MAAA,SAAS;;;;;;;;IAAT,MAAA,SAAS;;;;EAGhC,WAAC,OAAO,kCAAkC;kCAWtD;cAEW,mCAAmB,0BAAA,oBAAA,4BAAA;;8BAM9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
1
+ {"version":3,"file":"form.d.ts","names":[],"sources":["../../../src/components/form/form.ts"],"mappings":";;;;KAeK,YAAY;;KAGL,oBAAoB,KAC9B;;UA0Be;EACf,MAAM;EACN;EACA;EACA;EACA;EACA,WAAW;;;KAID,4BAA4B,KAAK;;UAG5B;EACf,MAAM;EACN;;cAGW,0BAAU,8BAAA;;IAIO,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IAChB,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IACZ,MAAA,SAAS;;;IACd,MAAA,SAAS;;;IACE,MAAA,SAAS;;;;IAEb,MAAA,SAAS;;;IACX,MAAA,SAAS;;;IACb,MAAA,SAAS;;;;IAEE,MAAA,SAAS;;;;;;IAEhB,MAAA,SAAS;;;;;;;;;IAOT,MAAA,SAAS;;;;;EAIX,kBAAA,UAAA,UAAU;EACV,kBAAA,UAAA,UAAU;EAChB,UAAA,UAAA,UAAU;EACL,iBAAA,UAAA,UAAU;EACN,qBAAA,UAAA,UAAU;EACd,kBAAA,SAAA,UAAU;EACV,kBAAA,SAAA,UAAU;;;IA/BX,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IAChB,MAAA,SAAS;;;IACF,MAAA,SAAS;;;IACZ,MAAA,SAAS;;;IACd,MAAA,SAAS;;;IACE,MAAA,SAAS;;;;IAEb,MAAA,SAAS;;;IACX,MAAA,SAAS;;;IACb,MAAA,SAAS;;;;IAEE,MAAA,SAAS;;;;;;IAEhB,MAAA,SAAS;;;;;;;;;IAOT,MAAA,SAAS;;;;;;;;;;;;;;EAa7B,WAAC,OAAO,sBAAsB;kCAiD1C;cAEW,gCAAgB,8BAAA;;;IAIQ,MAAA,SAAS;;;;;IAER,MAAA,SAAS;;;;;;;IAFV,MAAA,SAAS;;;;;IAER,MAAA,SAAS;;;EAGjC,WAAC,OAAO,4BAA4B;kCAoBhD;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;;EAGjB,WAAC,OAAO,8BAA8B;kCAWlD;cAEW,sCAAsB,8BAAA;;;IAIE,MAAA,SAAS;;;;;;;;IAAT,MAAA,SAAS;;;;EAGhC,WAAC,OAAO,kCAAkC;kCAWtD;cAEW,mCAAmB,0BAAA,oBAAA,4BAAA;;8BAM9B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
@@ -1,3 +1,4 @@
1
+ import { withXhConfig } from "../../config/config.js";
1
2
  import { provideForm, provideFormField, useFormContext } from "./context.js";
2
3
  import { useForm } from "./use-form.js";
3
4
  import { defineComponent, h } from "vue";
@@ -12,6 +13,8 @@ const XhFormRoot = defineComponent({
12
13
  validate: { type: Function },
13
14
  rules: { type: Object },
14
15
  validateMessages: { type: Object },
16
+ /** 校验报错的文案模板;全局语言包经它到达,validateMessages 再逐条压在上面。 */
17
+ translations: { type: Object },
15
18
  validateOn: { type: String },
16
19
  layout: { type: String },
17
20
  /** grid 排布下分几列:整数即各档同一个列数,断点对象 `{ base, sm, md, lg, xl }` 则逐档取值。 */
@@ -37,7 +40,7 @@ const XhFormRoot = defineComponent({
37
40
  },
38
41
  slots: Object,
39
42
  setup(props, { slots, emit }) {
40
- const ctx = useForm(props, {
43
+ const ctx = useForm(withXhConfig("form", props), {
41
44
  onValuesChange: (details) => {
42
45
  emit("values-change", details);
43
46
  emit("update:values", details.values);
@@ -1 +1 @@
1
- {"version":3,"file":"form.js","names":[],"sources":["../../../src/components/form/form.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 form 相关实现。\n\nimport type { FormApi, FormColumns, FormErrorPatch, FormFieldSpan, FormPath, FormSchema, FormValidateOn, FormValues } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h } from 'vue'\nimport { provideForm, provideFormField, useFormContext } from './context'\nimport { useForm } from './use-form'\n\ntype FormProps = FormSchema['props']\n\n/** 默认插槽的载荷:整表的值与错误、校验与提交在途、改动与触碰,以及逐字段读写、清错、校验、提交、重置的命令。 */\nexport type FormRootSlotProps = Pick<\n FormApi,\n | 'values'\n | 'errors'\n | 'errorNames'\n | 'invalid'\n | 'submitFailed'\n | 'validating'\n | 'submitting'\n | 'dirty'\n | 'validationError'\n | 'getFieldId'\n | 'getFieldError'\n | 'isFieldDirty'\n | 'isFieldTouched'\n | 'setFieldValue'\n | 'setFieldError'\n | 'clearErrors'\n | 'submit'\n | 'validateAll'\n | 'validateField'\n | 'validateFields'\n | 'resetField'\n | 'reset'\n>\n\n/** 字段容器默认插槽的载荷:该字段的名字、值、错误与控件 id,以及写值的命令。 */\nexport interface FormFieldGroupSlotProps {\n name: FormPath\n value: unknown\n error: string | undefined\n invalid: boolean\n controlId: string\n setValue: (next: unknown) => void\n}\n\n/** 错误摘要默认插槽的载荷:整表的错误、出错字段名与条数。 */\nexport type FormErrorSummarySlotProps = Pick<FormApi, 'errors' | 'errorNames' | 'errorCount'>\n\n/** 错误摘要单条默认插槽的载荷:该条指向的字段名与它的错误文案。 */\nexport interface FormErrorSummaryItemSlotProps {\n name: FormPath\n error: string | undefined\n}\n\nexport const XhFormRoot = defineComponent({\n name: 'XhFormRoot',\n // 缺省值由 connect 与机器给出;普通类型省略 default,Boolean 显式保留 undefined\n props: {\n values: { type: Object as PropType<FormValues> },\n defaultValues: { type: Object as PropType<FormValues> },\n errors: { type: Object as PropType<FormErrorPatch> },\n defaultErrors: { type: Object as PropType<FormErrorPatch> },\n validate: { type: Function as PropType<FormProps['validate']> },\n rules: { type: Object as PropType<FormProps['rules']> },\n validateMessages: { type: Object as PropType<FormProps['validateMessages']> },\n validateOn: { type: String as PropType<FormValidateOn> },\n layout: { type: String as PropType<FormProps['layout']> },\n /** grid 排布下分几列:整数即各档同一个列数,断点对象 `{ base, sm, md, lg, xl }` 则逐档取值。 */\n columns: { type: [Number, Object] as PropType<FormColumns> },\n labelWidth: { type: [Number, String] },\n labelAlign: { type: String as PropType<FormProps['labelAlign']> },\n disabled: Boolean,\n readOnly: Boolean,\n /**\n * 校验通过才调用。返回 thenable 期间 submitting 为真、再提交不发生,拒绝经 submit-error 报出。\n * 模板中照常写 @submit,Vue 会把它落到该 prop 上。\n */\n onSubmit: { type: Function as PropType<FormProps['onSubmit']> },\n },\n // *-change 携带 details 对象,update:* 携带裸表;submit 与 invalid 按校验结果二选一\n emits: {\n 'values-change': (_details: PayloadOf<FormProps, 'onValuesChange'>) => true,\n 'errors-change': (_details: PayloadOf<FormProps, 'onErrorsChange'>) => true,\n 'invalid': (_details: PayloadOf<FormProps, 'onInvalid'>) => true,\n 'submit-error': (_details: PayloadOf<FormProps, 'onSubmitError'>) => true,\n 'validation-error': (_details: PayloadOf<FormProps, 'onValidationError'>) => true,\n 'update:values': (_values: PayloadOf<FormProps, 'onValuesChange'>['values']) => true,\n 'update:errors': (_errors: PayloadOf<FormProps, 'onErrorsChange'>['errors']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: FormRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const ctx = useForm(props as FormProps, {\n onValuesChange: (details) => {\n emit('values-change', details)\n emit('update:values', details.values)\n },\n onErrorsChange: (details) => {\n emit('errors-change', details)\n emit('update:errors', details.errors)\n },\n // 返回值要交给机器:thenable 即进入提交在途\n onSubmit: details => props.onSubmit?.(details),\n onSubmitError: details => emit('submit-error', details),\n onInvalid: details => emit('invalid', details),\n onValidationError: details => emit('validation-error', details),\n })\n provideForm(ctx)\n\n // 根节点渲染为原生 form,隐式提交与 submit 事件都依赖它\n return () => h('form', {\n ...ctx.api.value.getRootProps() as Record<string, unknown>,\n ref: (el: unknown) => { ctx.rootRef.value = el as HTMLElement },\n }, slots.default?.({\n values: ctx.api.value.values,\n errors: ctx.api.value.errors,\n errorNames: ctx.api.value.errorNames,\n invalid: ctx.api.value.invalid,\n submitFailed: ctx.api.value.submitFailed,\n validating: ctx.api.value.validating,\n submitting: ctx.api.value.submitting,\n dirty: ctx.api.value.dirty,\n validationError: ctx.api.value.validationError,\n getFieldId: ctx.api.value.getFieldId,\n getFieldError: ctx.api.value.getFieldError,\n isFieldDirty: ctx.api.value.isFieldDirty,\n isFieldTouched: ctx.api.value.isFieldTouched,\n setFieldValue: ctx.setFieldValue,\n setFieldError: ctx.setFieldError,\n clearErrors: ctx.clearErrors,\n submit: ctx.submit,\n validateAll: ctx.validateAll,\n validateField: ctx.validateField,\n validateFields: ctx.validateFields,\n resetField: ctx.resetField,\n reset: ctx.reset,\n }))\n },\n})\n\nexport const XhFormFieldGroup = defineComponent({\n name: 'XhFormFieldGroup',\n props: {\n /** 字段路径;字符串含点仍是单键,数组才表示层级。 */\n name: { type: [String, Array] as PropType<FormPath>, required: true },\n /** grid 排布下该格占多宽:1 至 4 跨相应列数,'full' 占满整行;未写时占一列。 */\n span: { type: [Number, String] as PropType<FormFieldSpan> },\n },\n slots: Object as SlotsType<{\n default?: (props: FormFieldGroupSlotProps) => VNode[]\n }>,\n setup(props, { slots }) {\n const ctx = useFormContext()\n // 后代 Field 据此从表单上下文自取校验态,省掉逐字段搬运\n provideFormField({ name: () => props.name })\n // 作用域插槽暴露本字段的值、错误与写入方法\n return () => h(\n 'div',\n ctx.api.value.getFieldGroupProps({ name: props.name, span: props.span }) as Record<string, unknown>,\n slots.default?.({\n name: props.name,\n value: ctx.api.value.getFieldValue(props.name),\n error: ctx.api.value.getFieldError(props.name),\n invalid: ctx.api.value.isFieldInvalid(props.name),\n controlId: ctx.api.value.getFieldId(props.name),\n setValue: (next: unknown) => ctx.setFieldValue(props.name, next),\n }),\n )\n },\n})\n\nexport const XhFormErrorSummary = defineComponent({\n name: 'XhFormErrorSummary',\n slots: Object as SlotsType<{\n default?: (props: FormErrorSummarySlotProps) => VNode[]\n }>,\n setup(_, { slots }) {\n const ctx = useFormContext()\n // 摘要读它自己那版错误表:退场途中文案与条数照撤下之前的写\n return () => h('div', ctx.api.value.getErrorSummaryProps() as Record<string, unknown>, slots.default?.({\n errors: ctx.api.value.summaryErrors,\n errorNames: ctx.api.value.summaryErrorNames,\n errorCount: ctx.api.value.summaryErrorCount,\n }))\n },\n})\n\nexport const XhFormErrorSummaryItem = defineComponent({\n name: 'XhFormErrorSummaryItem',\n props: {\n /** 该条指向哪个字段路径。 */\n name: { type: [String, Array] as PropType<FormPath>, required: true },\n },\n slots: Object as SlotsType<{\n default?: (props: FormErrorSummaryItemSlotProps) => VNode[]\n }>,\n setup(props, { slots }) {\n const ctx = useFormContext()\n // 渲染为原生 a,href 指向字段容器的 id\n return () => h(\n 'a',\n ctx.api.value.getErrorSummaryItemProps({ name: props.name }) as Record<string, unknown>,\n slots.default?.({ name: props.name, error: ctx.api.value.getSummaryError(props.name) }),\n )\n },\n})\n\nexport const XhFormSubmitTrigger = defineComponent({\n name: 'XhFormSubmitTrigger',\n setup(_, { slots }) {\n const ctx = useFormContext()\n return () => h('button', ctx.api.value.getSubmitTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFormResetTrigger = defineComponent({\n name: 'XhFormResetTrigger',\n setup(_, { slots }) {\n const ctx = useFormContext()\n return () => h('button', ctx.api.value.getResetTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":";;;;AA8DA,MAAa,aAAa,gBAAgB;CACxC,MAAM;CAEN,OAAO;EACL,QAAQ,EAAE,MAAM,OAA+B;EAC/C,eAAe,EAAE,MAAM,OAA+B;EACtD,QAAQ,EAAE,MAAM,OAAmC;EACnD,eAAe,EAAE,MAAM,OAAmC;EAC1D,UAAU,EAAE,MAAM,SAA4C;EAC9D,OAAO,EAAE,MAAM,OAAuC;EACtD,kBAAkB,EAAE,MAAM,OAAkD;EAC5E,YAAY,EAAE,MAAM,OAAmC;EACvD,QAAQ,EAAE,MAAM,OAAwC;;EAExD,SAAS,EAAE,MAAM,CAAC,QAAQ,MAAM,EAA2B;EAC3D,YAAY,EAAE,MAAM,CAAC,QAAQ,MAAM,EAAE;EACrC,YAAY,EAAE,MAAM,OAA4C;EAChE,UAAU;EACV,UAAU;;;;;EAKV,UAAU,EAAE,MAAM,SAA4C;CAChE;CAEA,OAAO;EACL,kBAAkB,aAAqD;EACvE,kBAAkB,aAAqD;EACvE,YAAY,aAAgD;EAC5D,iBAAiB,aAAoD;EACrE,qBAAqB,aAAwD;EAC7E,kBAAkB,YAA8D;EAChF,kBAAkB,YAA8D;CAClF;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAC5B,MAAM,MAAM,QAAQ,OAAoB;GACtC,iBAAiB,YAAY;IAC3B,KAAK,iBAAiB,OAAO;IAC7B,KAAK,iBAAiB,QAAQ,MAAM;GACtC;GACA,iBAAiB,YAAY;IAC3B,KAAK,iBAAiB,OAAO;IAC7B,KAAK,iBAAiB,QAAQ,MAAM;GACtC;GAEA,WAAU,YAAW,MAAM,WAAW,OAAO;GAC7C,gBAAe,YAAW,KAAK,gBAAgB,OAAO;GACtD,YAAW,YAAW,KAAK,WAAW,OAAO;GAC7C,oBAAmB,YAAW,KAAK,oBAAoB,OAAO;EAChE,CAAC;EACD,YAAY,GAAG;EAGf,aAAa,EAAE,QAAQ;GACrB,GAAG,IAAI,IAAI,MAAM,aAAa;GAC9B,MAAM,OAAgB;IAAE,IAAI,QAAQ,QAAQ;GAAkB;EAChE,GAAG,MAAM,UAAU;GACjB,QAAQ,IAAI,IAAI,MAAM;GACtB,QAAQ,IAAI,IAAI,MAAM;GACtB,YAAY,IAAI,IAAI,MAAM;GAC1B,SAAS,IAAI,IAAI,MAAM;GACvB,cAAc,IAAI,IAAI,MAAM;GAC5B,YAAY,IAAI,IAAI,MAAM;GAC1B,YAAY,IAAI,IAAI,MAAM;GAC1B,OAAO,IAAI,IAAI,MAAM;GACrB,iBAAiB,IAAI,IAAI,MAAM;GAC/B,YAAY,IAAI,IAAI,MAAM;GAC1B,eAAe,IAAI,IAAI,MAAM;GAC7B,cAAc,IAAI,IAAI,MAAM;GAC5B,gBAAgB,IAAI,IAAI,MAAM;GAC9B,eAAe,IAAI;GACnB,eAAe,IAAI;GACnB,aAAa,IAAI;GACjB,QAAQ,IAAI;GACZ,aAAa,IAAI;GACjB,eAAe,IAAI;GACnB,gBAAgB,IAAI;GACpB,YAAY,IAAI;GAChB,OAAO,IAAI;EACb,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,mBAAmB,gBAAgB;CAC9C,MAAM;CACN,OAAO;;EAEL,MAAM;GAAE,MAAM,CAAC,QAAQ,KAAK;GAAyB,UAAU;EAAK;;EAEpE,MAAM,EAAE,MAAM,CAAC,QAAQ,MAAM,EAA6B;CAC5D;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,eAAe;EAE3B,iBAAiB,EAAE,YAAY,MAAM,KAAK,CAAC;EAE3C,aAAa,EACX,OACA,IAAI,IAAI,MAAM,mBAAmB;GAAE,MAAM,MAAM;GAAM,MAAM,MAAM;EAAK,CAAC,GACvE,MAAM,UAAU;GACd,MAAM,MAAM;GACZ,OAAO,IAAI,IAAI,MAAM,cAAc,MAAM,IAAI;GAC7C,OAAO,IAAI,IAAI,MAAM,cAAc,MAAM,IAAI;GAC7C,SAAS,IAAI,IAAI,MAAM,eAAe,MAAM,IAAI;GAChD,WAAW,IAAI,IAAI,MAAM,WAAW,MAAM,IAAI;GAC9C,WAAW,SAAkB,IAAI,cAAc,MAAM,MAAM,IAAI;EACjE,CAAC,CACH;CACF;AACF,CAAC;AAED,MAAa,qBAAqB,gBAAgB;CAChD,MAAM;CACN,OAAO;CAGP,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,eAAe;EAE3B,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,qBAAqB,GAA8B,MAAM,UAAU;GACrG,QAAQ,IAAI,IAAI,MAAM;GACtB,YAAY,IAAI,IAAI,MAAM;GAC1B,YAAY,IAAI,IAAI,MAAM;EAC5B,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,yBAAyB,gBAAgB;CACpD,MAAM;CACN,OAAO;;AAEL,MAAM;EAAE,MAAM,CAAC,QAAQ,KAAK;EAAyB,UAAU;CAAK,EACtE;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,eAAe;EAE3B,aAAa,EACX,KACA,IAAI,IAAI,MAAM,yBAAyB,EAAE,MAAM,MAAM,KAAK,CAAC,GAC3D,MAAM,UAAU;GAAE,MAAM,MAAM;GAAM,OAAO,IAAI,IAAI,MAAM,gBAAgB,MAAM,IAAI;EAAE,CAAC,CACxF;CACF;AACF,CAAC;AAED,MAAa,sBAAsB,gBAAgB;CACjD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,eAAe;EAC3B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,sBAAsB,GAA8B,MAAM,UAAU,CAAC;CAC9G;AACF,CAAC;AAED,MAAa,qBAAqB,gBAAgB;CAChD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,eAAe;EAC3B,aAAa,EAAE,UAAU,IAAI,IAAI,MAAM,qBAAqB,GAA8B,MAAM,UAAU,CAAC;CAC7G;AACF,CAAC"}
1
+ {"version":3,"file":"form.js","names":[],"sources":["../../../src/components/form/form.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// 提供 form 相关实现。\n\nimport type { FormApi, FormColumns, FormErrorPatch, FormFieldSpan, FormPath, FormSchema, FormValidateOn, FormValues } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h } from 'vue'\nimport { withXhConfig } from '../../config/config'\nimport { provideForm, provideFormField, useFormContext } from './context'\nimport { useForm } from './use-form'\n\ntype FormProps = FormSchema['props']\n\n/** 默认插槽的载荷:整表的值与错误、校验与提交在途、改动与触碰,以及逐字段读写、清错、校验、提交、重置的命令。 */\nexport type FormRootSlotProps = Pick<\n FormApi,\n | 'values'\n | 'errors'\n | 'errorNames'\n | 'invalid'\n | 'submitFailed'\n | 'validating'\n | 'submitting'\n | 'dirty'\n | 'validationError'\n | 'getFieldId'\n | 'getFieldError'\n | 'isFieldDirty'\n | 'isFieldTouched'\n | 'setFieldValue'\n | 'setFieldError'\n | 'clearErrors'\n | 'submit'\n | 'validateAll'\n | 'validateField'\n | 'validateFields'\n | 'resetField'\n | 'reset'\n>\n\n/** 字段容器默认插槽的载荷:该字段的名字、值、错误与控件 id,以及写值的命令。 */\nexport interface FormFieldGroupSlotProps {\n name: FormPath\n value: unknown\n error: string | undefined\n invalid: boolean\n controlId: string\n setValue: (next: unknown) => void\n}\n\n/** 错误摘要默认插槽的载荷:整表的错误、出错字段名与条数。 */\nexport type FormErrorSummarySlotProps = Pick<FormApi, 'errors' | 'errorNames' | 'errorCount'>\n\n/** 错误摘要单条默认插槽的载荷:该条指向的字段名与它的错误文案。 */\nexport interface FormErrorSummaryItemSlotProps {\n name: FormPath\n error: string | undefined\n}\n\nexport const XhFormRoot = defineComponent({\n name: 'XhFormRoot',\n // 缺省值由 connect 与机器给出;普通类型省略 default,Boolean 显式保留 undefined\n props: {\n values: { type: Object as PropType<FormValues> },\n defaultValues: { type: Object as PropType<FormValues> },\n errors: { type: Object as PropType<FormErrorPatch> },\n defaultErrors: { type: Object as PropType<FormErrorPatch> },\n validate: { type: Function as PropType<FormProps['validate']> },\n rules: { type: Object as PropType<FormProps['rules']> },\n validateMessages: { type: Object as PropType<FormProps['validateMessages']> },\n /** 校验报错的文案模板;全局语言包经它到达,validateMessages 再逐条压在上面。 */\n translations: { type: Object as PropType<FormProps['translations']> },\n validateOn: { type: String as PropType<FormValidateOn> },\n layout: { type: String as PropType<FormProps['layout']> },\n /** grid 排布下分几列:整数即各档同一个列数,断点对象 `{ base, sm, md, lg, xl }` 则逐档取值。 */\n columns: { type: [Number, Object] as PropType<FormColumns> },\n labelWidth: { type: [Number, String] },\n labelAlign: { type: String as PropType<FormProps['labelAlign']> },\n disabled: Boolean,\n readOnly: Boolean,\n /**\n * 校验通过才调用。返回 thenable 期间 submitting 为真、再提交不发生,拒绝经 submit-error 报出。\n * 模板中照常写 @submit,Vue 会把它落到该 prop 上。\n */\n onSubmit: { type: Function as PropType<FormProps['onSubmit']> },\n },\n // *-change 携带 details 对象,update:* 携带裸表;submit 与 invalid 按校验结果二选一\n emits: {\n 'values-change': (_details: PayloadOf<FormProps, 'onValuesChange'>) => true,\n 'errors-change': (_details: PayloadOf<FormProps, 'onErrorsChange'>) => true,\n 'invalid': (_details: PayloadOf<FormProps, 'onInvalid'>) => true,\n 'submit-error': (_details: PayloadOf<FormProps, 'onSubmitError'>) => true,\n 'validation-error': (_details: PayloadOf<FormProps, 'onValidationError'>) => true,\n 'update:values': (_values: PayloadOf<FormProps, 'onValuesChange'>['values']) => true,\n 'update:errors': (_errors: PayloadOf<FormProps, 'onErrorsChange'>['errors']) => true,\n },\n slots: Object as SlotsType<{\n default?: (props: FormRootSlotProps) => VNode[]\n }>,\n setup(props, { slots, emit }) {\n const ctx = useForm(withXhConfig('form', props) as FormProps, {\n onValuesChange: (details) => {\n emit('values-change', details)\n emit('update:values', details.values)\n },\n onErrorsChange: (details) => {\n emit('errors-change', details)\n emit('update:errors', details.errors)\n },\n // 返回值要交给机器:thenable 即进入提交在途\n onSubmit: details => props.onSubmit?.(details),\n onSubmitError: details => emit('submit-error', details),\n onInvalid: details => emit('invalid', details),\n onValidationError: details => emit('validation-error', details),\n })\n provideForm(ctx)\n\n // 根节点渲染为原生 form,隐式提交与 submit 事件都依赖它\n return () => h('form', {\n ...ctx.api.value.getRootProps() as Record<string, unknown>,\n ref: (el: unknown) => { ctx.rootRef.value = el as HTMLElement },\n }, slots.default?.({\n values: ctx.api.value.values,\n errors: ctx.api.value.errors,\n errorNames: ctx.api.value.errorNames,\n invalid: ctx.api.value.invalid,\n submitFailed: ctx.api.value.submitFailed,\n validating: ctx.api.value.validating,\n submitting: ctx.api.value.submitting,\n dirty: ctx.api.value.dirty,\n validationError: ctx.api.value.validationError,\n getFieldId: ctx.api.value.getFieldId,\n getFieldError: ctx.api.value.getFieldError,\n isFieldDirty: ctx.api.value.isFieldDirty,\n isFieldTouched: ctx.api.value.isFieldTouched,\n setFieldValue: ctx.setFieldValue,\n setFieldError: ctx.setFieldError,\n clearErrors: ctx.clearErrors,\n submit: ctx.submit,\n validateAll: ctx.validateAll,\n validateField: ctx.validateField,\n validateFields: ctx.validateFields,\n resetField: ctx.resetField,\n reset: ctx.reset,\n }))\n },\n})\n\nexport const XhFormFieldGroup = defineComponent({\n name: 'XhFormFieldGroup',\n props: {\n /** 字段路径;字符串含点仍是单键,数组才表示层级。 */\n name: { type: [String, Array] as PropType<FormPath>, required: true },\n /** grid 排布下该格占多宽:1 至 4 跨相应列数,'full' 占满整行;未写时占一列。 */\n span: { type: [Number, String] as PropType<FormFieldSpan> },\n },\n slots: Object as SlotsType<{\n default?: (props: FormFieldGroupSlotProps) => VNode[]\n }>,\n setup(props, { slots }) {\n const ctx = useFormContext()\n // 后代 Field 据此从表单上下文自取校验态,省掉逐字段搬运\n provideFormField({ name: () => props.name })\n // 作用域插槽暴露本字段的值、错误与写入方法\n return () => h(\n 'div',\n ctx.api.value.getFieldGroupProps({ name: props.name, span: props.span }) as Record<string, unknown>,\n slots.default?.({\n name: props.name,\n value: ctx.api.value.getFieldValue(props.name),\n error: ctx.api.value.getFieldError(props.name),\n invalid: ctx.api.value.isFieldInvalid(props.name),\n controlId: ctx.api.value.getFieldId(props.name),\n setValue: (next: unknown) => ctx.setFieldValue(props.name, next),\n }),\n )\n },\n})\n\nexport const XhFormErrorSummary = defineComponent({\n name: 'XhFormErrorSummary',\n slots: Object as SlotsType<{\n default?: (props: FormErrorSummarySlotProps) => VNode[]\n }>,\n setup(_, { slots }) {\n const ctx = useFormContext()\n // 摘要读它自己那版错误表:退场途中文案与条数照撤下之前的写\n return () => h('div', ctx.api.value.getErrorSummaryProps() as Record<string, unknown>, slots.default?.({\n errors: ctx.api.value.summaryErrors,\n errorNames: ctx.api.value.summaryErrorNames,\n errorCount: ctx.api.value.summaryErrorCount,\n }))\n },\n})\n\nexport const XhFormErrorSummaryItem = defineComponent({\n name: 'XhFormErrorSummaryItem',\n props: {\n /** 该条指向哪个字段路径。 */\n name: { type: [String, Array] as PropType<FormPath>, required: true },\n },\n slots: Object as SlotsType<{\n default?: (props: FormErrorSummaryItemSlotProps) => VNode[]\n }>,\n setup(props, { slots }) {\n const ctx = useFormContext()\n // 渲染为原生 a,href 指向字段容器的 id\n return () => h(\n 'a',\n ctx.api.value.getErrorSummaryItemProps({ name: props.name }) as Record<string, unknown>,\n slots.default?.({ name: props.name, error: ctx.api.value.getSummaryError(props.name) }),\n )\n },\n})\n\nexport const XhFormSubmitTrigger = defineComponent({\n name: 'XhFormSubmitTrigger',\n setup(_, { slots }) {\n const ctx = useFormContext()\n return () => h('button', ctx.api.value.getSubmitTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n\nexport const XhFormResetTrigger = defineComponent({\n name: 'XhFormResetTrigger',\n setup(_, { slots }) {\n const ctx = useFormContext()\n return () => h('button', ctx.api.value.getResetTriggerProps() as Record<string, unknown>, slots.default?.())\n },\n})\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"funnel-chart.d.ts","names":[],"sources":["../../../src/components/funnel-chart/funnel-chart.ts"],"mappings":";;;;KA+BK,mBAAmB;;KAGZ,2BAA2B,KAAK;;UAG3B;EACf,QAAQ;EACR,SAAS;;;cA2CE,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAShC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,0BAAA,oBAAA,4BAAA;;8BAU5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,oCAAoB,0BAAA,oBAAA,4BAAA;;;EAGnB,WAAC,OAAO,gCAAgC;kCAWpD;;cAGW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,8BAAA;;IAIH,MAAA,kBAAkB;;;;;;;;;IAGhB,MAAA,SAAS;;;IACT,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACb,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACE,MAAA,SAAS,qBAAqB;;;IACrC,MAAA;;;IACO,MAAA;;;IACa,MAAA,SAAS;;;;;;;;;;;;;;IAI5B,MAAA,SAAS,QAAQ;;;;;EAId,yBAAA,UAAA,UAAU;EACZ,wBAAA,SAAA,UAAU;EACX,sBAAA,UAAA,UAAU;EACf,qBAAA,MAAA,UAAU;EACV,iBAAA,UAAA,UAAU;EACX,gBAAA,UAAA,UAAU;;;IAzBb,MAAA,kBAAkB;;;;;;;;;IAGhB,MAAA,SAAS;;;IACT,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACb,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACE,MAAA,SAAS,qBAAqB;;;IACrC,MAAA;;;IACO,MAAA;;;IACa,MAAA,SAAS;;;;;;;;;;;;;;IAI5B,MAAA,SAAS,QAAQ;;;;;;;;;;;;;;EAavC,WAAC,OAAO,6BAA6B;;EAErC,gBAAM;;EAEN,WAAC,OAAO,gCAAgC;;EAE1C,cAAM;kCA4ChB"}
1
+ {"version":3,"file":"funnel-chart.d.ts","names":[],"sources":["../../../src/components/funnel-chart/funnel-chart.ts"],"mappings":";;;;KA+BK,mBAAmB;;KAGZ,2BAA2B,KAAK;;UAG3B;EACf,QAAQ;EACR,SAAS;;;cA8CE,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAM/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAShC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,0BAAA,oBAAA,4BAAA;;8BAU5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,oCAAoB,0BAAA,oBAAA,4BAAA;;;EAGnB,WAAC,OAAO,gCAAgC;kCAWpD;;cAGW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;;cAGW,iCAAiB,8BAAA;;IAIH,MAAA,kBAAkB;;;;;;;;;IAGhB,MAAA,SAAS;;;IACT,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACb,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACE,MAAA,SAAS,qBAAqB;;;IACrC,MAAA;;;IACO,MAAA;;;IACa,MAAA,SAAS;;;;;;;;;;;;;;IAI5B,MAAA,SAAS,QAAQ;;;;;EAId,yBAAA,UAAA,UAAU;EACZ,wBAAA,SAAA,UAAU;EACX,sBAAA,UAAA,UAAU;EACf,qBAAA,MAAA,UAAU;EACV,iBAAA,UAAA,UAAU;EACX,gBAAA,UAAA,UAAU;;;IAzBb,MAAA,kBAAkB;;;;;;;;;IAGhB,MAAA,SAAS;;;IACT,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACb,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACE,MAAA,SAAS,qBAAqB;;;IACrC,MAAA;;;IACO,MAAA;;;IACa,MAAA,SAAS;;;;;;;;;;;;;;IAI5B,MAAA,SAAS,QAAQ;;;;;;;;;;;;;;EAavC,WAAC,OAAO,6BAA6B;;EAErC,gBAAM;;EAEN,WAAC,OAAO,gCAAgC;;EAE1C,cAAM;kCA4ChB"}
@@ -29,7 +29,7 @@ function renderTooltipContent(api) {
29
29
  /** 摘要与数据表:由根自动生成、视觉隐藏,保证无障碍等价物始终存在。 */
30
30
  function renderA11y(api) {
31
31
  const { columns, rows } = api.table;
32
- return [h("p", api.getSummaryProps(), api.summary), h("table", api.getTableProps(), [
32
+ return [h("p", api.getSummaryProps(), api.summary), h("div", api.getTableRegionProps(), [h("table", api.getTableProps(), [
33
33
  h("caption", api.tableCaption),
34
34
  h("thead", [h("tr", columns.map((column) => h("th", {
35
35
  key: column.id,
@@ -39,7 +39,7 @@ function renderA11y(api) {
39
39
  key: c,
40
40
  scope: "row"
41
41
  }, cell.text) : h("td", { key: c }, cell.text)))))
42
- ])];
42
+ ])])];
43
43
  }
44
44
  /** 标题:图表的可及名来源。 */
45
45
  const XhFunnelChartCaption = defineComponent({