@juligc99/loro-ui 0.0.14 → 0.0.15
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/fesm2022/juligc99-loro-ui.mjs +244 -1994
- package/fesm2022/juligc99-loro-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/types/juligc99-loro-ui.d.ts +286 -156
package/package.json
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { LoroIconName as LoroIconName$1, LoroIconSize as LoroIconSize$1, LoroIconRenderMode as LoroIconRenderMode$1, LoroIconColor as LoroIconColor$1 } from '@loro-ui/components/resources/loro-icon';
|
|
2
3
|
import * as _juligc99_loro_ui from '@juligc99/loro-ui';
|
|
3
4
|
import { FormValueControl, WithOptionalFieldTree, ValidationError, FormCheckboxControl } from '@angular/forms/signals';
|
|
4
5
|
|
|
@@ -7,6 +8,249 @@ declare class Footer {
|
|
|
7
8
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Footer, "loro-footer", never, {}, {}, never, never, true, never>;
|
|
8
9
|
}
|
|
9
10
|
|
|
11
|
+
declare class LoroAccordion {
|
|
12
|
+
title: _angular_core.InputSignal<string>;
|
|
13
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
14
|
+
expanded: _angular_core.InputSignal<boolean>;
|
|
15
|
+
expandedChange: _angular_core.OutputEmitterRef<boolean>;
|
|
16
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAccordion, never>;
|
|
17
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroAccordion, "loro-accordion", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expandedChange": "expandedChange"; }, never, ["*"], true, never>;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
interface LoroAppNavItem {
|
|
21
|
+
id: string;
|
|
22
|
+
label: string;
|
|
23
|
+
icon: LoroIconName$1;
|
|
24
|
+
active?: boolean;
|
|
25
|
+
badge?: string | number | null;
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
}
|
|
28
|
+
interface LoroAppNavClick {
|
|
29
|
+
item: LoroAppNavItem;
|
|
30
|
+
section: 'main' | 'utility';
|
|
31
|
+
}
|
|
32
|
+
declare class LoroAppNav {
|
|
33
|
+
private readonly haptics;
|
|
34
|
+
private readonly draggedMobileIndex;
|
|
35
|
+
private readonly mobilePointerActive;
|
|
36
|
+
private activePointerId;
|
|
37
|
+
private suppressNextMobileClick;
|
|
38
|
+
items: _angular_core.InputSignal<LoroAppNavItem[]>;
|
|
39
|
+
utilityItems: _angular_core.InputSignal<LoroAppNavItem[]>;
|
|
40
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
41
|
+
showUtilityItems: _angular_core.InputSignal<boolean>;
|
|
42
|
+
compactDesktop: _angular_core.InputSignal<boolean>;
|
|
43
|
+
itemClick: _angular_core.OutputEmitterRef<LoroAppNavItem>;
|
|
44
|
+
utilityItemClick: _angular_core.OutputEmitterRef<LoroAppNavItem>;
|
|
45
|
+
navItemClick: _angular_core.OutputEmitterRef<LoroAppNavClick>;
|
|
46
|
+
protected readonly desktopItems: _angular_core.Signal<LoroAppNavItem[]>;
|
|
47
|
+
protected readonly mobileItems: _angular_core.Signal<LoroAppNavItem[]>;
|
|
48
|
+
protected readonly mobileVisualSlotCount: _angular_core.Signal<number>;
|
|
49
|
+
private readonly selectedMobileIndex;
|
|
50
|
+
protected readonly mobileSliderPosition: _angular_core.Signal<number>;
|
|
51
|
+
protected readonly isMobileDragging: _angular_core.Signal<boolean>;
|
|
52
|
+
protected readonly mobileItemCount: _angular_core.Signal<number>;
|
|
53
|
+
protected readonly selectedMobileItemId: _angular_core.Signal<string>;
|
|
54
|
+
protected isMobileItemVisualActive(index: number): boolean;
|
|
55
|
+
onMainItemClick(item: LoroAppNavItem): void;
|
|
56
|
+
protected onMobileItemClick(item: LoroAppNavItem): void;
|
|
57
|
+
protected onMobilePointerDown(event: PointerEvent): void;
|
|
58
|
+
protected onMobilePointerMove(event: PointerEvent): void;
|
|
59
|
+
protected onMobilePointerUp(event: PointerEvent): void;
|
|
60
|
+
protected onMobilePointerCancel(event: PointerEvent): void;
|
|
61
|
+
onUtilityItemClick(item: LoroAppNavItem): void;
|
|
62
|
+
private emitMainItem;
|
|
63
|
+
private getMobileVisualSlotPosition;
|
|
64
|
+
protected mobileItemGridColumn(index: number): number;
|
|
65
|
+
private mobileItemIndexToVisualSlot;
|
|
66
|
+
private getNearestEnabledMobileIndex;
|
|
67
|
+
private releaseMobilePointer;
|
|
68
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAppNav, never>;
|
|
69
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroAppNav, "loro-app-nav", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "utilityItems": { "alias": "utilityItems"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "showUtilityItems": { "alias": "showUtilityItems"; "required": false; "isSignal": true; }; "compactDesktop": { "alias": "compactDesktop"; "required": false; "isSignal": true; }; }, { "itemClick": "itemClick"; "utilityItemClick": "utilityItemClick"; "navItemClick": "navItemClick"; }, never, never, true, never>;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
/**
|
|
73
|
+
* LoroButton Type Definitions
|
|
74
|
+
*
|
|
75
|
+
* Centralized type definitions for the LoroButton component.
|
|
76
|
+
* Use these types for consistency across the application.
|
|
77
|
+
*
|
|
78
|
+
* @example
|
|
79
|
+
* const config: LoroButtonConfig = {
|
|
80
|
+
* variant: 'primary',
|
|
81
|
+
* size: 'md',
|
|
82
|
+
* disabled: false,
|
|
83
|
+
* };
|
|
84
|
+
*/
|
|
85
|
+
/**
|
|
86
|
+
* Visual variant style of the button
|
|
87
|
+
* @type {'primary' | 'outline' | 'ghost' | 'danger' | 'soft' | 'social' | 'action' | 'navigation'}
|
|
88
|
+
*/
|
|
89
|
+
type LoroButtonVariant = 'primary' | 'outline' | 'ghost' | 'danger' | 'soft' | 'social' | 'action' | 'navigation';
|
|
90
|
+
/**
|
|
91
|
+
* Button visual type (semantic grouping)
|
|
92
|
+
* @type {'primary' | 'secondary' | 'tertiary'}
|
|
93
|
+
*/
|
|
94
|
+
type LoroButtonType = 'primary' | 'secondary' | 'tertiary';
|
|
95
|
+
/**
|
|
96
|
+
* Button color theme
|
|
97
|
+
* @type {'primary' | 'secondary' | 'tertiary' | 'danger'}
|
|
98
|
+
*/
|
|
99
|
+
type LoroButtonColor = 'primary' | 'secondary' | 'tertiary' | 'danger';
|
|
100
|
+
/**
|
|
101
|
+
* Button size preset
|
|
102
|
+
* @type {'sm' | 'md' | 'lg'}
|
|
103
|
+
*/
|
|
104
|
+
type LoroButtonSize = 'sm' | 'md' | 'lg';
|
|
105
|
+
/**
|
|
106
|
+
* Button width behavior
|
|
107
|
+
* @type {'fit-content' | 'full'}
|
|
108
|
+
*/
|
|
109
|
+
type LoroButtonWidth = 'fit-content' | 'full';
|
|
110
|
+
/**
|
|
111
|
+
* Icon display mode within the button
|
|
112
|
+
* @type {'none' | 'with-icon' | 'only-icon'}
|
|
113
|
+
*/
|
|
114
|
+
type LoroButtonIconMode = 'none' | 'with-icon' | 'only-icon';
|
|
115
|
+
/**
|
|
116
|
+
* Button HTML type
|
|
117
|
+
* @type {'button' | 'submit' | 'reset'}
|
|
118
|
+
*/
|
|
119
|
+
type LoroButtonHtmlType = 'button' | 'submit' | 'reset';
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* LoroButton Constants
|
|
123
|
+
*
|
|
124
|
+
* Default values, valid options, and configuration constants for the LoroButton component.
|
|
125
|
+
* Update these to maintain consistency across all button usage.
|
|
126
|
+
*/
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Default input values for LoroButton
|
|
130
|
+
*/
|
|
131
|
+
declare const LORO_BUTTON_DEFAULTS: {
|
|
132
|
+
readonly text: "";
|
|
133
|
+
readonly label: "";
|
|
134
|
+
readonly variant: "primary";
|
|
135
|
+
readonly type: "primary";
|
|
136
|
+
readonly color: "primary";
|
|
137
|
+
readonly size: "md";
|
|
138
|
+
readonly fullWidth: false;
|
|
139
|
+
readonly buttonWidth: "fit-content";
|
|
140
|
+
readonly disabled: false;
|
|
141
|
+
readonly loading: false;
|
|
142
|
+
readonly selected: false;
|
|
143
|
+
readonly htmlType: "button";
|
|
144
|
+
readonly iconMode: "none";
|
|
145
|
+
readonly socialMobileCompact: true;
|
|
146
|
+
readonly iconSize: 23;
|
|
147
|
+
readonly iconButtonSize: null;
|
|
148
|
+
readonly iconColor: "";
|
|
149
|
+
};
|
|
150
|
+
/**
|
|
151
|
+
* Valid options for button variants
|
|
152
|
+
*/
|
|
153
|
+
declare const LORO_BUTTON_VARIANTS: readonly LoroButtonVariant[];
|
|
154
|
+
/**
|
|
155
|
+
* Valid options for button types
|
|
156
|
+
*/
|
|
157
|
+
declare const LORO_BUTTON_TYPES: readonly LoroButtonType[];
|
|
158
|
+
/**
|
|
159
|
+
* Valid options for button colors
|
|
160
|
+
*/
|
|
161
|
+
declare const LORO_BUTTON_COLORS: readonly LoroButtonColor[];
|
|
162
|
+
/**
|
|
163
|
+
* Valid options for button sizes
|
|
164
|
+
*/
|
|
165
|
+
declare const LORO_BUTTON_SIZES: readonly LoroButtonSize[];
|
|
166
|
+
/**
|
|
167
|
+
* Valid options for icon modes
|
|
168
|
+
*/
|
|
169
|
+
declare const LORO_BUTTON_ICON_MODES: readonly LoroButtonIconMode[];
|
|
170
|
+
/**
|
|
171
|
+
* CSS class names used by LoroButton (BEM notation)
|
|
172
|
+
*/
|
|
173
|
+
declare const LORO_BUTTON_CLASSES: {
|
|
174
|
+
readonly container: "loro-button";
|
|
175
|
+
readonly variant: (variant: LoroButtonVariant) => string;
|
|
176
|
+
readonly size: (size: LoroButtonSize) => string;
|
|
177
|
+
readonly color: (color: LoroButtonColor) => string;
|
|
178
|
+
readonly width: (width: LoroButtonWidth) => "loro-button--full" | undefined;
|
|
179
|
+
readonly state: {
|
|
180
|
+
readonly disabled: "loro-button--disabled";
|
|
181
|
+
readonly loading: "loro-button--loading";
|
|
182
|
+
readonly selected: "loro-button--selected";
|
|
183
|
+
};
|
|
184
|
+
readonly elements: {
|
|
185
|
+
readonly label: "loro-button__label";
|
|
186
|
+
readonly spinner: "loro-button__spinner";
|
|
187
|
+
readonly srStatus: "loro-button__sr-status";
|
|
188
|
+
};
|
|
189
|
+
};
|
|
190
|
+
|
|
191
|
+
/**
|
|
192
|
+
* LoroButton Component
|
|
193
|
+
*
|
|
194
|
+
* A versatile, accessible button component with multiple variants, sizes, and states.
|
|
195
|
+
* Follows Angular 21 best practices with signals, OnPush change detection, and semantic HTML.
|
|
196
|
+
*
|
|
197
|
+
* @example
|
|
198
|
+
* ```html
|
|
199
|
+
* <loro-button
|
|
200
|
+
* [text]="'Click me'"
|
|
201
|
+
* variant="primary"
|
|
202
|
+
* size="md"
|
|
203
|
+
* (change)="onButtonClick()"
|
|
204
|
+
* />
|
|
205
|
+
* ```
|
|
206
|
+
*/
|
|
207
|
+
declare class LoroButton {
|
|
208
|
+
label: _angular_core.InputSignal<string>;
|
|
209
|
+
text: _angular_core.InputSignal<string>;
|
|
210
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | LoroButtonIconMode | null>;
|
|
211
|
+
iconContent: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
212
|
+
iconMode: _angular_core.InputSignal<LoroButtonIconMode>;
|
|
213
|
+
iconSize: _angular_core.InputSignal<LoroIconSize$1>;
|
|
214
|
+
iconButtonSize: _angular_core.InputSignal<LoroIconSize$1 | null>;
|
|
215
|
+
iconColor: _angular_core.InputSignal<string>;
|
|
216
|
+
socialMobileCompact: _angular_core.InputSignal<boolean>;
|
|
217
|
+
selected: _angular_core.InputSignal<boolean>;
|
|
218
|
+
variant: _angular_core.InputSignal<LoroButtonVariant>;
|
|
219
|
+
typeButton: _angular_core.InputSignal<LoroButtonType>;
|
|
220
|
+
color: _angular_core.InputSignal<LoroButtonColor>;
|
|
221
|
+
size: _angular_core.InputSignal<LoroButtonSize>;
|
|
222
|
+
fullWidth: _angular_core.InputSignal<boolean>;
|
|
223
|
+
buttonWidth: _angular_core.InputSignal<LoroButtonWidth>;
|
|
224
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
225
|
+
loading: _angular_core.InputSignal<boolean>;
|
|
226
|
+
type: _angular_core.InputSignal<"button" | "submit" | "reset">;
|
|
227
|
+
formId: _angular_core.InputSignal<string>;
|
|
228
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
229
|
+
ariaDescription: _angular_core.InputSignal<string>;
|
|
230
|
+
buttonClick: _angular_core.OutputEmitterRef<void>;
|
|
231
|
+
change: _angular_core.OutputEmitterRef<void>;
|
|
232
|
+
sanChange: _angular_core.OutputEmitterRef<void>;
|
|
233
|
+
protected readonly resolvedText: _angular_core.Signal<string>;
|
|
234
|
+
protected readonly resolvedIcon: _angular_core.Signal<LoroIconName$1 | null>;
|
|
235
|
+
protected readonly resolvedIconMode: _angular_core.Signal<LoroButtonIconMode>;
|
|
236
|
+
protected readonly resolvedButtonWidth: _angular_core.Signal<LoroButtonWidth>;
|
|
237
|
+
protected readonly resolvedIconButtonSize: _angular_core.Signal<string>;
|
|
238
|
+
protected readonly resolvedTypeButton: _angular_core.Signal<LoroButtonType>;
|
|
239
|
+
protected readonly resolvedColor: _angular_core.Signal<LoroButtonColor>;
|
|
240
|
+
protected readonly showIcon: _angular_core.Signal<boolean>;
|
|
241
|
+
protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
|
|
242
|
+
protected readonly resolvedIconColor: _angular_core.Signal<string>;
|
|
243
|
+
protected readonly resolvedIconRenderMode: _angular_core.Signal<LoroIconRenderMode$1>;
|
|
244
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
245
|
+
protected readonly showSpinner: _angular_core.Signal<boolean>;
|
|
246
|
+
protected readonly loadingAriaLabel: _angular_core.Signal<string>;
|
|
247
|
+
protected emitChange(): void;
|
|
248
|
+
protected defaultIconColor(): LoroIconColor$1;
|
|
249
|
+
private isIconMode;
|
|
250
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroButton, never>;
|
|
251
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroButton, "loro-button", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconContent": { "alias": "iconContent"; "required": false; "isSignal": true; }; "iconMode": { "alias": "iconMode"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; "iconButtonSize": { "alias": "iconButtonSize"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "socialMobileCompact": { "alias": "socialMobileCompact"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "typeButton": { "alias": "typeButton"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "buttonWidth": { "alias": "buttonWidth"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "formId": { "alias": "formId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaDescription": { "alias": "ariaDescription"; "required": false; "isSignal": true; }; }, { "buttonClick": "buttonClick"; "change": "change"; "sanChange": "sanChange"; }, never, never, true, never>;
|
|
252
|
+
}
|
|
253
|
+
|
|
10
254
|
type LoroAssetLayer = 'Action' | 'Brand' | 'Direction' | 'Home' | 'Illustrations' | 'Navigation' | 'Product' | 'Products' | 'Screens' | 'Social' | 'Status' | 'Stores';
|
|
11
255
|
type LoroIconAsset = {
|
|
12
256
|
readonly name: string;
|
|
@@ -871,140 +1115,6 @@ type LoroImageAssetName = keyof typeof LORO_IMAGE_PATHS;
|
|
|
871
1115
|
type LoroImageLegacyName = keyof typeof LORO_IMAGE_LEGACY_NAMES;
|
|
872
1116
|
type LoroImageName = LoroImageAssetName | LoroImageLegacyName;
|
|
873
1117
|
|
|
874
|
-
type LoroIconColorToken = 'default' | 'primary' | 'primary-strong' | 'primary-deep' | 'text' | 'muted' | 'success' | 'danger' | 'warning' | 'inverse';
|
|
875
|
-
type LoroIconColor = LoroIconColorToken | string;
|
|
876
|
-
type LoroIconRenderMode = 'mask' | 'origin';
|
|
877
|
-
type LoroIconSize = number | string;
|
|
878
|
-
declare class LoroIcon {
|
|
879
|
-
name: _angular_core.InputSignal<LoroIconName>;
|
|
880
|
-
size: _angular_core.InputSignal<LoroIconSize>;
|
|
881
|
-
alt: _angular_core.InputSignal<string>;
|
|
882
|
-
decorative: _angular_core.InputSignal<boolean>;
|
|
883
|
-
color: _angular_core.InputSignal<string>;
|
|
884
|
-
renderMode: _angular_core.InputSignal<LoroIconRenderMode>;
|
|
885
|
-
protected readonly assetName: _angular_core.Signal<"icon-apple" | "icon-arrow-right" | "icon-auto" | "icon-back" | "icon-bag" | "icon-barcode" | "icon-bell" | "icon-bottle" | "icon-bulb" | "icon-calendar" | "icon-camera" | "icon-cart" | "icon-chart-bar" | "icon-chat" | "icon-check" | "icon-checkbox-empty" | "icon-chevron-down" | "icon-chevron-right" | "icon-chevron-up" | "icon-clock" | "icon-download" | "icon-email" | "icon-eye-off" | "icon-eye" | "icon-globe" | "icon-google" | "icon-headset" | "icon-help" | "icon-home" | "icon-info" | "icon-laptop" | "icon-leaf" | "icon-list" | "icon-location" | "icon-lock" | "icon-logout" | "icon-megaphone" | "icon-moon" | "icon-more-vertical" | "icon-nav-compare" | "icon-nav-home" | "icon-nav-list" | "icon-nav-pantry" | "icon-pantry-stock" | "icon-paperclip" | "icon-phone" | "icon-plus-user" | "icon-plus" | "icon-scanner" | "icon-search" | "icon-send" | "icon-settings" | "icon-shelf" | "icon-shield-alert" | "icon-shield" | "icon-star" | "icon-store" | "icon-sun" | "icon-tablet" | "icon-tag" | "icon-tick-circle" | "icon-trash-white" | "icon-trash" | "icon-trend" | "icon-user" | "icon-warning">;
|
|
886
|
-
protected readonly src: _angular_core.Signal<"assets/loro-ui/icons/apple.svg" | "assets/loro-ui/icons/arrow-right.svg" | "assets/loro-ui/icons/auto.svg" | "assets/loro-ui/icons/back.svg" | "assets/loro-ui/icons/bag.svg" | "assets/loro-ui/icons/barcode.svg" | "assets/loro-ui/icons/bell.svg" | "assets/loro-ui/icons/bottle.svg" | "assets/loro-ui/icons/bulb.svg" | "assets/loro-ui/icons/calendar.svg" | "assets/loro-ui/icons/camera.svg" | "assets/loro-ui/icons/cart.svg" | "assets/loro-ui/icons/chart-bar.svg" | "assets/loro-ui/icons/chat.svg" | "assets/loro-ui/icons/check.svg" | "assets/loro-ui/icons/checkbox-empty.svg" | "assets/loro-ui/icons/chevron-down.svg" | "assets/loro-ui/icons/chevron-right.svg" | "assets/loro-ui/icons/chevron-up.svg" | "assets/loro-ui/icons/clock.svg" | "assets/loro-ui/icons/download.svg" | "assets/loro-ui/icons/email.svg" | "assets/loro-ui/icons/eye-off.svg" | "assets/loro-ui/icons/eye.svg" | "assets/loro-ui/icons/globe.svg" | "assets/loro-ui/icons/google.svg" | "assets/loro-ui/icons/headset.svg" | "assets/loro-ui/icons/help.svg" | "assets/loro-ui/icons/home.svg" | "assets/loro-ui/icons/info.svg" | "assets/loro-ui/icons/laptop.svg" | "assets/loro-ui/icons/leaf.svg" | "assets/loro-ui/icons/list.svg" | "assets/loro-ui/icons/location.svg" | "assets/loro-ui/icons/lock.svg" | "assets/loro-ui/icons/logout.svg" | "assets/loro-ui/icons/megaphone.svg" | "assets/loro-ui/icons/moon.svg" | "assets/loro-ui/icons/more-vertical.svg" | "assets/loro-ui/icons/nav-compare.svg" | "assets/loro-ui/icons/nav-home.svg" | "assets/loro-ui/icons/nav-list.svg" | "assets/loro-ui/icons/nav-pantry.svg" | "assets/loro-ui/icons/pantry-stock.svg" | "assets/loro-ui/icons/paperclip.svg" | "assets/loro-ui/icons/phone.svg" | "assets/loro-ui/icons/plus-user.svg" | "assets/loro-ui/icons/plus.svg" | "assets/loro-ui/icons/scanner.svg" | "assets/loro-ui/icons/search.svg" | "assets/loro-ui/icons/send.svg" | "assets/loro-ui/icons/settings.svg" | "assets/loro-ui/icons/shelf.svg" | "assets/loro-ui/icons/shield-alert.svg" | "assets/loro-ui/icons/shield.svg" | "assets/loro-ui/icons/star.svg" | "assets/loro-ui/icons/store.svg" | "assets/loro-ui/icons/sun.svg" | "assets/loro-ui/icons/tablet.svg" | "assets/loro-ui/icons/tag.svg" | "assets/loro-ui/icons/tick-circle.svg" | "assets/loro-ui/icons/trash-white.svg" | "assets/loro-ui/icons/trash.svg" | "assets/loro-ui/icons/trend.svg" | "assets/loro-ui/icons/user.svg" | "assets/loro-ui/icons/warning.svg">;
|
|
887
|
-
protected readonly altText: _angular_core.Signal<string>;
|
|
888
|
-
protected readonly resolvedSize: _angular_core.Signal<string>;
|
|
889
|
-
protected readonly resolvedColor: _angular_core.Signal<string>;
|
|
890
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroIcon, never>;
|
|
891
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroIcon, "loro-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "renderMode": { "alias": "renderMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
892
|
-
}
|
|
893
|
-
|
|
894
|
-
declare class LoroAccordion {
|
|
895
|
-
title: _angular_core.InputSignal<string>;
|
|
896
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
897
|
-
expanded: _angular_core.InputSignal<boolean>;
|
|
898
|
-
expandedChange: _angular_core.OutputEmitterRef<boolean>;
|
|
899
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAccordion, never>;
|
|
900
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroAccordion, "loro-accordion", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expandedChange": "expandedChange"; }, never, ["*"], true, never>;
|
|
901
|
-
}
|
|
902
|
-
|
|
903
|
-
interface LoroAppNavItem {
|
|
904
|
-
id: string;
|
|
905
|
-
label: string;
|
|
906
|
-
icon: LoroIconName;
|
|
907
|
-
active?: boolean;
|
|
908
|
-
badge?: string | number | null;
|
|
909
|
-
disabled?: boolean;
|
|
910
|
-
}
|
|
911
|
-
interface LoroAppNavClick {
|
|
912
|
-
item: LoroAppNavItem;
|
|
913
|
-
section: 'main' | 'utility';
|
|
914
|
-
}
|
|
915
|
-
declare class LoroAppNav {
|
|
916
|
-
private readonly haptics;
|
|
917
|
-
private readonly draggedMobileIndex;
|
|
918
|
-
private readonly mobilePointerActive;
|
|
919
|
-
private activePointerId;
|
|
920
|
-
private suppressNextMobileClick;
|
|
921
|
-
items: _angular_core.InputSignal<LoroAppNavItem[]>;
|
|
922
|
-
utilityItems: _angular_core.InputSignal<LoroAppNavItem[]>;
|
|
923
|
-
ariaLabel: _angular_core.InputSignal<string>;
|
|
924
|
-
showUtilityItems: _angular_core.InputSignal<boolean>;
|
|
925
|
-
compactDesktop: _angular_core.InputSignal<boolean>;
|
|
926
|
-
itemClick: _angular_core.OutputEmitterRef<LoroAppNavItem>;
|
|
927
|
-
utilityItemClick: _angular_core.OutputEmitterRef<LoroAppNavItem>;
|
|
928
|
-
navItemClick: _angular_core.OutputEmitterRef<LoroAppNavClick>;
|
|
929
|
-
protected readonly desktopItems: _angular_core.Signal<LoroAppNavItem[]>;
|
|
930
|
-
protected readonly mobileItems: _angular_core.Signal<LoroAppNavItem[]>;
|
|
931
|
-
protected readonly mobileVisualSlotCount: _angular_core.Signal<number>;
|
|
932
|
-
private readonly selectedMobileIndex;
|
|
933
|
-
protected readonly mobileSliderPosition: _angular_core.Signal<number>;
|
|
934
|
-
protected readonly isMobileDragging: _angular_core.Signal<boolean>;
|
|
935
|
-
protected readonly mobileItemCount: _angular_core.Signal<number>;
|
|
936
|
-
protected readonly selectedMobileItemId: _angular_core.Signal<string>;
|
|
937
|
-
protected isMobileItemVisualActive(index: number): boolean;
|
|
938
|
-
onMainItemClick(item: LoroAppNavItem): void;
|
|
939
|
-
protected onMobileItemClick(item: LoroAppNavItem): void;
|
|
940
|
-
protected onMobilePointerDown(event: PointerEvent): void;
|
|
941
|
-
protected onMobilePointerMove(event: PointerEvent): void;
|
|
942
|
-
protected onMobilePointerUp(event: PointerEvent): void;
|
|
943
|
-
protected onMobilePointerCancel(event: PointerEvent): void;
|
|
944
|
-
onUtilityItemClick(item: LoroAppNavItem): void;
|
|
945
|
-
private emitMainItem;
|
|
946
|
-
private getMobileVisualSlotPosition;
|
|
947
|
-
protected mobileItemGridColumn(index: number): number;
|
|
948
|
-
private mobileItemIndexToVisualSlot;
|
|
949
|
-
private getNearestEnabledMobileIndex;
|
|
950
|
-
private releaseMobilePointer;
|
|
951
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAppNav, never>;
|
|
952
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroAppNav, "loro-app-nav", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "utilityItems": { "alias": "utilityItems"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "showUtilityItems": { "alias": "showUtilityItems"; "required": false; "isSignal": true; }; "compactDesktop": { "alias": "compactDesktop"; "required": false; "isSignal": true; }; }, { "itemClick": "itemClick"; "utilityItemClick": "utilityItemClick"; "navItemClick": "navItemClick"; }, never, never, true, never>;
|
|
953
|
-
}
|
|
954
|
-
|
|
955
|
-
type LoroButtonVariant = 'primary' | 'outline' | 'ghost' | 'danger' | 'soft' | 'social' | 'action' | 'navigation';
|
|
956
|
-
type LoroButtonType = 'primary' | 'secondary' | 'tertiary';
|
|
957
|
-
type LoroButtonColor = 'primary' | 'secondary' | 'tertiary' | 'danger';
|
|
958
|
-
type LoroButtonSize = 'sm' | 'md' | 'lg';
|
|
959
|
-
type LoroButtonWidth = 'fit-content' | 'full';
|
|
960
|
-
type LoroButtonIconMode = 'none' | 'with-icon' | 'only-icon';
|
|
961
|
-
declare class LoroButton {
|
|
962
|
-
label: _angular_core.InputSignal<string>;
|
|
963
|
-
text: _angular_core.InputSignal<string>;
|
|
964
|
-
icon: _angular_core.InputSignal<LoroIconName | LoroButtonIconMode | null>;
|
|
965
|
-
iconContent: _angular_core.InputSignal<LoroIconName | null>;
|
|
966
|
-
iconMode: _angular_core.InputSignal<LoroButtonIconMode>;
|
|
967
|
-
iconSize: _angular_core.InputSignal<LoroIconSize>;
|
|
968
|
-
iconButtonSize: _angular_core.InputSignal<LoroIconSize | null>;
|
|
969
|
-
iconColor: _angular_core.InputSignal<string>;
|
|
970
|
-
socialMobileCompact: _angular_core.InputSignal<boolean>;
|
|
971
|
-
selected: _angular_core.InputSignal<boolean>;
|
|
972
|
-
variant: _angular_core.InputSignal<LoroButtonVariant>;
|
|
973
|
-
typeButton: _angular_core.InputSignal<LoroButtonType>;
|
|
974
|
-
color: _angular_core.InputSignal<LoroButtonColor>;
|
|
975
|
-
size: _angular_core.InputSignal<LoroButtonSize>;
|
|
976
|
-
fullWidth: _angular_core.InputSignal<boolean>;
|
|
977
|
-
buttonWidth: _angular_core.InputSignal<LoroButtonWidth>;
|
|
978
|
-
disabled: _angular_core.InputSignal<boolean>;
|
|
979
|
-
loading: _angular_core.InputSignal<boolean>;
|
|
980
|
-
type: _angular_core.InputSignal<"button" | "submit" | "reset">;
|
|
981
|
-
formId: _angular_core.InputSignal<string>;
|
|
982
|
-
ariaLabel: _angular_core.InputSignal<string>;
|
|
983
|
-
ariaDescription: _angular_core.InputSignal<string>;
|
|
984
|
-
buttonClick: _angular_core.OutputEmitterRef<void>;
|
|
985
|
-
change: _angular_core.OutputEmitterRef<void>;
|
|
986
|
-
sanChange: _angular_core.OutputEmitterRef<void>;
|
|
987
|
-
protected readonly resolvedText: _angular_core.Signal<string>;
|
|
988
|
-
protected readonly resolvedIcon: _angular_core.Signal<LoroIconName | null>;
|
|
989
|
-
protected readonly resolvedIconMode: _angular_core.Signal<LoroButtonIconMode>;
|
|
990
|
-
protected readonly resolvedButtonWidth: _angular_core.Signal<LoroButtonWidth>;
|
|
991
|
-
protected readonly resolvedIconButtonSize: _angular_core.Signal<string>;
|
|
992
|
-
protected readonly resolvedTypeButton: _angular_core.Signal<LoroButtonType>;
|
|
993
|
-
protected readonly resolvedColor: _angular_core.Signal<LoroButtonColor>;
|
|
994
|
-
protected readonly showIcon: _angular_core.Signal<boolean>;
|
|
995
|
-
protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
|
|
996
|
-
protected readonly resolvedIconColor: _angular_core.Signal<string>;
|
|
997
|
-
protected readonly resolvedIconRenderMode: _angular_core.Signal<LoroIconRenderMode>;
|
|
998
|
-
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
999
|
-
protected readonly showSpinner: _angular_core.Signal<boolean>;
|
|
1000
|
-
protected readonly loadingAriaLabel: _angular_core.Signal<string>;
|
|
1001
|
-
protected emitChange(): void;
|
|
1002
|
-
protected defaultIconColor(): LoroIconColor;
|
|
1003
|
-
private isIconMode;
|
|
1004
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroButton, never>;
|
|
1005
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroButton, "loro-button", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconContent": { "alias": "iconContent"; "required": false; "isSignal": true; }; "iconMode": { "alias": "iconMode"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; "iconButtonSize": { "alias": "iconButtonSize"; "required": false; "isSignal": true; }; "iconColor": { "alias": "iconColor"; "required": false; "isSignal": true; }; "socialMobileCompact": { "alias": "socialMobileCompact"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "typeButton": { "alias": "typeButton"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "buttonWidth": { "alias": "buttonWidth"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "formId": { "alias": "formId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaDescription": { "alias": "ariaDescription"; "required": false; "isSignal": true; }; }, { "buttonClick": "buttonClick"; "change": "change"; "sanChange": "sanChange"; }, never, never, true, never>;
|
|
1006
|
-
}
|
|
1007
|
-
|
|
1008
1118
|
declare class LoroImage {
|
|
1009
1119
|
name: _angular_core.InputSignal<LoroImageName>;
|
|
1010
1120
|
alt: _angular_core.InputSignal<string>;
|
|
@@ -1025,9 +1135,9 @@ declare class LoroAssistantCard {
|
|
|
1025
1135
|
title: _angular_core.InputSignal<string>;
|
|
1026
1136
|
description: _angular_core.InputSignal<string>;
|
|
1027
1137
|
imageName: _angular_core.InputSignal<LoroImageName | null>;
|
|
1028
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1138
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1029
1139
|
actionLabel: _angular_core.InputSignal<string>;
|
|
1030
|
-
actionIcon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1140
|
+
actionIcon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1031
1141
|
actionVariant: _angular_core.InputSignal<LoroButtonVariant>;
|
|
1032
1142
|
action: _angular_core.OutputEmitterRef<void>;
|
|
1033
1143
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAssistantCard, never>;
|
|
@@ -1035,12 +1145,12 @@ declare class LoroAssistantCard {
|
|
|
1035
1145
|
}
|
|
1036
1146
|
|
|
1037
1147
|
declare class LoroAuthSocialButton {
|
|
1038
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1148
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1039
1149
|
label: _angular_core.InputSignal<string>;
|
|
1040
1150
|
outline: _angular_core.InputSignal<boolean>;
|
|
1041
1151
|
selected: _angular_core.InputSignal<boolean>;
|
|
1042
1152
|
iconSize: _angular_core.InputSignal<number>;
|
|
1043
|
-
protected readonly nativeIconSrc: _angular_core.Signal<"
|
|
1153
|
+
protected readonly nativeIconSrc: _angular_core.Signal<"assets/loro-ui/icons/apple.svg" | "assets/loro-ui/icons/google.svg" | "">;
|
|
1044
1154
|
protected releaseFocus(event: Event): void;
|
|
1045
1155
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroAuthSocialButton, never>;
|
|
1046
1156
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroAuthSocialButton, "loro-auth-social-button", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "outline": { "alias": "outline"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "iconSize": { "alias": "iconSize"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
@@ -1059,7 +1169,7 @@ type LoroCardJustify = 'start' | 'center' | 'end';
|
|
|
1059
1169
|
declare class LoroCard {
|
|
1060
1170
|
title: _angular_core.InputSignal<string>;
|
|
1061
1171
|
description: _angular_core.InputSignal<string>;
|
|
1062
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1172
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1063
1173
|
iconSize: _angular_core.InputSignal<number>;
|
|
1064
1174
|
iconColor: _angular_core.InputSignal<string>;
|
|
1065
1175
|
link: _angular_core.InputSignal<string>;
|
|
@@ -1073,7 +1183,7 @@ declare class LoroCard {
|
|
|
1073
1183
|
heroSubtitle: _angular_core.InputSignal<string>;
|
|
1074
1184
|
heroAvatarSrc: _angular_core.InputSignal<string | null>;
|
|
1075
1185
|
heroAvatarAlt: _angular_core.InputSignal<string>;
|
|
1076
|
-
heroAvatarIcon: _angular_core.InputSignal<LoroIconName>;
|
|
1186
|
+
heroAvatarIcon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1077
1187
|
heroAvatarIconSize: _angular_core.InputSignal<number>;
|
|
1078
1188
|
heroVisualImage: _angular_core.InputSignal<LoroImageName | null>;
|
|
1079
1189
|
heroVisualAlt: _angular_core.InputSignal<string>;
|
|
@@ -1088,7 +1198,7 @@ declare class LoroCardNav {
|
|
|
1088
1198
|
private readonly router;
|
|
1089
1199
|
title: _angular_core.InputSignal<string>;
|
|
1090
1200
|
description: _angular_core.InputSignal<string>;
|
|
1091
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1201
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1092
1202
|
iconSize: _angular_core.InputSignal<number>;
|
|
1093
1203
|
iconColor: _angular_core.InputSignal<string>;
|
|
1094
1204
|
route: _angular_core.InputSignal<string>;
|
|
@@ -1112,7 +1222,7 @@ declare class LoroDashboardCard {
|
|
|
1112
1222
|
title: _angular_core.InputSignal<string>;
|
|
1113
1223
|
description: _angular_core.InputSignal<string>;
|
|
1114
1224
|
link: _angular_core.InputSignal<string>;
|
|
1115
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1225
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1116
1226
|
illustration: _angular_core.InputSignal<LoroImageName | null>;
|
|
1117
1227
|
variant: _angular_core.InputSignal<"home" | "default">;
|
|
1118
1228
|
showArrow: _angular_core.InputSignal<boolean>;
|
|
@@ -1188,7 +1298,7 @@ declare class LoroProductRow {
|
|
|
1188
1298
|
|
|
1189
1299
|
declare class LoroProductSection {
|
|
1190
1300
|
title: _angular_core.InputSignal<string>;
|
|
1191
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1301
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1192
1302
|
collapsible: _angular_core.InputSignal<boolean>;
|
|
1193
1303
|
protected readonly expanded: _angular_core.WritableSignal<boolean>;
|
|
1194
1304
|
protected toggle(): void;
|
|
@@ -1245,7 +1355,7 @@ declare class LoroStatCard {
|
|
|
1245
1355
|
value: _angular_core.InputSignal<string>;
|
|
1246
1356
|
description: _angular_core.InputSignal<string>;
|
|
1247
1357
|
eyebrow: _angular_core.InputSignal<string>;
|
|
1248
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1358
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1249
1359
|
iconSize: _angular_core.InputSignal<number>;
|
|
1250
1360
|
image: _angular_core.InputSignal<LoroImageName | null>;
|
|
1251
1361
|
topImage: _angular_core.InputSignal<LoroImageName | null>;
|
|
@@ -1288,7 +1398,7 @@ type LoroTabAlign = 'flex' | 'block';
|
|
|
1288
1398
|
interface LoroTabOption {
|
|
1289
1399
|
readonly value: string;
|
|
1290
1400
|
readonly label: string;
|
|
1291
|
-
readonly icon?: LoroIconName | null;
|
|
1401
|
+
readonly icon?: LoroIconName$1 | null;
|
|
1292
1402
|
readonly ariaLabel?: string;
|
|
1293
1403
|
}
|
|
1294
1404
|
declare class LoroTab {
|
|
@@ -1325,7 +1435,7 @@ declare class LoroAlert {
|
|
|
1325
1435
|
readonly action: _angular_core.OutputEmitterRef<void>;
|
|
1326
1436
|
/** Emitted by the close button. The parent decides whether to remove the alert. */
|
|
1327
1437
|
readonly dismissed: _angular_core.OutputEmitterRef<void>;
|
|
1328
|
-
protected readonly resolvedIcon: _angular_core.Signal<LoroIconName>;
|
|
1438
|
+
protected readonly resolvedIcon: _angular_core.Signal<LoroIconName$1>;
|
|
1329
1439
|
protected readonly resolvedIconColor: _angular_core.Signal<string>;
|
|
1330
1440
|
protected readonly role: _angular_core.Signal<"status" | "alert" | null>;
|
|
1331
1441
|
protected readonly ariaLive: _angular_core.Signal<"polite" | "assertive" | null>;
|
|
@@ -1356,7 +1466,7 @@ interface LoroNotificationItem {
|
|
|
1356
1466
|
title: string;
|
|
1357
1467
|
message: string;
|
|
1358
1468
|
time?: string;
|
|
1359
|
-
icon?: LoroIconName;
|
|
1469
|
+
icon?: LoroIconName$1;
|
|
1360
1470
|
unread?: boolean;
|
|
1361
1471
|
}
|
|
1362
1472
|
declare class LoroNotificationPanel {
|
|
@@ -1367,7 +1477,7 @@ declare class LoroNotificationPanel {
|
|
|
1367
1477
|
markAllLabel: _angular_core.InputSignal<string>;
|
|
1368
1478
|
showClearAll: _angular_core.InputSignal<boolean>;
|
|
1369
1479
|
clearAllLabel: _angular_core.InputSignal<string>;
|
|
1370
|
-
emptyIcon: _angular_core.InputSignal<LoroIconName>;
|
|
1480
|
+
emptyIcon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1371
1481
|
emptyTitle: _angular_core.InputSignal<string>;
|
|
1372
1482
|
emptyMessage: _angular_core.InputSignal<string>;
|
|
1373
1483
|
itemClick: _angular_core.OutputEmitterRef<LoroNotificationItem>;
|
|
@@ -1385,7 +1495,7 @@ declare class LoroNotificationRow {
|
|
|
1385
1495
|
title: _angular_core.InputSignal<string>;
|
|
1386
1496
|
message: _angular_core.InputSignal<string>;
|
|
1387
1497
|
time: _angular_core.InputSignal<string>;
|
|
1388
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1498
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1389
1499
|
unread: _angular_core.InputSignal<boolean>;
|
|
1390
1500
|
rowClick: _angular_core.OutputEmitterRef<void>;
|
|
1391
1501
|
rowRemove: _angular_core.OutputEmitterRef<void>;
|
|
@@ -1440,7 +1550,7 @@ declare class LoroToast {
|
|
|
1440
1550
|
|
|
1441
1551
|
type LoroAuthFieldState = 'default' | 'error';
|
|
1442
1552
|
declare class LoroAuthField implements FormValueControl<string> {
|
|
1443
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1553
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1444
1554
|
label: _angular_core.InputSignal<string>;
|
|
1445
1555
|
placeholder: _angular_core.InputSignal<string>;
|
|
1446
1556
|
value: _angular_core.ModelSignal<string>;
|
|
@@ -1511,7 +1621,7 @@ declare class LoroDropdown implements FormValueControl<string> {
|
|
|
1511
1621
|
declare class LoroFilterChip {
|
|
1512
1622
|
label: _angular_core.InputSignal<string>;
|
|
1513
1623
|
value: _angular_core.InputSignal<string>;
|
|
1514
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1624
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1515
1625
|
active: _angular_core.InputSignal<boolean>;
|
|
1516
1626
|
selected: _angular_core.OutputEmitterRef<string>;
|
|
1517
1627
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroFilterChip, never>;
|
|
@@ -1530,9 +1640,9 @@ declare class LoroInput implements FormValueControl<string> {
|
|
|
1530
1640
|
name: _angular_core.InputSignal<string>;
|
|
1531
1641
|
autocomplete: _angular_core.InputSignal<string>;
|
|
1532
1642
|
inputmode: _angular_core.InputSignal<"" | "email" | "search" | "text" | "none" | "tel" | "url" | "numeric" | "decimal">;
|
|
1533
|
-
icon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1643
|
+
icon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1534
1644
|
iconSize: _angular_core.InputSignal<number>;
|
|
1535
|
-
trailingIcon: _angular_core.InputSignal<LoroIconName | null>;
|
|
1645
|
+
trailingIcon: _angular_core.InputSignal<LoroIconName$1 | null>;
|
|
1536
1646
|
trailingIconSize: _angular_core.InputSignal<number>;
|
|
1537
1647
|
trailingAriaLabel: _angular_core.InputSignal<string>;
|
|
1538
1648
|
variant: _angular_core.InputSignal<LoroInputVariant>;
|
|
@@ -1609,7 +1719,7 @@ declare class LoroSelect {
|
|
|
1609
1719
|
title: _angular_core.InputSignal<string>;
|
|
1610
1720
|
subtitle: _angular_core.InputSignal<string>;
|
|
1611
1721
|
meta: _angular_core.InputSignal<string>;
|
|
1612
|
-
icon: _angular_core.InputSignal<LoroIconName>;
|
|
1722
|
+
icon: _angular_core.InputSignal<LoroIconName$1>;
|
|
1613
1723
|
badge: _angular_core.InputSignal<string>;
|
|
1614
1724
|
status: _angular_core.InputSignal<string>;
|
|
1615
1725
|
selected: _angular_core.InputSignal<boolean>;
|
|
@@ -1705,6 +1815,26 @@ declare class LoroModal {
|
|
|
1705
1815
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroModal, "loro-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "sheetDragToClose": { "alias": "sheetDragToClose"; "required": false; "isSignal": true; }; "sheetRestTop": { "alias": "sheetRestTop"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "closeOnBackdrop": { "alias": "closeOnBackdrop"; "required": false; "isSignal": true; }; }, { "modalClose": "modalClose"; }, never, ["*", "[loro-modal-actions]"], true, never>;
|
|
1706
1816
|
}
|
|
1707
1817
|
|
|
1818
|
+
type LoroIconColorToken = 'default' | 'primary' | 'primary-strong' | 'primary-deep' | 'text' | 'muted' | 'success' | 'danger' | 'warning' | 'inverse';
|
|
1819
|
+
type LoroIconColor = LoroIconColorToken | string;
|
|
1820
|
+
type LoroIconRenderMode = 'mask' | 'origin';
|
|
1821
|
+
type LoroIconSize = number | string;
|
|
1822
|
+
declare class LoroIcon {
|
|
1823
|
+
name: _angular_core.InputSignal<LoroIconName>;
|
|
1824
|
+
size: _angular_core.InputSignal<LoroIconSize>;
|
|
1825
|
+
alt: _angular_core.InputSignal<string>;
|
|
1826
|
+
decorative: _angular_core.InputSignal<boolean>;
|
|
1827
|
+
color: _angular_core.InputSignal<string>;
|
|
1828
|
+
renderMode: _angular_core.InputSignal<LoroIconRenderMode>;
|
|
1829
|
+
protected readonly assetName: _angular_core.Signal<"icon-apple" | "icon-arrow-right" | "icon-auto" | "icon-back" | "icon-bag" | "icon-barcode" | "icon-bell" | "icon-bottle" | "icon-bulb" | "icon-calendar" | "icon-camera" | "icon-cart" | "icon-chart-bar" | "icon-chat" | "icon-check" | "icon-checkbox-empty" | "icon-chevron-down" | "icon-chevron-right" | "icon-chevron-up" | "icon-clock" | "icon-download" | "icon-email" | "icon-eye-off" | "icon-eye" | "icon-globe" | "icon-google" | "icon-headset" | "icon-help" | "icon-home" | "icon-info" | "icon-laptop" | "icon-leaf" | "icon-list" | "icon-location" | "icon-lock" | "icon-logout" | "icon-megaphone" | "icon-moon" | "icon-more-vertical" | "icon-nav-compare" | "icon-nav-home" | "icon-nav-list" | "icon-nav-pantry" | "icon-pantry-stock" | "icon-paperclip" | "icon-phone" | "icon-plus-user" | "icon-plus" | "icon-scanner" | "icon-search" | "icon-send" | "icon-settings" | "icon-shelf" | "icon-shield-alert" | "icon-shield" | "icon-star" | "icon-store" | "icon-sun" | "icon-tablet" | "icon-tag" | "icon-tick-circle" | "icon-trash-white" | "icon-trash" | "icon-trend" | "icon-user" | "icon-warning">;
|
|
1830
|
+
protected readonly src: _angular_core.Signal<"assets/loro-ui/icons/apple.svg" | "assets/loro-ui/icons/arrow-right.svg" | "assets/loro-ui/icons/auto.svg" | "assets/loro-ui/icons/back.svg" | "assets/loro-ui/icons/bag.svg" | "assets/loro-ui/icons/barcode.svg" | "assets/loro-ui/icons/bell.svg" | "assets/loro-ui/icons/bottle.svg" | "assets/loro-ui/icons/bulb.svg" | "assets/loro-ui/icons/calendar.svg" | "assets/loro-ui/icons/camera.svg" | "assets/loro-ui/icons/cart.svg" | "assets/loro-ui/icons/chart-bar.svg" | "assets/loro-ui/icons/chat.svg" | "assets/loro-ui/icons/check.svg" | "assets/loro-ui/icons/checkbox-empty.svg" | "assets/loro-ui/icons/chevron-down.svg" | "assets/loro-ui/icons/chevron-right.svg" | "assets/loro-ui/icons/chevron-up.svg" | "assets/loro-ui/icons/clock.svg" | "assets/loro-ui/icons/download.svg" | "assets/loro-ui/icons/email.svg" | "assets/loro-ui/icons/eye-off.svg" | "assets/loro-ui/icons/eye.svg" | "assets/loro-ui/icons/globe.svg" | "assets/loro-ui/icons/google.svg" | "assets/loro-ui/icons/headset.svg" | "assets/loro-ui/icons/help.svg" | "assets/loro-ui/icons/home.svg" | "assets/loro-ui/icons/info.svg" | "assets/loro-ui/icons/laptop.svg" | "assets/loro-ui/icons/leaf.svg" | "assets/loro-ui/icons/list.svg" | "assets/loro-ui/icons/location.svg" | "assets/loro-ui/icons/lock.svg" | "assets/loro-ui/icons/logout.svg" | "assets/loro-ui/icons/megaphone.svg" | "assets/loro-ui/icons/moon.svg" | "assets/loro-ui/icons/more-vertical.svg" | "assets/loro-ui/icons/nav-compare.svg" | "assets/loro-ui/icons/nav-home.svg" | "assets/loro-ui/icons/nav-list.svg" | "assets/loro-ui/icons/nav-pantry.svg" | "assets/loro-ui/icons/pantry-stock.svg" | "assets/loro-ui/icons/paperclip.svg" | "assets/loro-ui/icons/phone.svg" | "assets/loro-ui/icons/plus-user.svg" | "assets/loro-ui/icons/plus.svg" | "assets/loro-ui/icons/scanner.svg" | "assets/loro-ui/icons/search.svg" | "assets/loro-ui/icons/send.svg" | "assets/loro-ui/icons/settings.svg" | "assets/loro-ui/icons/shelf.svg" | "assets/loro-ui/icons/shield-alert.svg" | "assets/loro-ui/icons/shield.svg" | "assets/loro-ui/icons/star.svg" | "assets/loro-ui/icons/store.svg" | "assets/loro-ui/icons/sun.svg" | "assets/loro-ui/icons/tablet.svg" | "assets/loro-ui/icons/tag.svg" | "assets/loro-ui/icons/tick-circle.svg" | "assets/loro-ui/icons/trash-white.svg" | "assets/loro-ui/icons/trash.svg" | "assets/loro-ui/icons/trend.svg" | "assets/loro-ui/icons/user.svg" | "assets/loro-ui/icons/warning.svg">;
|
|
1831
|
+
protected readonly altText: _angular_core.Signal<string>;
|
|
1832
|
+
protected readonly resolvedSize: _angular_core.Signal<string>;
|
|
1833
|
+
protected readonly resolvedColor: _angular_core.Signal<string>;
|
|
1834
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoroIcon, never>;
|
|
1835
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoroIcon, "loro-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "renderMode": { "alias": "renderMode"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1836
|
+
}
|
|
1837
|
+
|
|
1708
1838
|
declare class LoroHapticsService {
|
|
1709
1839
|
private readonly document;
|
|
1710
1840
|
private readonly vibration;
|
|
@@ -1716,5 +1846,5 @@ declare class LoroHapticsService {
|
|
|
1716
1846
|
static ɵprov: _angular_core.ɵɵInjectableDeclaration<LoroHapticsService>;
|
|
1717
1847
|
}
|
|
1718
1848
|
|
|
1719
|
-
export { Footer, LORO_ICON_ASSETS, LORO_ICON_LEGACY_NAMES, LORO_ICON_PATHS, LORO_IMAGE_ASSETS, LORO_IMAGE_LEGACY_NAMES, LORO_IMAGE_PATHS, LoroAccordion, LoroAlert, LoroAppNav, LoroAssistantCard, LoroAuthField, LoroAuthSocialButton, LoroBadge, LoroButton, LoroCard, LoroCardNav, LoroCheckbox, LoroDashboardCard, LoroDivider, LoroDropdown, LoroFilterChip, LoroHapticsService, LoroIcon, LoroImage, LoroInput, LoroModal, LoroNotification, LoroNotificationPanel, LoroNotificationRow, LoroProductRow, LoroProductSection, LoroProfileCard, LoroProfileHero, LoroRadio, LoroSegmentedControl, LoroSelect, LoroSpinner, LoroStatCard, LoroStoreRankCard, LoroSummaryBar, LoroTab, LoroTextArea, LoroToast, LoroToggle, LoroUpload };
|
|
1720
|
-
export type { LoroAlertAnnouncement, LoroAlertVariant, LoroAppNavClick, LoroAppNavItem, LoroAuthFieldState, LoroBadgeVariant, LoroButtonColor, LoroButtonIconMode, LoroButtonSize, LoroButtonType, LoroButtonVariant, LoroButtonWidth, LoroCardJustify, LoroCardNavTrailing, LoroCardNavVariant, LoroCardVariant, LoroDividerAlign, LoroDropdownOption, LoroIconAsset, LoroIconAssetName, LoroIconColor, LoroIconColorToken, LoroIconLegacyName, LoroIconName, LoroIconRenderMode, LoroIconSize, LoroImageAsset, LoroImageAssetName, LoroImageLegacyName, LoroImageName, LoroInputState, LoroInputUnit, LoroInputVariant, LoroModalPlacement, LoroModalSize, LoroNotificationItem, LoroProductRowStatus, LoroProductRowVariant, LoroRadioVariant, LoroSegmentedOption, LoroStatCardVariant, LoroStoreRankCardVariant, LoroTabAlign, LoroTabOption, LoroToastPosition, LoroToastVariant };
|
|
1849
|
+
export { Footer, LORO_BUTTON_CLASSES, LORO_BUTTON_COLORS, LORO_BUTTON_DEFAULTS, LORO_BUTTON_ICON_MODES, LORO_BUTTON_SIZES, LORO_BUTTON_TYPES, LORO_BUTTON_VARIANTS, LORO_ICON_ASSETS, LORO_ICON_LEGACY_NAMES, LORO_ICON_PATHS, LORO_IMAGE_ASSETS, LORO_IMAGE_LEGACY_NAMES, LORO_IMAGE_PATHS, LoroAccordion, LoroAlert, LoroAppNav, LoroAssistantCard, LoroAuthField, LoroAuthSocialButton, LoroBadge, LoroButton, LoroCard, LoroCardNav, LoroCheckbox, LoroDashboardCard, LoroDivider, LoroDropdown, LoroFilterChip, LoroHapticsService, LoroIcon, LoroImage, LoroInput, LoroModal, LoroNotification, LoroNotificationPanel, LoroNotificationRow, LoroProductRow, LoroProductSection, LoroProfileCard, LoroProfileHero, LoroRadio, LoroSegmentedControl, LoroSelect, LoroSpinner, LoroStatCard, LoroStoreRankCard, LoroSummaryBar, LoroTab, LoroTextArea, LoroToast, LoroToggle, LoroUpload };
|
|
1850
|
+
export type { LoroAlertAnnouncement, LoroAlertVariant, LoroAppNavClick, LoroAppNavItem, LoroAuthFieldState, LoroBadgeVariant, LoroButtonColor, LoroButtonHtmlType, LoroButtonIconMode, LoroButtonSize, LoroButtonType, LoroButtonVariant, LoroButtonWidth, LoroCardJustify, LoroCardNavTrailing, LoroCardNavVariant, LoroCardVariant, LoroDividerAlign, LoroDropdownOption, LoroIconAsset, LoroIconAssetName, LoroIconColor, LoroIconColorToken, LoroIconLegacyName, LoroIconName, LoroIconRenderMode, LoroIconSize, LoroImageAsset, LoroImageAssetName, LoroImageLegacyName, LoroImageName, LoroInputState, LoroInputUnit, LoroInputVariant, LoroModalPlacement, LoroModalSize, LoroNotificationItem, LoroProductRowStatus, LoroProductRowVariant, LoroRadioVariant, LoroSegmentedOption, LoroStatCardVariant, LoroStoreRankCardVariant, LoroTabAlign, LoroTabOption, LoroToastPosition, LoroToastVariant };
|