@ansh-ui/vue 0.3.0 → 0.3.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.
- package/dist/{chunk-HIVA75XC.js → chunk-D3HH726R.js} +151 -143
- package/dist/chunk-D3HH726R.js.map +1 -0
- package/dist/{chunk-FK536ZUI.cjs → chunk-EDAF7RAN.cjs} +150 -142
- package/dist/chunk-EDAF7RAN.cjs.map +1 -0
- package/dist/{chunk-LRTNIUAG.js → chunk-G3EIU6VM.js} +13 -7
- package/dist/chunk-G3EIU6VM.js.map +1 -0
- package/dist/{chunk-J2LA4GRP.cjs → chunk-IO6WJEJI.cjs} +122 -120
- package/dist/chunk-IO6WJEJI.cjs.map +1 -0
- package/dist/{chunk-IK3E4MPB.cjs → chunk-JJBYF7AH.cjs} +13 -7
- package/dist/chunk-JJBYF7AH.cjs.map +1 -0
- package/dist/{chunk-Z7XOFKM4.cjs → chunk-KKCZ5RUE.cjs} +4 -2
- package/dist/chunk-KKCZ5RUE.cjs.map +1 -0
- package/dist/{chunk-6ABPGOJP.js → chunk-LFGAOD32.js} +4 -2
- package/dist/chunk-LFGAOD32.js.map +1 -0
- package/dist/{chunk-FVKLCGA4.js → chunk-NJMTWLT2.js} +123 -121
- package/dist/chunk-NJMTWLT2.js.map +1 -0
- package/dist/data.cjs +16 -16
- package/dist/data.d.cts +45 -44
- package/dist/data.d.ts +45 -44
- package/dist/data.js +1 -1
- package/dist/form.cjs +36 -36
- package/dist/form.d.cts +28 -21
- package/dist/form.d.ts +28 -21
- package/dist/form.js +1 -1
- package/dist/index.cjs +134 -134
- package/dist/index.js +8 -8
- package/dist/layout.d.cts +1 -1
- package/dist/layout.d.ts +1 -1
- package/dist/motion.cjs +11 -11
- package/dist/motion.d.cts +27 -24
- package/dist/motion.d.ts +27 -24
- package/dist/motion.js +1 -1
- package/dist/navigation.d.cts +1 -1
- package/dist/navigation.d.ts +1 -1
- package/dist/overlay.cjs +13 -13
- package/dist/overlay.d.cts +27 -25
- package/dist/overlay.d.ts +27 -25
- package/dist/overlay.js +1 -1
- package/package.json +3 -3
- package/dist/chunk-6ABPGOJP.js.map +0 -1
- package/dist/chunk-FK536ZUI.cjs.map +0 -1
- package/dist/chunk-FVKLCGA4.js.map +0 -1
- package/dist/chunk-HIVA75XC.js.map +0 -1
- package/dist/chunk-IK3E4MPB.cjs.map +0 -1
- package/dist/chunk-J2LA4GRP.cjs.map +0 -1
- package/dist/chunk-LRTNIUAG.js.map +0 -1
- package/dist/chunk-Z7XOFKM4.cjs.map +0 -1
package/dist/data.d.cts
CHANGED
|
@@ -2,28 +2,6 @@ import * as vue from 'vue';
|
|
|
2
2
|
import { VNodeChild, PropType, VNode } from 'vue';
|
|
3
3
|
import { SlotContent } from './index.cjs';
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* Tables — the Vue counterpart of `@ansh-ui/react`'s `Table`/`DataTable`.
|
|
7
|
-
*
|
|
8
|
-
* A real `<table>` with `<th scope>`, not a grid of divs. The semantics are the entire point: a
|
|
9
|
-
* screen reader announces "Column 3 of 7, Status, row 12" only if the markup says so. Every
|
|
10
|
-
* div-based table reimplements navigation badly or not at all, and the CSS argument for divs
|
|
11
|
-
* disappeared when `display: contents` and `position: sticky` landed.
|
|
12
|
-
*
|
|
13
|
-
* `DataTable` adds sorting, selection and pagination on top. It stays deliberately short of a full
|
|
14
|
-
* data grid — no virtualisation, no column resizing, no pinned regions. Those need a different
|
|
15
|
-
* architecture (windowing, measured columns), and half-implementing them produces a component that
|
|
16
|
-
* breaks at exactly the scale it was added for.
|
|
17
|
-
*
|
|
18
|
-
* `DataTable` is generic over the row type `T`, which Vue only supports for a plain (non-SFC)
|
|
19
|
-
* component through `defineComponent`'s "generic setup function" overload — the setup function
|
|
20
|
-
* itself stays generic (`<T,>(props: DataTableProps<T>, ctx) => …`) while the runtime `props` list
|
|
21
|
-
* is a plain array of keys. That trade means no per-prop runtime validation or default-value
|
|
22
|
-
* coercion (booleans aren't coerced from attribute presence, defaults are applied by hand inside
|
|
23
|
-
* `setup`, mirroring the destructured defaults the React version uses) — acceptable here because the
|
|
24
|
-
* real contract for a data-shaped component like this is the TypeScript signature, not template
|
|
25
|
-
* shorthand.
|
|
26
|
-
*/
|
|
27
5
|
type SortDirection = 'asc' | 'desc';
|
|
28
6
|
interface SortState {
|
|
29
7
|
columnId: string;
|
|
@@ -80,6 +58,29 @@ interface DataTableProps<T> {
|
|
|
80
58
|
/** Per-row extra class, for status highlighting. */
|
|
81
59
|
rowClassName?: (row: T) => string | undefined;
|
|
82
60
|
}
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* Tables — the Vue counterpart of `@ansh-ui/react`'s `Table`/`DataTable`.
|
|
64
|
+
*
|
|
65
|
+
* A real `<table>` with `<th scope>`, not a grid of divs. The semantics are the entire point: a
|
|
66
|
+
* screen reader announces "Column 3 of 7, Status, row 12" only if the markup says so. Every
|
|
67
|
+
* div-based table reimplements navigation badly or not at all, and the CSS argument for divs
|
|
68
|
+
* disappeared when `display: contents` and `position: sticky` landed.
|
|
69
|
+
*
|
|
70
|
+
* `DataTable` adds sorting, selection and pagination on top. It stays deliberately short of a full
|
|
71
|
+
* data grid — no virtualisation, no column resizing, no pinned regions. Those need a different
|
|
72
|
+
* architecture (windowing, measured columns), and half-implementing them produces a component that
|
|
73
|
+
* breaks at exactly the scale it was added for.
|
|
74
|
+
*
|
|
75
|
+
* `DataTable` is generic over the row type `T`, which Vue only supports for a plain (non-SFC)
|
|
76
|
+
* component through `defineComponent`'s "generic setup function" overload — the setup function
|
|
77
|
+
* itself stays generic (`<T,>(props: DataTableProps<T>, ctx) => …`) while the runtime `props` list
|
|
78
|
+
* is a plain array of keys. That trade means no per-prop runtime validation or default-value
|
|
79
|
+
* coercion (booleans aren't coerced from attribute presence, defaults are applied by hand inside
|
|
80
|
+
* `setup`, mirroring the destructured defaults the React version uses) — acceptable here because the
|
|
81
|
+
* real contract for a data-shaped component like this is the TypeScript signature, not template
|
|
82
|
+
* shorthand.
|
|
83
|
+
*/
|
|
83
84
|
declare const DataTable: new <T>(props: DataTableProps<T> & {
|
|
84
85
|
"onUpdate:sort"?: ((...args: any[]) => any) | undefined;
|
|
85
86
|
"onUpdate:selected"?: ((...args: any[]) => any) | undefined;
|
|
@@ -100,6 +101,7 @@ declare const DataTable: new <T>(props: DataTableProps<T> & {
|
|
|
100
101
|
"onUpdate:selected"?: ((...args: any[]) => any) | undefined;
|
|
101
102
|
"onUpdate:page"?: ((...args: any[]) => any) | undefined;
|
|
102
103
|
}, {}, {}, {}, {}, {}>;
|
|
104
|
+
|
|
103
105
|
interface PaginationProps {
|
|
104
106
|
/** Zero-based. */
|
|
105
107
|
page: number;
|
|
@@ -177,11 +179,11 @@ declare const Pagination: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
177
179
|
default: number;
|
|
178
180
|
};
|
|
179
181
|
}>> & Readonly<{}>, {
|
|
180
|
-
total: number;
|
|
181
182
|
pageSize: number;
|
|
183
|
+
total: number;
|
|
182
184
|
siblings: number;
|
|
183
185
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
184
|
-
|
|
186
|
+
|
|
185
187
|
declare const Table: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
186
188
|
caption: {
|
|
187
189
|
type: StringConstructor;
|
|
@@ -216,14 +218,6 @@ declare const Table: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
216
218
|
striped: boolean;
|
|
217
219
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
218
220
|
|
|
219
|
-
/**
|
|
220
|
-
* Small display components — the Vue counterpart of `@ansh-ui/react`'s data-display primitives.
|
|
221
|
-
*
|
|
222
|
-
* Individually trivial, collectively most of what an application screen is made of. The care here
|
|
223
|
-
* goes into the details that get skipped: a badge whose meaning isn't carried by colour alone, an
|
|
224
|
-
* avatar whose fallback initials are readable against a generated background, an empty state that
|
|
225
|
-
* says what to do next rather than just "no data".
|
|
226
|
-
*/
|
|
227
221
|
type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
|
|
228
222
|
/**
|
|
229
223
|
* A status label.
|
|
@@ -258,7 +252,7 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
258
252
|
type: PropType<SlotContent>;
|
|
259
253
|
default: undefined;
|
|
260
254
|
};
|
|
261
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
255
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
262
256
|
[key: string]: any;
|
|
263
257
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
264
258
|
tone: {
|
|
@@ -286,9 +280,10 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
286
280
|
size: "sm" | "md";
|
|
287
281
|
icon: SlotContent;
|
|
288
282
|
tone: BadgeTone;
|
|
289
|
-
variant: "soft" | "
|
|
283
|
+
variant: "soft" | "outline" | "solid";
|
|
290
284
|
dot: boolean;
|
|
291
285
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
286
|
+
|
|
292
287
|
interface AvatarProps {
|
|
293
288
|
src?: string;
|
|
294
289
|
/** The person's name. Used for the alt text and to derive the fallback initials. */
|
|
@@ -383,6 +378,7 @@ declare const AvatarGroup: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
383
378
|
size: "sm" | "md" | "lg" | "xl" | "xs" | undefined;
|
|
384
379
|
max: number;
|
|
385
380
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
381
|
+
|
|
386
382
|
/**
|
|
387
383
|
* A keyboard key.
|
|
388
384
|
*
|
|
@@ -394,9 +390,10 @@ declare const AvatarGroup: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
394
390
|
* call site, `<Kbd>⌘+K</Kbd>`) rather than switching to a string prop, and the text is recovered from
|
|
395
391
|
* the rendered slot nodes — which is exactly what that slot is expected to contain.
|
|
396
392
|
*/
|
|
397
|
-
declare const Kbd: vue.DefineComponent<{}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
393
|
+
declare const Kbd: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
398
394
|
[key: string]: any;
|
|
399
395
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
396
|
+
|
|
400
397
|
interface StatProps {
|
|
401
398
|
label: SlotContent;
|
|
402
399
|
value: SlotContent;
|
|
@@ -444,7 +441,7 @@ declare const Stat: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
444
441
|
type: PropType<SlotContent>;
|
|
445
442
|
default: undefined;
|
|
446
443
|
};
|
|
447
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
444
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
448
445
|
[key: string]: any;
|
|
449
446
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
450
447
|
label: {
|
|
@@ -482,6 +479,7 @@ declare const Stat: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
482
479
|
deltaLabel: string;
|
|
483
480
|
invertDelta: boolean;
|
|
484
481
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
482
|
+
|
|
485
483
|
interface EmptyStateProps {
|
|
486
484
|
title: SlotContent;
|
|
487
485
|
description?: SlotContent;
|
|
@@ -518,7 +516,7 @@ declare const EmptyState: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
518
516
|
type: PropType<"sm" | "md">;
|
|
519
517
|
default: string;
|
|
520
518
|
};
|
|
521
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
519
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
522
520
|
[key: string]: any;
|
|
523
521
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
524
522
|
title: {
|
|
@@ -547,6 +545,7 @@ declare const EmptyState: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
547
545
|
icon: SlotContent;
|
|
548
546
|
action: SlotContent;
|
|
549
547
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
548
|
+
|
|
550
549
|
interface DescriptionListProps {
|
|
551
550
|
items: ReadonlyArray<{
|
|
552
551
|
term: SlotContent;
|
|
@@ -570,7 +569,7 @@ declare const DescriptionList: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
570
569
|
type: PropType<"horizontal" | "vertical">;
|
|
571
570
|
default: string;
|
|
572
571
|
};
|
|
573
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
572
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
574
573
|
[key: string]: any;
|
|
575
574
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
576
575
|
items: {
|
|
@@ -584,6 +583,7 @@ declare const DescriptionList: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
584
583
|
}>> & Readonly<{}>, {
|
|
585
584
|
orientation: "horizontal" | "vertical";
|
|
586
585
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
586
|
+
|
|
587
587
|
interface TimelineItem {
|
|
588
588
|
id: string;
|
|
589
589
|
title: SlotContent;
|
|
@@ -605,7 +605,7 @@ declare const Timeline: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
605
605
|
type: PropType<readonly TimelineItem[]>;
|
|
606
606
|
required: true;
|
|
607
607
|
};
|
|
608
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
608
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
609
609
|
[key: string]: any;
|
|
610
610
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
611
611
|
items: {
|
|
@@ -613,6 +613,7 @@ declare const Timeline: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
613
613
|
required: true;
|
|
614
614
|
};
|
|
615
615
|
}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
616
|
+
|
|
616
617
|
interface CodeBlockProps {
|
|
617
618
|
code: string;
|
|
618
619
|
language?: string;
|
|
@@ -651,7 +652,7 @@ declare const CodeBlock: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
651
652
|
type: StringConstructor;
|
|
652
653
|
default: undefined;
|
|
653
654
|
};
|
|
654
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
655
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
655
656
|
[key: string]: any;
|
|
656
657
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
657
658
|
code: {
|
|
@@ -767,9 +768,9 @@ declare const Progress: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
767
768
|
size: "sm" | "md" | "lg";
|
|
768
769
|
value: number;
|
|
769
770
|
max: number;
|
|
770
|
-
formatValue: (value: number, max: number) => string;
|
|
771
771
|
tone: "accent" | "success" | "warning" | "danger";
|
|
772
772
|
showLabel: boolean;
|
|
773
|
+
formatValue: (value: number, max: number) => string;
|
|
773
774
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
774
775
|
interface CircularProgressProps extends Omit<ProgressProps, 'size'> {
|
|
775
776
|
/** Diameter in px. Default `48`. */
|
|
@@ -851,8 +852,8 @@ declare const CircularProgress: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
851
852
|
size: number;
|
|
852
853
|
value: number;
|
|
853
854
|
max: number;
|
|
854
|
-
formatValue: (value: number, max: number) => string;
|
|
855
855
|
tone: "accent" | "success" | "warning" | "danger";
|
|
856
|
+
formatValue: (value: number, max: number) => string;
|
|
856
857
|
thickness: number;
|
|
857
858
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
858
859
|
interface MeterProps {
|
|
@@ -951,13 +952,13 @@ declare const Meter: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
951
952
|
default: undefined;
|
|
952
953
|
};
|
|
953
954
|
}>> & Readonly<{}>, {
|
|
954
|
-
min: number;
|
|
955
955
|
max: number;
|
|
956
|
-
|
|
956
|
+
min: number;
|
|
957
957
|
formatValue: (value: number) => string;
|
|
958
958
|
low: number;
|
|
959
959
|
high: number;
|
|
960
960
|
inverted: boolean;
|
|
961
|
+
showValue: boolean;
|
|
961
962
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
962
963
|
|
|
963
964
|
export { Avatar, AvatarGroup, Badge, CircularProgress, CodeBlock, DataTable, DescriptionList, EmptyState, Kbd, Meter, Pagination, Progress, Stat, Table, Timeline };
|
package/dist/data.d.ts
CHANGED
|
@@ -2,28 +2,6 @@ import * as vue from 'vue';
|
|
|
2
2
|
import { VNodeChild, PropType, VNode } from 'vue';
|
|
3
3
|
import { SlotContent } from './index.js';
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* Tables — the Vue counterpart of `@ansh-ui/react`'s `Table`/`DataTable`.
|
|
7
|
-
*
|
|
8
|
-
* A real `<table>` with `<th scope>`, not a grid of divs. The semantics are the entire point: a
|
|
9
|
-
* screen reader announces "Column 3 of 7, Status, row 12" only if the markup says so. Every
|
|
10
|
-
* div-based table reimplements navigation badly or not at all, and the CSS argument for divs
|
|
11
|
-
* disappeared when `display: contents` and `position: sticky` landed.
|
|
12
|
-
*
|
|
13
|
-
* `DataTable` adds sorting, selection and pagination on top. It stays deliberately short of a full
|
|
14
|
-
* data grid — no virtualisation, no column resizing, no pinned regions. Those need a different
|
|
15
|
-
* architecture (windowing, measured columns), and half-implementing them produces a component that
|
|
16
|
-
* breaks at exactly the scale it was added for.
|
|
17
|
-
*
|
|
18
|
-
* `DataTable` is generic over the row type `T`, which Vue only supports for a plain (non-SFC)
|
|
19
|
-
* component through `defineComponent`'s "generic setup function" overload — the setup function
|
|
20
|
-
* itself stays generic (`<T,>(props: DataTableProps<T>, ctx) => …`) while the runtime `props` list
|
|
21
|
-
* is a plain array of keys. That trade means no per-prop runtime validation or default-value
|
|
22
|
-
* coercion (booleans aren't coerced from attribute presence, defaults are applied by hand inside
|
|
23
|
-
* `setup`, mirroring the destructured defaults the React version uses) — acceptable here because the
|
|
24
|
-
* real contract for a data-shaped component like this is the TypeScript signature, not template
|
|
25
|
-
* shorthand.
|
|
26
|
-
*/
|
|
27
5
|
type SortDirection = 'asc' | 'desc';
|
|
28
6
|
interface SortState {
|
|
29
7
|
columnId: string;
|
|
@@ -80,6 +58,29 @@ interface DataTableProps<T> {
|
|
|
80
58
|
/** Per-row extra class, for status highlighting. */
|
|
81
59
|
rowClassName?: (row: T) => string | undefined;
|
|
82
60
|
}
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* Tables — the Vue counterpart of `@ansh-ui/react`'s `Table`/`DataTable`.
|
|
64
|
+
*
|
|
65
|
+
* A real `<table>` with `<th scope>`, not a grid of divs. The semantics are the entire point: a
|
|
66
|
+
* screen reader announces "Column 3 of 7, Status, row 12" only if the markup says so. Every
|
|
67
|
+
* div-based table reimplements navigation badly or not at all, and the CSS argument for divs
|
|
68
|
+
* disappeared when `display: contents` and `position: sticky` landed.
|
|
69
|
+
*
|
|
70
|
+
* `DataTable` adds sorting, selection and pagination on top. It stays deliberately short of a full
|
|
71
|
+
* data grid — no virtualisation, no column resizing, no pinned regions. Those need a different
|
|
72
|
+
* architecture (windowing, measured columns), and half-implementing them produces a component that
|
|
73
|
+
* breaks at exactly the scale it was added for.
|
|
74
|
+
*
|
|
75
|
+
* `DataTable` is generic over the row type `T`, which Vue only supports for a plain (non-SFC)
|
|
76
|
+
* component through `defineComponent`'s "generic setup function" overload — the setup function
|
|
77
|
+
* itself stays generic (`<T,>(props: DataTableProps<T>, ctx) => …`) while the runtime `props` list
|
|
78
|
+
* is a plain array of keys. That trade means no per-prop runtime validation or default-value
|
|
79
|
+
* coercion (booleans aren't coerced from attribute presence, defaults are applied by hand inside
|
|
80
|
+
* `setup`, mirroring the destructured defaults the React version uses) — acceptable here because the
|
|
81
|
+
* real contract for a data-shaped component like this is the TypeScript signature, not template
|
|
82
|
+
* shorthand.
|
|
83
|
+
*/
|
|
83
84
|
declare const DataTable: new <T>(props: DataTableProps<T> & {
|
|
84
85
|
"onUpdate:sort"?: ((...args: any[]) => any) | undefined;
|
|
85
86
|
"onUpdate:selected"?: ((...args: any[]) => any) | undefined;
|
|
@@ -100,6 +101,7 @@ declare const DataTable: new <T>(props: DataTableProps<T> & {
|
|
|
100
101
|
"onUpdate:selected"?: ((...args: any[]) => any) | undefined;
|
|
101
102
|
"onUpdate:page"?: ((...args: any[]) => any) | undefined;
|
|
102
103
|
}, {}, {}, {}, {}, {}>;
|
|
104
|
+
|
|
103
105
|
interface PaginationProps {
|
|
104
106
|
/** Zero-based. */
|
|
105
107
|
page: number;
|
|
@@ -177,11 +179,11 @@ declare const Pagination: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
177
179
|
default: number;
|
|
178
180
|
};
|
|
179
181
|
}>> & Readonly<{}>, {
|
|
180
|
-
total: number;
|
|
181
182
|
pageSize: number;
|
|
183
|
+
total: number;
|
|
182
184
|
siblings: number;
|
|
183
185
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
184
|
-
|
|
186
|
+
|
|
185
187
|
declare const Table: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
186
188
|
caption: {
|
|
187
189
|
type: StringConstructor;
|
|
@@ -216,14 +218,6 @@ declare const Table: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
216
218
|
striped: boolean;
|
|
217
219
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
218
220
|
|
|
219
|
-
/**
|
|
220
|
-
* Small display components — the Vue counterpart of `@ansh-ui/react`'s data-display primitives.
|
|
221
|
-
*
|
|
222
|
-
* Individually trivial, collectively most of what an application screen is made of. The care here
|
|
223
|
-
* goes into the details that get skipped: a badge whose meaning isn't carried by colour alone, an
|
|
224
|
-
* avatar whose fallback initials are readable against a generated background, an empty state that
|
|
225
|
-
* says what to do next rather than just "no data".
|
|
226
|
-
*/
|
|
227
221
|
type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
|
|
228
222
|
/**
|
|
229
223
|
* A status label.
|
|
@@ -258,7 +252,7 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
258
252
|
type: PropType<SlotContent>;
|
|
259
253
|
default: undefined;
|
|
260
254
|
};
|
|
261
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
255
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
262
256
|
[key: string]: any;
|
|
263
257
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
264
258
|
tone: {
|
|
@@ -286,9 +280,10 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
286
280
|
size: "sm" | "md";
|
|
287
281
|
icon: SlotContent;
|
|
288
282
|
tone: BadgeTone;
|
|
289
|
-
variant: "soft" | "
|
|
283
|
+
variant: "soft" | "outline" | "solid";
|
|
290
284
|
dot: boolean;
|
|
291
285
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
286
|
+
|
|
292
287
|
interface AvatarProps {
|
|
293
288
|
src?: string;
|
|
294
289
|
/** The person's name. Used for the alt text and to derive the fallback initials. */
|
|
@@ -383,6 +378,7 @@ declare const AvatarGroup: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
383
378
|
size: "sm" | "md" | "lg" | "xl" | "xs" | undefined;
|
|
384
379
|
max: number;
|
|
385
380
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
381
|
+
|
|
386
382
|
/**
|
|
387
383
|
* A keyboard key.
|
|
388
384
|
*
|
|
@@ -394,9 +390,10 @@ declare const AvatarGroup: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
394
390
|
* call site, `<Kbd>⌘+K</Kbd>`) rather than switching to a string prop, and the text is recovered from
|
|
395
391
|
* the rendered slot nodes — which is exactly what that slot is expected to contain.
|
|
396
392
|
*/
|
|
397
|
-
declare const Kbd: vue.DefineComponent<{}, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
393
|
+
declare const Kbd: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
398
394
|
[key: string]: any;
|
|
399
395
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
396
|
+
|
|
400
397
|
interface StatProps {
|
|
401
398
|
label: SlotContent;
|
|
402
399
|
value: SlotContent;
|
|
@@ -444,7 +441,7 @@ declare const Stat: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
444
441
|
type: PropType<SlotContent>;
|
|
445
442
|
default: undefined;
|
|
446
443
|
};
|
|
447
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
444
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
448
445
|
[key: string]: any;
|
|
449
446
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
450
447
|
label: {
|
|
@@ -482,6 +479,7 @@ declare const Stat: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
482
479
|
deltaLabel: string;
|
|
483
480
|
invertDelta: boolean;
|
|
484
481
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
482
|
+
|
|
485
483
|
interface EmptyStateProps {
|
|
486
484
|
title: SlotContent;
|
|
487
485
|
description?: SlotContent;
|
|
@@ -518,7 +516,7 @@ declare const EmptyState: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
518
516
|
type: PropType<"sm" | "md">;
|
|
519
517
|
default: string;
|
|
520
518
|
};
|
|
521
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
519
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
522
520
|
[key: string]: any;
|
|
523
521
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
524
522
|
title: {
|
|
@@ -547,6 +545,7 @@ declare const EmptyState: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
547
545
|
icon: SlotContent;
|
|
548
546
|
action: SlotContent;
|
|
549
547
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
548
|
+
|
|
550
549
|
interface DescriptionListProps {
|
|
551
550
|
items: ReadonlyArray<{
|
|
552
551
|
term: SlotContent;
|
|
@@ -570,7 +569,7 @@ declare const DescriptionList: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
570
569
|
type: PropType<"horizontal" | "vertical">;
|
|
571
570
|
default: string;
|
|
572
571
|
};
|
|
573
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
572
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
574
573
|
[key: string]: any;
|
|
575
574
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
576
575
|
items: {
|
|
@@ -584,6 +583,7 @@ declare const DescriptionList: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
584
583
|
}>> & Readonly<{}>, {
|
|
585
584
|
orientation: "horizontal" | "vertical";
|
|
586
585
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
586
|
+
|
|
587
587
|
interface TimelineItem {
|
|
588
588
|
id: string;
|
|
589
589
|
title: SlotContent;
|
|
@@ -605,7 +605,7 @@ declare const Timeline: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
605
605
|
type: PropType<readonly TimelineItem[]>;
|
|
606
606
|
required: true;
|
|
607
607
|
};
|
|
608
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
608
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
609
609
|
[key: string]: any;
|
|
610
610
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
611
611
|
items: {
|
|
@@ -613,6 +613,7 @@ declare const Timeline: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
613
613
|
required: true;
|
|
614
614
|
};
|
|
615
615
|
}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
616
|
+
|
|
616
617
|
interface CodeBlockProps {
|
|
617
618
|
code: string;
|
|
618
619
|
language?: string;
|
|
@@ -651,7 +652,7 @@ declare const CodeBlock: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
651
652
|
type: StringConstructor;
|
|
652
653
|
default: undefined;
|
|
653
654
|
};
|
|
654
|
-
}>, () => VNode<vue.RendererNode, vue.RendererElement, {
|
|
655
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
655
656
|
[key: string]: any;
|
|
656
657
|
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
657
658
|
code: {
|
|
@@ -767,9 +768,9 @@ declare const Progress: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
767
768
|
size: "sm" | "md" | "lg";
|
|
768
769
|
value: number;
|
|
769
770
|
max: number;
|
|
770
|
-
formatValue: (value: number, max: number) => string;
|
|
771
771
|
tone: "accent" | "success" | "warning" | "danger";
|
|
772
772
|
showLabel: boolean;
|
|
773
|
+
formatValue: (value: number, max: number) => string;
|
|
773
774
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
774
775
|
interface CircularProgressProps extends Omit<ProgressProps, 'size'> {
|
|
775
776
|
/** Diameter in px. Default `48`. */
|
|
@@ -851,8 +852,8 @@ declare const CircularProgress: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
851
852
|
size: number;
|
|
852
853
|
value: number;
|
|
853
854
|
max: number;
|
|
854
|
-
formatValue: (value: number, max: number) => string;
|
|
855
855
|
tone: "accent" | "success" | "warning" | "danger";
|
|
856
|
+
formatValue: (value: number, max: number) => string;
|
|
856
857
|
thickness: number;
|
|
857
858
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
858
859
|
interface MeterProps {
|
|
@@ -951,13 +952,13 @@ declare const Meter: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
951
952
|
default: undefined;
|
|
952
953
|
};
|
|
953
954
|
}>> & Readonly<{}>, {
|
|
954
|
-
min: number;
|
|
955
955
|
max: number;
|
|
956
|
-
|
|
956
|
+
min: number;
|
|
957
957
|
formatValue: (value: number) => string;
|
|
958
958
|
low: number;
|
|
959
959
|
high: number;
|
|
960
960
|
inverted: boolean;
|
|
961
|
+
showValue: boolean;
|
|
961
962
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
962
963
|
|
|
963
964
|
export { Avatar, AvatarGroup, Badge, CircularProgress, CodeBlock, DataTable, DescriptionList, EmptyState, Kbd, Meter, Pagination, Progress, Stat, Table, Timeline };
|
package/dist/data.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { Avatar, AvatarGroup, Badge, CircularProgress, CodeBlock, DataTable, DescriptionList, EmptyState, Kbd, Meter, Pagination, Progress, Stat, Table, Timeline } from './chunk-
|
|
1
|
+
export { Avatar, AvatarGroup, Badge, CircularProgress, CodeBlock, DataTable, DescriptionList, EmptyState, Kbd, Meter, Pagination, Progress, Stat, Table, Timeline } from './chunk-NJMTWLT2.js';
|
|
2
2
|
import './chunk-OAQ7MDYX.js';
|
|
3
3
|
import './chunk-NJDDNO4C.js';
|
|
4
4
|
//# sourceMappingURL=data.js.map
|