straw-ui-vue 0.1.64 → 0.2.1

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.
@@ -89,7 +89,7 @@ export declare const colorVariantCompoundVariants: readonly [{
89
89
  readonly color: "default";
90
90
  readonly variant: "ghost";
91
91
  };
92
- readonly className: "text-secondary-foreground";
92
+ readonly className: "text-neutral-foreground";
93
93
  }, {
94
94
  readonly variants: {
95
95
  readonly color: "success";
@@ -125,7 +125,7 @@ export declare const groupMap: {
125
125
  /**
126
126
  * 桌面端 hover 态复合变体(color × variant 两个独立轴的配合;disabled 显式门控,禁用态不产出 hover 类)
127
127
  * - solid:在原填充色上加深
128
- * - ghost:叠加对应语义的半透明底色,default 走中性 accent
128
+ * - ghost:叠加对应语义的淡底,default 走中性淡底
129
129
  * 类名需保持字面量,供 UnoCSS 静态扫描收集
130
130
  * */
131
131
  export declare const hoverCompoundVariants: readonly [{
@@ -134,70 +134,70 @@ export declare const hoverCompoundVariants: readonly [{
134
134
  readonly variant: "solid";
135
135
  readonly disabled: false;
136
136
  };
137
- readonly className: "hover:bg-primary/90";
137
+ readonly className: "hover:bg-primary-hover";
138
138
  }, {
139
139
  readonly variants: {
140
140
  readonly color: "default";
141
141
  readonly variant: "solid";
142
142
  readonly disabled: false;
143
143
  };
144
- readonly className: "hover:bg-secondary/80";
144
+ readonly className: "hover:bg-neutral-hover";
145
145
  }, {
146
146
  readonly variants: {
147
147
  readonly color: "success";
148
148
  readonly variant: "solid";
149
149
  readonly disabled: false;
150
150
  };
151
- readonly className: "hover:bg-success/90";
151
+ readonly className: "hover:bg-success-hover";
152
152
  }, {
153
153
  readonly variants: {
154
154
  readonly color: "warning";
155
155
  readonly variant: "solid";
156
156
  readonly disabled: false;
157
157
  };
158
- readonly className: "hover:bg-warning/90";
158
+ readonly className: "hover:bg-warning-hover";
159
159
  }, {
160
160
  readonly variants: {
161
161
  readonly color: "danger";
162
162
  readonly variant: "solid";
163
163
  readonly disabled: false;
164
164
  };
165
- readonly className: "hover:bg-danger/90";
165
+ readonly className: "hover:bg-danger-hover";
166
166
  }, {
167
167
  readonly variants: {
168
168
  readonly color: "primary";
169
169
  readonly variant: "ghost";
170
170
  readonly disabled: false;
171
171
  };
172
- readonly className: "hover:bg-primary/10";
172
+ readonly className: "hover:bg-primary-subtle-hover";
173
173
  }, {
174
174
  readonly variants: {
175
175
  readonly color: "default";
176
176
  readonly variant: "ghost";
177
177
  readonly disabled: false;
178
178
  };
179
- readonly className: "hover:bg-accent";
179
+ readonly className: "hover:bg-neutral-subtle";
180
180
  }, {
181
181
  readonly variants: {
182
182
  readonly color: "success";
183
183
  readonly variant: "ghost";
184
184
  readonly disabled: false;
185
185
  };
186
- readonly className: "hover:bg-success/10";
186
+ readonly className: "hover:bg-success-subtle-hover";
187
187
  }, {
188
188
  readonly variants: {
189
189
  readonly color: "warning";
190
190
  readonly variant: "ghost";
191
191
  readonly disabled: false;
192
192
  };
193
- readonly className: "hover:bg-warning/10";
193
+ readonly className: "hover:bg-warning-subtle-hover";
194
194
  }, {
195
195
  readonly variants: {
196
196
  readonly color: "danger";
197
197
  readonly variant: "ghost";
198
198
  readonly disabled: false;
199
199
  };
200
- readonly className: "hover:bg-danger/10";
200
+ readonly className: "hover:bg-danger-subtle-hover";
201
201
  }];
202
202
  /** 移动端按压态复合变体(active:门控与配色规则同 hoverCompoundVariants) */
203
203
  export declare const activeCompoundVariants: readonly [{
@@ -206,68 +206,68 @@ export declare const activeCompoundVariants: readonly [{
206
206
  readonly variant: "solid";
207
207
  readonly disabled: false;
208
208
  };
209
- readonly className: "active:bg-primary/90";
209
+ readonly className: "active:bg-primary-active";
210
210
  }, {
211
211
  readonly variants: {
212
212
  readonly color: "default";
213
213
  readonly variant: "solid";
214
214
  readonly disabled: false;
215
215
  };
216
- readonly className: "active:bg-secondary/80";
216
+ readonly className: "active:bg-neutral-active";
217
217
  }, {
218
218
  readonly variants: {
219
219
  readonly color: "success";
220
220
  readonly variant: "solid";
221
221
  readonly disabled: false;
222
222
  };
223
- readonly className: "active:bg-success/90";
223
+ readonly className: "active:bg-success-active";
224
224
  }, {
225
225
  readonly variants: {
226
226
  readonly color: "warning";
227
227
  readonly variant: "solid";
228
228
  readonly disabled: false;
229
229
  };
230
- readonly className: "active:bg-warning/90";
230
+ readonly className: "active:bg-warning-active";
231
231
  }, {
232
232
  readonly variants: {
233
233
  readonly color: "danger";
234
234
  readonly variant: "solid";
235
235
  readonly disabled: false;
236
236
  };
237
- readonly className: "active:bg-danger/90";
237
+ readonly className: "active:bg-danger-active";
238
238
  }, {
239
239
  readonly variants: {
240
240
  readonly color: "primary";
241
241
  readonly variant: "ghost";
242
242
  readonly disabled: false;
243
243
  };
244
- readonly className: "active:bg-primary/10";
244
+ readonly className: "active:bg-primary-subtle-active";
245
245
  }, {
246
246
  readonly variants: {
247
247
  readonly color: "default";
248
248
  readonly variant: "ghost";
249
249
  readonly disabled: false;
250
250
  };
251
- readonly className: "active:bg-accent";
251
+ readonly className: "active:bg-neutral-subtle-hover";
252
252
  }, {
253
253
  readonly variants: {
254
254
  readonly color: "success";
255
255
  readonly variant: "ghost";
256
256
  readonly disabled: false;
257
257
  };
258
- readonly className: "active:bg-success/10";
258
+ readonly className: "active:bg-success-subtle-active";
259
259
  }, {
260
260
  readonly variants: {
261
261
  readonly color: "warning";
262
262
  readonly variant: "ghost";
263
263
  readonly disabled: false;
264
264
  };
265
- readonly className: "active:bg-warning/10";
265
+ readonly className: "active:bg-warning-subtle-active";
266
266
  }, {
267
267
  readonly variants: {
268
268
  readonly color: "danger";
269
269
  readonly variant: "ghost";
270
270
  readonly disabled: false;
271
271
  };
272
- readonly className: "active:bg-danger/10";
272
+ readonly className: "active:bg-danger-subtle-active";
273
273
  }];
@@ -1,5 +1,5 @@
1
1
  /** 焦点可见环,向外 2px 品牌描边,与全线浮层控件一致 */
2
- export declare const pickerFocusRing = "outline-none focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary";
2
+ export declare const pickerFocusRing = "outline-none focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary-ring";
3
3
  /**
4
4
  * 面板内容容器
5
5
  * 边框 / 底色 / 圆角 / 投影由 StPopover 与 StDrawer 提供,此处只定宽与裁剪,避免二次描边
@@ -30,13 +30,13 @@ export declare const pickerTitleVariants: import('../../types').CVAReturnFunctio
30
30
  /** 底部工具条容器 */
31
31
  export declare const pickerFooterClasses = "flex items-center gap-default border-t border-border px-3 py-2 text-3.25";
32
32
  /** 底部文字按钮(清除 / 今天 / 此刻) */
33
- export declare const pickerLinkClasses = "shrink-0 cursor-pointer select-none rounded-md px-1.5 py-0.5 text-3.25 text-muted-foreground transition-colors duration-100 hover:bg-accent hover:text-foreground outline-none focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary";
33
+ export declare const pickerLinkClasses = "shrink-0 cursor-pointer select-none rounded-md px-1.5 py-0.5 text-3.25 text-muted-foreground transition-colors duration-100 hover:bg-neutral-subtle hover:text-foreground outline-none focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary-ring";
34
34
  /** 次级说明文本 */
35
35
  export declare const pickerHintClasses = "min-w-0 flex-1 truncate text-3 text-muted-foreground tabular-nums";
36
36
  /** 列头 / 星期表头文本 */
37
37
  export declare const pickerLabelClasses = "text-center text-3 text-muted-foreground tabular-nums select-none";
38
38
  /** 端点步骤提示胶囊 */
39
- export declare const pickerChipClasses = "inline-flex h-5.5 shrink-0 items-center rounded-full bg-primary/10 px-2 text-2.75 font-medium text-primary tabular-nums";
39
+ export declare const pickerChipClasses = "inline-flex h-5.5 shrink-0 items-center rounded-full bg-primary-subtle px-2 text-2.75 font-medium text-primary tabular-nums";
40
40
  /** 区间分隔竖线 */
41
41
  export declare const pickerDividerClasses = "w-px shrink-0 self-stretch bg-border";
42
42
  /** 日期时间双开关输入行 */
@@ -1,4 +1,5 @@
1
1
  import { StSize } from '../../types/size.d.ts';
2
+ import { StMessageType } from './types/index.d.ts';
2
3
  /**
3
4
  * 消息组件的样式与常量表
4
5
  *
@@ -23,7 +24,14 @@ export declare const STACK_ANCHOR_KEY = "st-message-stack-anchor";
23
24
  * 条间距由容器的 gap 负责;离场项在动画开始时就 absolute 脱流,位置交给 move 动画搬,
24
25
  * 因此不需要收合行高,也不会有裁剪层切掉投影的问题。
25
26
  */
26
- export declare const messageItemBase = "pointer-events-auto flex items-center gap-default rounded bg-background border border-solid border-border shadow-md px-xl py-default max-w-[calc(100vw-2rem)]";
27
+ export declare const messageItemBase = "pointer-events-auto flex items-center gap-default rounded border border-solid shadow-md px-xl py-default max-w-[calc(100vw-2rem)]";
28
+ /**
29
+ * 语义类型 → 底色与描边
30
+ *
31
+ * 底色取 surface 角色(明色 10% / 暗色 26%),描边取 20% 混色;
32
+ * info 与 loading 同用 primary 系,error 落在 danger 系。
33
+ */
34
+ export declare const messageTypeSurfaceMap: Record<StMessageType, string>;
27
35
  /**
28
36
  * 管理者用的过渡类(时长与缓动对齐参考实现 ln-message)
29
37
  *
@@ -1,8 +1,10 @@
1
1
  export declare const StSplitter: {
2
2
  new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./index.ts').StSplitterProps> & Readonly<{
3
3
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
4
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
4
5
  }>, import('./index.ts').StSplitterExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
5
6
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
7
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
6
8
  }, import('vue').PublicProps, {
7
9
  direction: import('./index.ts').StSplitterDirection;
8
10
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -15,6 +17,7 @@ export declare const StSplitter: {
15
17
  Defaults: {};
16
18
  }, Readonly<import('./index.ts').StSplitterProps> & Readonly<{
17
19
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
20
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
18
21
  }>, import('./index.ts').StSplitterExpose, {}, {}, {}, {
19
22
  direction: import('./index.ts').StSplitterDirection;
20
23
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -24,8 +27,10 @@ export declare const StSplitter: {
24
27
  __isSuspense?: never;
25
28
  } & import('vue').ComponentOptionsBase<Readonly<import('./index.ts').StSplitterProps> & Readonly<{
26
29
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
30
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
27
31
  }>, import('./index.ts').StSplitterExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
28
32
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
33
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
29
34
  }, string, {
30
35
  direction: import('./index.ts').StSplitterDirection;
31
36
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -35,16 +40,12 @@ export declare const StSplitter: {
35
40
  StSplitterPanel: {
36
41
  new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./index.ts').StSplitterPanelProps & {
37
42
  size?: number;
38
- visible?: boolean;
39
43
  }> & Readonly<{
40
- "onUpdate:visible"?: (value: boolean) => any;
41
44
  "onUpdate:size"?: (value: number) => any;
42
45
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
43
- "update:visible": (value: boolean) => any;
44
46
  "update:size": (value: number) => any;
45
47
  }, import('vue').PublicProps, {
46
48
  maxSize: number;
47
- flex: boolean;
48
49
  minSize: number;
49
50
  }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
50
51
  P: {};
@@ -55,13 +56,10 @@ export declare const StSplitter: {
55
56
  Defaults: {};
56
57
  }, Readonly<import('./index.ts').StSplitterPanelProps & {
57
58
  size?: number;
58
- visible?: boolean;
59
59
  }> & Readonly<{
60
- "onUpdate:visible"?: (value: boolean) => any;
61
60
  "onUpdate:size"?: (value: number) => any;
62
61
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, {
63
62
  maxSize: number;
64
- flex: boolean;
65
63
  minSize: number;
66
64
  }>;
67
65
  __isFragment?: never;
@@ -69,16 +67,12 @@ export declare const StSplitter: {
69
67
  __isSuspense?: never;
70
68
  } & import('vue').ComponentOptionsBase<Readonly<import('./index.ts').StSplitterPanelProps & {
71
69
  size?: number;
72
- visible?: boolean;
73
70
  }> & Readonly<{
74
- "onUpdate:visible"?: (value: boolean) => any;
75
71
  "onUpdate:size"?: (value: number) => any;
76
72
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
77
- "update:visible": (value: boolean) => any;
78
73
  "update:size": (value: number) => any;
79
74
  }, string, {
80
75
  maxSize: number;
81
- flex: boolean;
82
76
  minSize: number;
83
77
  }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
84
78
  $slots: import('./index.ts').StSplitterPanelSlots;
@@ -86,8 +80,10 @@ export declare const StSplitter: {
86
80
  StSplitterGroup: {
87
81
  new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
88
82
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
83
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
89
84
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
90
85
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
86
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
91
87
  }, import('vue').PublicProps, {
92
88
  direction: import('./index.ts').StSplitterDirection;
93
89
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -100,6 +96,7 @@ export declare const StSplitter: {
100
96
  Defaults: {};
101
97
  }, Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
102
98
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
99
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
103
100
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, {
104
101
  direction: import('./index.ts').StSplitterDirection;
105
102
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -109,8 +106,10 @@ export declare const StSplitter: {
109
106
  __isSuspense?: never;
110
107
  } & import('vue').ComponentOptionsBase<Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
111
108
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
109
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
112
110
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
113
111
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
112
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
114
113
  }, string, {
115
114
  direction: import('./index.ts').StSplitterDirection;
116
115
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -125,16 +124,12 @@ export declare const StSplitter: {
125
124
  export declare const StSplitterPanel: {
126
125
  new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./index.ts').StSplitterPanelProps & {
127
126
  size?: number;
128
- visible?: boolean;
129
127
  }> & Readonly<{
130
- "onUpdate:visible"?: (value: boolean) => any;
131
128
  "onUpdate:size"?: (value: number) => any;
132
129
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
133
- "update:visible": (value: boolean) => any;
134
130
  "update:size": (value: number) => any;
135
131
  }, import('vue').PublicProps, {
136
132
  maxSize: number;
137
- flex: boolean;
138
133
  minSize: number;
139
134
  }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
140
135
  P: {};
@@ -145,13 +140,10 @@ export declare const StSplitterPanel: {
145
140
  Defaults: {};
146
141
  }, Readonly<import('./index.ts').StSplitterPanelProps & {
147
142
  size?: number;
148
- visible?: boolean;
149
143
  }> & Readonly<{
150
- "onUpdate:visible"?: (value: boolean) => any;
151
144
  "onUpdate:size"?: (value: number) => any;
152
145
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, {
153
146
  maxSize: number;
154
- flex: boolean;
155
147
  minSize: number;
156
148
  }>;
157
149
  __isFragment?: never;
@@ -159,16 +151,12 @@ export declare const StSplitterPanel: {
159
151
  __isSuspense?: never;
160
152
  } & import('vue').ComponentOptionsBase<Readonly<import('./index.ts').StSplitterPanelProps & {
161
153
  size?: number;
162
- visible?: boolean;
163
154
  }> & Readonly<{
164
- "onUpdate:visible"?: (value: boolean) => any;
165
155
  "onUpdate:size"?: (value: number) => any;
166
156
  }>, import('./index.ts').StSplitterPanelExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
167
- "update:visible": (value: boolean) => any;
168
157
  "update:size": (value: number) => any;
169
158
  }, string, {
170
159
  maxSize: number;
171
- flex: boolean;
172
160
  minSize: number;
173
161
  }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
174
162
  $slots: import('./index.ts').StSplitterPanelSlots;
@@ -176,8 +164,10 @@ export declare const StSplitterPanel: {
176
164
  export declare const StSplitterGroup: {
177
165
  new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
178
166
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
167
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
179
168
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
180
169
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
170
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
181
171
  }, import('vue').PublicProps, {
182
172
  direction: import('./index.ts').StSplitterDirection;
183
173
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -190,6 +180,7 @@ export declare const StSplitterGroup: {
190
180
  Defaults: {};
191
181
  }, Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
192
182
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
183
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
193
184
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, {
194
185
  direction: import('./index.ts').StSplitterDirection;
195
186
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -199,8 +190,10 @@ export declare const StSplitterGroup: {
199
190
  __isSuspense?: never;
200
191
  } & import('vue').ComponentOptionsBase<Readonly<import('./index.ts').StSplitterGroupProps> & Readonly<{
201
192
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
193
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
202
194
  }>, import('./index.ts').StSplitterGroupExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
203
195
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
196
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
204
197
  }, string, {
205
198
  direction: import('./index.ts').StSplitterDirection;
206
199
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -2,8 +2,10 @@ import { StSplitterGroupExpose, StSplitterGroupProps, StSplitterGroupSlots } fro
2
2
  type __VLS_Slots = StSplitterGroupSlots;
3
3
  declare const __VLS_base: import('vue').DefineComponent<StSplitterGroupProps, StSplitterGroupExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
4
4
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
5
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
5
6
  }, string, import('vue').PublicProps, Readonly<StSplitterGroupProps> & Readonly<{
6
7
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
8
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
7
9
  }>, {
8
10
  direction: import('./index.ts').StSplitterDirection;
9
11
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -4,23 +4,17 @@ type __VLS_Slots = StSplitterPanelSlots;
4
4
  type __VLS_ModelProps = {
5
5
  /**
6
6
  * 面板尺寸双向绑定
7
+ * 省略时不写入,面板参与平分剩余空间
7
8
  * */
8
9
  'size'?: number;
9
- /**
10
- * 面板可见性双向绑定,折叠按钮与外部受控共用同一份状态
11
- * */
12
- 'visible'?: boolean;
13
10
  };
14
11
  type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
15
12
  declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, StSplitterPanelExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
16
- "update:visible": (value: boolean) => any;
17
13
  "update:size": (value: number) => any;
18
14
  }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
19
- "onUpdate:visible"?: (value: boolean) => any;
20
15
  "onUpdate:size"?: (value: number) => any;
21
16
  }>, {
22
17
  maxSize: number;
23
- flex: boolean;
24
18
  minSize: number;
25
19
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
26
20
  declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
@@ -2,8 +2,10 @@ import { StSplitterExpose, StSplitterProps, StSplitterSlots } from './types/st-s
2
2
  type __VLS_Slots = StSplitterSlots;
3
3
  declare const __VLS_base: import('vue').DefineComponent<StSplitterProps, StSplitterExpose, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
4
4
  resize: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
5
+ collapse: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
5
6
  }, string, import('vue').PublicProps, Readonly<StSplitterProps> & Readonly<{
6
7
  onResize?: (panels: import('./index.ts').StSplitterPanelConfig[]) => any;
8
+ onCollapse?: (index: number, side: import('./index.ts').StSplitterBarSide, sizes: number[]) => any;
7
9
  }>, {
8
10
  direction: import('./index.ts').StSplitterDirection;
9
11
  showCollapseButton: import('./index.ts').StSplitterCollapseTrigger;
@@ -1,5 +1,25 @@
1
- import type { ClassValue, Ref, StyleValue } from 'vue';
2
- import type { StSplitterCollapseSide, StSplitterCollapseTrigger, StSplitterDirection, StSplitterPanelConfig, } from './st-splitter.d.ts';
1
+ import type { ClassValue, ComputedRef, Ref, StyleValue } from 'vue';
2
+ import type {
3
+ StSplitterBarSide,
4
+ StSplitterBarState,
5
+ StSplitterCollapseTrigger,
6
+ StSplitterDirection,
7
+ StSplitterPanelConfig,
8
+ } from './st-splitter.d.ts';
9
+
10
+ /**
11
+ * 面板注册参数
12
+ * */
13
+ export interface StSplitterPanelRegisterOptions {
14
+ /** 面板唯一标识 */
15
+ id: string;
16
+ /** 显式给定的尺寸;省略时参与平分剩余空间 */
17
+ size?: number;
18
+ /** 最小尺寸 */
19
+ minSize: number;
20
+ /** 最大尺寸 */
21
+ maxSize: number;
22
+ }
3
23
 
4
24
  /**
5
25
  * 分屏内部上下文接口 - 包含响应式状态
@@ -10,9 +30,13 @@ export interface StSplitterInternalContext {
10
30
  * */
11
31
  direction: Ref<StSplitterDirection>;
12
32
  /**
13
- * 面板列表
33
+ * 面板配置列表(派生视图,含 collapsed)
34
+ * */
35
+ panels: ComputedRef<StSplitterPanelConfig[]>;
36
+ /**
37
+ * 分隔条渲染状态列表
14
38
  * */
15
- panels: Ref<StSplitterPanelConfig[]>;
39
+ bars: ComputedRef<StSplitterBarState[]>;
16
40
  /**
17
41
  * 当前激活的分隔条索引
18
42
  * */
@@ -34,26 +58,35 @@ export interface StSplitterInternalContext {
34
58
  * */
35
59
  showCollapseButton: Ref<StSplitterCollapseTrigger>;
36
60
  /**
37
- * 设置面板可见性(展开/收起动画的唯一入口)
38
- * @param id - 面板ID
39
- * @param visible - 是否可见
40
- * @param side - 收起侧位,决定收起条箭头朝向
61
+ * 是否正在拖拽,用于拖拽期间关闭尺寸过渡
62
+ * */
63
+ dragging: Ref<boolean>;
64
+ /**
65
+ * 是否已完成首次尺寸分配,用于抑制初始渲染的过渡动画
66
+ * */
67
+ ready: Ref<boolean>;
68
+ /**
69
+ * 用户点击折叠入口:切换目标面板并向外抛出事件
70
+ * @param barIndex - 分隔条索引
71
+ * @param side - 点击的一侧
41
72
  * */
42
- setPanelVisible: (id: string, visible: boolean, side?: StSplitterCollapseSide) => void;
73
+ onCollapse: (barIndex: number, side: StSplitterBarSide) => void;
43
74
  /**
44
- * 获取收起条占用的总尺寸,未开启折叠按钮时为 0
75
+ * 设置面板收起状态,side 缺省时按最近的可用邻居收起
76
+ * @param panelId - 面板ID
77
+ * @param collapsed - 是否收起
45
78
  * */
46
- getCollapseBarTotalSize: () => number;
79
+ setPanelCollapsed: (panelId: string, collapsed: boolean) => void;
47
80
  /**
48
- * 判断面板是否应渲染收起条
81
+ * 按 ID 获取面板配置
49
82
  * @param id - 面板ID
50
83
  * */
51
- isPanelBarVisible: (id: string) => boolean;
84
+ getPanel: (id: string) => StSplitterPanelConfig | undefined;
52
85
  /**
53
- * 获取分隔条两侧折叠按钮的作用目标面板ID
54
- * @param visibleIndex - 分隔条归属面板在可见列表中的索引
86
+ * 分隔条当前是否可拖拽(任一侧收起时不可拖拽)
87
+ * @param barIndex - 分隔条索引
55
88
  * */
56
- getCollapseTargets: (visibleIndex: number) => { startId?: string; endId?: string };
89
+ isDraggable: (barIndex: number) => boolean;
57
90
  /**
58
91
  * splitter 容器 class
59
92
  * */
@@ -77,7 +110,7 @@ export interface StSplitterInternalContext {
77
110
  /**
78
111
  * 注册面板
79
112
  * */
80
- registerPanel: (panel: StSplitterPanelConfig) => void;
113
+ registerPanel: (options: StSplitterPanelRegisterOptions) => void;
81
114
  /**
82
115
  * 注销面板
83
116
  * */
@@ -85,15 +118,24 @@ export interface StSplitterInternalContext {
85
118
  /**
86
119
  * 开始拖拽调整尺寸
87
120
  * */
88
- startResize: (gutterIndex: number, event: MouseEvent) => void;
121
+ startResize: (barIndex: number, event: MouseEvent) => void;
122
+ /**
123
+ * 设置面板尺寸(会将该面板标记为显式尺寸)
124
+ * */
125
+ setPanelSize: (id: string, size: number) => void;
126
+ /**
127
+ * 按容器可用尺寸重新分配面板尺寸
128
+ * */
129
+ resetSizes: () => void;
89
130
  /**
90
- * 更新弹性面板尺寸
131
+ * 容器尺寸变化时重算(收起面板保持收起)
91
132
  * */
92
- updateFlexPanelSize: () => void;
133
+ handleContainerResize: () => void;
93
134
  /**
94
- * 初始化面板尺寸
135
+ * 初始化尺寸(首次分配,并开启过渡动画)
136
+ * @param el - 容器DOM元素
95
137
  * */
96
- initializePanelSizes: (containerEl: HTMLElement | null) => void;
138
+ initializeSizes: (el: HTMLElement | null) => void;
97
139
  /**
98
140
  * 获取容器尺寸
99
141
  * */
@@ -124,14 +166,6 @@ export interface StDragState {
124
166
  * 起始时各面板尺寸
125
167
  * */
126
168
  startSizes: number[];
127
- /**
128
- * 当前鼠标X坐标
129
- * */
130
- currentX?: number;
131
- /**
132
- * 当前鼠标Y坐标
133
- * */
134
- currentY?: number;
135
169
  }
136
170
 
137
171
  /**
@@ -180,4 +214,4 @@ export interface StConstrainedSizesResult {
180
214
  * 约束后的右面板尺寸
181
215
  * */
182
216
  rightSize: number;
183
- }
217
+ }
@@ -1,23 +1,23 @@
1
- /**
2
- * 折叠按钮所在位置
3
- * start 分隔条起始侧(收起归属面板)、end 分隔条结束侧(收起后一个面板)、bar 收起条(展开该面板)
4
- * */
5
- export type StSplitterGroupCollapsePosition = 'start' | 'end' | 'bar';
1
+ import type { StSplitterBarSide } from './st-splitter.d.ts';
6
2
 
7
3
  /**
8
4
  * 折叠按钮原子属性接口
9
5
  * */
10
6
  export interface StSplitterGroupCollapseProps {
11
7
  /**
12
- * 作用目标面板ID
8
+ * 分隔条索引
9
+ * */
10
+ barIndex: number;
11
+ /**
12
+ * 按钮位于分隔条哪一侧:start 作用于左侧(vertical 为上侧)面板,end 作用于右侧(下侧)面板
13
13
  * */
14
- panelId: string;
14
+ side: StSplitterBarSide;
15
15
  /**
16
- * 按钮所在位置
16
+ * 点击后执行的动作
17
17
  * */
18
- side: StSplitterGroupCollapsePosition;
18
+ action: 'collapse' | 'restore';
19
19
  /**
20
20
  * 宿主是否处于悬浮态,仅 show-collapse-button 为 hover 时生效
21
21
  * */
22
22
  hovered?: boolean;
23
- }
23
+ }
@@ -3,7 +3,7 @@
3
3
  * */
4
4
  export interface StSplitterGroupHandleProps {
5
5
  /**
6
- * 分隔条在可见面板中的索引
6
+ * 分隔条索引,夹在 panels[index] 与 panels[index + 1] 之间
7
7
  * */
8
8
  index: number;
9
- }
9
+ }