@dropi/ui 0.1.48 → 0.1.49
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/cjs/dropi-alert-modal.cjs.entry.js +14 -37
- package/dist/cjs/dropi-empty-state.cjs.entry.js +87 -10
- package/dist/collection/components/dropi-alert-modal/dropi-alert-modal.js +24 -65
- package/dist/collection/components/dropi-empty-state/dropi-empty-state.js +24 -23
- package/dist/collection/utils/illustration-map.generated.js +73 -0
- package/dist/collection/utils/lottie-map.generated.js +10 -0
- package/dist/components/dropi-alert-modal.js +1 -1
- package/dist/components/dropi-empty-state.js +1 -1
- package/dist/components/p-B9-h_ikq.js +1 -0
- package/dist/components/p-B9rJd-Rf.js +1 -0
- package/dist/components/p-CCZ6rIo5.js +1 -0
- package/dist/components/p-D7GP-lmt.js +1 -0
- package/dist/components/p-DYAsdhfM.js +1 -0
- package/dist/components/p-Dnx3uXgo.js +1 -0
- package/dist/components/p-RQjw5hdz.js +1 -0
- package/dist/docs.json +31 -45
- package/dist/dropi-ui/dropi-ui.esm.js +1 -1
- package/dist/dropi-ui/p-0086fbc8.entry.js +1 -0
- package/dist/dropi-ui/p-04cd97a1.entry.js +1 -0
- package/dist/dropi-ui/p-11b83d87.entry.js +1 -0
- package/dist/dropi-ui/p-1c3a5cee.entry.js +1 -0
- package/dist/dropi-ui/p-3d7a3ea5.entry.js +1 -0
- package/dist/dropi-ui/p-68891c64.entry.js +1 -0
- package/dist/dropi-ui/p-ca7c025d.entry.js +1 -0
- package/dist/dropi-ui/p-ed4bd1cc.entry.js +1 -0
- package/dist/esm/dropi-alert-modal.entry.js +15 -38
- package/dist/esm/dropi-empty-state.entry.js +88 -11
- package/dist/types/components/dropi-alert-modal/dropi-alert-modal.d.ts +1 -39
- package/dist/types/components/dropi-empty-state/dropi-empty-state.d.ts +7 -13
- package/dist/types/components.d.ts +8 -105
- package/dist/types/utils/illustration-map.generated.d.ts +1 -0
- package/dist/types/utils/lottie-map.generated.d.ts +1 -0
- package/hydrate/index.js +101 -60
- package/hydrate/index.mjs +101 -60
- package/package.json +1 -1
- package/scripts/generate-illustration-map.js +37 -0
- package/scripts/generate-lottie-map.js +49 -0
|
@@ -202,88 +202,66 @@ export namespace Components {
|
|
|
202
202
|
*/
|
|
203
203
|
"visible": boolean;
|
|
204
204
|
}
|
|
205
|
-
/**
|
|
206
|
-
* @component dropi-alert-modal
|
|
207
|
-
* Confirmation/alert modal with Lottie animation, title, message and action buttons.
|
|
208
|
-
* Uses dropi-modal internally.
|
|
209
|
-
* @example const el = document.querySelector('dropi-alert-modal');
|
|
210
|
-
* el.visible = true;
|
|
211
|
-
*/
|
|
212
205
|
interface DropiAlertModal {
|
|
213
206
|
/**
|
|
214
|
-
* Base z-index for the internal modal overlay (matches Angular `baseZIndex`)
|
|
215
207
|
* @default 0
|
|
216
208
|
*/
|
|
217
209
|
"baseZIndex": number;
|
|
218
210
|
/**
|
|
219
|
-
* Show close icon in header
|
|
220
211
|
* @default false
|
|
221
212
|
*/
|
|
222
213
|
"closable": boolean;
|
|
223
214
|
/**
|
|
224
|
-
* Hide action buttons
|
|
225
215
|
* @default true
|
|
226
216
|
*/
|
|
227
217
|
"displayButtons": boolean;
|
|
228
218
|
"hide": () => Promise<void>;
|
|
229
219
|
/**
|
|
230
|
-
* When true, primary button does NOT auto-close the modal (matches Angular `isStep`). Useful for step-by-step flows.
|
|
231
220
|
* @default false
|
|
232
221
|
*/
|
|
233
222
|
"isStep": boolean;
|
|
234
223
|
/**
|
|
235
|
-
* Use White Label (MB) illustration style instead of Lottie animation.
|
|
236
224
|
* @default false
|
|
237
225
|
*/
|
|
238
226
|
"isWhiteLabel": boolean;
|
|
239
227
|
/**
|
|
240
|
-
* Show loading state with loading.json Lottie
|
|
241
228
|
* @default false
|
|
242
229
|
*/
|
|
243
230
|
"loading": boolean;
|
|
244
231
|
/**
|
|
245
|
-
* Loading message
|
|
246
232
|
* @default 'Please wait a moment'
|
|
247
233
|
*/
|
|
248
234
|
"loadingMessage": string;
|
|
249
235
|
/**
|
|
250
|
-
* Loading title
|
|
251
236
|
* @default 'Loading'
|
|
252
237
|
*/
|
|
253
238
|
"loadingTitle": string;
|
|
254
239
|
/**
|
|
255
|
-
* Body message
|
|
256
240
|
* @default ''
|
|
257
241
|
*/
|
|
258
242
|
"message": string;
|
|
259
243
|
/**
|
|
260
|
-
* Convenience object prop — matches Angular `params: ModalParams`. Fields: tittle, type, message, primaryButton, secondaryButton, loadingTitle, loadingMessage, closable, displayButtons. When provided, its values override the corresponding individual props.
|
|
261
244
|
* @default null
|
|
262
245
|
*/
|
|
263
246
|
"params": any;
|
|
264
247
|
/**
|
|
265
|
-
* Primary button label
|
|
266
248
|
* @default 'Accept'
|
|
267
249
|
*/
|
|
268
250
|
"primaryButton": string;
|
|
269
251
|
/**
|
|
270
|
-
* Secondary button label (hidden if empty)
|
|
271
252
|
* @default ''
|
|
272
253
|
*/
|
|
273
254
|
"secondaryButton": string;
|
|
274
255
|
"show": () => Promise<void>;
|
|
275
256
|
/**
|
|
276
|
-
* Bold title
|
|
277
257
|
* @default ''
|
|
278
258
|
*/
|
|
279
259
|
"tittle": string;
|
|
280
260
|
/**
|
|
281
|
-
* Modal type — determines Lottie animation
|
|
282
261
|
* @default 'question'
|
|
283
262
|
*/
|
|
284
263
|
"type": AlertModalType;
|
|
285
264
|
/**
|
|
286
|
-
* Controls visibility
|
|
287
265
|
* @default false
|
|
288
266
|
*/
|
|
289
267
|
"visible": any;
|
|
@@ -1091,48 +1069,40 @@ export namespace Components {
|
|
|
1091
1069
|
*/
|
|
1092
1070
|
"valueModel": string;
|
|
1093
1071
|
}
|
|
1094
|
-
/**
|
|
1095
|
-
* @component dropi-empty-state
|
|
1096
|
-
* Empty state illustration with title, description and optional action button.
|
|
1097
|
-
*/
|
|
1098
1072
|
interface DropiEmptyState {
|
|
1099
1073
|
/**
|
|
1100
|
-
* Icon name for
|
|
1074
|
+
* Icon name for the action button
|
|
1101
1075
|
* @default ''
|
|
1102
1076
|
*/
|
|
1103
1077
|
"buttonIcon": string;
|
|
1104
1078
|
/**
|
|
1105
|
-
* Severity for the action button — matches Angular 'buttonSeverity'
|
|
1106
1079
|
* @default 'tertiary'
|
|
1107
1080
|
*/
|
|
1108
1081
|
"buttonSeverity": 'primary' | 'secondary' | 'tertiary';
|
|
1109
1082
|
/**
|
|
1110
|
-
* Primary action button label (empty = hidden)
|
|
1083
|
+
* Primary action button label (empty = hidden)
|
|
1111
1084
|
* @default ''
|
|
1112
1085
|
*/
|
|
1113
1086
|
"buttonText": string;
|
|
1114
1087
|
/**
|
|
1115
|
-
* Description text
|
|
1116
1088
|
* @default ''
|
|
1117
1089
|
*/
|
|
1118
1090
|
"description": string;
|
|
1119
1091
|
/**
|
|
1120
|
-
*
|
|
1092
|
+
* Built-in illustration state
|
|
1121
1093
|
* @default 'default'
|
|
1122
1094
|
*/
|
|
1123
1095
|
"dropiIcon": 'default' | 'loading' | 'sorry' | 'love' | 'success' | 'error' | 'warning' | 'info';
|
|
1124
1096
|
/**
|
|
1125
|
-
* Alt text for the image
|
|
1126
1097
|
* @default 'Sin resultados'
|
|
1127
1098
|
*/
|
|
1128
1099
|
"imageAlt": string;
|
|
1129
1100
|
/**
|
|
1130
|
-
* URL of
|
|
1101
|
+
* URL of an external illustration image (overrides dropiIcon)
|
|
1131
1102
|
* @default ''
|
|
1132
1103
|
*/
|
|
1133
1104
|
"imageUrl": string;
|
|
1134
1105
|
/**
|
|
1135
|
-
* Title text (matches Angular 'title')
|
|
1136
1106
|
* @default ''
|
|
1137
1107
|
*/
|
|
1138
1108
|
"title": string;
|
|
@@ -3020,13 +2990,6 @@ declare global {
|
|
|
3020
2990
|
"dropiVisibleChange": boolean;
|
|
3021
2991
|
"dropiHide": void;
|
|
3022
2992
|
}
|
|
3023
|
-
/**
|
|
3024
|
-
* @component dropi-alert-modal
|
|
3025
|
-
* Confirmation/alert modal with Lottie animation, title, message and action buttons.
|
|
3026
|
-
* Uses dropi-modal internally.
|
|
3027
|
-
* @example const el = document.querySelector('dropi-alert-modal');
|
|
3028
|
-
* el.visible = true;
|
|
3029
|
-
*/
|
|
3030
2993
|
interface HTMLDropiAlertModalElement extends Components.DropiAlertModal, HTMLStencilElement {
|
|
3031
2994
|
addEventListener<K extends keyof HTMLDropiAlertModalElementEventMap>(type: K, listener: (this: HTMLDropiAlertModalElement, ev: DropiAlertModalCustomEvent<HTMLDropiAlertModalElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
3032
2995
|
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
@@ -3472,10 +3435,6 @@ declare global {
|
|
|
3472
3435
|
interface HTMLDropiEmptyStateElementEventMap {
|
|
3473
3436
|
"buttonClickEvent": void;
|
|
3474
3437
|
}
|
|
3475
|
-
/**
|
|
3476
|
-
* @component dropi-empty-state
|
|
3477
|
-
* Empty state illustration with title, description and optional action button.
|
|
3478
|
-
*/
|
|
3479
3438
|
interface HTMLDropiEmptyStateElement extends Components.DropiEmptyState, HTMLStencilElement {
|
|
3480
3439
|
addEventListener<K extends keyof HTMLDropiEmptyStateElementEventMap>(type: K, listener: (this: HTMLDropiEmptyStateElement, ev: DropiEmptyStateCustomEvent<HTMLDropiEmptyStateElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
3481
3440
|
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
@@ -4427,102 +4386,68 @@ declare namespace LocalJSX {
|
|
|
4427
4386
|
*/
|
|
4428
4387
|
"visible"?: boolean;
|
|
4429
4388
|
}
|
|
4430
|
-
/**
|
|
4431
|
-
* @component dropi-alert-modal
|
|
4432
|
-
* Confirmation/alert modal with Lottie animation, title, message and action buttons.
|
|
4433
|
-
* Uses dropi-modal internally.
|
|
4434
|
-
* @example const el = document.querySelector('dropi-alert-modal');
|
|
4435
|
-
* el.visible = true;
|
|
4436
|
-
*/
|
|
4437
4389
|
interface DropiAlertModal {
|
|
4438
4390
|
/**
|
|
4439
|
-
* Base z-index for the internal modal overlay (matches Angular `baseZIndex`)
|
|
4440
4391
|
* @default 0
|
|
4441
4392
|
*/
|
|
4442
4393
|
"baseZIndex"?: number;
|
|
4443
4394
|
/**
|
|
4444
|
-
* Show close icon in header
|
|
4445
4395
|
* @default false
|
|
4446
4396
|
*/
|
|
4447
4397
|
"closable"?: boolean;
|
|
4448
4398
|
/**
|
|
4449
|
-
* Hide action buttons
|
|
4450
4399
|
* @default true
|
|
4451
4400
|
*/
|
|
4452
4401
|
"displayButtons"?: boolean;
|
|
4453
4402
|
/**
|
|
4454
|
-
* When true, primary button does NOT auto-close the modal (matches Angular `isStep`). Useful for step-by-step flows.
|
|
4455
4403
|
* @default false
|
|
4456
4404
|
*/
|
|
4457
4405
|
"isStep"?: boolean;
|
|
4458
4406
|
/**
|
|
4459
|
-
* Use White Label (MB) illustration style instead of Lottie animation.
|
|
4460
4407
|
* @default false
|
|
4461
4408
|
*/
|
|
4462
4409
|
"isWhiteLabel"?: boolean;
|
|
4463
4410
|
/**
|
|
4464
|
-
* Show loading state with loading.json Lottie
|
|
4465
4411
|
* @default false
|
|
4466
4412
|
*/
|
|
4467
4413
|
"loading"?: boolean;
|
|
4468
4414
|
/**
|
|
4469
|
-
* Loading message
|
|
4470
4415
|
* @default 'Please wait a moment'
|
|
4471
4416
|
*/
|
|
4472
4417
|
"loadingMessage"?: string;
|
|
4473
4418
|
/**
|
|
4474
|
-
* Loading title
|
|
4475
4419
|
* @default 'Loading'
|
|
4476
4420
|
*/
|
|
4477
4421
|
"loadingTitle"?: string;
|
|
4478
4422
|
/**
|
|
4479
|
-
* Body message
|
|
4480
4423
|
* @default ''
|
|
4481
4424
|
*/
|
|
4482
4425
|
"message"?: string;
|
|
4483
|
-
/**
|
|
4484
|
-
* Emitted when modal is hidden — matches Angular 'onHide'
|
|
4485
|
-
*/
|
|
4486
4426
|
"onDropiHide"?: (event: DropiAlertModalCustomEvent<void>) => void;
|
|
4487
|
-
/**
|
|
4488
|
-
* Emitted when primary button is clicked — matches Angular 'primaryButtonEvent'
|
|
4489
|
-
*/
|
|
4490
4427
|
"onDropiPrimaryClick"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
|
|
4491
|
-
/**
|
|
4492
|
-
* Emitted when secondary button is clicked — matches Angular 'secondaryButtonEvent'
|
|
4493
|
-
*/
|
|
4494
4428
|
"onDropiSecondaryClick"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
|
|
4495
|
-
/**
|
|
4496
|
-
* Emitted when modal open state changes — matches Angular 'modalOpenChange'
|
|
4497
|
-
*/
|
|
4498
4429
|
"onDropiVisibleChange"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
|
|
4499
4430
|
/**
|
|
4500
|
-
* Convenience object prop — matches Angular `params: ModalParams`. Fields: tittle, type, message, primaryButton, secondaryButton, loadingTitle, loadingMessage, closable, displayButtons. When provided, its values override the corresponding individual props.
|
|
4501
4431
|
* @default null
|
|
4502
4432
|
*/
|
|
4503
4433
|
"params"?: any;
|
|
4504
4434
|
/**
|
|
4505
|
-
* Primary button label
|
|
4506
4435
|
* @default 'Accept'
|
|
4507
4436
|
*/
|
|
4508
4437
|
"primaryButton"?: string;
|
|
4509
4438
|
/**
|
|
4510
|
-
* Secondary button label (hidden if empty)
|
|
4511
4439
|
* @default ''
|
|
4512
4440
|
*/
|
|
4513
4441
|
"secondaryButton"?: string;
|
|
4514
4442
|
/**
|
|
4515
|
-
* Bold title
|
|
4516
4443
|
* @default ''
|
|
4517
4444
|
*/
|
|
4518
4445
|
"tittle"?: string;
|
|
4519
4446
|
/**
|
|
4520
|
-
* Modal type — determines Lottie animation
|
|
4521
4447
|
* @default 'question'
|
|
4522
4448
|
*/
|
|
4523
4449
|
"type"?: AlertModalType;
|
|
4524
4450
|
/**
|
|
4525
|
-
* Controls visibility
|
|
4526
4451
|
* @default false
|
|
4527
4452
|
*/
|
|
4528
4453
|
"visible"?: any;
|
|
@@ -5457,52 +5382,41 @@ declare namespace LocalJSX {
|
|
|
5457
5382
|
*/
|
|
5458
5383
|
"valueModel"?: string;
|
|
5459
5384
|
}
|
|
5460
|
-
/**
|
|
5461
|
-
* @component dropi-empty-state
|
|
5462
|
-
* Empty state illustration with title, description and optional action button.
|
|
5463
|
-
*/
|
|
5464
5385
|
interface DropiEmptyState {
|
|
5465
5386
|
/**
|
|
5466
|
-
* Icon name for
|
|
5387
|
+
* Icon name for the action button
|
|
5467
5388
|
* @default ''
|
|
5468
5389
|
*/
|
|
5469
5390
|
"buttonIcon"?: string;
|
|
5470
5391
|
/**
|
|
5471
|
-
* Severity for the action button — matches Angular 'buttonSeverity'
|
|
5472
5392
|
* @default 'tertiary'
|
|
5473
5393
|
*/
|
|
5474
5394
|
"buttonSeverity"?: 'primary' | 'secondary' | 'tertiary';
|
|
5475
5395
|
/**
|
|
5476
|
-
* Primary action button label (empty = hidden)
|
|
5396
|
+
* Primary action button label (empty = hidden)
|
|
5477
5397
|
* @default ''
|
|
5478
5398
|
*/
|
|
5479
5399
|
"buttonText"?: string;
|
|
5480
5400
|
/**
|
|
5481
|
-
* Description text
|
|
5482
5401
|
* @default ''
|
|
5483
5402
|
*/
|
|
5484
5403
|
"description"?: string;
|
|
5485
5404
|
/**
|
|
5486
|
-
*
|
|
5405
|
+
* Built-in illustration state
|
|
5487
5406
|
* @default 'default'
|
|
5488
5407
|
*/
|
|
5489
5408
|
"dropiIcon"?: 'default' | 'loading' | 'sorry' | 'love' | 'success' | 'error' | 'warning' | 'info';
|
|
5490
5409
|
/**
|
|
5491
|
-
* Alt text for the image
|
|
5492
5410
|
* @default 'Sin resultados'
|
|
5493
5411
|
*/
|
|
5494
5412
|
"imageAlt"?: string;
|
|
5495
5413
|
/**
|
|
5496
|
-
* URL of
|
|
5414
|
+
* URL of an external illustration image (overrides dropiIcon)
|
|
5497
5415
|
* @default ''
|
|
5498
5416
|
*/
|
|
5499
5417
|
"imageUrl"?: string;
|
|
5500
|
-
/**
|
|
5501
|
-
* Emitted when button is clicked — matches Angular 'buttonClickEvent'
|
|
5502
|
-
*/
|
|
5503
5418
|
"onButtonClickEvent"?: (event: DropiEmptyStateCustomEvent<void>) => void;
|
|
5504
5419
|
/**
|
|
5505
|
-
* Title text (matches Angular 'title')
|
|
5506
5420
|
* @default ''
|
|
5507
5421
|
*/
|
|
5508
5422
|
"title"?: string;
|
|
@@ -8065,13 +7979,6 @@ declare module "@stencil/core" {
|
|
|
8065
7979
|
* Legacy alert component for backward compatibility with Angular core.
|
|
8066
7980
|
*/
|
|
8067
7981
|
"dropi-alert-legacy": LocalJSX.IntrinsicElements["dropi-alert-legacy"] & JSXBase.HTMLAttributes<HTMLDropiAlertLegacyElement>;
|
|
8068
|
-
/**
|
|
8069
|
-
* @component dropi-alert-modal
|
|
8070
|
-
* Confirmation/alert modal with Lottie animation, title, message and action buttons.
|
|
8071
|
-
* Uses dropi-modal internally.
|
|
8072
|
-
* @example const el = document.querySelector('dropi-alert-modal');
|
|
8073
|
-
* el.visible = true;
|
|
8074
|
-
*/
|
|
8075
7982
|
"dropi-alert-modal": LocalJSX.IntrinsicElements["dropi-alert-modal"] & JSXBase.HTMLAttributes<HTMLDropiAlertModalElement>;
|
|
8076
7983
|
/**
|
|
8077
7984
|
* @component dropi-avatars
|
|
@@ -8198,10 +8105,6 @@ declare module "@stencil/core" {
|
|
|
8198
8105
|
* Pass options as an array (JS) or JSON string.
|
|
8199
8106
|
*/
|
|
8200
8107
|
"dropi-dropdown": LocalJSX.IntrinsicElements["dropi-dropdown"] & JSXBase.HTMLAttributes<HTMLDropiDropdownElement>;
|
|
8201
|
-
/**
|
|
8202
|
-
* @component dropi-empty-state
|
|
8203
|
-
* Empty state illustration with title, description and optional action button.
|
|
8204
|
-
*/
|
|
8205
8108
|
"dropi-empty-state": LocalJSX.IntrinsicElements["dropi-empty-state"] & JSXBase.HTMLAttributes<HTMLDropiEmptyStateElement>;
|
|
8206
8109
|
/**
|
|
8207
8110
|
* @component dropi-favorite-button
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const ILLUSTRATION_MAP: Record<string, string>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const LOTTIE_MAP: Record<string, string>;
|