@hoci/components 0.9.0 → 0.10.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 (6) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +74 -0
  3. package/README.zh-CN.md +74 -0
  4. package/dist/index.d.ts +199 -165
  5. package/dist/index.js +38 -161
  6. package/package.json +4 -4
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2022 Chizuki
3
+ Copyright (c) 2022 Chizuki(chizukicn@outlook.com)
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
package/README.md ADDED
@@ -0,0 +1,74 @@
1
+ # @hoci/components
2
+
3
+ [中文](README.zh-CN.md) | English
4
+
5
+ Vue 3 components that wrap [@hoci/core](../core/README.md) headless primitives. Use these when you want ready-to-use components with consistent naming (`Hi*` / `hi-*`) and a single `install()` for global registration.
6
+
7
+ > **💡 Recommendation:** For most use cases, we recommend using the **hoci** package instead of directly installing `@hoci/components`. The **hoci** package provides a unified entry point with components, composables, and auto-import resolver (`HociResolver`).
8
+
9
+ ## Install
10
+
11
+ ```sh
12
+ pnpm add @hoci/components
13
+ ```
14
+
15
+ **Peer dependencies:** Vue 3.3+, [@vueuse/core](https://vueuse.org/) 10.5+.
16
+
17
+ **Dependencies:** [@hoci/core](../core/README.md), [@hoci/shared](../shared/README.md).
18
+
19
+ ## Components
20
+
21
+ | Component | Description | Key Features |
22
+ |-----------|-------------|--------------|
23
+ | **HiAffix** | Pin content to viewport or target element while scrolling | Supports top/bottom positioning, custom offset, scroll container |
24
+ | **HiAffixTarget** | Target element for affix positioning | Provides context for affix components |
25
+ | **HiConfigProvider** | Global configuration provider | Sets default icon config, activate event for child components |
26
+ | **HiFileUpload** | File input with drag-and-drop support | Single/multiple file selection, file validation |
27
+ | **HiIcon** | Icon wrapper component | Size, color, mask support, flexible icon sources |
28
+ | **HiItem** | Selectable list item | Works with HiSelection, supports custom labels |
29
+ | **HiPopover** | Floating panel with placement control | Multiple placements, trigger events (click, hover, etc.), teleport support |
30
+ | **HiSelection** | Single/multi selection container | Supports single/multiple selection, custom classes, clearable |
31
+ | **HiSwitch** | Toggle switch component | Boolean state, active/inactive classes, disabled state |
32
+ | **HiTabs** | Tab container component | Tab switching logic, works with HiTabPane |
33
+ | **HiTabPane** | Individual tab panel | Used within HiTabs container |
34
+ | **HiVirtualList** | Virtualized list for large datasets | Efficient rendering, scroll handling, customizable item size |
35
+
36
+ ## Usage
37
+
38
+ ### Full Import
39
+
40
+ If you don't care about the bundle size so much, it's more convenient to use full import.
41
+
42
+ ```ts
43
+ import * as HociComponents from "@hoci/components";
44
+ // main.ts
45
+ import { createApp } from "vue";
46
+ import App from "./App.vue";
47
+
48
+ const app = createApp(App);
49
+ app.use(HociComponents);
50
+ app.mount("#app");
51
+ ```
52
+
53
+ ### Manually import
54
+
55
+ ```ts
56
+ import {
57
+ HiAffix,
58
+ HiAffixTarget,
59
+ HiConfigProvider,
60
+ HiFileUpload,
61
+ HiIcon,
62
+ HiItem,
63
+ HiPopover,
64
+ HiSelection,
65
+ HiSwitch,
66
+ HiTabPane,
67
+ HiTabs,
68
+ HiVirtualList,
69
+ } from "@hoci/components";
70
+ ```
71
+
72
+ ## License
73
+
74
+ MIT
package/README.zh-CN.md ADDED
@@ -0,0 +1,74 @@
1
+ # @hoci/components
2
+
3
+ [English](README.md) | 中文
4
+
5
+ 基于 [@hoci/core](../core/README.zh-CN.md) 无样式基础逻辑的 Vue 3 组件封装。适用于需要即用型组件、统一命名（`Hi*` / `hi-*`）以及一次 `install()` 全局注册的场景。
6
+
7
+ > **💡 推荐：** 大多数场景下，我们推荐使用 **hoci** 主包，而不是直接安装 `@hoci/components`。**hoci** 包提供了统一的入口，包含组件、组合式函数和自动导入解析器（`HociResolver`）。
8
+
9
+ ## 安装
10
+
11
+ ```sh
12
+ pnpm add @hoci/components
13
+ ```
14
+
15
+ **依赖要求：** Vue 3.3+、[@vueuse/core](https://vueuse.org/) 10.5+。
16
+
17
+ **内部依赖：** [@hoci/core](../core/README.zh-CN.md)、[@hoci/shared](../shared/README.zh-CN.md)。
18
+
19
+ ## 组件列表
20
+
21
+ | 组件 | 说明 | 主要特性 |
22
+ |------|------|----------|
23
+ | **HiAffix** | 滚动时将内容固定在视口或目标元素 | 支持顶部/底部定位、自定义偏移量、滚动容器 |
24
+ | **HiAffixTarget** | Affix 定位的目标元素 | 为 affix 组件提供上下文 |
25
+ | **HiConfigProvider** | 全局配置提供者 | 设置默认图标配置、子组件的激活事件 |
26
+ | **HiFileUpload** | 支持拖拽的文件上传 | 单选/多选文件、文件校验 |
27
+ | **HiIcon** | 图标封装组件 | 尺寸、颜色、遮罩支持，灵活的图标源 |
28
+ | **HiItem** | 可选项列表项 | 与 HiSelection 配合使用，支持自定义标签 |
29
+ | **HiPopover** | 可控制位置的浮动面板 | 多种位置、触发事件（点击、悬停等）、传送支持 |
30
+ | **HiSelection** | 单选/多选容器 | 支持单选/多选、自定义类名、可清除 |
31
+ | **HiSwitch** | 开关切换组件 | 布尔状态、激活/非激活类名、禁用状态 |
32
+ | **HiTabs** | 标签页容器组件 | 标签切换逻辑，与 HiTabPane 配合使用 |
33
+ | **HiTabPane** | 单个标签页面板 | 在 HiTabs 容器内使用 |
34
+ | **HiVirtualList** | 大列表虚拟滚动 | 高效渲染、滚动处理、可自定义项大小 |
35
+
36
+ ## 使用方式
37
+
38
+ ### 完整导入
39
+
40
+ 如果不太在意打包体积，完整导入更方便。
41
+
42
+ ```ts
43
+ import * as HociComponents from "@hoci/components";
44
+ // main.ts
45
+ import { createApp } from "vue";
46
+ import App from "./App.vue";
47
+
48
+ const app = createApp(App);
49
+ app.use(HociComponents);
50
+ app.mount("#app");
51
+ ```
52
+
53
+ ### 手动导入
54
+
55
+ ```ts
56
+ import {
57
+ HiAffix,
58
+ HiAffixTarget,
59
+ HiConfigProvider,
60
+ HiFileUpload,
61
+ HiIcon,
62
+ HiItem,
63
+ HiPopover,
64
+ HiSelection,
65
+ HiSwitch,
66
+ HiTabPane,
67
+ HiTabs,
68
+ HiVirtualList,
69
+ } from "@hoci/components";
70
+ ```
71
+
72
+ ## 许可
73
+
74
+ MIT
package/dist/index.d.ts CHANGED
@@ -1,19 +1,31 @@
1
+ import * as _hoci_core0 from "@hoci/core";
1
2
  import * as _hoci_shared0 from "@hoci/shared";
2
- import * as vue9 from "vue";
3
+ import * as vue from "vue";
3
4
  import { App, CSSProperties, KeepAliveProps, PropType } from "vue";
4
- import * as _hoci_core0 from "@hoci/core";
5
5
  import * as _tanstack_virtual_core0 from "@tanstack/virtual-core";
6
6
  import { PartialKeys, Virtualizer, VirtualizerOptions } from "@tanstack/virtual-core";
7
7
 
8
8
  //#region ../core/src/affix-target/component.d.ts
9
- declare const HiAffixTarget: vue9.DefineComponent<{}, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
9
+ declare const HiAffixTarget: vue.DefineComponent<vue.ExtractPropTypes<{
10
+ as: {
11
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
12
+ default: string;
13
+ };
14
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
10
15
  [key: string]: any;
11
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
16
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
17
+ as: {
18
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
19
+ default: string;
20
+ };
21
+ }>> & Readonly<{}>, {
22
+ as: string | vue.Component | ((props: any) => any);
23
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
12
24
  //#endregion
13
25
  //#region ../core/src/affix/component.d.ts
14
- declare const HiAffix: vue9.DefineComponent<vue9.ExtractPropTypes<{
26
+ declare const HiAffix: vue.DefineComponent<vue.ExtractPropTypes<{
15
27
  as: {
16
- type: StringConstructor;
28
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
17
29
  default: string;
18
30
  };
19
31
  fixedClass: {
@@ -25,21 +37,21 @@ declare const HiAffix: vue9.DefineComponent<vue9.ExtractPropTypes<{
25
37
  default: number;
26
38
  };
27
39
  position: {
28
- type: vue9.PropType<"top" | "bottom">;
40
+ type: vue.PropType<"top" | "bottom">;
29
41
  default: string;
30
42
  };
31
43
  target: {
32
- type: vue9.PropType<string | Element | (() => Element | null | undefined)>;
44
+ type: vue.PropType<string | Element | (() => Element | null | undefined)>;
33
45
  };
34
46
  zIndex: {
35
47
  type: NumberConstructor;
36
48
  default: number;
37
49
  };
38
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
50
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
39
51
  [key: string]: any;
40
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
52
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
41
53
  as: {
42
- type: StringConstructor;
54
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
43
55
  default: string;
44
56
  };
45
57
  fixedClass: {
@@ -51,80 +63,84 @@ declare const HiAffix: vue9.DefineComponent<vue9.ExtractPropTypes<{
51
63
  default: number;
52
64
  };
53
65
  position: {
54
- type: vue9.PropType<"top" | "bottom">;
66
+ type: vue.PropType<"top" | "bottom">;
55
67
  default: string;
56
68
  };
57
69
  target: {
58
- type: vue9.PropType<string | Element | (() => Element | null | undefined)>;
70
+ type: vue.PropType<string | Element | (() => Element | null | undefined)>;
59
71
  };
60
72
  zIndex: {
61
73
  type: NumberConstructor;
62
74
  default: number;
63
75
  };
64
76
  }>> & Readonly<{}>, {
65
- as: string;
77
+ as: string | vue.Component | ((props: any) => any);
66
78
  position: "bottom" | "top";
67
- fixedClass: string;
68
- offset: number;
69
79
  zIndex: number;
70
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
80
+ offset: number;
81
+ fixedClass: string;
82
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
71
83
  //#endregion
72
84
  //#region ../core/src/config-provider/component.d.ts
73
- declare const HiConfigProvider: vue9.DefineComponent<vue9.ExtractPropTypes<{
85
+ declare const HiConfigProvider: vue.DefineComponent<vue.ExtractPropTypes<{
74
86
  as: {
75
- type: StringConstructor;
87
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
88
+ default: string;
76
89
  };
77
90
  icon: {
78
- type: vue9.PropType<Partial<_hoci_core0.SharedConfig["icon"]>>;
91
+ type: vue.PropType<Partial<_hoci_core0.SharedConfig["icon"]>>;
79
92
  };
80
93
  activateEvent: {
81
- type: vue9.PropType<Partial<_hoci_core0.SharedConfig["activateEvent"]>>;
94
+ type: vue.PropType<Partial<_hoci_core0.SharedConfig["activateEvent"]>>;
82
95
  };
83
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
96
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
84
97
  [key: string]: any;
85
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
98
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
86
99
  as: {
87
- type: StringConstructor;
100
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
101
+ default: string;
88
102
  };
89
103
  icon: {
90
- type: vue9.PropType<Partial<_hoci_core0.SharedConfig["icon"]>>;
104
+ type: vue.PropType<Partial<_hoci_core0.SharedConfig["icon"]>>;
91
105
  };
92
106
  activateEvent: {
93
- type: vue9.PropType<Partial<_hoci_core0.SharedConfig["activateEvent"]>>;
107
+ type: vue.PropType<Partial<_hoci_core0.SharedConfig["activateEvent"]>>;
94
108
  };
95
- }>> & Readonly<{}>, {}, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
109
+ }>> & Readonly<{}>, {
110
+ as: string | vue.Component | ((props: any) => any);
111
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
96
112
  //#endregion
97
113
  //#region ../core/src/file-upload/component.d.ts
98
- declare const HiFileUpload: vue9.DefineComponent<vue9.ExtractPropTypes<{
114
+ declare const HiFileUpload: vue.DefineComponent<vue.ExtractPropTypes<{
99
115
  accept: {
100
116
  type: StringConstructor;
101
117
  default: string;
102
118
  };
103
119
  as: {
104
- type: StringConstructor;
120
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
105
121
  default: string;
106
122
  };
107
123
  modelValue: {
108
- type: vue9.PropType<File | File[]>;
124
+ type: vue.PropType<File | File[]>;
109
125
  default: () => never[];
110
126
  };
111
127
  multiple: {
112
128
  type: BooleanConstructor;
113
129
  default: boolean;
114
130
  };
115
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
131
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
116
132
  [key: string]: any;
117
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
133
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
118
134
  accept: {
119
135
  type: StringConstructor;
120
136
  default: string;
121
137
  };
122
138
  as: {
123
- type: StringConstructor;
139
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
124
140
  default: string;
125
141
  };
126
142
  modelValue: {
127
- type: vue9.PropType<File | File[]>;
143
+ type: vue.PropType<File | File[]>;
128
144
  default: () => never[];
129
145
  };
130
146
  multiple: {
@@ -135,16 +151,16 @@ declare const HiFileUpload: vue9.DefineComponent<vue9.ExtractPropTypes<{
135
151
  onChange?: ((...args: any[]) => any) | undefined;
136
152
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
137
153
  }>, {
138
- as: string;
154
+ as: string | vue.Component | ((props: any) => any);
139
155
  multiple: boolean;
140
156
  modelValue: File | File[];
141
157
  accept: string;
142
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
158
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
143
159
  //#endregion
144
160
  //#region ../core/src/icon/component.d.ts
145
- declare const HiIcon: vue9.DefineComponent<vue9.ExtractPropTypes<{
161
+ declare const HiIcon: vue.DefineComponent<vue.ExtractPropTypes<{
146
162
  as: {
147
- type: StringConstructor;
163
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
148
164
  default: string;
149
165
  };
150
166
  src: {
@@ -165,14 +181,14 @@ declare const HiIcon: vue9.DefineComponent<vue9.ExtractPropTypes<{
165
181
  default: string;
166
182
  };
167
183
  mask: {
168
- type: vue9.PropType<boolean | "auto">;
184
+ type: vue.PropType<boolean | "auto">;
169
185
  default: () => "auto";
170
186
  };
171
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
187
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
172
188
  [key: string]: any;
173
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
189
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
174
190
  as: {
175
- type: StringConstructor;
191
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
176
192
  default: string;
177
193
  };
178
194
  src: {
@@ -193,59 +209,59 @@ declare const HiIcon: vue9.DefineComponent<vue9.ExtractPropTypes<{
193
209
  default: string;
194
210
  };
195
211
  mask: {
196
- type: vue9.PropType<boolean | "auto">;
212
+ type: vue.PropType<boolean | "auto">;
197
213
  default: () => "auto";
198
214
  };
199
215
  }>> & Readonly<{}>, {
200
- as: string;
216
+ as: string | vue.Component | ((props: any) => any);
201
217
  color: string;
202
218
  mask: boolean | "auto";
203
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
219
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
204
220
  //#endregion
205
221
  //#region ../core/src/item/component.d.ts
206
- declare const HiItem: vue9.DefineComponent<vue9.ExtractPropTypes<{
222
+ declare const HiItem: vue.DefineComponent<vue.ExtractPropTypes<{
207
223
  as: {
208
- type: StringConstructor;
224
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
209
225
  default: string;
210
226
  };
211
227
  value: {
212
- type: vue9.PropType<any>;
228
+ type: vue.PropType<any>;
213
229
  default(): string;
214
230
  };
215
231
  label: {
216
- type: vue9.PropType<string | ((val: any) => string) | _hoci_core0.ElementLike | null>;
232
+ type: vue.PropType<string | ((val: any) => string) | _hoci_core0.ElementLike | null>;
217
233
  };
218
234
  keepAlive: {
219
235
  type: BooleanConstructor;
220
236
  default: () => true;
221
237
  };
222
238
  activateEvent: {
223
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
239
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
224
240
  };
225
241
  disabled: {
226
242
  type: BooleanConstructor;
227
243
  default: boolean;
228
244
  };
229
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
245
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
230
246
  [key: string]: any;
231
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, "reject"[], "reject", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
247
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "reject"[], "reject", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
232
248
  as: {
233
- type: StringConstructor;
249
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
234
250
  default: string;
235
251
  };
236
252
  value: {
237
- type: vue9.PropType<any>;
253
+ type: vue.PropType<any>;
238
254
  default(): string;
239
255
  };
240
256
  label: {
241
- type: vue9.PropType<string | ((val: any) => string) | _hoci_core0.ElementLike | null>;
257
+ type: vue.PropType<string | ((val: any) => string) | _hoci_core0.ElementLike | null>;
242
258
  };
243
259
  keepAlive: {
244
260
  type: BooleanConstructor;
245
261
  default: () => true;
246
262
  };
247
263
  activateEvent: {
248
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
264
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
249
265
  };
250
266
  disabled: {
251
267
  type: BooleanConstructor;
@@ -254,27 +270,31 @@ declare const HiItem: vue9.DefineComponent<vue9.ExtractPropTypes<{
254
270
  }>> & Readonly<{
255
271
  onReject?: ((...args: any[]) => any) | undefined;
256
272
  }>, {
257
- as: string;
273
+ as: string | vue.Component | ((props: any) => any);
258
274
  disabled: boolean;
259
275
  value: any;
260
276
  keepAlive: boolean;
261
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
277
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
262
278
  //#endregion
263
279
  //#region ../core/src/popover/component.d.ts
264
- declare const HiPopover: vue9.DefineComponent<vue9.ExtractPropTypes<{
280
+ declare const HiPopover: vue.DefineComponent<vue.ExtractPropTypes<{
281
+ popupAs: {
282
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
283
+ default: string;
284
+ };
265
285
  as: {
266
- type: StringConstructor;
286
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
267
287
  default: string;
268
288
  };
269
289
  popupClass: {
270
290
  type: StringConstructor;
271
291
  };
272
292
  placement: {
273
- type: vue9.PropType<_hoci_core0.Placement>;
293
+ type: vue.PropType<_hoci_core0.Placement>;
274
294
  default: () => "auto";
275
295
  };
276
296
  triggerEvent: {
277
- type: vue9.PropType<_hoci_core0.TriggerEvent>;
297
+ type: vue.PropType<_hoci_core0.TriggerEvent>;
278
298
  default: () => "hover";
279
299
  };
280
300
  offset: {
@@ -294,25 +314,29 @@ declare const HiPopover: vue9.DefineComponent<vue9.ExtractPropTypes<{
294
314
  default: () => false;
295
315
  };
296
316
  teleport: {
297
- type: vue9.PropType<string | HTMLElement | boolean>;
317
+ type: vue.PropType<string | HTMLElement | boolean>;
298
318
  default: () => true;
299
319
  };
300
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
320
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
301
321
  [key: string]: any;
302
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, ("change" | "update:visible")[], "change" | "update:visible", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
322
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "update:visible")[], "change" | "update:visible", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
323
+ popupAs: {
324
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
325
+ default: string;
326
+ };
303
327
  as: {
304
- type: StringConstructor;
328
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
305
329
  default: string;
306
330
  };
307
331
  popupClass: {
308
332
  type: StringConstructor;
309
333
  };
310
334
  placement: {
311
- type: vue9.PropType<_hoci_core0.Placement>;
335
+ type: vue.PropType<_hoci_core0.Placement>;
312
336
  default: () => "auto";
313
337
  };
314
338
  triggerEvent: {
315
- type: vue9.PropType<_hoci_core0.TriggerEvent>;
339
+ type: vue.PropType<_hoci_core0.TriggerEvent>;
316
340
  default: () => "hover";
317
341
  };
318
342
  offset: {
@@ -332,14 +356,14 @@ declare const HiPopover: vue9.DefineComponent<vue9.ExtractPropTypes<{
332
356
  default: () => false;
333
357
  };
334
358
  teleport: {
335
- type: vue9.PropType<string | HTMLElement | boolean>;
359
+ type: vue.PropType<string | HTMLElement | boolean>;
336
360
  default: () => true;
337
361
  };
338
362
  }>> & Readonly<{
339
363
  onChange?: ((...args: any[]) => any) | undefined;
340
364
  "onUpdate:visible"?: ((...args: any[]) => any) | undefined;
341
365
  }>, {
342
- as: string;
366
+ as: string | vue.Component | ((props: any) => any);
343
367
  visible: boolean;
344
368
  disabled: boolean;
345
369
  offset: number;
@@ -347,94 +371,95 @@ declare const HiPopover: vue9.DefineComponent<vue9.ExtractPropTypes<{
347
371
  triggerEvent: _hoci_core0.TriggerEvent;
348
372
  lazy: boolean;
349
373
  teleport: string | boolean | HTMLElement;
350
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
374
+ popupAs: string | vue.Component | ((props: any) => any);
375
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
351
376
  //#endregion
352
377
  //#region ../core/src/selection/component.d.ts
353
- declare const HiSelection: vue9.DefineComponent<vue9.ExtractPropTypes<{
378
+ declare const HiSelection: vue.DefineComponent<vue.ExtractPropTypes<{
354
379
  as: {
355
- type: StringConstructor;
380
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
356
381
  default: string;
357
382
  };
358
383
  modelValue: {
359
- type: vue9.PropType<any>;
384
+ type: vue.PropType<any>;
360
385
  default: () => null;
361
386
  };
362
387
  activeClass: {
363
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
388
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
364
389
  default: string;
365
390
  };
366
391
  itemClass: {
367
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
392
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
368
393
  default: string;
369
394
  };
370
395
  disabledClass: {
371
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
396
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
372
397
  default: string;
373
398
  };
374
399
  unactiveClass: {
375
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
400
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
376
401
  default: string;
377
402
  };
378
403
  label: {
379
- type: vue9.PropType<string | ((val?: any) => string) | null>;
404
+ type: vue.PropType<string | ((val?: any) => string) | null>;
380
405
  };
381
406
  multiple: {
382
- type: vue9.PropType<boolean | number | [number, number?]>;
407
+ type: vue.PropType<boolean | number | [number, number?]>;
383
408
  default: () => false;
384
409
  };
385
410
  clearable: {
386
411
  type: BooleanConstructor;
387
412
  };
388
413
  defaultValue: {
389
- type: vue9.PropType<any>;
414
+ type: vue.PropType<any>;
390
415
  default: () => null;
391
416
  };
392
417
  activateEvent: {
393
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
418
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
394
419
  };
395
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
420
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
396
421
  [key: string]: any;
397
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, ("change" | "load" | "update:modelValue" | "reject" | "unload")[], "change" | "load" | "update:modelValue" | "reject" | "unload", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
422
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "load" | "update:modelValue" | "reject" | "unload")[], "change" | "load" | "update:modelValue" | "reject" | "unload", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
398
423
  as: {
399
- type: StringConstructor;
424
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
400
425
  default: string;
401
426
  };
402
427
  modelValue: {
403
- type: vue9.PropType<any>;
428
+ type: vue.PropType<any>;
404
429
  default: () => null;
405
430
  };
406
431
  activeClass: {
407
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
432
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
408
433
  default: string;
409
434
  };
410
435
  itemClass: {
411
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
436
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
412
437
  default: string;
413
438
  };
414
439
  disabledClass: {
415
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
440
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
416
441
  default: string;
417
442
  };
418
443
  unactiveClass: {
419
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
444
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
420
445
  default: string;
421
446
  };
422
447
  label: {
423
- type: vue9.PropType<string | ((val?: any) => string) | null>;
448
+ type: vue.PropType<string | ((val?: any) => string) | null>;
424
449
  };
425
450
  multiple: {
426
- type: vue9.PropType<boolean | number | [number, number?]>;
451
+ type: vue.PropType<boolean | number | [number, number?]>;
427
452
  default: () => false;
428
453
  };
429
454
  clearable: {
430
455
  type: BooleanConstructor;
431
456
  };
432
457
  defaultValue: {
433
- type: vue9.PropType<any>;
458
+ type: vue.PropType<any>;
434
459
  default: () => null;
435
460
  };
436
461
  activateEvent: {
437
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
462
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
438
463
  };
439
464
  }>> & Readonly<{
440
465
  onChange?: ((...args: any[]) => any) | undefined;
@@ -443,7 +468,7 @@ declare const HiSelection: vue9.DefineComponent<vue9.ExtractPropTypes<{
443
468
  onReject?: ((...args: any[]) => any) | undefined;
444
469
  onUnload?: ((...args: any[]) => any) | undefined;
445
470
  }>, {
446
- as: string;
471
+ as: string | vue.Component | ((props: any) => any);
447
472
  multiple: number | boolean | [number, (number | undefined)?];
448
473
  modelValue: any;
449
474
  activeClass: string | string[] | Record<string, boolean>;
@@ -452,12 +477,12 @@ declare const HiSelection: vue9.DefineComponent<vue9.ExtractPropTypes<{
452
477
  unactiveClass: string | string[] | Record<string, boolean>;
453
478
  clearable: boolean;
454
479
  defaultValue: any;
455
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
480
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
456
481
  //#endregion
457
482
  //#region ../core/src/switch/component.d.ts
458
- declare const HiSwitch: vue9.DefineComponent<vue9.ExtractPropTypes<{
483
+ declare const HiSwitch: vue.DefineComponent<vue.ExtractPropTypes<{
459
484
  as: {
460
- type: StringConstructor;
485
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
461
486
  default: string;
462
487
  };
463
488
  modelValue: {
@@ -465,29 +490,29 @@ declare const HiSwitch: vue9.DefineComponent<vue9.ExtractPropTypes<{
465
490
  default: () => false;
466
491
  };
467
492
  class: {
468
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
493
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
469
494
  };
470
495
  activeClass: {
471
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
496
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
472
497
  };
473
498
  unactiveClass: {
474
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
499
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
475
500
  };
476
501
  activateEvent: {
477
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
502
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
478
503
  };
479
504
  disabled: {
480
505
  type: BooleanConstructor;
481
506
  default: () => false;
482
507
  };
483
508
  disabledClass: {
484
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
509
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
485
510
  };
486
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
511
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
487
512
  [key: string]: any;
488
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, ("change" | "update:modelValue" | "reject")[], "change" | "update:modelValue" | "reject", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
513
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "update:modelValue" | "reject")[], "change" | "update:modelValue" | "reject", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
489
514
  as: {
490
- type: StringConstructor;
515
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
491
516
  default: string;
492
517
  };
493
518
  modelValue: {
@@ -495,70 +520,78 @@ declare const HiSwitch: vue9.DefineComponent<vue9.ExtractPropTypes<{
495
520
  default: () => false;
496
521
  };
497
522
  class: {
498
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
523
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
499
524
  };
500
525
  activeClass: {
501
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
526
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
502
527
  };
503
528
  unactiveClass: {
504
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
529
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
505
530
  };
506
531
  activateEvent: {
507
- type: vue9.PropType<_hoci_core0.ActivateEvent>;
532
+ type: vue.PropType<_hoci_core0.ActivateEvent>;
508
533
  };
509
534
  disabled: {
510
535
  type: BooleanConstructor;
511
536
  default: () => false;
512
537
  };
513
538
  disabledClass: {
514
- type: vue9.PropType<string | string[] | Record<string, boolean>>;
539
+ type: vue.PropType<string | string[] | Record<string, boolean>>;
515
540
  };
516
541
  }>> & Readonly<{
517
542
  onChange?: ((...args: any[]) => any) | undefined;
518
543
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
519
544
  onReject?: ((...args: any[]) => any) | undefined;
520
545
  }>, {
521
- as: string;
546
+ as: string | vue.Component | ((props: any) => any);
522
547
  disabled: boolean;
523
548
  modelValue: boolean;
524
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
549
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
525
550
  //#endregion
526
551
  //#region ../core/src/tab-pane/component.d.ts
527
- declare const HiTabPane: vue9.DefineComponent<vue9.ExtractPropTypes<{
552
+ declare const HiTabPane: vue.DefineComponent<vue.ExtractPropTypes<{
553
+ as: {
554
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
555
+ default: string;
556
+ };
528
557
  value: {
529
- type: vue9.PropType<any>;
558
+ type: vue.PropType<any>;
530
559
  default(): string;
531
560
  };
532
561
  label: {
533
- type: vue9.PropType<string | ((val: any) => string) | _hoci_shared0.ElementLike | null>;
562
+ type: vue.PropType<string | ((val: any) => string) | _hoci_shared0.ElementLike | null>;
534
563
  };
535
564
  keepAlive: {
536
565
  type: BooleanConstructor;
537
566
  default: () => true;
538
567
  };
539
568
  activateEvent: {
540
- type: vue9.PropType<_hoci_shared0.ActivateEvent>;
569
+ type: vue.PropType<_hoci_shared0.ActivateEvent>;
541
570
  };
542
571
  disabled: {
543
572
  type: BooleanConstructor;
544
573
  default: boolean;
545
574
  };
546
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
575
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
547
576
  [key: string]: any;
548
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, "reject"[], "reject", vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
577
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "reject"[], "reject", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
578
+ as: {
579
+ type: vue.PropType<string | vue.Component | ((props: any) => any)>;
580
+ default: string;
581
+ };
549
582
  value: {
550
- type: vue9.PropType<any>;
583
+ type: vue.PropType<any>;
551
584
  default(): string;
552
585
  };
553
586
  label: {
554
- type: vue9.PropType<string | ((val: any) => string) | _hoci_shared0.ElementLike | null>;
587
+ type: vue.PropType<string | ((val: any) => string) | _hoci_shared0.ElementLike | null>;
555
588
  };
556
589
  keepAlive: {
557
590
  type: BooleanConstructor;
558
591
  default: () => true;
559
592
  };
560
593
  activateEvent: {
561
- type: vue9.PropType<_hoci_shared0.ActivateEvent>;
594
+ type: vue.PropType<_hoci_shared0.ActivateEvent>;
562
595
  };
563
596
  disabled: {
564
597
  type: BooleanConstructor;
@@ -567,26 +600,20 @@ declare const HiTabPane: vue9.DefineComponent<vue9.ExtractPropTypes<{
567
600
  }>> & Readonly<{
568
601
  onReject?: ((...args: any[]) => any) | undefined;
569
602
  }>, {
603
+ as: string | vue.Component | ((props: any) => any);
570
604
  disabled: boolean;
571
605
  value: any;
572
606
  keepAlive: boolean;
573
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
607
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
574
608
  //#endregion
575
609
  //#region ../core/src/tabs/component.d.ts
576
- declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
577
- headerClass: {
578
- type: PropType<string | string[] | Record<string, boolean>>;
579
- };
580
- as: {
581
- type: StringConstructor;
582
- default: string;
583
- };
610
+ declare const HiTabs: vue.DefineComponent<vue.ExtractPropTypes<{
584
611
  headerAs: {
585
- type: StringConstructor;
612
+ type: PropType<string | vue.Component | ((props: any) => any)>;
586
613
  default: string;
587
614
  };
588
615
  contentAs: {
589
- type: StringConstructor;
616
+ type: PropType<string | vue.Component | ((props: any) => any)>;
590
617
  default: string;
591
618
  };
592
619
  contentClass: {
@@ -596,6 +623,13 @@ declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
596
623
  type: PropType<boolean | KeepAliveProps>;
597
624
  default: boolean;
598
625
  };
626
+ as: {
627
+ type: PropType<string | vue.Component | ((props: any) => any)>;
628
+ default: string;
629
+ };
630
+ headerClass: {
631
+ type: PropType<string | string[] | Record<string, boolean>>;
632
+ };
599
633
  modelValue: {
600
634
  type: PropType<any>;
601
635
  default: () => null;
@@ -633,22 +667,15 @@ declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
633
667
  activateEvent: {
634
668
  type: PropType<_hoci_shared0.ActivateEvent>;
635
669
  };
636
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
670
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
637
671
  [key: string]: any;
638
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {}, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
639
- headerClass: {
640
- type: PropType<string | string[] | Record<string, boolean>>;
641
- };
642
- as: {
643
- type: StringConstructor;
644
- default: string;
645
- };
672
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
646
673
  headerAs: {
647
- type: StringConstructor;
674
+ type: PropType<string | vue.Component | ((props: any) => any)>;
648
675
  default: string;
649
676
  };
650
677
  contentAs: {
651
- type: StringConstructor;
678
+ type: PropType<string | vue.Component | ((props: any) => any)>;
652
679
  default: string;
653
680
  };
654
681
  contentClass: {
@@ -658,6 +685,13 @@ declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
658
685
  type: PropType<boolean | KeepAliveProps>;
659
686
  default: boolean;
660
687
  };
688
+ as: {
689
+ type: PropType<string | vue.Component | ((props: any) => any)>;
690
+ default: string;
691
+ };
692
+ headerClass: {
693
+ type: PropType<string | string[] | Record<string, boolean>>;
694
+ };
661
695
  modelValue: {
662
696
  type: PropType<any>;
663
697
  default: () => null;
@@ -696,7 +730,7 @@ declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
696
730
  type: PropType<_hoci_shared0.ActivateEvent>;
697
731
  };
698
732
  }>> & Readonly<{}>, {
699
- as: string;
733
+ as: string | vue.Component | ((props: any) => any);
700
734
  multiple: number | boolean | [number, (number | undefined)?];
701
735
  modelValue: any;
702
736
  keepAlive: boolean | KeepAliveProps;
@@ -706,21 +740,17 @@ declare const HiTabs: vue9.DefineComponent<vue9.ExtractPropTypes<{
706
740
  unactiveClass: string | string[] | Record<string, boolean>;
707
741
  clearable: boolean;
708
742
  defaultValue: any;
709
- headerAs: string;
710
- contentAs: string;
711
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
743
+ headerAs: string | vue.Component | ((props: any) => any);
744
+ contentAs: string | vue.Component | ((props: any) => any);
745
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
712
746
  //#endregion
713
747
  //#region ../core/src/virtual-list/index.d.ts
714
748
  type VirtualizerOptions$1<TScrollElement extends Element, TItemElement extends Element = Element> = PartialKeys<VirtualizerOptions<TScrollElement, TItemElement>, "observeElementRect" | "observeElementOffset" | "scrollToFn" | "getScrollElement" | "initialOffset">;
715
749
  //#endregion
716
750
  //#region ../core/src/virtual-list/component.d.ts
717
- declare const HiVirtualList: vue9.DefineComponent<vue9.ExtractPropTypes<{
718
- as: {
719
- type: StringConstructor;
720
- default: () => string;
721
- };
751
+ declare const HiVirtualList: vue.DefineComponent<vue.ExtractPropTypes<{
722
752
  wrapperAs: {
723
- type: StringConstructor;
753
+ type: PropType<string | vue.Component | ((props: any) => any)>;
724
754
  default: () => string;
725
755
  };
726
756
  wrapperStyle: {
@@ -731,6 +761,10 @@ declare const HiVirtualList: vue9.DefineComponent<vue9.ExtractPropTypes<{
731
761
  type: PropType<string | string[] | Record<string, boolean>>;
732
762
  default: () => string;
733
763
  };
764
+ as: {
765
+ type: PropType<string | vue.Component | ((props: any) => any)>;
766
+ default: string;
767
+ };
734
768
  options: {
735
769
  type: PropType<_tanstack_virtual_core0.PartialKeys<VirtualizerOptions$1<HTMLElement, HTMLElement>, "observeElementRect" | "observeElementOffset" | "scrollToFn" | "getScrollElement">>;
736
770
  default: () => {};
@@ -747,19 +781,15 @@ declare const HiVirtualList: vue9.DefineComponent<vue9.ExtractPropTypes<{
747
781
  type: BooleanConstructor;
748
782
  default: () => false;
749
783
  };
750
- }>, () => vue9.VNode<vue9.RendererNode, vue9.RendererElement, {
784
+ }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
751
785
  [key: string]: any;
752
- }>, {}, {}, {}, vue9.ComponentOptionsMixin, vue9.ComponentOptionsMixin, {
786
+ }>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
753
787
  scrollEnd: () => boolean;
754
788
  scrollStart: () => boolean;
755
789
  scroll: (_: number[]) => boolean;
756
- }, string, vue9.PublicProps, Readonly<vue9.ExtractPropTypes<{
757
- as: {
758
- type: StringConstructor;
759
- default: () => string;
760
- };
790
+ }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
761
791
  wrapperAs: {
762
- type: StringConstructor;
792
+ type: PropType<string | vue.Component | ((props: any) => any)>;
763
793
  default: () => string;
764
794
  };
765
795
  wrapperStyle: {
@@ -770,6 +800,10 @@ declare const HiVirtualList: vue9.DefineComponent<vue9.ExtractPropTypes<{
770
800
  type: PropType<string | string[] | Record<string, boolean>>;
771
801
  default: () => string;
772
802
  };
803
+ as: {
804
+ type: PropType<string | vue.Component | ((props: any) => any)>;
805
+ default: string;
806
+ };
773
807
  options: {
774
808
  type: PropType<_tanstack_virtual_core0.PartialKeys<VirtualizerOptions$1<HTMLElement, HTMLElement>, "observeElementRect" | "observeElementOffset" | "scrollToFn" | "getScrollElement">>;
775
809
  default: () => {};
@@ -795,11 +829,11 @@ declare const HiVirtualList: vue9.DefineComponent<vue9.ExtractPropTypes<{
795
829
  count: number;
796
830
  estimateSize: number | ((index: number) => number);
797
831
  horizontal: boolean;
798
- as: string;
799
- wrapperAs: string;
832
+ wrapperAs: string | vue.Component | ((props: any) => any);
800
833
  wrapperStyle: CSSProperties;
801
834
  wrapperClass: string | string[] | Record<string, boolean>;
802
- }, {}, {}, {}, string, vue9.ComponentProvideOptions, true, {}, any>;
835
+ as: string | vue.Component | ((props: any) => any);
836
+ }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
803
837
  //#endregion
804
838
  //#region install.d.ts
805
839
  declare function install(app: App): void;
package/dist/index.js CHANGED
@@ -1,13 +1,13 @@
1
- import { classPropType, defineHookComponent, defineHookEmits, defineHookProps, elementRef, getFirstChilld, isWindow, labelPropType, throttleByRaf, toReactive, useElement, useSharedConfig, valuePropType } from "@hoci/shared";
2
- import { KeepAlive, Teleport, computed, defineComponent, h, inject, provide, reactive, ref, renderSlot, shallowRef, triggerRef, watch, watchPostEffect } from "vue";
3
- import { isDefined, syncRef, tryOnScopeDispose, useElementBounding, useElementVisibility, useEventListener } from "@vueuse/core";
4
- import { capitalize, cls, each, px } from "tslx";
5
- import { affixProps, configProviderProps, fileUploadEmits, fileUploadProps, iconProps, itemEmits, itemProps, popoverEmits, popoverProps, provideSharedConfig, selectionEmits, selectionProps, switchEmits, switchProps, useAffix, useFileUpload, useIcon, usePopover, useSelectionItem, useSelectionList, useSwitch } from "@hoci/core";
1
+ import { affixProps, configProviderProps, fileUploadEmits, fileUploadProps, iconProps, itemEmits, itemProps, popoverEmits, popoverProps, provideAffixTarget, provideSharedConfig, selectionEmits, selectionProps, switchEmits, switchProps, useAffix, useFileUpload, useIcon, usePopover, useSelectionItem, useSelectionList, useSwitch } from "@hoci/core";
2
+ import { asPropType, asProps, classPropType, defineHookComponent, defineHookEmits, defineHookProps, elementRef, getFirstChilld, labelPropType, useSharedConfig, valuePropType } from "@hoci/shared";
3
+ import { KeepAlive, Teleport, computed, defineComponent, h, inject, provide, reactive, renderSlot, shallowRef, triggerRef, watch } from "vue";
4
+ import { capitalize, cls, each } from "tslx";
5
+ import { isDefined, syncRef, toReactive, tryOnScopeDispose } from "@vueuse/core";
6
6
  import { Virtualizer, elementScroll, observeElementOffset, observeElementRect } from "@tanstack/virtual-core";
7
7
 
8
- //#region rolldown:runtime
8
+ //#region \0rolldown/runtime.js
9
9
  var __defProp = Object.defineProperty;
10
- var __exportAll = (all, symbols) => {
10
+ var __exportAll = (all, no_symbols) => {
11
11
  let target = {};
12
12
  for (var name in all) {
13
13
  __defProp(target, name, {
@@ -15,127 +15,21 @@ var __exportAll = (all, symbols) => {
15
15
  enumerable: true
16
16
  });
17
17
  }
18
- if (symbols) {
18
+ if (!no_symbols) {
19
19
  __defProp(target, Symbol.toStringTag, { value: "Module" });
20
20
  }
21
21
  return target;
22
22
  };
23
23
 
24
- //#endregion
25
- //#region ../core/src/affix/index.ts
26
- const affixProps$1 = defineHookProps({
27
- fixedClass: {
28
- type: String,
29
- default: ""
30
- },
31
- offset: {
32
- type: Number,
33
- default: 0
34
- },
35
- position: {
36
- type: String,
37
- default: "top"
38
- },
39
- target: { type: [
40
- String,
41
- Object,
42
- Function
43
- ] },
44
- zIndex: {
45
- type: Number,
46
- default: 998
47
- }
48
- });
49
- const affixEmits = defineHookEmits(["scroll", "change"]);
50
- const AFFIX_TARGET_KEY = Symbol("AFFIX_TARGET_KEY");
51
- function getTargetRect(target) {
52
- return isWindow(target) ? {
53
- top: 0,
54
- bottom: window.innerHeight
55
- } : target.getBoundingClientRect();
56
- }
57
- const useAffix$1 = defineHookComponent({
58
- props: affixProps$1,
59
- setup(props, { emit }) {
60
- const wrapperRef = elementRef();
61
- const wrapperRect = toReactive(useElementBounding(wrapperRef));
62
- const parentRef = inject(AFFIX_TARGET_KEY, void 0);
63
- const targetRef = useElement(props.target, parentRef);
64
- const isFixed = ref(false);
65
- const placeholderStyle = ref({});
66
- const fixedStyle = ref({});
67
- const className = computed(() => {
68
- return isFixed.value ? props.fixedClass : "";
69
- });
70
- const wrapperVisible = useElementVisibility(wrapperRef);
71
- const containerRef = computed(() => {
72
- if (!wrapperVisible.value) return null;
73
- return targetRef.value ?? window;
74
- });
75
- const updatePosition = throttleByRaf(async () => {
76
- if (!wrapperRef.value || !containerRef.value) return;
77
- if (wrapperRect.width * wrapperRect.height === 0) return;
78
- const newPlaceholderStyles = {
79
- width: px(wrapperRect.width),
80
- height: px(wrapperRect.height)
81
- };
82
- const targetRect = getTargetRect(containerRef.value);
83
- let newIsFixed = false;
84
- let newFixedStyles = {};
85
- const offset = props.offset;
86
- if (props.position === "top") {
87
- newIsFixed = wrapperRect.top - targetRect.top < offset && offset >= 0;
88
- newFixedStyles = newIsFixed ? {
89
- position: "fixed",
90
- zIndex: props.zIndex,
91
- top: px(targetRect.top + offset)
92
- } : {};
93
- } else {
94
- newIsFixed = targetRect.bottom - wrapperRect.bottom < offset;
95
- newFixedStyles = newIsFixed ? {
96
- position: "fixed",
97
- bottom: px(window.innerHeight - targetRect.bottom + offset)
98
- } : {};
99
- }
100
- if (newIsFixed !== isFixed.value) {
101
- isFixed.value = newIsFixed;
102
- emit("change", newIsFixed);
103
- }
104
- placeholderStyle.value = newPlaceholderStyles;
105
- fixedStyle.value = {
106
- ...newFixedStyles,
107
- ...newIsFixed ? newPlaceholderStyles : {}
108
- };
109
- });
110
- useEventListener(containerRef, "scroll", () => {
111
- emit("scroll");
112
- updatePosition();
113
- });
114
- useEventListener(containerRef, "resize", updatePosition);
115
- watchPostEffect(updatePosition);
116
- return {
117
- className,
118
- wrapperRef,
119
- containerRef,
120
- isFixed,
121
- placeholderStyle,
122
- fixedStyle,
123
- updatePosition
124
- };
125
- }
126
- });
127
- function provideAffixTarget(target) {
128
- provide(AFFIX_TARGET_KEY, target);
129
- }
130
-
131
24
  //#endregion
132
25
  //#region ../core/src/affix-target/component.ts
133
26
  const HiAffixTarget = defineComponent({
134
27
  name: "HiAffixTarget",
135
- setup(_, context) {
28
+ props: { ...asProps },
29
+ setup(props, context) {
136
30
  const targetRef = elementRef();
137
31
  provideAffixTarget(targetRef);
138
- return () => h("div", {
32
+ return () => h(props.as, {
139
33
  ref: targetRef,
140
34
  ...context.attrs
141
35
  }, renderSlot(context.slots, "default"));
@@ -148,10 +42,7 @@ const HiAffix = defineComponent({
148
42
  name: "HiAffix",
149
43
  props: {
150
44
  ...affixProps,
151
- as: {
152
- type: String,
153
- default: "div"
154
- }
45
+ ...asProps
155
46
  },
156
47
  setup(props, context) {
157
48
  const { className, wrapperRef, isFixed, placeholderStyle, fixedStyle } = useAffix(props, context);
@@ -167,14 +58,13 @@ const HiAffix = defineComponent({
167
58
  const HiConfigProvider = defineComponent({
168
59
  props: {
169
60
  ...configProviderProps,
170
- as: { type: String }
61
+ ...asProps
171
62
  },
172
63
  setup(props, context) {
173
64
  provideSharedConfig(props);
174
65
  return () => {
175
66
  const content = renderSlot(context.slots, "default", void 0);
176
- if (props.as) return h(props.as, content);
177
- return content;
67
+ return h(props.as, content);
178
68
  };
179
69
  }
180
70
  });
@@ -185,13 +75,10 @@ const HiFileUpload = defineComponent({
185
75
  name: "HiFileUpload",
186
76
  props: {
187
77
  ...fileUploadProps,
78
+ ...asProps,
188
79
  accept: {
189
80
  type: String,
190
81
  default: "*/*"
191
- },
192
- as: {
193
- type: String,
194
- default: "div"
195
82
  }
196
83
  },
197
84
  emits: fileUploadEmits,
@@ -215,10 +102,7 @@ const HiFileUpload = defineComponent({
215
102
  const HiIcon = defineComponent({
216
103
  props: {
217
104
  ...iconProps,
218
- as: {
219
- type: String,
220
- default: "div"
221
- }
105
+ ...asProps
222
106
  },
223
107
  setup(props, context) {
224
108
  const { style } = useIcon(props, context);
@@ -234,10 +118,7 @@ const HiItem = defineComponent({
234
118
  name: "HiItem",
235
119
  props: {
236
120
  ...itemProps,
237
- as: {
238
- type: String,
239
- default: "div"
240
- }
121
+ ...asProps
241
122
  },
242
123
  emits: itemEmits,
243
124
  setup(props, context) {
@@ -256,16 +137,21 @@ const HiPopover = defineComponent({
256
137
  name: "HiPopover",
257
138
  props: {
258
139
  ...popoverProps,
259
- as: {
260
- type: String,
140
+ ...asProps,
141
+ popupAs: {
142
+ type: asPropType,
261
143
  default: "div"
262
144
  }
263
145
  },
264
146
  emits: popoverEmits,
265
147
  setup(props, context) {
266
- const { triggerRef, popupClass, events, popupRef, popupStyle } = usePopover(props, context);
148
+ const { show, close, triggerRef, popupClass, events, popupRef, popupStyle } = usePopover(props, context);
149
+ context.expose({
150
+ show,
151
+ close
152
+ });
267
153
  return () => {
268
- let content = h("div", {
154
+ let content = h(props.popupAs, {
269
155
  class: popupClass.value,
270
156
  style: popupStyle.value,
271
157
  ref: popupRef
@@ -285,10 +171,7 @@ const HiSelection = defineComponent({
285
171
  name: "HiSelection",
286
172
  props: {
287
173
  ...selectionProps,
288
- as: {
289
- type: String,
290
- default: "div"
291
- }
174
+ ...asProps
292
175
  },
293
176
  emits: selectionEmits,
294
177
  setup(props, context) {
@@ -303,10 +186,7 @@ const HiSwitch = defineComponent({
303
186
  name: "HiSwitch",
304
187
  props: {
305
188
  ...switchProps,
306
- as: {
307
- type: String,
308
- default: "div"
309
- }
189
+ ...asProps
310
190
  },
311
191
  emits: switchEmits,
312
192
  setup(props, context) {
@@ -592,13 +472,16 @@ const useSelectionItem$1 = defineHookComponent({
592
472
  //#region ../core/src/tab-pane/component.ts
593
473
  const HiTabPane = defineComponent({
594
474
  name: "HiTabPane",
595
- props: { ...itemProps$1 },
475
+ props: {
476
+ ...itemProps$1,
477
+ ...asProps
478
+ },
596
479
  emits: itemEmits$1,
597
480
  inheritAttrs: true,
598
481
  setup(props, context) {
599
482
  const { className, activateEvent, activate, isDisabled, label } = useSelectionItem$1(props, context);
600
483
  return () => {
601
- return h("div", {
484
+ return h(props.as, {
602
485
  class: className.value,
603
486
  [`on${capitalize(activateEvent.value)}`]: activate,
604
487
  disabled: isDisabled.value
@@ -614,16 +497,13 @@ const HiTabs = defineComponent({
614
497
  props: {
615
498
  ...selectionProps$1,
616
499
  headerClass: { type: classPropType },
617
- as: {
618
- type: String,
619
- default: "div"
620
- },
500
+ ...asProps,
621
501
  headerAs: {
622
- type: String,
502
+ type: asPropType,
623
503
  default: "div"
624
504
  },
625
505
  contentAs: {
626
- type: String,
506
+ type: asPropType,
627
507
  default: "div"
628
508
  },
629
509
  contentClass: { type: classPropType },
@@ -752,12 +632,9 @@ const HiVirtualList = defineComponent({
752
632
  inheritAttrs: true,
753
633
  props: {
754
634
  ...virtualListProps,
755
- as: {
756
- type: String,
757
- default: () => "div"
758
- },
635
+ ...asProps,
759
636
  wrapperAs: {
760
- type: String,
637
+ type: asPropType,
761
638
  default: () => "div"
762
639
  },
763
640
  wrapperStyle: {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@hoci/components",
3
3
  "type": "module",
4
- "version": "0.9.0",
4
+ "version": "0.10.0",
5
5
  "description": "",
6
6
  "author": "Chizuki <chizukicn@outlook.com>",
7
7
  "license": "MIT",
@@ -20,15 +20,15 @@
20
20
  "dist/"
21
21
  ],
22
22
  "peerDependencies": {
23
- "@vueuse/core": ">=9.12.0",
23
+ "@vueuse/core": ">=10.5.0",
24
24
  "vue": ">=3.3.0"
25
25
  },
26
26
  "dependencies": {
27
27
  "@tanstack/virtual-core": "^3.13.18",
28
28
  "maybe-types": "^0.2.0",
29
29
  "tslx": "^0.3.0",
30
- "@hoci/shared": "0.9.0",
31
- "@hoci/core": "0.9.0"
30
+ "@hoci/core": "0.10.0",
31
+ "@hoci/shared": "0.10.0"
32
32
  },
33
33
  "scripts": {
34
34
  "build": "tsdown"