@aotearoan/neon 28.3.0 → 28.4.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.
- package/dist/components/feedback/alert/NeonAlert.cjs.js +1 -1
- package/dist/components/feedback/alert/NeonAlert.cjs.js.map +1 -1
- package/dist/components/feedback/alert/NeonAlert.es.js +1 -1
- package/dist/components/feedback/alert/NeonAlert.es.js.map +1 -1
- package/dist/components/feedback/splash-loader/NeonSplashLoader.vue.cjs.js +1 -1
- package/dist/components/feedback/splash-loader/NeonSplashLoader.vue.cjs.js.map +1 -1
- package/dist/components/feedback/splash-loader/NeonSplashLoader.vue.es.js +15 -15
- package/dist/components/feedback/splash-loader/NeonSplashLoader.vue.es.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.cjs.js +1 -1
- package/dist/components/layout/card-list/NeonCardList.cjs.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.es.js +32 -26
- package/dist/components/layout/card-list/NeonCardList.es.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.cjs.js +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.cjs.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.es.js +57 -61
- package/dist/components/layout/card-list/NeonCardList.vue.es.js.map +1 -1
- package/dist/components/layout/list-layout/NeonListLayout.cjs.js +2 -0
- package/dist/components/layout/list-layout/NeonListLayout.cjs.js.map +1 -0
- package/dist/components/layout/list-layout/NeonListLayout.es.js +99 -0
- package/dist/components/layout/list-layout/NeonListLayout.es.js.map +1 -0
- package/dist/components/layout/list-layout/NeonListLayout.vue.cjs.js +2 -0
- package/dist/components/layout/list-layout/NeonListLayout.vue.cjs.js.map +1 -0
- package/dist/components/layout/list-layout/NeonListLayout.vue.es.js +58 -0
- package/dist/components/layout/list-layout/NeonListLayout.vue.es.js.map +1 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.cjs.js +2 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.cjs.js.map +1 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.es.js +62 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.es.js.map +1 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.vue.cjs.js +2 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.vue.cjs.js.map +1 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.vue.es.js +54 -0
- package/dist/components/presentation/empty-state/NeonEmptyState.vue.es.js.map +1 -0
- package/dist/model/presentation/empty-state/NeonEmptyStateType.cjs.js +2 -0
- package/dist/model/presentation/empty-state/NeonEmptyStateType.cjs.js.map +1 -0
- package/dist/model/presentation/empty-state/NeonEmptyStateType.es.js +5 -0
- package/dist/model/presentation/empty-state/NeonEmptyStateType.es.js.map +1 -0
- package/dist/neon.cjs.js +1 -1
- package/dist/neon.es.js +229 -223
- package/dist/neon.es.js.map +1 -1
- package/dist/src/components/layout/card-list/NeonCardList.d.ts +128 -7
- package/dist/src/components/layout/drawer/NeonDrawer.d.ts +1 -1
- package/dist/src/components/layout/list-layout/NeonListLayout.d.ts +2764 -0
- package/dist/src/components/layout/list-layout/NeonListLayout.vue.d.ts +2 -0
- package/dist/src/components/presentation/empty-state/NeonEmptyState.d.ts +613 -0
- package/dist/src/components/presentation/empty-state/NeonEmptyState.vue.d.ts +2 -0
- package/dist/src/model/presentation/empty-state/NeonEmptyStateType.d.ts +9 -0
- package/dist/src/model/user-input/button/NeonButtonModel.d.ts +19 -0
- package/dist/src/neon.d.ts +4 -0
- package/package.json +1 -1
- package/src/sass/components/_card-list.scss +19 -0
- package/src/sass/components/_empty-state.scss +47 -0
- package/src/sass/components/_header.scss +2 -0
- package/src/sass/components/_list-layout.scss +37 -0
- package/src/sass/components/_page-container.scss +1 -0
- package/src/sass/components/components.scss +2 -0
- package/src/sass/core/_transitions.scss +15 -0
- package/src/sass/global/base-html.scss +0 -4
- package/src/sass/includes/_dependencies.scss +2 -0
- package/src/sass/theme.scss +8 -0
- package/src/sass/variables-global.scss +7 -0
- package/dist/components/feedback/alert/container/NeonDialogContainer.cjs2.js +0 -2
- package/dist/components/feedback/alert/container/NeonDialogContainer.cjs2.js.map +0 -1
- package/dist/components/feedback/alert/container/NeonDialogContainer.es2.js +0 -25
- package/dist/components/feedback/alert/container/NeonDialogContainer.es2.js.map +0 -1
|
@@ -0,0 +1,613 @@
|
|
|
1
|
+
import type { NeonButtonModel } from '@/model/user-input/button/NeonButtonModel';
|
|
2
|
+
import { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';
|
|
3
|
+
import { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';
|
|
4
|
+
import { NeonEmptyStateType } from '@/model/presentation/empty-state/NeonEmptyStateType';
|
|
5
|
+
/**
|
|
6
|
+
* NeonEmptyState is a component for displaying an empty state message with an image and optional call-to-action buttons.
|
|
7
|
+
* It can also be used to render error pages.
|
|
8
|
+
*/
|
|
9
|
+
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
10
|
+
/**
|
|
11
|
+
* The image to display in the empty state. This is an icon name used by the NeonIcon component, typically an
|
|
12
|
+
* svg illustration.
|
|
13
|
+
*/
|
|
14
|
+
image: {
|
|
15
|
+
type: StringConstructor;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* The type of empty state to render, either an empty state or an error.
|
|
19
|
+
*/
|
|
20
|
+
type: {
|
|
21
|
+
type: () => NeonEmptyStateType;
|
|
22
|
+
default: () => NeonEmptyStateType;
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* The accent color of the image. This is a functional color from the NeonFunctionalColor enum.
|
|
26
|
+
*/
|
|
27
|
+
imageColor: {
|
|
28
|
+
type: () => NeonFunctionalColor;
|
|
29
|
+
default: () => NeonFunctionalColor;
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* The title of the empty state component.
|
|
33
|
+
*/
|
|
34
|
+
title: {
|
|
35
|
+
type: StringConstructor;
|
|
36
|
+
required: true;
|
|
37
|
+
};
|
|
38
|
+
/**
|
|
39
|
+
* A subtitle of the empty state component.
|
|
40
|
+
*/
|
|
41
|
+
subtitle: {
|
|
42
|
+
type: StringConstructor;
|
|
43
|
+
};
|
|
44
|
+
/**
|
|
45
|
+
* A list of CTA buttons to display in the empty state. These are
|
|
46
|
+
* NeonButtonModel objects.
|
|
47
|
+
*/
|
|
48
|
+
ctas: {
|
|
49
|
+
type: () => Array<NeonButtonModel>;
|
|
50
|
+
default: () => never[];
|
|
51
|
+
};
|
|
52
|
+
}>, {
|
|
53
|
+
emit: (event: "cta-click", ...args: any[]) => void;
|
|
54
|
+
NeonButtonStyle: typeof NeonButtonStyle;
|
|
55
|
+
NeonFunctionalColor: typeof NeonFunctionalColor;
|
|
56
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "cta-click"[], "cta-click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
57
|
+
/**
|
|
58
|
+
* The image to display in the empty state. This is an icon name used by the NeonIcon component, typically an
|
|
59
|
+
* svg illustration.
|
|
60
|
+
*/
|
|
61
|
+
image: {
|
|
62
|
+
type: StringConstructor;
|
|
63
|
+
};
|
|
64
|
+
/**
|
|
65
|
+
* The type of empty state to render, either an empty state or an error.
|
|
66
|
+
*/
|
|
67
|
+
type: {
|
|
68
|
+
type: () => NeonEmptyStateType;
|
|
69
|
+
default: () => NeonEmptyStateType;
|
|
70
|
+
};
|
|
71
|
+
/**
|
|
72
|
+
* The accent color of the image. This is a functional color from the NeonFunctionalColor enum.
|
|
73
|
+
*/
|
|
74
|
+
imageColor: {
|
|
75
|
+
type: () => NeonFunctionalColor;
|
|
76
|
+
default: () => NeonFunctionalColor;
|
|
77
|
+
};
|
|
78
|
+
/**
|
|
79
|
+
* The title of the empty state component.
|
|
80
|
+
*/
|
|
81
|
+
title: {
|
|
82
|
+
type: StringConstructor;
|
|
83
|
+
required: true;
|
|
84
|
+
};
|
|
85
|
+
/**
|
|
86
|
+
* A subtitle of the empty state component.
|
|
87
|
+
*/
|
|
88
|
+
subtitle: {
|
|
89
|
+
type: StringConstructor;
|
|
90
|
+
};
|
|
91
|
+
/**
|
|
92
|
+
* A list of CTA buttons to display in the empty state. These are
|
|
93
|
+
* NeonButtonModel objects.
|
|
94
|
+
*/
|
|
95
|
+
ctas: {
|
|
96
|
+
type: () => Array<NeonButtonModel>;
|
|
97
|
+
default: () => never[];
|
|
98
|
+
};
|
|
99
|
+
}>> & Readonly<{
|
|
100
|
+
"onCta-click"?: ((...args: any[]) => any) | undefined;
|
|
101
|
+
}>, {
|
|
102
|
+
type: NeonEmptyStateType;
|
|
103
|
+
imageColor: NeonFunctionalColor;
|
|
104
|
+
ctas: NeonButtonModel[];
|
|
105
|
+
}, {}, {
|
|
106
|
+
NeonButton: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
107
|
+
href: {
|
|
108
|
+
type: StringConstructor;
|
|
109
|
+
default: null;
|
|
110
|
+
};
|
|
111
|
+
label: {
|
|
112
|
+
type: StringConstructor;
|
|
113
|
+
default: null;
|
|
114
|
+
};
|
|
115
|
+
size: {
|
|
116
|
+
type: () => import("../../../neon").NeonButtonSize;
|
|
117
|
+
default: import("../../../neon").NeonButtonSize;
|
|
118
|
+
};
|
|
119
|
+
color: {
|
|
120
|
+
type: () => NeonFunctionalColor;
|
|
121
|
+
default: NeonFunctionalColor;
|
|
122
|
+
};
|
|
123
|
+
inverse: {
|
|
124
|
+
type: BooleanConstructor;
|
|
125
|
+
default: boolean;
|
|
126
|
+
};
|
|
127
|
+
alternateColor: {
|
|
128
|
+
type: () => NeonFunctionalColor;
|
|
129
|
+
default: null;
|
|
130
|
+
};
|
|
131
|
+
icon: {
|
|
132
|
+
type: StringConstructor;
|
|
133
|
+
default: null;
|
|
134
|
+
};
|
|
135
|
+
iconAriaLabel: {
|
|
136
|
+
type: StringConstructor;
|
|
137
|
+
};
|
|
138
|
+
iconPosition: {
|
|
139
|
+
type: () => import("../../../neon").NeonHorizontalPosition;
|
|
140
|
+
default: import("../../../neon").NeonHorizontalPosition;
|
|
141
|
+
};
|
|
142
|
+
buttonStyle: {
|
|
143
|
+
type: () => NeonButtonStyle;
|
|
144
|
+
default: NeonButtonStyle;
|
|
145
|
+
};
|
|
146
|
+
buttonType: {
|
|
147
|
+
type: () => import("../../../neon").NeonButtonType;
|
|
148
|
+
default: import("../../../neon").NeonButtonType;
|
|
149
|
+
};
|
|
150
|
+
state: {
|
|
151
|
+
type: () => import("../../../neon").NeonState;
|
|
152
|
+
default: import("../../../neon").NeonState;
|
|
153
|
+
};
|
|
154
|
+
disabled: {
|
|
155
|
+
type: BooleanConstructor;
|
|
156
|
+
default: boolean;
|
|
157
|
+
};
|
|
158
|
+
transparent: {
|
|
159
|
+
type: BooleanConstructor;
|
|
160
|
+
default: boolean;
|
|
161
|
+
};
|
|
162
|
+
outline: {
|
|
163
|
+
type: BooleanConstructor;
|
|
164
|
+
default: boolean;
|
|
165
|
+
};
|
|
166
|
+
circular: {
|
|
167
|
+
type: BooleanConstructor;
|
|
168
|
+
default: null;
|
|
169
|
+
};
|
|
170
|
+
fullWidth: {
|
|
171
|
+
type: BooleanConstructor;
|
|
172
|
+
default: null;
|
|
173
|
+
};
|
|
174
|
+
indicator: {
|
|
175
|
+
type: BooleanConstructor;
|
|
176
|
+
default: boolean;
|
|
177
|
+
};
|
|
178
|
+
indicatorExpanded: {
|
|
179
|
+
type: BooleanConstructor;
|
|
180
|
+
default: null;
|
|
181
|
+
};
|
|
182
|
+
}>, {
|
|
183
|
+
iconName: import("vue").ComputedRef<string>;
|
|
184
|
+
classes: import("vue").ComputedRef<(string | false | {
|
|
185
|
+
[x: string]: boolean | "" | NeonFunctionalColor;
|
|
186
|
+
'neon-button--text-transparent': boolean;
|
|
187
|
+
'neon-button--disabled': boolean;
|
|
188
|
+
'neon-button--inverse': boolean;
|
|
189
|
+
'neon-button--circular': boolean;
|
|
190
|
+
'neon-button--no-outline': boolean;
|
|
191
|
+
'neon-button--full-width': boolean;
|
|
192
|
+
'neon-button--with-icon neon-button--icon-only': boolean | "";
|
|
193
|
+
'neon-button--with-icon neon-button--icon-left': boolean | "";
|
|
194
|
+
'neon-button--with-icon neon-button--icon-right': boolean | "";
|
|
195
|
+
})[]>;
|
|
196
|
+
button: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
|
|
197
|
+
attrs: {
|
|
198
|
+
[x: string]: unknown;
|
|
199
|
+
};
|
|
200
|
+
sanitizedAttributes: import("vue").ComputedRef<{
|
|
201
|
+
[x: string]: unknown;
|
|
202
|
+
}>;
|
|
203
|
+
clickLink: () => void | undefined;
|
|
204
|
+
clickButton: () => void;
|
|
205
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
206
|
+
href: {
|
|
207
|
+
type: StringConstructor;
|
|
208
|
+
default: null;
|
|
209
|
+
};
|
|
210
|
+
label: {
|
|
211
|
+
type: StringConstructor;
|
|
212
|
+
default: null;
|
|
213
|
+
};
|
|
214
|
+
size: {
|
|
215
|
+
type: () => import("../../../neon").NeonButtonSize;
|
|
216
|
+
default: import("../../../neon").NeonButtonSize;
|
|
217
|
+
};
|
|
218
|
+
color: {
|
|
219
|
+
type: () => NeonFunctionalColor;
|
|
220
|
+
default: NeonFunctionalColor;
|
|
221
|
+
};
|
|
222
|
+
inverse: {
|
|
223
|
+
type: BooleanConstructor;
|
|
224
|
+
default: boolean;
|
|
225
|
+
};
|
|
226
|
+
alternateColor: {
|
|
227
|
+
type: () => NeonFunctionalColor;
|
|
228
|
+
default: null;
|
|
229
|
+
};
|
|
230
|
+
icon: {
|
|
231
|
+
type: StringConstructor;
|
|
232
|
+
default: null;
|
|
233
|
+
};
|
|
234
|
+
iconAriaLabel: {
|
|
235
|
+
type: StringConstructor;
|
|
236
|
+
};
|
|
237
|
+
iconPosition: {
|
|
238
|
+
type: () => import("../../../neon").NeonHorizontalPosition;
|
|
239
|
+
default: import("../../../neon").NeonHorizontalPosition;
|
|
240
|
+
};
|
|
241
|
+
buttonStyle: {
|
|
242
|
+
type: () => NeonButtonStyle;
|
|
243
|
+
default: NeonButtonStyle;
|
|
244
|
+
};
|
|
245
|
+
buttonType: {
|
|
246
|
+
type: () => import("../../../neon").NeonButtonType;
|
|
247
|
+
default: import("../../../neon").NeonButtonType;
|
|
248
|
+
};
|
|
249
|
+
state: {
|
|
250
|
+
type: () => import("../../../neon").NeonState;
|
|
251
|
+
default: import("../../../neon").NeonState;
|
|
252
|
+
};
|
|
253
|
+
disabled: {
|
|
254
|
+
type: BooleanConstructor;
|
|
255
|
+
default: boolean;
|
|
256
|
+
};
|
|
257
|
+
transparent: {
|
|
258
|
+
type: BooleanConstructor;
|
|
259
|
+
default: boolean;
|
|
260
|
+
};
|
|
261
|
+
outline: {
|
|
262
|
+
type: BooleanConstructor;
|
|
263
|
+
default: boolean;
|
|
264
|
+
};
|
|
265
|
+
circular: {
|
|
266
|
+
type: BooleanConstructor;
|
|
267
|
+
default: null;
|
|
268
|
+
};
|
|
269
|
+
fullWidth: {
|
|
270
|
+
type: BooleanConstructor;
|
|
271
|
+
default: null;
|
|
272
|
+
};
|
|
273
|
+
indicator: {
|
|
274
|
+
type: BooleanConstructor;
|
|
275
|
+
default: boolean;
|
|
276
|
+
};
|
|
277
|
+
indicatorExpanded: {
|
|
278
|
+
type: BooleanConstructor;
|
|
279
|
+
default: null;
|
|
280
|
+
};
|
|
281
|
+
}>> & Readonly<{
|
|
282
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
283
|
+
}>, {
|
|
284
|
+
color: NeonFunctionalColor;
|
|
285
|
+
icon: string;
|
|
286
|
+
label: string;
|
|
287
|
+
inverse: boolean;
|
|
288
|
+
disabled: boolean;
|
|
289
|
+
href: string;
|
|
290
|
+
size: import("../../../neon").NeonButtonSize;
|
|
291
|
+
alternateColor: NeonFunctionalColor;
|
|
292
|
+
outline: boolean;
|
|
293
|
+
iconPosition: import("../../../neon").NeonHorizontalPosition;
|
|
294
|
+
buttonStyle: NeonButtonStyle;
|
|
295
|
+
buttonType: import("../../../neon").NeonButtonType;
|
|
296
|
+
state: import("../../../neon").NeonState;
|
|
297
|
+
transparent: boolean;
|
|
298
|
+
circular: boolean;
|
|
299
|
+
fullWidth: boolean;
|
|
300
|
+
indicator: boolean;
|
|
301
|
+
indicatorExpanded: boolean;
|
|
302
|
+
}, {}, {
|
|
303
|
+
NeonExpansionIndicator: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
304
|
+
expanded: {
|
|
305
|
+
type: BooleanConstructor;
|
|
306
|
+
default: boolean;
|
|
307
|
+
};
|
|
308
|
+
inverse: {
|
|
309
|
+
type: BooleanConstructor;
|
|
310
|
+
default: boolean;
|
|
311
|
+
};
|
|
312
|
+
disabled: {
|
|
313
|
+
type: BooleanConstructor;
|
|
314
|
+
default: boolean;
|
|
315
|
+
};
|
|
316
|
+
color: {
|
|
317
|
+
type: () => NeonFunctionalColor;
|
|
318
|
+
default: null;
|
|
319
|
+
};
|
|
320
|
+
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
321
|
+
expanded: {
|
|
322
|
+
type: BooleanConstructor;
|
|
323
|
+
default: boolean;
|
|
324
|
+
};
|
|
325
|
+
inverse: {
|
|
326
|
+
type: BooleanConstructor;
|
|
327
|
+
default: boolean;
|
|
328
|
+
};
|
|
329
|
+
disabled: {
|
|
330
|
+
type: BooleanConstructor;
|
|
331
|
+
default: boolean;
|
|
332
|
+
};
|
|
333
|
+
color: {
|
|
334
|
+
type: () => NeonFunctionalColor;
|
|
335
|
+
default: null;
|
|
336
|
+
};
|
|
337
|
+
}>> & Readonly<{}>, {
|
|
338
|
+
color: NeonFunctionalColor;
|
|
339
|
+
inverse: boolean;
|
|
340
|
+
disabled: boolean;
|
|
341
|
+
expanded: boolean;
|
|
342
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
343
|
+
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
344
|
+
name: {
|
|
345
|
+
type: StringConstructor;
|
|
346
|
+
required: true;
|
|
347
|
+
};
|
|
348
|
+
id: {
|
|
349
|
+
type: StringConstructor;
|
|
350
|
+
default: null;
|
|
351
|
+
};
|
|
352
|
+
color: {
|
|
353
|
+
type: () => NeonFunctionalColor;
|
|
354
|
+
default: null; /**
|
|
355
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
356
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
357
|
+
* array.
|
|
358
|
+
*/
|
|
359
|
+
};
|
|
360
|
+
inverse: {
|
|
361
|
+
type: BooleanConstructor;
|
|
362
|
+
default: boolean;
|
|
363
|
+
};
|
|
364
|
+
disabled: {
|
|
365
|
+
type: BooleanConstructor;
|
|
366
|
+
default: boolean;
|
|
367
|
+
};
|
|
368
|
+
}>, {
|
|
369
|
+
sanitizedAttributes: import("vue").ComputedRef<{
|
|
370
|
+
[x: string]: unknown;
|
|
371
|
+
}>;
|
|
372
|
+
icon: import("vue").ComputedRef<string | undefined>;
|
|
373
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
374
|
+
name: {
|
|
375
|
+
type: StringConstructor;
|
|
376
|
+
required: true;
|
|
377
|
+
};
|
|
378
|
+
id: {
|
|
379
|
+
type: StringConstructor;
|
|
380
|
+
default: null;
|
|
381
|
+
};
|
|
382
|
+
color: {
|
|
383
|
+
type: () => NeonFunctionalColor;
|
|
384
|
+
default: null; /**
|
|
385
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
386
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
387
|
+
* array.
|
|
388
|
+
*/
|
|
389
|
+
};
|
|
390
|
+
inverse: {
|
|
391
|
+
type: BooleanConstructor;
|
|
392
|
+
default: boolean;
|
|
393
|
+
};
|
|
394
|
+
disabled: {
|
|
395
|
+
type: BooleanConstructor;
|
|
396
|
+
default: boolean;
|
|
397
|
+
};
|
|
398
|
+
}>> & Readonly<{}>, {
|
|
399
|
+
color: NeonFunctionalColor;
|
|
400
|
+
id: string;
|
|
401
|
+
inverse: boolean;
|
|
402
|
+
disabled: boolean;
|
|
403
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
404
|
+
NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
405
|
+
href: {
|
|
406
|
+
type: StringConstructor;
|
|
407
|
+
default: null;
|
|
408
|
+
};
|
|
409
|
+
noStyle: {
|
|
410
|
+
type: BooleanConstructor;
|
|
411
|
+
default: boolean;
|
|
412
|
+
};
|
|
413
|
+
outlineStyle: {
|
|
414
|
+
type: () => import("../../../neon").NeonOutlineStyle;
|
|
415
|
+
default: import("../../../neon").NeonOutlineStyle;
|
|
416
|
+
};
|
|
417
|
+
externalIndicator: {
|
|
418
|
+
type: BooleanConstructor;
|
|
419
|
+
default: boolean;
|
|
420
|
+
};
|
|
421
|
+
}>, {
|
|
422
|
+
neonLink: import("vue").Ref<HTMLAnchorElement | null, HTMLAnchorElement | null>;
|
|
423
|
+
routerUrl: import("vue").ComputedRef<string | undefined>;
|
|
424
|
+
sanitizedAttributes: import("vue").ComputedRef<{
|
|
425
|
+
[x: string]: unknown;
|
|
426
|
+
}>;
|
|
427
|
+
activeRoute: import("vue").ComputedRef<boolean | "" | undefined>;
|
|
428
|
+
exactRoute: import("vue").ComputedRef<boolean | "" | undefined>;
|
|
429
|
+
onClick: () => void;
|
|
430
|
+
onSpace: () => Promise<void>;
|
|
431
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
432
|
+
href: {
|
|
433
|
+
type: StringConstructor;
|
|
434
|
+
default: null;
|
|
435
|
+
};
|
|
436
|
+
noStyle: {
|
|
437
|
+
type: BooleanConstructor;
|
|
438
|
+
default: boolean;
|
|
439
|
+
};
|
|
440
|
+
outlineStyle: {
|
|
441
|
+
type: () => import("../../../neon").NeonOutlineStyle;
|
|
442
|
+
default: import("../../../neon").NeonOutlineStyle;
|
|
443
|
+
};
|
|
444
|
+
externalIndicator: {
|
|
445
|
+
type: BooleanConstructor;
|
|
446
|
+
default: boolean;
|
|
447
|
+
};
|
|
448
|
+
}>> & Readonly<{
|
|
449
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
450
|
+
}>, {
|
|
451
|
+
href: string;
|
|
452
|
+
noStyle: boolean;
|
|
453
|
+
outlineStyle: import("../../../neon").NeonOutlineStyle;
|
|
454
|
+
externalIndicator: boolean;
|
|
455
|
+
}, {}, {
|
|
456
|
+
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
457
|
+
name: {
|
|
458
|
+
type: StringConstructor;
|
|
459
|
+
required: true;
|
|
460
|
+
};
|
|
461
|
+
id: {
|
|
462
|
+
type: StringConstructor;
|
|
463
|
+
default: null;
|
|
464
|
+
};
|
|
465
|
+
color: {
|
|
466
|
+
type: () => NeonFunctionalColor;
|
|
467
|
+
default: null; /**
|
|
468
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
469
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
470
|
+
* array.
|
|
471
|
+
*/
|
|
472
|
+
};
|
|
473
|
+
inverse: {
|
|
474
|
+
type: BooleanConstructor;
|
|
475
|
+
default: boolean;
|
|
476
|
+
};
|
|
477
|
+
disabled: {
|
|
478
|
+
type: BooleanConstructor;
|
|
479
|
+
default: boolean;
|
|
480
|
+
};
|
|
481
|
+
}>, {
|
|
482
|
+
sanitizedAttributes: import("vue").ComputedRef<{
|
|
483
|
+
[x: string]: unknown;
|
|
484
|
+
}>;
|
|
485
|
+
icon: import("vue").ComputedRef<string | undefined>;
|
|
486
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
487
|
+
name: {
|
|
488
|
+
type: StringConstructor;
|
|
489
|
+
required: true;
|
|
490
|
+
};
|
|
491
|
+
id: {
|
|
492
|
+
type: StringConstructor;
|
|
493
|
+
default: null;
|
|
494
|
+
};
|
|
495
|
+
color: {
|
|
496
|
+
type: () => NeonFunctionalColor;
|
|
497
|
+
default: null; /**
|
|
498
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
499
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
500
|
+
* array.
|
|
501
|
+
*/
|
|
502
|
+
};
|
|
503
|
+
inverse: {
|
|
504
|
+
type: BooleanConstructor;
|
|
505
|
+
default: boolean;
|
|
506
|
+
};
|
|
507
|
+
disabled: {
|
|
508
|
+
type: BooleanConstructor;
|
|
509
|
+
default: boolean;
|
|
510
|
+
};
|
|
511
|
+
}>> & Readonly<{}>, {
|
|
512
|
+
color: NeonFunctionalColor;
|
|
513
|
+
id: string;
|
|
514
|
+
inverse: boolean;
|
|
515
|
+
disabled: boolean;
|
|
516
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
517
|
+
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
518
|
+
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
519
|
+
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
520
|
+
name: {
|
|
521
|
+
type: StringConstructor;
|
|
522
|
+
required: true;
|
|
523
|
+
};
|
|
524
|
+
id: {
|
|
525
|
+
type: StringConstructor;
|
|
526
|
+
default: null;
|
|
527
|
+
};
|
|
528
|
+
color: {
|
|
529
|
+
type: () => NeonFunctionalColor;
|
|
530
|
+
default: null; /**
|
|
531
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
532
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
533
|
+
* array.
|
|
534
|
+
*/
|
|
535
|
+
};
|
|
536
|
+
inverse: {
|
|
537
|
+
type: BooleanConstructor;
|
|
538
|
+
default: boolean;
|
|
539
|
+
};
|
|
540
|
+
disabled: {
|
|
541
|
+
type: BooleanConstructor;
|
|
542
|
+
default: boolean;
|
|
543
|
+
};
|
|
544
|
+
}>, {
|
|
545
|
+
sanitizedAttributes: import("vue").ComputedRef<{
|
|
546
|
+
[x: string]: unknown;
|
|
547
|
+
}>;
|
|
548
|
+
icon: import("vue").ComputedRef<string | undefined>;
|
|
549
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
550
|
+
name: {
|
|
551
|
+
type: StringConstructor;
|
|
552
|
+
required: true;
|
|
553
|
+
};
|
|
554
|
+
id: {
|
|
555
|
+
type: StringConstructor;
|
|
556
|
+
default: null;
|
|
557
|
+
};
|
|
558
|
+
color: {
|
|
559
|
+
type: () => NeonFunctionalColor;
|
|
560
|
+
default: null; /**
|
|
561
|
+
* Emitted when a CTA button is clicked. The index of the button in the ctas array is passed as the first argument.
|
|
562
|
+
* @type {number} The index of the button clicked. This corresponds to the index of the button in the ctas property
|
|
563
|
+
* array.
|
|
564
|
+
*/
|
|
565
|
+
};
|
|
566
|
+
inverse: {
|
|
567
|
+
type: BooleanConstructor;
|
|
568
|
+
default: boolean;
|
|
569
|
+
};
|
|
570
|
+
disabled: {
|
|
571
|
+
type: BooleanConstructor;
|
|
572
|
+
default: boolean;
|
|
573
|
+
};
|
|
574
|
+
}>> & Readonly<{}>, {
|
|
575
|
+
color: NeonFunctionalColor;
|
|
576
|
+
id: string;
|
|
577
|
+
inverse: boolean;
|
|
578
|
+
disabled: boolean;
|
|
579
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
580
|
+
NeonInline: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
581
|
+
gap: {
|
|
582
|
+
type: () => import("../../../neon").NeonLayoutSize;
|
|
583
|
+
default: () => import("../../../neon").NeonLayoutSize;
|
|
584
|
+
};
|
|
585
|
+
breakpoint: {
|
|
586
|
+
type: () => import("../../../neon").NeonResponsive;
|
|
587
|
+
};
|
|
588
|
+
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
589
|
+
gap: {
|
|
590
|
+
type: () => import("../../../neon").NeonLayoutSize;
|
|
591
|
+
default: () => import("../../../neon").NeonLayoutSize;
|
|
592
|
+
};
|
|
593
|
+
breakpoint: {
|
|
594
|
+
type: () => import("../../../neon").NeonResponsive;
|
|
595
|
+
};
|
|
596
|
+
}>> & Readonly<{}>, {
|
|
597
|
+
gap: import("../../../neon").NeonLayoutSize;
|
|
598
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
599
|
+
NeonStack: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
600
|
+
gap: {
|
|
601
|
+
type: () => import("../../../neon").NeonLayoutSize;
|
|
602
|
+
default: () => import("../../../neon").NeonLayoutSize;
|
|
603
|
+
};
|
|
604
|
+
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
605
|
+
gap: {
|
|
606
|
+
type: () => import("../../../neon").NeonLayoutSize;
|
|
607
|
+
default: () => import("../../../neon").NeonLayoutSize;
|
|
608
|
+
};
|
|
609
|
+
}>> & Readonly<{}>, {
|
|
610
|
+
gap: import("../../../neon").NeonLayoutSize;
|
|
611
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
612
|
+
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
613
|
+
export default _default;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Describes the different layout types for the <a href="/presentation/empty-state">NeonEmptyState</a> component.
|
|
3
|
+
*/
|
|
4
|
+
export declare enum NeonEmptyStateType {
|
|
5
|
+
/** Standard empty state layout. */
|
|
6
|
+
EmptyState = "empty-state",
|
|
7
|
+
/** Error state layout. */
|
|
8
|
+
Error = "error"
|
|
9
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import type { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';
|
|
2
|
+
import type { NeonButtonStyle } from './NeonButtonStyle';
|
|
3
|
+
/**
|
|
4
|
+
* Model describing a button
|
|
5
|
+
*/
|
|
6
|
+
export interface NeonButtonModel {
|
|
7
|
+
/** The button label */
|
|
8
|
+
label?: string;
|
|
9
|
+
/** Button url (renders button as an anchor element) */
|
|
10
|
+
href?: string;
|
|
11
|
+
/** button disabled state */
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
/** Button icon */
|
|
14
|
+
icon?: string;
|
|
15
|
+
/** Button color */
|
|
16
|
+
color?: NeonFunctionalColor;
|
|
17
|
+
/** Button style */
|
|
18
|
+
style?: NeonButtonStyle;
|
|
19
|
+
}
|
package/dist/src/neon.d.ts
CHANGED
|
@@ -20,6 +20,7 @@ export { default as NeonDrawer } from './components/layout/drawer/NeonDrawer.vue
|
|
|
20
20
|
export { default as NeonDropdown } from './components/presentation/dropdown/NeonDropdown.vue';
|
|
21
21
|
export { default as NeonDropdownMenu } from './components/navigation/dropdown-menu/NeonDropdownMenu.vue';
|
|
22
22
|
export { default as NeonDropZone } from './components/user-input/drop-zone/NeonDropZone.vue';
|
|
23
|
+
export { default as NeonEmptyState } from './components/presentation/empty-state/NeonEmptyState.vue';
|
|
23
24
|
export { default as NeonExpansionIndicator } from './components/presentation/expansion-indicator/NeonExpansionIndicator.vue';
|
|
24
25
|
export { default as NeonExpansionPanel } from './components/presentation/expansion-panel/NeonExpansionPanel.vue';
|
|
25
26
|
export { default as NeonFieldGroup } from './components/user-input/field-group/NeonFieldGroup.vue';
|
|
@@ -42,6 +43,7 @@ export { default as NeonLabelledContent } from './components/presentation/labell
|
|
|
42
43
|
export { default as NeonLinearProgress } from './components/feedback/linear-progress/NeonLinearProgress.vue';
|
|
43
44
|
export { default as NeonLink } from './components/navigation/link/NeonLink.vue';
|
|
44
45
|
export { default as NeonList } from './components/user-input/list/NeonList.vue';
|
|
46
|
+
export { default as NeonListLayout } from './components/layout/list-layout/NeonListLayout.vue';
|
|
45
47
|
export { default as NeonMenu } from './components/navigation/menu/NeonMenu.vue';
|
|
46
48
|
export { default as NeonMobileMenu } from './components/navigation/mobile-menu/NeonMobileMenu.vue';
|
|
47
49
|
export { default as NeonModal } from './components/layout/modal/NeonModal.vue';
|
|
@@ -86,6 +88,7 @@ export type { NeonBannerMessage } from '@/model/feedback/banner/NeonBannerMessag
|
|
|
86
88
|
export type { NeonBannerModel } from '@/model/feedback/banner/NeonBannerModel';
|
|
87
89
|
export type { NeonBreadcrumbLink } from './model/navigation/breadcrumbs/NeonBreadcrumbLink';
|
|
88
90
|
export { NeonBreadcrumbResponsiveStyle } from './model/navigation/breadcrumbs/NeonBreadcrumbResponsiveStyle';
|
|
91
|
+
export type { NeonButtonModel } from './model/user-input/button/NeonButtonModel';
|
|
89
92
|
export { NeonButtonSize } from '@/model/user-input/button/NeonButtonSize';
|
|
90
93
|
export { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';
|
|
91
94
|
export { NeonButtonType } from '@/model/user-input/button/NeonButtonType';
|
|
@@ -99,6 +102,7 @@ export type { NeonDropdownMenuItem } from '@/model/presentation/dropdown/NeonDro
|
|
|
99
102
|
export { NeonDropdownPlacement } from '@/model/presentation/dropdown/NeonDropdownPlacement';
|
|
100
103
|
export type { NeonDropdownPlacementObject } from '@/model/presentation/dropdown/NeonDropdownPlacementObject';
|
|
101
104
|
export { NeonDropdownStyle } from '@/model/presentation/dropdown/NeonDropdownStyle';
|
|
105
|
+
export { NeonEmptyStateType } from './model/presentation/empty-state/NeonEmptyStateType';
|
|
102
106
|
export type { NeonFilterItem } from './model/user-input/filter/NeonFilterItem';
|
|
103
107
|
export type { NeonFilterListItem } from '@/model/user-input/filter-list/NeonFilterListItem';
|
|
104
108
|
export { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';
|