@lovince/ui-vue 0.2.0 → 0.3.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/README.md +3 -1
  2. package/dist/components/display/table-parts.d.ts +272 -0
  3. package/dist/components/layout/section.d.ts +184 -0
  4. package/dist/index.d.ts +2 -0
  5. package/dist/index.js +1811 -1537
  6. package/package.json +2 -2
package/README.md CHANGED
@@ -6,7 +6,7 @@ effects run through [`@lovince/ui-dom`](../ui-dom). This package subscribes to
6
6
  the machine, feeds props in, and renders what `connect()` returns. It holds no
7
7
  behaviour of its own.
8
8
 
9
- > **Status: `0.2.0`, experimental.** The API may change before `1.0`.
9
+ > **Status: `0.3.0`, experimental.** The API may change before `1.0`.
10
10
 
11
11
  ```bash
12
12
  bun add @lovince/ui-vue
@@ -52,7 +52,9 @@ names never clash with your own components or native elements.
52
52
  | | Tree | `LvTreeRoot`, `LvTreeItem`, `LvTreeGroup` |
53
53
  | | Carousel | `LvCarouselRoot`, `LvCarouselViewport`, `LvCarouselSlide`, `LvCarouselPrevious`, `LvCarouselNext`, `LvCarouselIndicators`, `LvCarouselIndicator` |
54
54
  | | Sortable | `LvSortableRoot`, `LvSortableItem`, `LvSortableHandle` |
55
+ | | Section | `LvSectionRoot`, `LvSectionHeader`, `LvSectionEyebrow`, `LvSectionTitle`, `LvSectionDescription`, `LvSectionContent` |
55
56
  | Display | Avatar, Progress | `LvAvatarRoot`, `LvAvatarImage`, `LvAvatarFallback`, `LvProgressRoot`, `LvProgressIndicator` |
57
+ | | Table | `LvTableContainer`, `LvTableRoot`, `LvTableCaption`, `LvTableHeader`, `LvTableBody`, `LvTableFooter`, `LvTableRow`, `LvTableHead`, `LvTableCell`, plus `LvDataTable` |
56
58
 
57
59
  ### Primitives
58
60
 
package/dist/components/display/table-parts.d.ts ADDED
@@ -0,0 +1,272 @@
1
+ import { PropType } from 'vue';
2
+ export type TableAlign = 'start' | 'center' | 'end';
3
+ export type TableHeadScope = 'col' | 'row' | 'colgroup' | 'rowgroup';
4
+ export declare const TABLE_ALIGNS: readonly ["start", "center", "end"];
5
+ export declare const TABLE_HEAD_SCOPES: readonly ["col", "row", "colgroup", "rowgroup"];
6
+ export declare const LvTableContainer: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
7
+ label: {
8
+ type: StringConstructor;
9
+ default: undefined;
10
+ };
11
+ as: {
12
+ readonly type: PropType<string | import('vue').Component>;
13
+ readonly default: "div";
14
+ };
15
+ asChild: {
16
+ readonly type: BooleanConstructor;
17
+ readonly default: false;
18
+ };
19
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
20
+ [key: string]: any;
21
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
22
+ label: {
23
+ type: StringConstructor;
24
+ default: undefined;
25
+ };
26
+ as: {
27
+ readonly type: PropType<string | import('vue').Component>;
28
+ readonly default: "div";
29
+ };
30
+ asChild: {
31
+ readonly type: BooleanConstructor;
32
+ readonly default: false;
33
+ };
34
+ }>> & Readonly<{}>, {
35
+ as: string | import('vue').Component;
36
+ asChild: boolean;
37
+ label: string;
38
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
39
+ export declare const LvTableRoot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
40
+ as: {
41
+ default: string;
42
+ type: PropType<string | import('vue').Component>;
43
+ };
44
+ asChild: {
45
+ readonly type: BooleanConstructor;
46
+ readonly default: false;
47
+ };
48
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
49
+ [key: string]: any;
50
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
51
+ as: {
52
+ default: string;
53
+ type: PropType<string | import('vue').Component>;
54
+ };
55
+ asChild: {
56
+ readonly type: BooleanConstructor;
57
+ readonly default: false;
58
+ };
59
+ }>> & Readonly<{}>, {
60
+ as: string | import('vue').Component;
61
+ asChild: boolean;
62
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
63
+ export declare const LvTableCaption: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
64
+ as: {
65
+ default: string;
66
+ type: PropType<string | import('vue').Component>;
67
+ };
68
+ asChild: {
69
+ readonly type: BooleanConstructor;
70
+ readonly default: false;
71
+ };
72
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
73
+ [key: string]: any;
74
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
75
+ as: {
76
+ default: string;
77
+ type: PropType<string | import('vue').Component>;
78
+ };
79
+ asChild: {
80
+ readonly type: BooleanConstructor;
81
+ readonly default: false;
82
+ };
83
+ }>> & Readonly<{}>, {
84
+ as: string | import('vue').Component;
85
+ asChild: boolean;
86
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
87
+ export declare const LvTableHeader: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
88
+ as: {
89
+ default: string;
90
+ type: PropType<string | import('vue').Component>;
91
+ };
92
+ asChild: {
93
+ readonly type: BooleanConstructor;
94
+ readonly default: false;
95
+ };
96
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
97
+ [key: string]: any;
98
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
99
+ as: {
100
+ default: string;
101
+ type: PropType<string | import('vue').Component>;
102
+ };
103
+ asChild: {
104
+ readonly type: BooleanConstructor;
105
+ readonly default: false;
106
+ };
107
+ }>> & Readonly<{}>, {
108
+ as: string | import('vue').Component;
109
+ asChild: boolean;
110
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
111
+ export declare const LvTableBody: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
112
+ as: {
113
+ default: string;
114
+ type: PropType<string | import('vue').Component>;
115
+ };
116
+ asChild: {
117
+ readonly type: BooleanConstructor;
118
+ readonly default: false;
119
+ };
120
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
121
+ [key: string]: any;
122
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
123
+ as: {
124
+ default: string;
125
+ type: PropType<string | import('vue').Component>;
126
+ };
127
+ asChild: {
128
+ readonly type: BooleanConstructor;
129
+ readonly default: false;
130
+ };
131
+ }>> & Readonly<{}>, {
132
+ as: string | import('vue').Component;
133
+ asChild: boolean;
134
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
135
+ export declare const LvTableFooter: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
136
+ as: {
137
+ default: string;
138
+ type: PropType<string | import('vue').Component>;
139
+ };
140
+ asChild: {
141
+ readonly type: BooleanConstructor;
142
+ readonly default: false;
143
+ };
144
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
145
+ [key: string]: any;
146
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
147
+ as: {
148
+ default: string;
149
+ type: PropType<string | import('vue').Component>;
150
+ };
151
+ asChild: {
152
+ readonly type: BooleanConstructor;
153
+ readonly default: false;
154
+ };
155
+ }>> & Readonly<{}>, {
156
+ as: string | import('vue').Component;
157
+ asChild: boolean;
158
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
159
+ export declare const LvTableRow: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
160
+ as: {
161
+ default: string;
162
+ type: PropType<string | import('vue').Component>;
163
+ };
164
+ selected: {
165
+ type: BooleanConstructor;
166
+ default: boolean;
167
+ };
168
+ asChild: {
169
+ readonly type: BooleanConstructor;
170
+ readonly default: false;
171
+ };
172
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
173
+ [key: string]: any;
174
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
175
+ as: {
176
+ default: string;
177
+ type: PropType<string | import('vue').Component>;
178
+ };
179
+ selected: {
180
+ type: BooleanConstructor;
181
+ default: boolean;
182
+ };
183
+ asChild: {
184
+ readonly type: BooleanConstructor;
185
+ readonly default: false;
186
+ };
187
+ }>> & Readonly<{}>, {
188
+ as: string | import('vue').Component;
189
+ asChild: boolean;
190
+ selected: boolean;
191
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
192
+ export declare const LvTableHead: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
193
+ as: {
194
+ default: string;
195
+ type: PropType<string | import('vue').Component>;
196
+ };
197
+ scope: {
198
+ type: PropType<TableHeadScope>;
199
+ default: string;
200
+ validator: (value: string) => boolean;
201
+ };
202
+ align: {
203
+ type: PropType<TableAlign>;
204
+ default: undefined;
205
+ validator: (value: string) => boolean;
206
+ };
207
+ asChild: {
208
+ readonly type: BooleanConstructor;
209
+ readonly default: false;
210
+ };
211
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
212
+ [key: string]: any;
213
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
214
+ as: {
215
+ default: string;
216
+ type: PropType<string | import('vue').Component>;
217
+ };
218
+ scope: {
219
+ type: PropType<TableHeadScope>;
220
+ default: string;
221
+ validator: (value: string) => boolean;
222
+ };
223
+ align: {
224
+ type: PropType<TableAlign>;
225
+ default: undefined;
226
+ validator: (value: string) => boolean;
227
+ };
228
+ asChild: {
229
+ readonly type: BooleanConstructor;
230
+ readonly default: false;
231
+ };
232
+ }>> & Readonly<{}>, {
233
+ as: string | import('vue').Component;
234
+ asChild: boolean;
235
+ align: TableAlign;
236
+ scope: TableHeadScope;
237
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
238
+ export declare const LvTableCell: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
239
+ as: {
240
+ default: string;
241
+ type: PropType<string | import('vue').Component>;
242
+ };
243
+ align: {
244
+ type: PropType<TableAlign>;
245
+ default: undefined;
246
+ validator: (value: string) => boolean;
247
+ };
248
+ asChild: {
249
+ readonly type: BooleanConstructor;
250
+ readonly default: false;
251
+ };
252
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
253
+ [key: string]: any;
254
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
255
+ as: {
256
+ default: string;
257
+ type: PropType<string | import('vue').Component>;
258
+ };
259
+ align: {
260
+ type: PropType<TableAlign>;
261
+ default: undefined;
262
+ validator: (value: string) => boolean;
263
+ };
264
+ asChild: {
265
+ readonly type: BooleanConstructor;
266
+ readonly default: false;
267
+ };
268
+ }>> & Readonly<{}>, {
269
+ as: string | import('vue').Component;
270
+ asChild: boolean;
271
+ align: TableAlign;
272
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
package/dist/components/layout/section.d.ts ADDED
@@ -0,0 +1,184 @@
1
+ import { Component, PropType } from 'vue';
2
+ export type SectionSpacing = 'none' | 'sm' | 'md' | 'lg' | 'xl';
3
+ export type SectionAlign = 'start' | 'center';
4
+ export type SectionHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
5
+ export declare const SECTION_SPACINGS: readonly ["none", "sm", "md", "lg", "xl"];
6
+ export declare const SECTION_ALIGNS: readonly ["start", "center"];
7
+ export declare const SECTION_HEADING_LEVELS: readonly [1, 2, 3, 4, 5, 6];
8
+ export declare const LvSectionRoot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
9
+ as: {
10
+ default: string;
11
+ type: PropType<string | Component>;
12
+ };
13
+ spacing: {
14
+ type: PropType<SectionSpacing>;
15
+ default: string;
16
+ validator: (value: string) => boolean;
17
+ };
18
+ align: {
19
+ type: PropType<SectionAlign>;
20
+ default: string;
21
+ validator: (value: string) => boolean;
22
+ };
23
+ asChild: {
24
+ readonly type: BooleanConstructor;
25
+ readonly default: false;
26
+ };
27
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
28
+ [key: string]: any;
29
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
30
+ as: {
31
+ default: string;
32
+ type: PropType<string | Component>;
33
+ };
34
+ spacing: {
35
+ type: PropType<SectionSpacing>;
36
+ default: string;
37
+ validator: (value: string) => boolean;
38
+ };
39
+ align: {
40
+ type: PropType<SectionAlign>;
41
+ default: string;
42
+ validator: (value: string) => boolean;
43
+ };
44
+ asChild: {
45
+ readonly type: BooleanConstructor;
46
+ readonly default: false;
47
+ };
48
+ }>> & Readonly<{}>, {
49
+ as: string | Component;
50
+ asChild: boolean;
51
+ align: SectionAlign;
52
+ spacing: SectionSpacing;
53
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
54
+ export declare const LvSectionHeader: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
55
+ as: {
56
+ default: string;
57
+ type: PropType<string | Component>;
58
+ };
59
+ asChild: {
60
+ readonly type: BooleanConstructor;
61
+ readonly default: false;
62
+ };
63
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
64
+ [key: string]: any;
65
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
66
+ as: {
67
+ default: string;
68
+ type: PropType<string | Component>;
69
+ };
70
+ asChild: {
71
+ readonly type: BooleanConstructor;
72
+ readonly default: false;
73
+ };
74
+ }>> & Readonly<{}>, {
75
+ as: string | Component;
76
+ asChild: boolean;
77
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
78
+ export declare const LvSectionEyebrow: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
79
+ as: {
80
+ default: string;
81
+ type: PropType<string | Component>;
82
+ };
83
+ asChild: {
84
+ readonly type: BooleanConstructor;
85
+ readonly default: false;
86
+ };
87
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
88
+ [key: string]: any;
89
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
90
+ as: {
91
+ default: string;
92
+ type: PropType<string | Component>;
93
+ };
94
+ asChild: {
95
+ readonly type: BooleanConstructor;
96
+ readonly default: false;
97
+ };
98
+ }>> & Readonly<{}>, {
99
+ as: string | Component;
100
+ asChild: boolean;
101
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
102
+ export declare const LvSectionTitle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
103
+ as: {
104
+ type: PropType<string | Component>;
105
+ default: undefined;
106
+ };
107
+ level: {
108
+ type: PropType<SectionHeadingLevel>;
109
+ default: number;
110
+ validator: (value: number) => boolean;
111
+ };
112
+ asChild: {
113
+ readonly type: BooleanConstructor;
114
+ readonly default: false;
115
+ };
116
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
117
+ [key: string]: any;
118
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
119
+ as: {
120
+ type: PropType<string | Component>;
121
+ default: undefined;
122
+ };
123
+ level: {
124
+ type: PropType<SectionHeadingLevel>;
125
+ default: number;
126
+ validator: (value: number) => boolean;
127
+ };
128
+ asChild: {
129
+ readonly type: BooleanConstructor;
130
+ readonly default: false;
131
+ };
132
+ }>> & Readonly<{}>, {
133
+ as: string | Component;
134
+ asChild: boolean;
135
+ level: SectionHeadingLevel;
136
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
137
+ export declare const LvSectionDescription: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
138
+ as: {
139
+ default: string;
140
+ type: PropType<string | Component>;
141
+ };
142
+ asChild: {
143
+ readonly type: BooleanConstructor;
144
+ readonly default: false;
145
+ };
146
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
147
+ [key: string]: any;
148
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
149
+ as: {
150
+ default: string;
151
+ type: PropType<string | Component>;
152
+ };
153
+ asChild: {
154
+ readonly type: BooleanConstructor;
155
+ readonly default: false;
156
+ };
157
+ }>> & Readonly<{}>, {
158
+ as: string | Component;
159
+ asChild: boolean;
160
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
161
+ export declare const LvSectionContent: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
162
+ readonly as: {
163
+ readonly type: PropType<string | Component>;
164
+ readonly default: "div";
165
+ };
166
+ readonly asChild: {
167
+ readonly type: BooleanConstructor;
168
+ readonly default: false;
169
+ };
170
+ }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
171
+ [key: string]: any;
172
+ }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
173
+ readonly as: {
174
+ readonly type: PropType<string | Component>;
175
+ readonly default: "div";
176
+ };
177
+ readonly asChild: {
178
+ readonly type: BooleanConstructor;
179
+ readonly default: false;
180
+ };
181
+ }>> & Readonly<{}>, {
182
+ readonly as: string | Component;
183
+ readonly asChild: boolean;
184
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
package/dist/index.d.ts CHANGED
@@ -50,6 +50,7 @@ export * from './components/display/timeline';
50
50
  export * from './components/display/avatar-group';
51
51
  export * from './components/display/image';
52
52
  export * from './components/display/table';
53
+ export * from './components/display/table-parts';
53
54
  export * from './components/choice/rating';
54
55
  export * from './components/choice/segmented-control';
55
56
  export * from './components/forms/text-inputs';
@@ -66,5 +67,6 @@ export * from './components/navigation/toolbar';
66
67
  export * from './components/navigation/sidebar';
67
68
  export * from './components/navigation/table-of-contents';
68
69
  export * from './components/layout/primitives';
70
+ export * from './components/layout/section';
69
71
  export * from './components/layout/virtual-list';
70
72
  export * from './components/layout/marquee';