@ziadshalaby/ngx-zs-component 2.0.8 → 2.0.9
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/ziadshalaby-ngx-zs-component.mjs +456 -161
- package/fesm2022/ziadshalaby-ngx-zs-component.mjs.map +1 -1
- package/index.d.ts +131 -20
- package/output.css +345 -42
- package/package.json +1 -1
package/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { computed, ElementRef, WritableSignal } from '@angular/core';
|
|
3
|
-
import * as _ziadshalaby_ngx_zs_component from '@ziadshalaby/ngx-zs-component';
|
|
4
3
|
|
|
5
4
|
declare class NgxZsComponent {
|
|
6
5
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxZsComponent, never>;
|
|
@@ -113,20 +112,88 @@ declare class NavItemService {
|
|
|
113
112
|
|
|
114
113
|
type BaseSize = 'sm' | 'md' | 'lg';
|
|
115
114
|
type FormStyle = 'primary' | 'secondary' | 'warning' | 'success' | 'danger' | 'dark' | 'info' | 'violet' | 'teal';
|
|
116
|
-
|
|
115
|
+
declare const unifiedPaletteMap: Map<FormStyle, {
|
|
116
|
+
input: {
|
|
117
|
+
border: string;
|
|
118
|
+
borderHover: string;
|
|
119
|
+
inputBg: string;
|
|
120
|
+
text: string;
|
|
121
|
+
};
|
|
122
|
+
ring: {
|
|
123
|
+
ring: string;
|
|
124
|
+
};
|
|
125
|
+
buttonSolid: {
|
|
126
|
+
btnBG: string;
|
|
127
|
+
btnBGHover: string;
|
|
128
|
+
};
|
|
129
|
+
buttonOutline: {
|
|
130
|
+
border: string;
|
|
131
|
+
btnBGHover: string;
|
|
132
|
+
text: string;
|
|
133
|
+
};
|
|
134
|
+
select: {
|
|
135
|
+
bgSelect: string;
|
|
136
|
+
cleartext: string;
|
|
137
|
+
cleartexthover: string;
|
|
138
|
+
};
|
|
139
|
+
checkbox: {
|
|
140
|
+
checkBoxText: string;
|
|
141
|
+
checkBoxTextHover: string;
|
|
142
|
+
};
|
|
143
|
+
card: {
|
|
144
|
+
border: string;
|
|
145
|
+
borderHover: string;
|
|
146
|
+
};
|
|
147
|
+
modal: {
|
|
148
|
+
border: string;
|
|
149
|
+
text: string;
|
|
150
|
+
};
|
|
151
|
+
page404: {
|
|
152
|
+
btnBG: string;
|
|
153
|
+
btnBGHover: string;
|
|
154
|
+
iconText: string;
|
|
155
|
+
};
|
|
156
|
+
}>;
|
|
157
|
+
declare const inputPaletteMap: Map<FormStyle, {
|
|
117
158
|
border: string;
|
|
118
159
|
borderHover: string;
|
|
119
160
|
inputBg: string;
|
|
120
|
-
|
|
161
|
+
text: string;
|
|
162
|
+
}>;
|
|
163
|
+
declare const ringPaletteMap: Map<FormStyle, {
|
|
121
164
|
ring: string;
|
|
165
|
+
}>;
|
|
166
|
+
declare const buttonSolidPaletteMap: Map<FormStyle, {
|
|
122
167
|
btnBG: string;
|
|
123
168
|
btnBGHover: string;
|
|
169
|
+
}>;
|
|
170
|
+
declare const buttonOutlinePaletteMap: Map<FormStyle, {
|
|
171
|
+
border: string;
|
|
172
|
+
btnBGHover: string;
|
|
124
173
|
text: string;
|
|
125
|
-
|
|
174
|
+
}>;
|
|
175
|
+
declare const selectPaletteMap: Map<FormStyle, {
|
|
176
|
+
bgSelect: string;
|
|
177
|
+
cleartext: string;
|
|
178
|
+
cleartexthover: string;
|
|
179
|
+
}>;
|
|
180
|
+
declare const checkboxTextPaletteMap: Map<FormStyle, {
|
|
126
181
|
checkBoxText: string;
|
|
127
182
|
checkBoxTextHover: string;
|
|
128
|
-
}
|
|
129
|
-
declare const
|
|
183
|
+
}>;
|
|
184
|
+
declare const cardPaletteMap: Map<FormStyle, {
|
|
185
|
+
border: string;
|
|
186
|
+
borderHover: string;
|
|
187
|
+
}>;
|
|
188
|
+
declare const modalPaletteMap: Map<FormStyle, {
|
|
189
|
+
border: string;
|
|
190
|
+
text: string;
|
|
191
|
+
}>;
|
|
192
|
+
declare const page404PaletteMap: Map<FormStyle, {
|
|
193
|
+
btnBG: string;
|
|
194
|
+
btnBGHover: string;
|
|
195
|
+
iconText: string;
|
|
196
|
+
}>;
|
|
130
197
|
type BaseColors = 'slate' | 'gray' | 'zinc' | 'neutral' | 'stone' | 'red' | 'orange' | 'amber' | 'yellow' | 'rose' | 'lime' | 'green' | 'emerald' | 'teal' | 'cyan' | 'sky' | 'blue' | 'indigo' | 'violet' | 'purple' | 'fuchsia' | 'pink';
|
|
131
198
|
type BaseColorPrefixes = 'text' | 'bg' | 'border';
|
|
132
199
|
declare const ColorMapping: Map<BaseColors, Record<BaseColorPrefixes, string>>;
|
|
@@ -271,9 +338,8 @@ declare class Button {
|
|
|
271
338
|
readonly size: _angular_core.InputSignal<BtnSizeType>;
|
|
272
339
|
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
273
340
|
readonly icon: _angular_core.InputSignal<string | null>;
|
|
274
|
-
readonly type: _angular_core.InputSignal<"
|
|
341
|
+
readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
|
|
275
342
|
readonly clickedEv: _angular_core.OutputEmitterRef<Event>;
|
|
276
|
-
readonly palette: _angular_core.Signal<_ziadshalaby_ngx_zs_component.FormPaletteEntry>;
|
|
277
343
|
readonly solidTextColor: _angular_core.Signal<string>;
|
|
278
344
|
readonly baseClasses: _angular_core.Signal<string>;
|
|
279
345
|
private join;
|
|
@@ -328,7 +394,10 @@ declare class Modal {
|
|
|
328
394
|
readonly confirmEv: _angular_core.OutputEmitterRef<void>;
|
|
329
395
|
readonly cancelEv: _angular_core.OutputEmitterRef<void>;
|
|
330
396
|
readonly closedEv: _angular_core.OutputEmitterRef<void>;
|
|
331
|
-
readonly palette: _angular_core.Signal<
|
|
397
|
+
readonly palette: _angular_core.Signal<{
|
|
398
|
+
border: string;
|
|
399
|
+
text: string;
|
|
400
|
+
}>;
|
|
332
401
|
readonly isOpen: _angular_core.WritableSignal<boolean>;
|
|
333
402
|
readonly positionClass: _angular_core.Signal<string>;
|
|
334
403
|
private setTimeId?;
|
|
@@ -413,6 +482,11 @@ declare class Navbar {
|
|
|
413
482
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Navbar, "ZS-navbar", never, { "fixed": { "alias": "fixed"; "required": false; "isSignal": true; }; "logoUrl": { "alias": "logoUrl"; "required": false; "isSignal": true; }; "siteNameConfig": { "alias": "siteNameConfig"; "required": false; "isSignal": true; }; "authButtons": { "alias": "authButtons"; "required": false; "isSignal": true; }; "showUserSection": { "alias": "showUserSection"; "required": false; "isSignal": true; }; "showSearchBar": { "alias": "showSearchBar"; "required": false; "isSignal": true; }; "navItems": { "alias": "navItems"; "required": false; "isSignal": true; }; "isLoggedIn": { "alias": "isLoggedIn"; "required": false; "isSignal": true; }; "userProfile": { "alias": "userProfile"; "required": false; "isSignal": true; }; "userMenuItems": { "alias": "userMenuItems"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; "isSignal": true; }; "isMobileMenuOpen": { "alias": "isMobileMenuOpen"; "required": false; "isSignal": true; }; }, { "loginClickedEv": "loginClickedEv"; "signupClickedEv": "signupClickedEv"; "searchSubmittedEv": "searchSubmittedEv"; "anyItemClickedEv": "anyItemClickedEv"; "searchValue": "searchValueChange"; "isMobileMenuOpen": "isMobileMenuOpenChange"; }, never, never, true, never>;
|
|
414
483
|
}
|
|
415
484
|
|
|
485
|
+
interface Page404StyleType {
|
|
486
|
+
btnBG: string;
|
|
487
|
+
btnBGHover: string;
|
|
488
|
+
iconText: string;
|
|
489
|
+
}
|
|
416
490
|
declare class Page404 {
|
|
417
491
|
readonly title: _angular_core.InputSignal<string>;
|
|
418
492
|
readonly message: _angular_core.InputSignal<string>;
|
|
@@ -421,11 +495,7 @@ declare class Page404 {
|
|
|
421
495
|
readonly showButton: _angular_core.InputSignal<boolean>;
|
|
422
496
|
readonly buttonText: _angular_core.InputSignal<string>;
|
|
423
497
|
readonly routerLink: _angular_core.InputSignal<string>;
|
|
424
|
-
readonly style: _angular_core.Signal<
|
|
425
|
-
btnBG: string;
|
|
426
|
-
btnBgHover: string;
|
|
427
|
-
iconText: string;
|
|
428
|
-
}>;
|
|
498
|
+
readonly style: _angular_core.Signal<Page404StyleType>;
|
|
429
499
|
readonly onAction: _angular_core.OutputEmitterRef<void>;
|
|
430
500
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<Page404, never>;
|
|
431
501
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Page404, "ZS-page404", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "pageStyle": { "alias": "pageStyle"; "required": false; "isSignal": true; }; "showButton": { "alias": "showButton"; "required": false; "isSignal": true; }; "buttonText": { "alias": "buttonText"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; }, { "onAction": "onAction"; }, never, never, true, never>;
|
|
@@ -567,7 +637,15 @@ declare class Checkbox {
|
|
|
567
637
|
readonly variant: _angular_core.InputSignal<ChVariantType>;
|
|
568
638
|
readonly shape: _angular_core.InputSignal<ShapeType>;
|
|
569
639
|
readonly value: _angular_core.ModelSignal<boolean>;
|
|
570
|
-
readonly palette: _angular_core.Signal<
|
|
640
|
+
readonly palette: _angular_core.Signal<{
|
|
641
|
+
checkboxTextPalette: {
|
|
642
|
+
checkBoxText: string;
|
|
643
|
+
checkBoxTextHover: string;
|
|
644
|
+
};
|
|
645
|
+
ringPalette: {
|
|
646
|
+
ring: string;
|
|
647
|
+
};
|
|
648
|
+
}>;
|
|
571
649
|
readonly iconClasses: _angular_core.Signal<string>;
|
|
572
650
|
readonly sizeClass: _angular_core.Signal<string>;
|
|
573
651
|
readonly isChecked: _angular_core.Signal<boolean>;
|
|
@@ -683,7 +761,17 @@ declare class FileInput {
|
|
|
683
761
|
readonly files: _angular_core.ModelSignal<FilesType>;
|
|
684
762
|
readonly touched: _angular_core.ModelSignal<boolean>;
|
|
685
763
|
readonly fileInputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
|
|
686
|
-
readonly palette: _angular_core.Signal<
|
|
764
|
+
readonly palette: _angular_core.Signal<{
|
|
765
|
+
inputPalette: {
|
|
766
|
+
border: string;
|
|
767
|
+
borderHover: string;
|
|
768
|
+
inputBg: string;
|
|
769
|
+
text: string;
|
|
770
|
+
};
|
|
771
|
+
ringPalette: {
|
|
772
|
+
ring: string;
|
|
773
|
+
};
|
|
774
|
+
}>;
|
|
687
775
|
readonly hasFiles: _angular_core.Signal<boolean>;
|
|
688
776
|
readonly totalSize: _angular_core.Signal<number>;
|
|
689
777
|
readonly disabledOrReadonly: _angular_core.Signal<boolean>;
|
|
@@ -743,11 +831,22 @@ declare class Range {
|
|
|
743
831
|
readonly trackRef: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
|
|
744
832
|
readonly dragging: _angular_core.WritableSignal<boolean>;
|
|
745
833
|
readonly disabledOrReadonly: _angular_core.Signal<boolean>;
|
|
746
|
-
readonly palette: _angular_core.Signal<_ziadshalaby_ngx_zs_component.FormPaletteEntry>;
|
|
747
834
|
readonly percent: _angular_core.Signal<number>;
|
|
748
835
|
rangeSizeClasses: (type: "size" | "height") => string;
|
|
749
836
|
readonly dotCLasses: _angular_core.Signal<string>;
|
|
750
837
|
readonly gapCLasses: _angular_core.Signal<string>;
|
|
838
|
+
readonly palette: _angular_core.Signal<{
|
|
839
|
+
buttonSolidPalette: {
|
|
840
|
+
btnBG: string;
|
|
841
|
+
btnBGHover: string;
|
|
842
|
+
};
|
|
843
|
+
inputPalette: {
|
|
844
|
+
border: string;
|
|
845
|
+
borderHover: string;
|
|
846
|
+
inputBg: string;
|
|
847
|
+
text: string;
|
|
848
|
+
};
|
|
849
|
+
}>;
|
|
751
850
|
readonly rangeClasses: _angular_core.Signal<string>;
|
|
752
851
|
readonly ThumbClasses: _angular_core.Signal<string>;
|
|
753
852
|
onMouseDown(event: MouseEvent): void;
|
|
@@ -791,7 +890,19 @@ declare class Select<T> {
|
|
|
791
890
|
readonly selectionClearedEv: _angular_core.OutputEmitterRef<void>;
|
|
792
891
|
readonly isOpen: _angular_core.WritableSignal<boolean>;
|
|
793
892
|
readonly searchQuery: _angular_core.WritableSignal<string | null>;
|
|
794
|
-
readonly styleEntry: _angular_core.Signal<
|
|
893
|
+
readonly styleEntry: _angular_core.Signal<{
|
|
894
|
+
inputEntry: {
|
|
895
|
+
border: string;
|
|
896
|
+
borderHover: string;
|
|
897
|
+
inputBg: string;
|
|
898
|
+
text: string;
|
|
899
|
+
};
|
|
900
|
+
selectEntry: {
|
|
901
|
+
bgSelect: string;
|
|
902
|
+
cleartext: string;
|
|
903
|
+
cleartexthover: string;
|
|
904
|
+
};
|
|
905
|
+
}>;
|
|
795
906
|
readonly disabledOrReadonly: _angular_core.Signal<boolean>;
|
|
796
907
|
readonly filteredItems: _angular_core.Signal<DropdownItem<T>[]>;
|
|
797
908
|
readonly containerClasses: _angular_core.Signal<string>;
|
|
@@ -835,5 +946,5 @@ declare class Toggle {
|
|
|
835
946
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<Toggle, "ZS-toggle", never, { "Id": { "alias": "Id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "isReadonly": { "alias": "isReadonly"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
836
947
|
}
|
|
837
948
|
|
|
838
|
-
export { ALERT_CONFIG, Alert, AlertService, Button, Card, Carousel, Checkbox, ColorMapping, Connection, ExtractorService, FileInput, Form,
|
|
839
|
-
export type { AlertFullType, AlertType, AnimationType, AuthButtonsType, BaseColorPrefixes, BaseColors, BaseSize, BtnSizeType, BtnType, BtnTypeDefault, BulkAlert, ButtonVariant, CarouselItem, ChVariantType, ChangeEventType, DateType, DropdownItem, FileData, FilesType,
|
|
949
|
+
export { ALERT_CONFIG, Alert, AlertService, Button, Card, Carousel, Checkbox, ColorMapping, Connection, ExtractorService, FileInput, Form, Input, InputErrors, Label, Modal, NavItem, NavItemService, Navbar, NgxZsComponent, Page404, Pagination, Range, ScrollToTop, Select, Spinner, ThemeToggle, Toggle, buttonOutlinePaletteMap, buttonSolidPaletteMap, cardPaletteMap, checkboxTextPaletteMap, inputPaletteMap, modalPaletteMap, page404PaletteMap, ringPaletteMap, selectPaletteMap, unifiedPaletteMap };
|
|
950
|
+
export type { AlertFullType, AlertType, AnimationType, AuthButtonsType, BaseColorPrefixes, BaseColors, BaseSize, BtnSizeType, BtnType, BtnTypeDefault, BulkAlert, ButtonVariant, CarouselItem, ChVariantType, ChangeEventType, DateType, DropdownItem, FileData, FilesType, FormStyle, FormatterFn, InputType, ItemShapeType, LoaderType, NavbarItem, NavbarItemExport, NewAlert, OldAlertsType, Position, PositionClassType, PositionType, ShapeType, SiteNameConfigType, UserProfile, ValidatorFn, VariantType, ZFormField, ZFormFieldMap, navItemsType, themeTypes };
|