@iamgld/ui 21.2.0 → 21.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.
Files changed (4) hide show
  1. package/fesm2022/iamgld-ui.mjs +398 -407
  2. package/fesm2022/iamgld-ui.mjs.map +1 -1
  3. package/package.json +6 -6
  4. package/types/iamgld-ui.d.ts +387 -181
package/fesm2022/iamgld-ui.mjs CHANGED
@@ -11,203 +11,183 @@ import { signalStore, withState, withMethods, patchState, withHooks, watchState
11
11
  import { HttpClient, HttpParams } from '@angular/common/http';
12
12
  import { TranslocoService } from '@jsverse/transloco';
13
13
 
14
- var ButtonColor;
15
- (function (ButtonColor) {
16
- ButtonColor["pink"] = "pink";
17
- ButtonColor["purple"] = "purple";
18
- ButtonColor["mustard"] = "mustard";
19
- ButtonColor["orange"] = "orange";
20
- ButtonColor["red"] = "red";
21
- ButtonColor["blue"] = "blue";
22
- ButtonColor["green"] = "green";
23
- })(ButtonColor || (ButtonColor = {}));
24
- var ButtonSize;
25
- (function (ButtonSize) {
26
- ButtonSize["tiny"] = "tiny";
27
- ButtonSize["small"] = "small";
28
- ButtonSize["normal"] = "normal";
29
- ButtonSize["medium"] = "medium";
30
- ButtonSize["large"] = "large";
31
- })(ButtonSize || (ButtonSize = {}));
32
-
33
- var DropdownType;
34
- (function (DropdownType) {
35
- DropdownType["button"] = "button";
36
- DropdownType["iconButton"] = "iconButton";
37
- })(DropdownType || (DropdownType = {}));
38
- var DropdownDirection;
39
- (function (DropdownDirection) {
40
- DropdownDirection["left"] = "left";
41
- DropdownDirection["right"] = "right";
42
- })(DropdownDirection || (DropdownDirection = {}));
43
-
44
- var LinkType;
45
- (function (LinkType) {
46
- LinkType["default"] = "default";
47
- })(LinkType || (LinkType = {}));
48
- var LinkAlign;
49
- (function (LinkAlign) {
50
- LinkAlign["left"] = "left";
51
- LinkAlign["right"] = "right";
52
- LinkAlign["center"] = "center";
53
- })(LinkAlign || (LinkAlign = {}));
54
-
55
- var RadioDirection;
56
- (function (RadioDirection) {
57
- RadioDirection["horizontal"] = "horizontal";
58
- RadioDirection["vertical"] = "vertical";
59
- })(RadioDirection || (RadioDirection = {}));
60
-
61
- var SelectType;
62
- (function (SelectType) {
63
- SelectType["default"] = "default";
64
- SelectType["inline"] = "inline";
65
- })(SelectType || (SelectType = {}));
66
-
67
- var Icons;
68
- (function (Icons) {
69
- Icons["arrowDownSLine"] = "arrow-down-s-line";
70
- Icons["arrowUpSLine"] = "arrow-up-s-line";
71
- Icons["checkboxCircleLine"] = "checkbox-circle-line";
72
- Icons["checkboxBlankCircleLine"] = "checkbox-blank-circle-line";
73
- Icons["loader4Fill"] = "loader-4-fill";
74
- Icons["logoutCircleLine"] = "ri-logout-circle-line";
75
- Icons["loginCircleLine"] = "ri-login-circle-line";
76
- Icons["gitRepositoryLine"] = "ri-git-repository-line";
77
- Icons["fileList3Line"] = "ri-file-list-3-line";
78
- Icons["menuLine"] = "ri-menu-line";
79
- Icons["sunLine"] = "ri-sun-line";
80
- Icons["moonClearLine"] = "ri-moon-clear-line";
81
- Icons["englishInput"] = "ri-english-input";
82
- Icons["translate"] = "ri-translate";
83
- Icons["user4Line"] = "ri-user-4-line";
84
- Icons["shapesLine"] = "ri-shapes-line";
85
- Icons["closeLine"] = "ri-close-line";
86
- Icons["eyeLine"] = "ri-eye-line";
87
- Icons["eyeCloseLine"] = "ri-eye-close-line";
88
- Icons["linkedinBoxFill"] = "ri-linkedin-box-fill";
89
- Icons["githubFill"] = "ri-github-fill";
90
- Icons["instagramFill"] = "ri-instagram-fill";
91
- Icons["twitterXFill"] = "ri-twitter-x-fill";
92
- Icons["downloadCloud2Line"] = "ri-download-cloud-2-line";
93
- Icons["globeLine"] = "ri-globe-line";
94
- Icons["mailSendLine"] = "ri-mail-send-line";
95
- Icons["pagesLine"] = "ri-pages-line";
96
- Icons["gitForkLine"] = "ri-git-fork-line";
97
- Icons["gitRepositoryPrivateLine"] = "ri-git-repository-private-line";
98
- Icons["starLine"] = "ri-star-line";
99
- Icons["calendar2Line"] = "ri-calendar-2-line";
100
- Icons["macLine"] = "ri-mac-line";
101
- Icons["more2Fill"] = "ri-more-2-fill";
102
- Icons["editLine"] = "ri-edit-line";
103
- Icons["deleteBinLine"] = "ri-delete-bin-line";
104
- })(Icons || (Icons = {}));
105
- var IconsSize;
106
- (function (IconsSize) {
107
- IconsSize["tiny"] = "tiny";
108
- IconsSize["small"] = "small";
109
- IconsSize["normal"] = "normal";
110
- IconsSize["medium"] = "medium";
111
- IconsSize["large"] = "large";
112
- })(IconsSize || (IconsSize = {}));
113
- var IconsSpace;
114
- (function (IconsSpace) {
115
- IconsSpace["left"] = "left";
116
- IconsSpace["right"] = "right";
117
- IconsSpace["none"] = "none";
118
- })(IconsSpace || (IconsSpace = {}));
119
-
120
- var TableColumnActionType;
121
- (function (TableColumnActionType) {
122
- TableColumnActionType["show"] = "show";
123
- TableColumnActionType["open"] = "open";
124
- TableColumnActionType["update"] = "update";
125
- TableColumnActionType["delete"] = "delete";
126
- })(TableColumnActionType || (TableColumnActionType = {}));
127
- var TableSearchAction;
128
- (function (TableSearchAction) {
129
- TableSearchAction["searching"] = "searching";
130
- TableSearchAction["cleared"] = "cleared";
131
- })(TableSearchAction || (TableSearchAction = {}));
132
-
133
- var TileColor;
134
- (function (TileColor) {
135
- TileColor["default"] = "default";
136
- TileColor["pink"] = "pink";
137
- TileColor["purple"] = "purple";
138
- TileColor["mustard"] = "mustard";
139
- TileColor["orange"] = "orange";
140
- TileColor["red"] = "red";
141
- TileColor["blue"] = "blue";
142
- TileColor["green"] = "green";
143
- })(TileColor || (TileColor = {}));
144
- var TilePaddingSize;
145
- (function (TilePaddingSize) {
146
- TilePaddingSize["zero"] = "zero";
147
- TilePaddingSize["tiny"] = "tiny";
148
- TilePaddingSize["small"] = "small";
149
- TilePaddingSize["normal"] = "normal";
150
- TilePaddingSize["medium"] = "medium";
151
- TilePaddingSize["large"] = "large";
152
- })(TilePaddingSize || (TilePaddingSize = {}));
153
-
154
- var CookiesKeys;
155
- (function (CookiesKeys) {
156
- CookiesKeys["accessToken"] = "gld-access-token";
157
- CookiesKeys["refreshToken"] = "gld-refresh-token";
158
- })(CookiesKeys || (CookiesKeys = {}));
159
-
160
- var EnvironmentType;
161
- (function (EnvironmentType) {
162
- EnvironmentType["production"] = "production";
163
- EnvironmentType["staging"] = "staging";
164
- EnvironmentType["development"] = "development";
165
- EnvironmentType["local"] = "local";
166
- })(EnvironmentType || (EnvironmentType = {}));
167
-
168
- var TranslocoLanguageKey;
169
- (function (TranslocoLanguageKey) {
170
- TranslocoLanguageKey["spanish"] = "es";
171
- TranslocoLanguageKey["english"] = "en";
172
- })(TranslocoLanguageKey || (TranslocoLanguageKey = {}));
173
- var TranslocoLanguageName;
174
- (function (TranslocoLanguageName) {
175
- TranslocoLanguageName["spanish"] = "spanish";
176
- TranslocoLanguageName["english"] = "english";
177
- })(TranslocoLanguageName || (TranslocoLanguageName = {}));
178
-
179
- var UiTheme;
180
- (function (UiTheme) {
181
- UiTheme["dark"] = "theme--dark";
182
- UiTheme["light"] = "theme--light";
183
- UiTheme["system"] = "theme--system";
184
- })(UiTheme || (UiTheme = {}));
14
+ const BUTTON_COLORS = {
15
+ pink: 'pink',
16
+ purple: 'purple',
17
+ mustard: 'mustard',
18
+ orange: 'orange',
19
+ red: 'red',
20
+ blue: 'blue',
21
+ green: 'green',
22
+ };
23
+ const BUTTON_SIZES = {
24
+ tiny: 'tiny',
25
+ small: 'small',
26
+ normal: 'normal',
27
+ medium: 'medium',
28
+ large: 'large',
29
+ };
30
+
31
+ const DROPDOWN_TYPES = {
32
+ button: 'button',
33
+ iconButton: 'iconButton',
34
+ };
35
+ const DROPDOWN_DIRECTIONS = {
36
+ left: 'left',
37
+ right: 'right',
38
+ };
39
+
40
+ const LINK_TYPES = {
41
+ default: 'default',
42
+ };
43
+ const LINK_ALIGNS = {
44
+ left: 'left',
45
+ right: 'right',
46
+ center: 'center',
47
+ };
48
+
49
+ const RADIO_DIRECTIONS = {
50
+ horizontal: 'horizontal',
51
+ vertical: 'vertical',
52
+ };
53
+
54
+ const SELECT_TYPES = {
55
+ default: 'default',
56
+ inline: 'inline',
57
+ };
58
+
59
+ const ICONS = {
60
+ arrowDownSLine: 'arrow-down-s-line',
61
+ arrowUpSLine: 'arrow-up-s-line',
62
+ checkboxCircleLine: 'checkbox-circle-line',
63
+ checkboxBlankCircleLine: 'checkbox-blank-circle-line',
64
+ loader4Fill: 'loader-4-fill',
65
+ logoutCircleLine: 'ri-logout-circle-line',
66
+ loginCircleLine: 'ri-login-circle-line',
67
+ gitRepositoryLine: 'ri-git-repository-line',
68
+ fileList3Line: 'ri-file-list-3-line',
69
+ menuLine: 'ri-menu-line',
70
+ sunLine: 'ri-sun-line',
71
+ moonClearLine: 'ri-moon-clear-line',
72
+ englishInput: 'ri-english-input',
73
+ translate: 'ri-translate',
74
+ user4Line: 'ri-user-4-line',
75
+ shapesLine: 'ri-shapes-line',
76
+ closeLine: 'ri-close-line',
77
+ eyeLine: 'ri-eye-line',
78
+ eyeCloseLine: 'ri-eye-close-line',
79
+ linkedinBoxFill: 'ri-linkedin-box-fill',
80
+ githubFill: 'ri-github-fill',
81
+ instagramFill: 'ri-instagram-fill',
82
+ twitterXFill: 'ri-twitter-x-fill',
83
+ downloadCloud2Line: 'ri-download-cloud-2-line',
84
+ globeLine: 'ri-globe-line',
85
+ mailSendLine: 'ri-mail-send-line',
86
+ pagesLine: 'ri-pages-line',
87
+ gitForkLine: 'ri-git-fork-line',
88
+ gitRepositoryPrivateLine: 'ri-git-repository-private-line',
89
+ starLine: 'ri-star-line',
90
+ calendar2Line: 'ri-calendar-2-line',
91
+ macLine: 'ri-mac-line',
92
+ more2Fill: 'ri-more-2-fill',
93
+ editLine: 'ri-edit-line',
94
+ deleteBinLine: 'ri-delete-bin-line',
95
+ };
96
+ const ICONS_SIZES = {
97
+ tiny: 'tiny',
98
+ small: 'small',
99
+ normal: 'normal',
100
+ medium: 'medium',
101
+ large: 'large',
102
+ };
103
+ const ICONS_SPACES = {
104
+ left: 'left',
105
+ right: 'right',
106
+ none: 'none',
107
+ };
108
+
109
+ const TABLE_COLUMN_ACTION_TYPES = {
110
+ show: 'show',
111
+ open: 'open',
112
+ update: 'update',
113
+ delete: 'delete',
114
+ };
115
+ const TABLE_SEARCH_ACTIONS = {
116
+ searching: 'searching',
117
+ cleared: 'cleared',
118
+ };
119
+
120
+ const TILE_COLORS = {
121
+ default: 'default',
122
+ pink: 'pink',
123
+ purple: 'purple',
124
+ mustard: 'mustard',
125
+ orange: 'orange',
126
+ red: 'red',
127
+ blue: 'blue',
128
+ green: 'green',
129
+ };
130
+ const TILE_PADDING_SIZES = {
131
+ zero: 'zero',
132
+ tiny: 'tiny',
133
+ small: 'small',
134
+ normal: 'normal',
135
+ medium: 'medium',
136
+ large: 'large',
137
+ };
138
+
139
+ const COOKIES_KEYS = {
140
+ accessToken: 'gld-access-token',
141
+ refreshToken: 'gld-refresh-token',
142
+ };
143
+
144
+ const ENVIRONMENT_TYPES = {
145
+ production: 'production',
146
+ staging: 'staging',
147
+ development: 'development',
148
+ local: 'local',
149
+ };
150
+
151
+ const UI_THEMES = {
152
+ dark: 'theme--dark',
153
+ light: 'theme--light',
154
+ system: 'theme--system',
155
+ };
185
156
  const THEMES = [
186
157
  {
187
158
  label: 'light',
188
- icon: Icons.sunLine,
189
- value: UiTheme.light,
159
+ icon: ICONS.sunLine,
160
+ value: UI_THEMES.light,
190
161
  },
191
162
  {
192
163
  label: 'dark',
193
- icon: Icons.moonClearLine,
194
- value: UiTheme.dark,
164
+ icon: ICONS.moonClearLine,
165
+ value: UI_THEMES.dark,
195
166
  },
196
167
  {
197
168
  label: 'system',
198
- icon: Icons.macLine,
199
- value: UiTheme.system,
169
+ icon: ICONS.macLine,
170
+ value: UI_THEMES.system,
200
171
  },
201
172
  ];
202
173
 
174
+ const TRANSLOCO_LANGUAGE_KEYS = {
175
+ spanish: 'es',
176
+ english: 'en',
177
+ };
178
+ const TRANSLOCO_LANGUAGE_NAMES = {
179
+ spanish: 'spanish',
180
+ english: 'english',
181
+ };
182
+
203
183
  // Angular Imports
204
184
  class Icon {
205
185
  constructor() {
206
- this.IconsSpace = IconsSpace;
207
- this.Icons = Icons;
208
- this.icon = input.required({ ...(ngDevMode ? { debugName: "icon" } : {}) });
209
- this.size = input(IconsSize.normal, { ...(ngDevMode ? { debugName: "size" } : {}) });
210
- this.space = input(IconsSpace.none, { ...(ngDevMode ? { debugName: "space" } : {}) });
186
+ this.ICONS_SPACES = ICONS_SPACES;
187
+ this.ICONS = ICONS;
188
+ this.icon = input.required(...(ngDevMode ? [{ debugName: "icon" }] : []));
189
+ this.size = input(ICONS_SIZES.normal, ...(ngDevMode ? [{ debugName: "size" }] : []));
190
+ this.space = input(ICONS_SPACES.none, ...(ngDevMode ? [{ debugName: "space" }] : []));
211
191
  this.moveTopToBottom = input(0, { ...(ngDevMode ? { debugName: "moveTopToBottom" } : {}), transform: numberAttribute });
212
192
  this.moveLeftToRight = input(0, { ...(ngDevMode ? { debugName: "moveLeftToRight" } : {}), transform: numberAttribute });
213
193
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
@@ -220,12 +200,12 @@ class Icon {
220
200
  keyup() {
221
201
  this.emitClick();
222
202
  }
223
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Icon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
224
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Icon, isStandalone: true, selector: "gld-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<span\n tabindex=\"-1\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n class=\"icon icon--{{ size() }}\"\n [class.icon--left]=\"space() === IconsSpace.left\"\n [class.icon--right]=\"space() === IconsSpace.right\"\n [style.right.px]=\"moveLeftToRight()\"\n [style.top.px]=\"moveTopToBottom()\">\n @switch (icon()) {\n @case (Icons.arrowDownSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z\"></path>\n </svg>\n }\n @case (Icons.arrowUpSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z\"></path>\n </svg>\n }\n @case (Icons.checkboxCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z\"></path>\n </svg>\n }\n @case (Icons.checkboxBlankCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z\"></path>\n </svg>\n }\n @case (Icons.loader4Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z\"></path>\n </svg>\n }\n @case (Icons.logoutCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 11H13V13H5V16L0 12L5 8V11ZM3.99927 18H6.70835C8.11862 19.2447 9.97111 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C9.97111 4 8.11862 4.75527 6.70835 6H3.99927C5.82368 3.57111 8.72836 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C8.72836 22 5.82368 20.4289 3.99927 18Z\"></path>\n </svg>\n }\n @case (Icons.loginCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 11V8L15 12L10 16V13H1V11H10ZM2.4578 15H4.58152C5.76829 17.9318 8.64262 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C8.64262 4 5.76829 6.06817 4.58152 9H2.4578C3.73207 4.94289 7.52236 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C7.52236 22 3.73207 19.0571 2.4578 15Z\"></path>\n </svg>\n }\n @case (Icons.gitRepositoryLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 21V23.5L10 21.5L7 23.5V21H6.5C4.567 21 3 19.433 3 17.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V20C21 20.5523 20.5523 21 20 21H13ZM13 19H19V16H6.5C5.67157 16 5 16.6716 5 17.5C5 18.3284 5.67157 19 6.5 19H7V17H13V19ZM19 14V4H6V14.0354C6.1633 14.0121 6.33024 14 6.5 14H19ZM7 5H9V7H7V5ZM7 8H9V10H7V8ZM7 11H9V13H7V11Z\"></path>\n </svg>\n }\n @case (Icons.fileList3Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M19 22H5C3.34315 22 2 20.6569 2 19V3C2 2.44772 2.44772 2 3 2H17C17.5523 2 18 2.44772 18 3V15H22V19C22 20.6569 20.6569 22 19 22ZM18 17V19C18 19.5523 18.4477 20 19 20C19.5523 20 20 19.5523 20 19V17H18ZM16 20V4H4V19C4 19.5523 4.44772 20 5 20H16ZM6 7H14V9H6V7ZM6 11H14V13H6V11ZM6 15H11V17H6V15Z\"></path>\n </svg>\n }\n @case (Icons.menuLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z\"></path>\n </svg>\n }\n @case (Icons.sunLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z\"></path>\n </svg>\n }\n @case (Icons.moonClearLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 6C10 10.4183 13.5817 14 18 14C19.4386 14 20.7885 13.6203 21.9549 12.9556C21.4738 18.0302 17.2005 22 12 22C6.47715 22 2 17.5228 2 12C2 6.79948 5.9698 2.52616 11.0444 2.04507C10.3797 3.21152 10 4.56142 10 6ZM4 12C4 16.4183 7.58172 20 12 20C14.9654 20 17.5757 18.3788 18.9571 15.9546C18.6407 15.9848 18.3214 16 18 16C12.4772 16 8 11.5228 8 6C8 5.67863 8.01524 5.35933 8.04536 5.04293C5.62119 6.42426 4 9.03458 4 12ZM18.1642 2.29104L19 2.5V3.5L18.1642 3.70896C17.4476 3.8881 16.8881 4.4476 16.709 5.16417L16.5 6H15.5L15.291 5.16417C15.1119 4.4476 14.5524 3.8881 13.8358 3.70896L13 3.5V2.5L13.8358 2.29104C14.5524 2.1119 15.1119 1.5524 15.291 0.835829L15.5 0H16.5L16.709 0.835829C16.8881 1.5524 17.4476 2.1119 18.1642 2.29104ZM23.1642 7.29104L24 7.5V8.5L23.1642 8.70896C22.4476 8.8881 21.8881 9.4476 21.709 10.1642L21.5 11H20.5L20.291 10.1642C20.1119 9.4476 19.5524 8.8881 18.8358 8.70896L18 8.5V7.5L18.8358 7.29104C19.5524 7.1119 20.1119 6.5524 20.291 5.83583L20.5 5H21.5L21.709 5.83583C21.8881 6.5524 22.4476 7.1119 23.1642 7.29104Z\"></path>\n </svg>\n }\n @case (Icons.englishInput) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 10H16L16.0005 10.7574C16.7154 10.279 17.5751 10 18.5 10C20.9853 10 23 12.0147 23 14.5V20H21V14.5C21 13.07 19.8255 12 18.5 12C17.1745 12 16 13.07 16 14.5V20H14V10ZM12 4V6H4V11H12V13H4V18H12V20H2V4H12Z\"></path>\n </svg>\n }\n @case (Icons.translate) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 15V17C5 18.0544 5.81588 18.9182 6.85074 18.9945L7 19H10V21H7C4.79086 21 3 19.2091 3 17V15H5ZM18 10L22.4 21H20.245L19.044 18H14.954L13.755 21H11.601L16 10H18ZM17 12.8852L15.753 16H18.245L17 12.8852ZM8 2V4H12V11H8V14H6V11H2V4H6V2H8ZM17 3C19.2091 3 21 4.79086 21 7V9H19V7C19 5.89543 18.1046 5 17 5H14V3H17ZM6 6H4V9H6V6ZM10 6H8V9H10V6Z\"></path>\n </svg>\n }\n @case (Icons.user4Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 20H19V22H5V20ZM12 18C7.58172 18 4 14.4183 4 10C4 5.58172 7.58172 2 12 2C16.4183 2 20 5.58172 20 10C20 14.4183 16.4183 18 12 18ZM12 16C15.3137 16 18 13.3137 18 10C18 6.68629 15.3137 4 12 4C8.68629 4 6 6.68629 6 10C6 13.3137 8.68629 16 12 16Z\"></path>\n </svg>\n }\n @case (Icons.shapesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9998 1L6 11H18L11.9998 1ZM11.9998 4.8873L14.4676 9H9.53232L11.9998 4.8873ZM6.75 20C5.23122 20 4 18.7688 4 17.25C4 15.7312 5.23122 14.5 6.75 14.5C8.26878 14.5 9.5 15.7312 9.5 17.25C9.5 18.7688 8.26878 20 6.75 20ZM6.75 22C9.37335 22 11.5 19.8734 11.5 17.25C11.5 14.6266 9.37335 12.5 6.75 12.5C4.12665 12.5 2 14.6266 2 17.25C2 19.8734 4.12665 22 6.75 22ZM15 15.5V19.5H19V15.5H15ZM13 21.5V13.5H21V21.5H13Z\"></path>\n </svg>\n }\n @case (Icons.closeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z\"></path>\n </svg>\n }\n @case (Icons.eyeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z\"></path>\n </svg>\n }\n @case (Icons.eyeCloseLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9.34268 18.7819L7.41083 18.2642L8.1983 15.3254C7.00919 14.8874 5.91661 14.2498 4.96116 13.4534L2.80783 15.6067L1.39362 14.1925L3.54695 12.0392C2.35581 10.6103 1.52014 8.87466 1.17578 6.96818L3.14386 6.61035C3.90289 10.8126 7.57931 14.0001 12.0002 14.0001C16.4211 14.0001 20.0976 10.8126 20.8566 6.61035L22.8247 6.96818C22.4803 8.87466 21.6446 10.6103 20.4535 12.0392L22.6068 14.1925L21.1926 15.6067L19.0393 13.4534C18.0838 14.2498 16.9912 14.8874 15.8021 15.3254L16.5896 18.2642L14.6578 18.7819L13.87 15.8418C13.2623 15.9459 12.6376 16.0001 12.0002 16.0001C11.3629 16.0001 10.7381 15.9459 10.1305 15.8418L9.34268 18.7819Z\"></path>\n </svg>\n }\n @case (Icons.linkedinBoxFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.3362 18.339H15.6707V14.1622C15.6707 13.1662 15.6505 11.8845 14.2817 11.8845C12.892 11.8845 12.6797 12.9683 12.6797 14.0887V18.339H10.0142V9.75H12.5747V10.9207H12.6092C12.967 10.2457 13.837 9.53325 15.1367 9.53325C17.8375 9.53325 18.337 11.3108 18.337 13.6245V18.339H18.3362ZM7.00373 8.57475C6.14573 8.57475 5.45648 7.88025 5.45648 7.026C5.45648 6.1725 6.14648 5.47875 7.00373 5.47875C7.85873 5.47875 8.55173 6.1725 8.55173 7.026C8.55173 7.88025 7.85798 8.57475 7.00373 8.57475ZM8.34023 18.339H5.66723V9.75H8.34023V18.339ZM19.6697 3H4.32923C3.59498 3 3.00098 3.5805 3.00098 4.29675V19.7033C3.00098 20.4202 3.59498 21 4.32923 21H19.6675C20.401 21 21.001 20.4202 21.001 19.7033V4.29675C21.001 3.5805 20.401 3 19.6675 3H19.6697Z\"></path>\n </svg>\n }\n @case (Icons.githubFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.001 2C6.47598 2 2.00098 6.475 2.00098 12C2.00098 16.425 4.86348 20.1625 8.83848 21.4875C9.33848 21.575 9.52598 21.275 9.52598 21.0125C9.52598 20.775 9.51348 19.9875 9.51348 19.15C7.00098 19.6125 6.35098 18.5375 6.15098 17.975C6.03848 17.6875 5.55098 16.8 5.12598 16.5625C4.77598 16.375 4.27598 15.9125 5.11348 15.9C5.90098 15.8875 6.46348 16.625 6.65098 16.925C7.55098 18.4375 8.98848 18.0125 9.56348 17.75C9.65098 17.1 9.91348 16.6625 10.201 16.4125C7.97598 16.1625 5.65098 15.3 5.65098 11.475C5.65098 10.3875 6.03848 9.4875 6.67598 8.7875C6.57598 8.5375 6.22598 7.5125 6.77598 6.1375C6.77598 6.1375 7.61348 5.875 9.52598 7.1625C10.326 6.9375 11.176 6.825 12.026 6.825C12.876 6.825 13.726 6.9375 14.526 7.1625C16.4385 5.8625 17.276 6.1375 17.276 6.1375C17.826 7.5125 17.476 8.5375 17.376 8.7875C18.0135 9.4875 18.401 10.375 18.401 11.475C18.401 15.3125 16.0635 16.1625 13.8385 16.4125C14.201 16.725 14.5135 17.325 14.5135 18.2625C14.5135 19.6 14.501 20.675 14.501 21.0125C14.501 21.275 14.6885 21.5875 15.1885 21.4875C19.259 20.1133 21.9999 16.2963 22.001 12C22.001 6.475 17.526 2 12.001 2Z\"></path>\n </svg>\n }\n @case (Icons.instagramFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0281 2.00073C14.1535 2.00259 14.7238 2.00855 15.2166 2.02322L15.4107 2.02956C15.6349 2.03753 15.8561 2.04753 16.1228 2.06003C17.1869 2.1092 17.9128 2.27753 18.5503 2.52503C19.2094 2.7792 19.7661 3.12253 20.3219 3.67837C20.8769 4.2342 21.2203 4.79253 21.4753 5.45003C21.7219 6.0867 21.8903 6.81337 21.9403 7.87753C21.9522 8.1442 21.9618 8.3654 21.9697 8.58964L21.976 8.78373C21.9906 9.27647 21.9973 9.84686 21.9994 10.9723L22.0002 11.7179C22.0003 11.809 22.0003 11.903 22.0003 12L22.0002 12.2821L21.9996 13.0278C21.9977 14.1532 21.9918 14.7236 21.9771 15.2163L21.9707 15.4104C21.9628 15.6347 21.9528 15.8559 21.9403 16.1225C21.8911 17.1867 21.7219 17.9125 21.4753 18.55C21.2211 19.2092 20.8769 19.7659 20.3219 20.3217C19.7661 20.8767 19.2069 21.22 18.5503 21.475C17.9128 21.7217 17.1869 21.89 16.1228 21.94C15.8561 21.9519 15.6349 21.9616 15.4107 21.9694L15.2166 21.9757C14.7238 21.9904 14.1535 21.997 13.0281 21.9992L12.2824 22C12.1913 22 12.0973 22 12.0003 22L11.7182 22L10.9725 21.9993C9.8471 21.9975 9.27672 21.9915 8.78397 21.9768L8.58989 21.9705C8.36564 21.9625 8.14444 21.9525 7.87778 21.94C6.81361 21.8909 6.08861 21.7217 5.45028 21.475C4.79194 21.2209 4.23444 20.8767 3.67861 20.3217C3.12278 19.7659 2.78028 19.2067 2.52528 18.55C2.27778 17.9125 2.11028 17.1867 2.06028 16.1225C2.0484 15.8559 2.03871 15.6347 2.03086 15.4104L2.02457 15.2163C2.00994 14.7236 2.00327 14.1532 2.00111 13.0278L2.00098 10.9723C2.00284 9.84686 2.00879 9.27647 2.02346 8.78373L2.02981 8.58964C2.03778 8.3654 2.04778 8.1442 2.06028 7.87753C2.10944 6.81253 2.27778 6.08753 2.52528 5.45003C2.77944 4.7917 3.12278 4.2342 3.67861 3.67837C4.23444 3.12253 4.79278 2.78003 5.45028 2.52503C6.08778 2.27753 6.81278 2.11003 7.87778 2.06003C8.14444 2.04816 8.36564 2.03847 8.58989 2.03062L8.78397 2.02433C9.27672 2.00969 9.8471 2.00302 10.9725 2.00086L13.0281 2.00073ZM12.0003 7.00003C9.23738 7.00003 7.00028 9.23956 7.00028 12C7.00028 14.7629 9.23981 17 12.0003 17C14.7632 17 17.0003 14.7605 17.0003 12C17.0003 9.23713 14.7607 7.00003 12.0003 7.00003ZM12.0003 9.00003C13.6572 9.00003 15.0003 10.3427 15.0003 12C15.0003 13.6569 13.6576 15 12.0003 15C10.3434 15 9.00028 13.6574 9.00028 12C9.00028 10.3431 10.3429 9.00003 12.0003 9.00003ZM17.2503 5.50003C16.561 5.50003 16.0003 6.05994 16.0003 6.74918C16.0003 7.43843 16.5602 7.9992 17.2503 7.9992C17.9395 7.9992 18.5003 7.4393 18.5003 6.74918C18.5003 6.05994 17.9386 5.49917 17.2503 5.50003Z\"></path>\n </svg>\n }\n @case (Icons.twitterXFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17.6874 3.0625L12.6907 8.77425L8.37045 3.0625H2.11328L9.58961 12.8387L2.50378 20.9375H5.53795L11.0068 14.6886L15.7863 20.9375H21.8885L14.095 10.6342L20.7198 3.0625H17.6874ZM16.6232 19.1225L5.65436 4.78217H7.45745L18.3034 19.1225H16.6232Z\"></path>\n </svg>\n }\n @case (Icons.downloadCloud2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 13V18.585L14.8284 16.7574L16.2426 18.1716L12 22.4142L7.75736 18.1716L9.17157 16.7574L11 18.585V13H13ZM12 2C15.5934 2 18.5544 4.70761 18.9541 8.19395C21.2858 8.83154 23 10.9656 23 13.5C23 16.3688 20.8036 18.7246 18.0006 18.9776L18.0009 16.9644C19.6966 16.7214 21 15.2629 21 13.5C21 11.567 19.433 10 17.5 10C17.2912 10 17.0867 10.0183 16.8887 10.054C16.9616 9.7142 17 9.36158 17 9C17 6.23858 14.7614 4 12 4C9.23858 4 7 6.23858 7 9C7 9.36158 7.03838 9.7142 7.11205 10.0533C6.91331 10.0183 6.70879 10 6.5 10C4.567 10 3 11.567 3 13.5C3 15.2003 4.21241 16.6174 5.81986 16.934L6.00005 16.9646L6.00039 18.9776C3.19696 18.7252 1 16.3692 1 13.5C1 10.9656 2.71424 8.83154 5.04648 8.19411C5.44561 4.70761 8.40661 2 12 2Z\"></path>\n </svg>\n }\n @case (Icons.globeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0003 21H18.0003V23H6.00032V21H11.0003V19.9506C7.70689 19.6236 4.88351 17.6987 3.31641 14.9622L5.05319 13.9697C6.43208 16.3776 9.02674 18 12.0003 18C16.4186 18 20.0003 14.4182 20.0003 9.99995C20.0003 7.02637 18.378 4.43171 15.9701 3.05282L16.9626 1.31604C19.9724 3.03965 22.0003 6.28297 22.0003 9.99995C22.0003 15.1853 18.0536 19.4489 13.0003 19.9506V21ZM12.0003 17C8.13433 17 5.00032 13.8659 5.00032 9.99995C5.00032 6.13396 8.13433 2.99995 12.0003 2.99995C15.8663 2.99995 19.0003 6.13396 19.0003 9.99995C19.0003 13.8659 15.8663 17 12.0003 17ZM12.0003 15C14.7617 15 17.0003 12.7614 17.0003 9.99995C17.0003 7.23853 14.7617 4.99995 12.0003 4.99995C9.2389 4.99995 7.00032 7.23853 7.00032 9.99995C7.00032 12.7614 9.2389 15 12.0003 15Z\"></path>\n </svg>\n }\n @case (Icons.mailSendLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M21 3C21.5523 3 22 3.44772 22 4V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V19H20V7.3L12 14.5L2 5.5V4C2 3.44772 2.44772 3 3 3H21ZM8 15V17H0V15H8ZM5 10V12H0V10H5ZM19.5659 5H4.43414L12 11.8093L19.5659 5Z\"></path>\n </svg>\n }\n @case (Icons.pagesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 8V20H19V8H5ZM5 6H19V4H5V6ZM20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM7 10H11V14H7V10ZM7 16H17V18H7V16ZM13 11H17V13H13V11Z\"></path>\n </svg>\n }\n @case (Icons.gitForkLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 5C5.44772 5 5 5.44772 5 6C5 6.55228 5.44772 7 6 7C6.55228 7 7 6.55228 7 6C7 5.44772 6.55228 5 6 5ZM3 6C3 4.34315 4.34315 3 6 3C7.65685 3 9 4.34315 9 6C9 7.30622 8.16519 8.41746 7 8.82929V9C7 10.1046 7.89543 11 9 11H15C16.1046 11 17 10.1046 17 9V8.82929C15.8348 8.41746 15 7.30622 15 6C15 4.34315 16.3431 3 18 3C19.6569 3 21 4.34315 21 6C21 7.30622 20.1652 8.41746 19 8.82929V9C19 11.2091 17.2091 13 15 13H13V15.1707C14.1652 15.5825 15 16.6938 15 18C15 19.6569 13.6569 21 12 21C10.3431 21 9 19.6569 9 18C9 16.6938 9.83481 15.5825 11 15.1707V13H9C6.79086 13 5 11.2091 5 9V8.82929C3.83481 8.41746 3 7.30622 3 6ZM18 5C17.4477 5 17 5.44772 17 6C17 6.55228 17.4477 7 18 7C18.5523 7 19 6.55228 19 6C19 5.44772 18.5523 5 18 5ZM12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18C13 17.4477 12.5523 17 12 17Z\"></path>\n </svg>\n }\n @case (Icons.gitRepositoryPrivateLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 10V20H19V10H6ZM18 8H20C20.5523 8 21 8.44772 21 9V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V9C3 8.44772 3.44772 8 4 8H6V7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7V8ZM16 8V7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7V8H16ZM7 11H9V13H7V11ZM7 14H9V16H7V14ZM7 17H9V19H7V17Z\"></path>\n </svg>\n }\n @case (Icons.starLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26ZM12.0006 15.968L16.2473 18.3451L15.2988 13.5717L18.8719 10.2674L14.039 9.69434L12.0006 5.27502L9.96214 9.69434L5.12921 10.2674L8.70231 13.5717L7.75383 18.3451L12.0006 15.968Z\"></path>\n </svg>\n }\n @case (Icons.calendar2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z\"></path>\n </svg>\n }\n @case (Icons.macLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 18V20L16 21V22H8L7.99639 21.0036L10 20V18H2.9918C2.44405 18 2 17.5511 2 16.9925V4.00748C2 3.45107 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44892 22 4.00748V16.9925C22 17.5489 21.5447 18 21.0082 18H14ZM4 5V14H20V5H4Z\"></path>\n </svg>\n }\n @case (Icons.more2Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 3C10.9 3 10 3.9 10 5C10 6.1 10.9 7 12 7C13.1 7 14 6.1 14 5C14 3.9 13.1 3 12 3ZM12 17C10.9 17 10 17.9 10 19C10 20.1 10.9 21 12 21C13.1 21 14 20.1 14 19C14 17.9 13.1 17 12 17ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z\"></path>\n </svg>\n }\n @case (Icons.editLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6.41421 15.89L16.5563 5.74785L15.1421 4.33363L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6473L14.435 2.21231C14.8256 1.82179 15.4587 1.82179 15.8492 2.21231L18.6777 5.04074C19.0682 5.43126 19.0682 6.06443 18.6777 6.45495L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z\"></path>\n </svg>\n }\n @case (Icons.deleteBinLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z\"></path>\n </svg>\n }\n }\n</span>\n", styles: [":host{color:inherit;display:inline-flex}:host:has(.icon--left){margin-left:var(--gld-spacing--xxxs)}:host:has(.icon--right){margin-right:var(--gld-spacing--xxxs)}.icon{--gld-icon-size: var(--gld-icon-size--normal);position:relative;color:inherit;font-weight:400;width:var(--gld-icon-size);height:var(--gld-icon-size);margin:auto}.icon--tiny{--gld-icon-size: var(--gld-icon-size--tiny)}.icon--small{--gld-icon-size: var(--gld-icon-size--small)}.icon--medium{--gld-icon-size: var(--gld-icon-size--medium)}.icon--large{--gld-icon-size: var(--gld-icon-size--large)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
203
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Icon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
204
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Icon, isStandalone: true, selector: "gld-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<span\n tabindex=\"-1\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n class=\"icon icon--{{ size() }}\"\n [class.icon--left]=\"space() === ICONS_SPACES.left\"\n [class.icon--right]=\"space() === ICONS_SPACES.right\"\n [style.right.px]=\"moveLeftToRight()\"\n [style.top.px]=\"moveTopToBottom()\">\n @switch (icon()) {\n @case (ICONS.arrowDownSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z\"></path>\n </svg>\n }\n @case (ICONS.arrowUpSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z\"></path>\n </svg>\n }\n @case (ICONS.checkboxCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z\"></path>\n </svg>\n }\n @case (ICONS.checkboxBlankCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z\"></path>\n </svg>\n }\n @case (ICONS.loader4Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z\"></path>\n </svg>\n }\n @case (ICONS.logoutCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 11H13V13H5V16L0 12L5 8V11ZM3.99927 18H6.70835C8.11862 19.2447 9.97111 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C9.97111 4 8.11862 4.75527 6.70835 6H3.99927C5.82368 3.57111 8.72836 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C8.72836 22 5.82368 20.4289 3.99927 18Z\"></path>\n </svg>\n }\n @case (ICONS.loginCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 11V8L15 12L10 16V13H1V11H10ZM2.4578 15H4.58152C5.76829 17.9318 8.64262 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C8.64262 4 5.76829 6.06817 4.58152 9H2.4578C3.73207 4.94289 7.52236 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C7.52236 22 3.73207 19.0571 2.4578 15Z\"></path>\n </svg>\n }\n @case (ICONS.gitRepositoryLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 21V23.5L10 21.5L7 23.5V21H6.5C4.567 21 3 19.433 3 17.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V20C21 20.5523 20.5523 21 20 21H13ZM13 19H19V16H6.5C5.67157 16 5 16.6716 5 17.5C5 18.3284 5.67157 19 6.5 19H7V17H13V19ZM19 14V4H6V14.0354C6.1633 14.0121 6.33024 14 6.5 14H19ZM7 5H9V7H7V5ZM7 8H9V10H7V8ZM7 11H9V13H7V11Z\"></path>\n </svg>\n }\n @case (ICONS.fileList3Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M19 22H5C3.34315 22 2 20.6569 2 19V3C2 2.44772 2.44772 2 3 2H17C17.5523 2 18 2.44772 18 3V15H22V19C22 20.6569 20.6569 22 19 22ZM18 17V19C18 19.5523 18.4477 20 19 20C19.5523 20 20 19.5523 20 19V17H18ZM16 20V4H4V19C4 19.5523 4.44772 20 5 20H16ZM6 7H14V9H6V7ZM6 11H14V13H6V11ZM6 15H11V17H6V15Z\"></path>\n </svg>\n }\n @case (ICONS.menuLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z\"></path>\n </svg>\n }\n @case (ICONS.sunLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z\"></path>\n </svg>\n }\n @case (ICONS.moonClearLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 6C10 10.4183 13.5817 14 18 14C19.4386 14 20.7885 13.6203 21.9549 12.9556C21.4738 18.0302 17.2005 22 12 22C6.47715 22 2 17.5228 2 12C2 6.79948 5.9698 2.52616 11.0444 2.04507C10.3797 3.21152 10 4.56142 10 6ZM4 12C4 16.4183 7.58172 20 12 20C14.9654 20 17.5757 18.3788 18.9571 15.9546C18.6407 15.9848 18.3214 16 18 16C12.4772 16 8 11.5228 8 6C8 5.67863 8.01524 5.35933 8.04536 5.04293C5.62119 6.42426 4 9.03458 4 12ZM18.1642 2.29104L19 2.5V3.5L18.1642 3.70896C17.4476 3.8881 16.8881 4.4476 16.709 5.16417L16.5 6H15.5L15.291 5.16417C15.1119 4.4476 14.5524 3.8881 13.8358 3.70896L13 3.5V2.5L13.8358 2.29104C14.5524 2.1119 15.1119 1.5524 15.291 0.835829L15.5 0H16.5L16.709 0.835829C16.8881 1.5524 17.4476 2.1119 18.1642 2.29104ZM23.1642 7.29104L24 7.5V8.5L23.1642 8.70896C22.4476 8.8881 21.8881 9.4476 21.709 10.1642L21.5 11H20.5L20.291 10.1642C20.1119 9.4476 19.5524 8.8881 18.8358 8.70896L18 8.5V7.5L18.8358 7.29104C19.5524 7.1119 20.1119 6.5524 20.291 5.83583L20.5 5H21.5L21.709 5.83583C21.8881 6.5524 22.4476 7.1119 23.1642 7.29104Z\"></path>\n </svg>\n }\n @case (ICONS.englishInput) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 10H16L16.0005 10.7574C16.7154 10.279 17.5751 10 18.5 10C20.9853 10 23 12.0147 23 14.5V20H21V14.5C21 13.07 19.8255 12 18.5 12C17.1745 12 16 13.07 16 14.5V20H14V10ZM12 4V6H4V11H12V13H4V18H12V20H2V4H12Z\"></path>\n </svg>\n }\n @case (ICONS.translate) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 15V17C5 18.0544 5.81588 18.9182 6.85074 18.9945L7 19H10V21H7C4.79086 21 3 19.2091 3 17V15H5ZM18 10L22.4 21H20.245L19.044 18H14.954L13.755 21H11.601L16 10H18ZM17 12.8852L15.753 16H18.245L17 12.8852ZM8 2V4H12V11H8V14H6V11H2V4H6V2H8ZM17 3C19.2091 3 21 4.79086 21 7V9H19V7C19 5.89543 18.1046 5 17 5H14V3H17ZM6 6H4V9H6V6ZM10 6H8V9H10V6Z\"></path>\n </svg>\n }\n @case (ICONS.user4Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 20H19V22H5V20ZM12 18C7.58172 18 4 14.4183 4 10C4 5.58172 7.58172 2 12 2C16.4183 2 20 5.58172 20 10C20 14.4183 16.4183 18 12 18ZM12 16C15.3137 16 18 13.3137 18 10C18 6.68629 15.3137 4 12 4C8.68629 4 6 6.68629 6 10C6 13.3137 8.68629 16 12 16Z\"></path>\n </svg>\n }\n @case (ICONS.shapesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9998 1L6 11H18L11.9998 1ZM11.9998 4.8873L14.4676 9H9.53232L11.9998 4.8873ZM6.75 20C5.23122 20 4 18.7688 4 17.25C4 15.7312 5.23122 14.5 6.75 14.5C8.26878 14.5 9.5 15.7312 9.5 17.25C9.5 18.7688 8.26878 20 6.75 20ZM6.75 22C9.37335 22 11.5 19.8734 11.5 17.25C11.5 14.6266 9.37335 12.5 6.75 12.5C4.12665 12.5 2 14.6266 2 17.25C2 19.8734 4.12665 22 6.75 22ZM15 15.5V19.5H19V15.5H15ZM13 21.5V13.5H21V21.5H13Z\"></path>\n </svg>\n }\n @case (ICONS.closeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z\"></path>\n </svg>\n }\n @case (ICONS.eyeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z\"></path>\n </svg>\n }\n @case (ICONS.eyeCloseLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9.34268 18.7819L7.41083 18.2642L8.1983 15.3254C7.00919 14.8874 5.91661 14.2498 4.96116 13.4534L2.80783 15.6067L1.39362 14.1925L3.54695 12.0392C2.35581 10.6103 1.52014 8.87466 1.17578 6.96818L3.14386 6.61035C3.90289 10.8126 7.57931 14.0001 12.0002 14.0001C16.4211 14.0001 20.0976 10.8126 20.8566 6.61035L22.8247 6.96818C22.4803 8.87466 21.6446 10.6103 20.4535 12.0392L22.6068 14.1925L21.1926 15.6067L19.0393 13.4534C18.0838 14.2498 16.9912 14.8874 15.8021 15.3254L16.5896 18.2642L14.6578 18.7819L13.87 15.8418C13.2623 15.9459 12.6376 16.0001 12.0002 16.0001C11.3629 16.0001 10.7381 15.9459 10.1305 15.8418L9.34268 18.7819Z\"></path>\n </svg>\n }\n @case (ICONS.linkedinBoxFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.3362 18.339H15.6707V14.1622C15.6707 13.1662 15.6505 11.8845 14.2817 11.8845C12.892 11.8845 12.6797 12.9683 12.6797 14.0887V18.339H10.0142V9.75H12.5747V10.9207H12.6092C12.967 10.2457 13.837 9.53325 15.1367 9.53325C17.8375 9.53325 18.337 11.3108 18.337 13.6245V18.339H18.3362ZM7.00373 8.57475C6.14573 8.57475 5.45648 7.88025 5.45648 7.026C5.45648 6.1725 6.14648 5.47875 7.00373 5.47875C7.85873 5.47875 8.55173 6.1725 8.55173 7.026C8.55173 7.88025 7.85798 8.57475 7.00373 8.57475ZM8.34023 18.339H5.66723V9.75H8.34023V18.339ZM19.6697 3H4.32923C3.59498 3 3.00098 3.5805 3.00098 4.29675V19.7033C3.00098 20.4202 3.59498 21 4.32923 21H19.6675C20.401 21 21.001 20.4202 21.001 19.7033V4.29675C21.001 3.5805 20.401 3 19.6675 3H19.6697Z\"></path>\n </svg>\n }\n @case (ICONS.githubFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.001 2C6.47598 2 2.00098 6.475 2.00098 12C2.00098 16.425 4.86348 20.1625 8.83848 21.4875C9.33848 21.575 9.52598 21.275 9.52598 21.0125C9.52598 20.775 9.51348 19.9875 9.51348 19.15C7.00098 19.6125 6.35098 18.5375 6.15098 17.975C6.03848 17.6875 5.55098 16.8 5.12598 16.5625C4.77598 16.375 4.27598 15.9125 5.11348 15.9C5.90098 15.8875 6.46348 16.625 6.65098 16.925C7.55098 18.4375 8.98848 18.0125 9.56348 17.75C9.65098 17.1 9.91348 16.6625 10.201 16.4125C7.97598 16.1625 5.65098 15.3 5.65098 11.475C5.65098 10.3875 6.03848 9.4875 6.67598 8.7875C6.57598 8.5375 6.22598 7.5125 6.77598 6.1375C6.77598 6.1375 7.61348 5.875 9.52598 7.1625C10.326 6.9375 11.176 6.825 12.026 6.825C12.876 6.825 13.726 6.9375 14.526 7.1625C16.4385 5.8625 17.276 6.1375 17.276 6.1375C17.826 7.5125 17.476 8.5375 17.376 8.7875C18.0135 9.4875 18.401 10.375 18.401 11.475C18.401 15.3125 16.0635 16.1625 13.8385 16.4125C14.201 16.725 14.5135 17.325 14.5135 18.2625C14.5135 19.6 14.501 20.675 14.501 21.0125C14.501 21.275 14.6885 21.5875 15.1885 21.4875C19.259 20.1133 21.9999 16.2963 22.001 12C22.001 6.475 17.526 2 12.001 2Z\"></path>\n </svg>\n }\n @case (ICONS.instagramFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0281 2.00073C14.1535 2.00259 14.7238 2.00855 15.2166 2.02322L15.4107 2.02956C15.6349 2.03753 15.8561 2.04753 16.1228 2.06003C17.1869 2.1092 17.9128 2.27753 18.5503 2.52503C19.2094 2.7792 19.7661 3.12253 20.3219 3.67837C20.8769 4.2342 21.2203 4.79253 21.4753 5.45003C21.7219 6.0867 21.8903 6.81337 21.9403 7.87753C21.9522 8.1442 21.9618 8.3654 21.9697 8.58964L21.976 8.78373C21.9906 9.27647 21.9973 9.84686 21.9994 10.9723L22.0002 11.7179C22.0003 11.809 22.0003 11.903 22.0003 12L22.0002 12.2821L21.9996 13.0278C21.9977 14.1532 21.9918 14.7236 21.9771 15.2163L21.9707 15.4104C21.9628 15.6347 21.9528 15.8559 21.9403 16.1225C21.8911 17.1867 21.7219 17.9125 21.4753 18.55C21.2211 19.2092 20.8769 19.7659 20.3219 20.3217C19.7661 20.8767 19.2069 21.22 18.5503 21.475C17.9128 21.7217 17.1869 21.89 16.1228 21.94C15.8561 21.9519 15.6349 21.9616 15.4107 21.9694L15.2166 21.9757C14.7238 21.9904 14.1535 21.997 13.0281 21.9992L12.2824 22C12.1913 22 12.0973 22 12.0003 22L11.7182 22L10.9725 21.9993C9.8471 21.9975 9.27672 21.9915 8.78397 21.9768L8.58989 21.9705C8.36564 21.9625 8.14444 21.9525 7.87778 21.94C6.81361 21.8909 6.08861 21.7217 5.45028 21.475C4.79194 21.2209 4.23444 20.8767 3.67861 20.3217C3.12278 19.7659 2.78028 19.2067 2.52528 18.55C2.27778 17.9125 2.11028 17.1867 2.06028 16.1225C2.0484 15.8559 2.03871 15.6347 2.03086 15.4104L2.02457 15.2163C2.00994 14.7236 2.00327 14.1532 2.00111 13.0278L2.00098 10.9723C2.00284 9.84686 2.00879 9.27647 2.02346 8.78373L2.02981 8.58964C2.03778 8.3654 2.04778 8.1442 2.06028 7.87753C2.10944 6.81253 2.27778 6.08753 2.52528 5.45003C2.77944 4.7917 3.12278 4.2342 3.67861 3.67837C4.23444 3.12253 4.79278 2.78003 5.45028 2.52503C6.08778 2.27753 6.81278 2.11003 7.87778 2.06003C8.14444 2.04816 8.36564 2.03847 8.58989 2.03062L8.78397 2.02433C9.27672 2.00969 9.8471 2.00302 10.9725 2.00086L13.0281 2.00073ZM12.0003 7.00003C9.23738 7.00003 7.00028 9.23956 7.00028 12C7.00028 14.7629 9.23981 17 12.0003 17C14.7632 17 17.0003 14.7605 17.0003 12C17.0003 9.23713 14.7607 7.00003 12.0003 7.00003ZM12.0003 9.00003C13.6572 9.00003 15.0003 10.3427 15.0003 12C15.0003 13.6569 13.6576 15 12.0003 15C10.3434 15 9.00028 13.6574 9.00028 12C9.00028 10.3431 10.3429 9.00003 12.0003 9.00003ZM17.2503 5.50003C16.561 5.50003 16.0003 6.05994 16.0003 6.74918C16.0003 7.43843 16.5602 7.9992 17.2503 7.9992C17.9395 7.9992 18.5003 7.4393 18.5003 6.74918C18.5003 6.05994 17.9386 5.49917 17.2503 5.50003Z\"></path>\n </svg>\n }\n @case (ICONS.twitterXFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17.6874 3.0625L12.6907 8.77425L8.37045 3.0625H2.11328L9.58961 12.8387L2.50378 20.9375H5.53795L11.0068 14.6886L15.7863 20.9375H21.8885L14.095 10.6342L20.7198 3.0625H17.6874ZM16.6232 19.1225L5.65436 4.78217H7.45745L18.3034 19.1225H16.6232Z\"></path>\n </svg>\n }\n @case (ICONS.downloadCloud2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 13V18.585L14.8284 16.7574L16.2426 18.1716L12 22.4142L7.75736 18.1716L9.17157 16.7574L11 18.585V13H13ZM12 2C15.5934 2 18.5544 4.70761 18.9541 8.19395C21.2858 8.83154 23 10.9656 23 13.5C23 16.3688 20.8036 18.7246 18.0006 18.9776L18.0009 16.9644C19.6966 16.7214 21 15.2629 21 13.5C21 11.567 19.433 10 17.5 10C17.2912 10 17.0867 10.0183 16.8887 10.054C16.9616 9.7142 17 9.36158 17 9C17 6.23858 14.7614 4 12 4C9.23858 4 7 6.23858 7 9C7 9.36158 7.03838 9.7142 7.11205 10.0533C6.91331 10.0183 6.70879 10 6.5 10C4.567 10 3 11.567 3 13.5C3 15.2003 4.21241 16.6174 5.81986 16.934L6.00005 16.9646L6.00039 18.9776C3.19696 18.7252 1 16.3692 1 13.5C1 10.9656 2.71424 8.83154 5.04648 8.19411C5.44561 4.70761 8.40661 2 12 2Z\"></path>\n </svg>\n }\n @case (ICONS.globeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0003 21H18.0003V23H6.00032V21H11.0003V19.9506C7.70689 19.6236 4.88351 17.6987 3.31641 14.9622L5.05319 13.9697C6.43208 16.3776 9.02674 18 12.0003 18C16.4186 18 20.0003 14.4182 20.0003 9.99995C20.0003 7.02637 18.378 4.43171 15.9701 3.05282L16.9626 1.31604C19.9724 3.03965 22.0003 6.28297 22.0003 9.99995C22.0003 15.1853 18.0536 19.4489 13.0003 19.9506V21ZM12.0003 17C8.13433 17 5.00032 13.8659 5.00032 9.99995C5.00032 6.13396 8.13433 2.99995 12.0003 2.99995C15.8663 2.99995 19.0003 6.13396 19.0003 9.99995C19.0003 13.8659 15.8663 17 12.0003 17ZM12.0003 15C14.7617 15 17.0003 12.7614 17.0003 9.99995C17.0003 7.23853 14.7617 4.99995 12.0003 4.99995C9.2389 4.99995 7.00032 7.23853 7.00032 9.99995C7.00032 12.7614 9.2389 15 12.0003 15Z\"></path>\n </svg>\n }\n @case (ICONS.mailSendLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M21 3C21.5523 3 22 3.44772 22 4V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V19H20V7.3L12 14.5L2 5.5V4C2 3.44772 2.44772 3 3 3H21ZM8 15V17H0V15H8ZM5 10V12H0V10H5ZM19.5659 5H4.43414L12 11.8093L19.5659 5Z\"></path>\n </svg>\n }\n @case (ICONS.pagesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 8V20H19V8H5ZM5 6H19V4H5V6ZM20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM7 10H11V14H7V10ZM7 16H17V18H7V16ZM13 11H17V13H13V11Z\"></path>\n </svg>\n }\n @case (ICONS.gitForkLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 5C5.44772 5 5 5.44772 5 6C5 6.55228 5.44772 7 6 7C6.55228 7 7 6.55228 7 6C7 5.44772 6.55228 5 6 5ZM3 6C3 4.34315 4.34315 3 6 3C7.65685 3 9 4.34315 9 6C9 7.30622 8.16519 8.41746 7 8.82929V9C7 10.1046 7.89543 11 9 11H15C16.1046 11 17 10.1046 17 9V8.82929C15.8348 8.41746 15 7.30622 15 6C15 4.34315 16.3431 3 18 3C19.6569 3 21 4.34315 21 6C21 7.30622 20.1652 8.41746 19 8.82929V9C19 11.2091 17.2091 13 15 13H13V15.1707C14.1652 15.5825 15 16.6938 15 18C15 19.6569 13.6569 21 12 21C10.3431 21 9 19.6569 9 18C9 16.6938 9.83481 15.5825 11 15.1707V13H9C6.79086 13 5 11.2091 5 9V8.82929C3.83481 8.41746 3 7.30622 3 6ZM18 5C17.4477 5 17 5.44772 17 6C17 6.55228 17.4477 7 18 7C18.5523 7 19 6.55228 19 6C19 5.44772 18.5523 5 18 5ZM12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18C13 17.4477 12.5523 17 12 17Z\"></path>\n </svg>\n }\n @case (ICONS.gitRepositoryPrivateLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 10V20H19V10H6ZM18 8H20C20.5523 8 21 8.44772 21 9V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V9C3 8.44772 3.44772 8 4 8H6V7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7V8ZM16 8V7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7V8H16ZM7 11H9V13H7V11ZM7 14H9V16H7V14ZM7 17H9V19H7V17Z\"></path>\n </svg>\n }\n @case (ICONS.starLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26ZM12.0006 15.968L16.2473 18.3451L15.2988 13.5717L18.8719 10.2674L14.039 9.69434L12.0006 5.27502L9.96214 9.69434L5.12921 10.2674L8.70231 13.5717L7.75383 18.3451L12.0006 15.968Z\"></path>\n </svg>\n }\n @case (ICONS.calendar2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z\"></path>\n </svg>\n }\n @case (ICONS.macLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 18V20L16 21V22H8L7.99639 21.0036L10 20V18H2.9918C2.44405 18 2 17.5511 2 16.9925V4.00748C2 3.45107 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44892 22 4.00748V16.9925C22 17.5489 21.5447 18 21.0082 18H14ZM4 5V14H20V5H4Z\"></path>\n </svg>\n }\n @case (ICONS.more2Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 3C10.9 3 10 3.9 10 5C10 6.1 10.9 7 12 7C13.1 7 14 6.1 14 5C14 3.9 13.1 3 12 3ZM12 17C10.9 17 10 17.9 10 19C10 20.1 10.9 21 12 21C13.1 21 14 20.1 14 19C14 17.9 13.1 17 12 17ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z\"></path>\n </svg>\n }\n @case (ICONS.editLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6.41421 15.89L16.5563 5.74785L15.1421 4.33363L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6473L14.435 2.21231C14.8256 1.82179 15.4587 1.82179 15.8492 2.21231L18.6777 5.04074C19.0682 5.43126 19.0682 6.06443 18.6777 6.45495L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z\"></path>\n </svg>\n }\n @case (ICONS.deleteBinLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z\"></path>\n </svg>\n }\n }\n</span>\n", styles: [":host{color:inherit;display:inline-flex}:host:has(.icon--left){margin-left:var(--gld-spacing--xxxs)}:host:has(.icon--right){margin-right:var(--gld-spacing--xxxs)}.icon{--gld-icon-size: var(--gld-icon-size--normal);position:relative;color:inherit;font-weight:400;width:var(--gld-icon-size);height:var(--gld-icon-size);margin:auto}.icon--tiny{--gld-icon-size: var(--gld-icon-size--tiny)}.icon--small{--gld-icon-size: var(--gld-icon-size--small)}.icon--medium{--gld-icon-size: var(--gld-icon-size--medium)}.icon--large{--gld-icon-size: var(--gld-icon-size--large)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
225
205
  }
226
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Icon, decorators: [{
206
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Icon, decorators: [{
227
207
  type: Component,
228
- args: [{ selector: 'gld-icon', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n tabindex=\"-1\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n class=\"icon icon--{{ size() }}\"\n [class.icon--left]=\"space() === IconsSpace.left\"\n [class.icon--right]=\"space() === IconsSpace.right\"\n [style.right.px]=\"moveLeftToRight()\"\n [style.top.px]=\"moveTopToBottom()\">\n @switch (icon()) {\n @case (Icons.arrowDownSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z\"></path>\n </svg>\n }\n @case (Icons.arrowUpSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z\"></path>\n </svg>\n }\n @case (Icons.checkboxCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z\"></path>\n </svg>\n }\n @case (Icons.checkboxBlankCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z\"></path>\n </svg>\n }\n @case (Icons.loader4Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z\"></path>\n </svg>\n }\n @case (Icons.logoutCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 11H13V13H5V16L0 12L5 8V11ZM3.99927 18H6.70835C8.11862 19.2447 9.97111 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C9.97111 4 8.11862 4.75527 6.70835 6H3.99927C5.82368 3.57111 8.72836 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C8.72836 22 5.82368 20.4289 3.99927 18Z\"></path>\n </svg>\n }\n @case (Icons.loginCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 11V8L15 12L10 16V13H1V11H10ZM2.4578 15H4.58152C5.76829 17.9318 8.64262 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C8.64262 4 5.76829 6.06817 4.58152 9H2.4578C3.73207 4.94289 7.52236 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C7.52236 22 3.73207 19.0571 2.4578 15Z\"></path>\n </svg>\n }\n @case (Icons.gitRepositoryLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 21V23.5L10 21.5L7 23.5V21H6.5C4.567 21 3 19.433 3 17.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V20C21 20.5523 20.5523 21 20 21H13ZM13 19H19V16H6.5C5.67157 16 5 16.6716 5 17.5C5 18.3284 5.67157 19 6.5 19H7V17H13V19ZM19 14V4H6V14.0354C6.1633 14.0121 6.33024 14 6.5 14H19ZM7 5H9V7H7V5ZM7 8H9V10H7V8ZM7 11H9V13H7V11Z\"></path>\n </svg>\n }\n @case (Icons.fileList3Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M19 22H5C3.34315 22 2 20.6569 2 19V3C2 2.44772 2.44772 2 3 2H17C17.5523 2 18 2.44772 18 3V15H22V19C22 20.6569 20.6569 22 19 22ZM18 17V19C18 19.5523 18.4477 20 19 20C19.5523 20 20 19.5523 20 19V17H18ZM16 20V4H4V19C4 19.5523 4.44772 20 5 20H16ZM6 7H14V9H6V7ZM6 11H14V13H6V11ZM6 15H11V17H6V15Z\"></path>\n </svg>\n }\n @case (Icons.menuLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z\"></path>\n </svg>\n }\n @case (Icons.sunLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z\"></path>\n </svg>\n }\n @case (Icons.moonClearLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 6C10 10.4183 13.5817 14 18 14C19.4386 14 20.7885 13.6203 21.9549 12.9556C21.4738 18.0302 17.2005 22 12 22C6.47715 22 2 17.5228 2 12C2 6.79948 5.9698 2.52616 11.0444 2.04507C10.3797 3.21152 10 4.56142 10 6ZM4 12C4 16.4183 7.58172 20 12 20C14.9654 20 17.5757 18.3788 18.9571 15.9546C18.6407 15.9848 18.3214 16 18 16C12.4772 16 8 11.5228 8 6C8 5.67863 8.01524 5.35933 8.04536 5.04293C5.62119 6.42426 4 9.03458 4 12ZM18.1642 2.29104L19 2.5V3.5L18.1642 3.70896C17.4476 3.8881 16.8881 4.4476 16.709 5.16417L16.5 6H15.5L15.291 5.16417C15.1119 4.4476 14.5524 3.8881 13.8358 3.70896L13 3.5V2.5L13.8358 2.29104C14.5524 2.1119 15.1119 1.5524 15.291 0.835829L15.5 0H16.5L16.709 0.835829C16.8881 1.5524 17.4476 2.1119 18.1642 2.29104ZM23.1642 7.29104L24 7.5V8.5L23.1642 8.70896C22.4476 8.8881 21.8881 9.4476 21.709 10.1642L21.5 11H20.5L20.291 10.1642C20.1119 9.4476 19.5524 8.8881 18.8358 8.70896L18 8.5V7.5L18.8358 7.29104C19.5524 7.1119 20.1119 6.5524 20.291 5.83583L20.5 5H21.5L21.709 5.83583C21.8881 6.5524 22.4476 7.1119 23.1642 7.29104Z\"></path>\n </svg>\n }\n @case (Icons.englishInput) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 10H16L16.0005 10.7574C16.7154 10.279 17.5751 10 18.5 10C20.9853 10 23 12.0147 23 14.5V20H21V14.5C21 13.07 19.8255 12 18.5 12C17.1745 12 16 13.07 16 14.5V20H14V10ZM12 4V6H4V11H12V13H4V18H12V20H2V4H12Z\"></path>\n </svg>\n }\n @case (Icons.translate) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 15V17C5 18.0544 5.81588 18.9182 6.85074 18.9945L7 19H10V21H7C4.79086 21 3 19.2091 3 17V15H5ZM18 10L22.4 21H20.245L19.044 18H14.954L13.755 21H11.601L16 10H18ZM17 12.8852L15.753 16H18.245L17 12.8852ZM8 2V4H12V11H8V14H6V11H2V4H6V2H8ZM17 3C19.2091 3 21 4.79086 21 7V9H19V7C19 5.89543 18.1046 5 17 5H14V3H17ZM6 6H4V9H6V6ZM10 6H8V9H10V6Z\"></path>\n </svg>\n }\n @case (Icons.user4Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 20H19V22H5V20ZM12 18C7.58172 18 4 14.4183 4 10C4 5.58172 7.58172 2 12 2C16.4183 2 20 5.58172 20 10C20 14.4183 16.4183 18 12 18ZM12 16C15.3137 16 18 13.3137 18 10C18 6.68629 15.3137 4 12 4C8.68629 4 6 6.68629 6 10C6 13.3137 8.68629 16 12 16Z\"></path>\n </svg>\n }\n @case (Icons.shapesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9998 1L6 11H18L11.9998 1ZM11.9998 4.8873L14.4676 9H9.53232L11.9998 4.8873ZM6.75 20C5.23122 20 4 18.7688 4 17.25C4 15.7312 5.23122 14.5 6.75 14.5C8.26878 14.5 9.5 15.7312 9.5 17.25C9.5 18.7688 8.26878 20 6.75 20ZM6.75 22C9.37335 22 11.5 19.8734 11.5 17.25C11.5 14.6266 9.37335 12.5 6.75 12.5C4.12665 12.5 2 14.6266 2 17.25C2 19.8734 4.12665 22 6.75 22ZM15 15.5V19.5H19V15.5H15ZM13 21.5V13.5H21V21.5H13Z\"></path>\n </svg>\n }\n @case (Icons.closeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z\"></path>\n </svg>\n }\n @case (Icons.eyeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z\"></path>\n </svg>\n }\n @case (Icons.eyeCloseLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9.34268 18.7819L7.41083 18.2642L8.1983 15.3254C7.00919 14.8874 5.91661 14.2498 4.96116 13.4534L2.80783 15.6067L1.39362 14.1925L3.54695 12.0392C2.35581 10.6103 1.52014 8.87466 1.17578 6.96818L3.14386 6.61035C3.90289 10.8126 7.57931 14.0001 12.0002 14.0001C16.4211 14.0001 20.0976 10.8126 20.8566 6.61035L22.8247 6.96818C22.4803 8.87466 21.6446 10.6103 20.4535 12.0392L22.6068 14.1925L21.1926 15.6067L19.0393 13.4534C18.0838 14.2498 16.9912 14.8874 15.8021 15.3254L16.5896 18.2642L14.6578 18.7819L13.87 15.8418C13.2623 15.9459 12.6376 16.0001 12.0002 16.0001C11.3629 16.0001 10.7381 15.9459 10.1305 15.8418L9.34268 18.7819Z\"></path>\n </svg>\n }\n @case (Icons.linkedinBoxFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.3362 18.339H15.6707V14.1622C15.6707 13.1662 15.6505 11.8845 14.2817 11.8845C12.892 11.8845 12.6797 12.9683 12.6797 14.0887V18.339H10.0142V9.75H12.5747V10.9207H12.6092C12.967 10.2457 13.837 9.53325 15.1367 9.53325C17.8375 9.53325 18.337 11.3108 18.337 13.6245V18.339H18.3362ZM7.00373 8.57475C6.14573 8.57475 5.45648 7.88025 5.45648 7.026C5.45648 6.1725 6.14648 5.47875 7.00373 5.47875C7.85873 5.47875 8.55173 6.1725 8.55173 7.026C8.55173 7.88025 7.85798 8.57475 7.00373 8.57475ZM8.34023 18.339H5.66723V9.75H8.34023V18.339ZM19.6697 3H4.32923C3.59498 3 3.00098 3.5805 3.00098 4.29675V19.7033C3.00098 20.4202 3.59498 21 4.32923 21H19.6675C20.401 21 21.001 20.4202 21.001 19.7033V4.29675C21.001 3.5805 20.401 3 19.6675 3H19.6697Z\"></path>\n </svg>\n }\n @case (Icons.githubFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.001 2C6.47598 2 2.00098 6.475 2.00098 12C2.00098 16.425 4.86348 20.1625 8.83848 21.4875C9.33848 21.575 9.52598 21.275 9.52598 21.0125C9.52598 20.775 9.51348 19.9875 9.51348 19.15C7.00098 19.6125 6.35098 18.5375 6.15098 17.975C6.03848 17.6875 5.55098 16.8 5.12598 16.5625C4.77598 16.375 4.27598 15.9125 5.11348 15.9C5.90098 15.8875 6.46348 16.625 6.65098 16.925C7.55098 18.4375 8.98848 18.0125 9.56348 17.75C9.65098 17.1 9.91348 16.6625 10.201 16.4125C7.97598 16.1625 5.65098 15.3 5.65098 11.475C5.65098 10.3875 6.03848 9.4875 6.67598 8.7875C6.57598 8.5375 6.22598 7.5125 6.77598 6.1375C6.77598 6.1375 7.61348 5.875 9.52598 7.1625C10.326 6.9375 11.176 6.825 12.026 6.825C12.876 6.825 13.726 6.9375 14.526 7.1625C16.4385 5.8625 17.276 6.1375 17.276 6.1375C17.826 7.5125 17.476 8.5375 17.376 8.7875C18.0135 9.4875 18.401 10.375 18.401 11.475C18.401 15.3125 16.0635 16.1625 13.8385 16.4125C14.201 16.725 14.5135 17.325 14.5135 18.2625C14.5135 19.6 14.501 20.675 14.501 21.0125C14.501 21.275 14.6885 21.5875 15.1885 21.4875C19.259 20.1133 21.9999 16.2963 22.001 12C22.001 6.475 17.526 2 12.001 2Z\"></path>\n </svg>\n }\n @case (Icons.instagramFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0281 2.00073C14.1535 2.00259 14.7238 2.00855 15.2166 2.02322L15.4107 2.02956C15.6349 2.03753 15.8561 2.04753 16.1228 2.06003C17.1869 2.1092 17.9128 2.27753 18.5503 2.52503C19.2094 2.7792 19.7661 3.12253 20.3219 3.67837C20.8769 4.2342 21.2203 4.79253 21.4753 5.45003C21.7219 6.0867 21.8903 6.81337 21.9403 7.87753C21.9522 8.1442 21.9618 8.3654 21.9697 8.58964L21.976 8.78373C21.9906 9.27647 21.9973 9.84686 21.9994 10.9723L22.0002 11.7179C22.0003 11.809 22.0003 11.903 22.0003 12L22.0002 12.2821L21.9996 13.0278C21.9977 14.1532 21.9918 14.7236 21.9771 15.2163L21.9707 15.4104C21.9628 15.6347 21.9528 15.8559 21.9403 16.1225C21.8911 17.1867 21.7219 17.9125 21.4753 18.55C21.2211 19.2092 20.8769 19.7659 20.3219 20.3217C19.7661 20.8767 19.2069 21.22 18.5503 21.475C17.9128 21.7217 17.1869 21.89 16.1228 21.94C15.8561 21.9519 15.6349 21.9616 15.4107 21.9694L15.2166 21.9757C14.7238 21.9904 14.1535 21.997 13.0281 21.9992L12.2824 22C12.1913 22 12.0973 22 12.0003 22L11.7182 22L10.9725 21.9993C9.8471 21.9975 9.27672 21.9915 8.78397 21.9768L8.58989 21.9705C8.36564 21.9625 8.14444 21.9525 7.87778 21.94C6.81361 21.8909 6.08861 21.7217 5.45028 21.475C4.79194 21.2209 4.23444 20.8767 3.67861 20.3217C3.12278 19.7659 2.78028 19.2067 2.52528 18.55C2.27778 17.9125 2.11028 17.1867 2.06028 16.1225C2.0484 15.8559 2.03871 15.6347 2.03086 15.4104L2.02457 15.2163C2.00994 14.7236 2.00327 14.1532 2.00111 13.0278L2.00098 10.9723C2.00284 9.84686 2.00879 9.27647 2.02346 8.78373L2.02981 8.58964C2.03778 8.3654 2.04778 8.1442 2.06028 7.87753C2.10944 6.81253 2.27778 6.08753 2.52528 5.45003C2.77944 4.7917 3.12278 4.2342 3.67861 3.67837C4.23444 3.12253 4.79278 2.78003 5.45028 2.52503C6.08778 2.27753 6.81278 2.11003 7.87778 2.06003C8.14444 2.04816 8.36564 2.03847 8.58989 2.03062L8.78397 2.02433C9.27672 2.00969 9.8471 2.00302 10.9725 2.00086L13.0281 2.00073ZM12.0003 7.00003C9.23738 7.00003 7.00028 9.23956 7.00028 12C7.00028 14.7629 9.23981 17 12.0003 17C14.7632 17 17.0003 14.7605 17.0003 12C17.0003 9.23713 14.7607 7.00003 12.0003 7.00003ZM12.0003 9.00003C13.6572 9.00003 15.0003 10.3427 15.0003 12C15.0003 13.6569 13.6576 15 12.0003 15C10.3434 15 9.00028 13.6574 9.00028 12C9.00028 10.3431 10.3429 9.00003 12.0003 9.00003ZM17.2503 5.50003C16.561 5.50003 16.0003 6.05994 16.0003 6.74918C16.0003 7.43843 16.5602 7.9992 17.2503 7.9992C17.9395 7.9992 18.5003 7.4393 18.5003 6.74918C18.5003 6.05994 17.9386 5.49917 17.2503 5.50003Z\"></path>\n </svg>\n }\n @case (Icons.twitterXFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17.6874 3.0625L12.6907 8.77425L8.37045 3.0625H2.11328L9.58961 12.8387L2.50378 20.9375H5.53795L11.0068 14.6886L15.7863 20.9375H21.8885L14.095 10.6342L20.7198 3.0625H17.6874ZM16.6232 19.1225L5.65436 4.78217H7.45745L18.3034 19.1225H16.6232Z\"></path>\n </svg>\n }\n @case (Icons.downloadCloud2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 13V18.585L14.8284 16.7574L16.2426 18.1716L12 22.4142L7.75736 18.1716L9.17157 16.7574L11 18.585V13H13ZM12 2C15.5934 2 18.5544 4.70761 18.9541 8.19395C21.2858 8.83154 23 10.9656 23 13.5C23 16.3688 20.8036 18.7246 18.0006 18.9776L18.0009 16.9644C19.6966 16.7214 21 15.2629 21 13.5C21 11.567 19.433 10 17.5 10C17.2912 10 17.0867 10.0183 16.8887 10.054C16.9616 9.7142 17 9.36158 17 9C17 6.23858 14.7614 4 12 4C9.23858 4 7 6.23858 7 9C7 9.36158 7.03838 9.7142 7.11205 10.0533C6.91331 10.0183 6.70879 10 6.5 10C4.567 10 3 11.567 3 13.5C3 15.2003 4.21241 16.6174 5.81986 16.934L6.00005 16.9646L6.00039 18.9776C3.19696 18.7252 1 16.3692 1 13.5C1 10.9656 2.71424 8.83154 5.04648 8.19411C5.44561 4.70761 8.40661 2 12 2Z\"></path>\n </svg>\n }\n @case (Icons.globeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0003 21H18.0003V23H6.00032V21H11.0003V19.9506C7.70689 19.6236 4.88351 17.6987 3.31641 14.9622L5.05319 13.9697C6.43208 16.3776 9.02674 18 12.0003 18C16.4186 18 20.0003 14.4182 20.0003 9.99995C20.0003 7.02637 18.378 4.43171 15.9701 3.05282L16.9626 1.31604C19.9724 3.03965 22.0003 6.28297 22.0003 9.99995C22.0003 15.1853 18.0536 19.4489 13.0003 19.9506V21ZM12.0003 17C8.13433 17 5.00032 13.8659 5.00032 9.99995C5.00032 6.13396 8.13433 2.99995 12.0003 2.99995C15.8663 2.99995 19.0003 6.13396 19.0003 9.99995C19.0003 13.8659 15.8663 17 12.0003 17ZM12.0003 15C14.7617 15 17.0003 12.7614 17.0003 9.99995C17.0003 7.23853 14.7617 4.99995 12.0003 4.99995C9.2389 4.99995 7.00032 7.23853 7.00032 9.99995C7.00032 12.7614 9.2389 15 12.0003 15Z\"></path>\n </svg>\n }\n @case (Icons.mailSendLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M21 3C21.5523 3 22 3.44772 22 4V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V19H20V7.3L12 14.5L2 5.5V4C2 3.44772 2.44772 3 3 3H21ZM8 15V17H0V15H8ZM5 10V12H0V10H5ZM19.5659 5H4.43414L12 11.8093L19.5659 5Z\"></path>\n </svg>\n }\n @case (Icons.pagesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 8V20H19V8H5ZM5 6H19V4H5V6ZM20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM7 10H11V14H7V10ZM7 16H17V18H7V16ZM13 11H17V13H13V11Z\"></path>\n </svg>\n }\n @case (Icons.gitForkLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 5C5.44772 5 5 5.44772 5 6C5 6.55228 5.44772 7 6 7C6.55228 7 7 6.55228 7 6C7 5.44772 6.55228 5 6 5ZM3 6C3 4.34315 4.34315 3 6 3C7.65685 3 9 4.34315 9 6C9 7.30622 8.16519 8.41746 7 8.82929V9C7 10.1046 7.89543 11 9 11H15C16.1046 11 17 10.1046 17 9V8.82929C15.8348 8.41746 15 7.30622 15 6C15 4.34315 16.3431 3 18 3C19.6569 3 21 4.34315 21 6C21 7.30622 20.1652 8.41746 19 8.82929V9C19 11.2091 17.2091 13 15 13H13V15.1707C14.1652 15.5825 15 16.6938 15 18C15 19.6569 13.6569 21 12 21C10.3431 21 9 19.6569 9 18C9 16.6938 9.83481 15.5825 11 15.1707V13H9C6.79086 13 5 11.2091 5 9V8.82929C3.83481 8.41746 3 7.30622 3 6ZM18 5C17.4477 5 17 5.44772 17 6C17 6.55228 17.4477 7 18 7C18.5523 7 19 6.55228 19 6C19 5.44772 18.5523 5 18 5ZM12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18C13 17.4477 12.5523 17 12 17Z\"></path>\n </svg>\n }\n @case (Icons.gitRepositoryPrivateLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 10V20H19V10H6ZM18 8H20C20.5523 8 21 8.44772 21 9V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V9C3 8.44772 3.44772 8 4 8H6V7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7V8ZM16 8V7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7V8H16ZM7 11H9V13H7V11ZM7 14H9V16H7V14ZM7 17H9V19H7V17Z\"></path>\n </svg>\n }\n @case (Icons.starLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26ZM12.0006 15.968L16.2473 18.3451L15.2988 13.5717L18.8719 10.2674L14.039 9.69434L12.0006 5.27502L9.96214 9.69434L5.12921 10.2674L8.70231 13.5717L7.75383 18.3451L12.0006 15.968Z\"></path>\n </svg>\n }\n @case (Icons.calendar2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z\"></path>\n </svg>\n }\n @case (Icons.macLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 18V20L16 21V22H8L7.99639 21.0036L10 20V18H2.9918C2.44405 18 2 17.5511 2 16.9925V4.00748C2 3.45107 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44892 22 4.00748V16.9925C22 17.5489 21.5447 18 21.0082 18H14ZM4 5V14H20V5H4Z\"></path>\n </svg>\n }\n @case (Icons.more2Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 3C10.9 3 10 3.9 10 5C10 6.1 10.9 7 12 7C13.1 7 14 6.1 14 5C14 3.9 13.1 3 12 3ZM12 17C10.9 17 10 17.9 10 19C10 20.1 10.9 21 12 21C13.1 21 14 20.1 14 19C14 17.9 13.1 17 12 17ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z\"></path>\n </svg>\n }\n @case (Icons.editLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6.41421 15.89L16.5563 5.74785L15.1421 4.33363L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6473L14.435 2.21231C14.8256 1.82179 15.4587 1.82179 15.8492 2.21231L18.6777 5.04074C19.0682 5.43126 19.0682 6.06443 18.6777 6.45495L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z\"></path>\n </svg>\n }\n @case (Icons.deleteBinLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z\"></path>\n </svg>\n }\n }\n</span>\n", styles: [":host{color:inherit;display:inline-flex}:host:has(.icon--left){margin-left:var(--gld-spacing--xxxs)}:host:has(.icon--right){margin-right:var(--gld-spacing--xxxs)}.icon{--gld-icon-size: var(--gld-icon-size--normal);position:relative;color:inherit;font-weight:400;width:var(--gld-icon-size);height:var(--gld-icon-size);margin:auto}.icon--tiny{--gld-icon-size: var(--gld-icon-size--tiny)}.icon--small{--gld-icon-size: var(--gld-icon-size--small)}.icon--medium{--gld-icon-size: var(--gld-icon-size--medium)}.icon--large{--gld-icon-size: var(--gld-icon-size--large)}\n"] }]
208
+ args: [{ selector: 'gld-icon', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n tabindex=\"-1\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n class=\"icon icon--{{ size() }}\"\n [class.icon--left]=\"space() === ICONS_SPACES.left\"\n [class.icon--right]=\"space() === ICONS_SPACES.right\"\n [style.right.px]=\"moveLeftToRight()\"\n [style.top.px]=\"moveTopToBottom()\">\n @switch (icon()) {\n @case (ICONS.arrowDownSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z\"></path>\n </svg>\n }\n @case (ICONS.arrowUpSLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z\"></path>\n </svg>\n }\n @case (ICONS.checkboxCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z\"></path>\n </svg>\n }\n @case (ICONS.checkboxBlankCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z\"></path>\n </svg>\n }\n @case (ICONS.loader4Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.364 5.63604L16.9497 7.05025C15.683 5.7835 13.933 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19C15.866 19 19 15.866 19 12H21C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C14.4853 3 16.7353 4.00736 18.364 5.63604Z\"></path>\n </svg>\n }\n @case (ICONS.logoutCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 11H13V13H5V16L0 12L5 8V11ZM3.99927 18H6.70835C8.11862 19.2447 9.97111 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C9.97111 4 8.11862 4.75527 6.70835 6H3.99927C5.82368 3.57111 8.72836 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C8.72836 22 5.82368 20.4289 3.99927 18Z\"></path>\n </svg>\n }\n @case (ICONS.loginCircleLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 11V8L15 12L10 16V13H1V11H10ZM2.4578 15H4.58152C5.76829 17.9318 8.64262 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C8.64262 4 5.76829 6.06817 4.58152 9H2.4578C3.73207 4.94289 7.52236 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C7.52236 22 3.73207 19.0571 2.4578 15Z\"></path>\n </svg>\n }\n @case (ICONS.gitRepositoryLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 21V23.5L10 21.5L7 23.5V21H6.5C4.567 21 3 19.433 3 17.5V5C3 3.34315 4.34315 2 6 2H20C20.5523 2 21 2.44772 21 3V20C21 20.5523 20.5523 21 20 21H13ZM13 19H19V16H6.5C5.67157 16 5 16.6716 5 17.5C5 18.3284 5.67157 19 6.5 19H7V17H13V19ZM19 14V4H6V14.0354C6.1633 14.0121 6.33024 14 6.5 14H19ZM7 5H9V7H7V5ZM7 8H9V10H7V8ZM7 11H9V13H7V11Z\"></path>\n </svg>\n }\n @case (ICONS.fileList3Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M19 22H5C3.34315 22 2 20.6569 2 19V3C2 2.44772 2.44772 2 3 2H17C17.5523 2 18 2.44772 18 3V15H22V19C22 20.6569 20.6569 22 19 22ZM18 17V19C18 19.5523 18.4477 20 19 20C19.5523 20 20 19.5523 20 19V17H18ZM16 20V4H4V19C4 19.5523 4.44772 20 5 20H16ZM6 7H14V9H6V7ZM6 11H14V13H6V11ZM6 15H11V17H6V15Z\"></path>\n </svg>\n }\n @case (ICONS.menuLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z\"></path>\n </svg>\n }\n @case (ICONS.sunLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z\"></path>\n </svg>\n }\n @case (ICONS.moonClearLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M10 6C10 10.4183 13.5817 14 18 14C19.4386 14 20.7885 13.6203 21.9549 12.9556C21.4738 18.0302 17.2005 22 12 22C6.47715 22 2 17.5228 2 12C2 6.79948 5.9698 2.52616 11.0444 2.04507C10.3797 3.21152 10 4.56142 10 6ZM4 12C4 16.4183 7.58172 20 12 20C14.9654 20 17.5757 18.3788 18.9571 15.9546C18.6407 15.9848 18.3214 16 18 16C12.4772 16 8 11.5228 8 6C8 5.67863 8.01524 5.35933 8.04536 5.04293C5.62119 6.42426 4 9.03458 4 12ZM18.1642 2.29104L19 2.5V3.5L18.1642 3.70896C17.4476 3.8881 16.8881 4.4476 16.709 5.16417L16.5 6H15.5L15.291 5.16417C15.1119 4.4476 14.5524 3.8881 13.8358 3.70896L13 3.5V2.5L13.8358 2.29104C14.5524 2.1119 15.1119 1.5524 15.291 0.835829L15.5 0H16.5L16.709 0.835829C16.8881 1.5524 17.4476 2.1119 18.1642 2.29104ZM23.1642 7.29104L24 7.5V8.5L23.1642 8.70896C22.4476 8.8881 21.8881 9.4476 21.709 10.1642L21.5 11H20.5L20.291 10.1642C20.1119 9.4476 19.5524 8.8881 18.8358 8.70896L18 8.5V7.5L18.8358 7.29104C19.5524 7.1119 20.1119 6.5524 20.291 5.83583L20.5 5H21.5L21.709 5.83583C21.8881 6.5524 22.4476 7.1119 23.1642 7.29104Z\"></path>\n </svg>\n }\n @case (ICONS.englishInput) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 10H16L16.0005 10.7574C16.7154 10.279 17.5751 10 18.5 10C20.9853 10 23 12.0147 23 14.5V20H21V14.5C21 13.07 19.8255 12 18.5 12C17.1745 12 16 13.07 16 14.5V20H14V10ZM12 4V6H4V11H12V13H4V18H12V20H2V4H12Z\"></path>\n </svg>\n }\n @case (ICONS.translate) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 15V17C5 18.0544 5.81588 18.9182 6.85074 18.9945L7 19H10V21H7C4.79086 21 3 19.2091 3 17V15H5ZM18 10L22.4 21H20.245L19.044 18H14.954L13.755 21H11.601L16 10H18ZM17 12.8852L15.753 16H18.245L17 12.8852ZM8 2V4H12V11H8V14H6V11H2V4H6V2H8ZM17 3C19.2091 3 21 4.79086 21 7V9H19V7C19 5.89543 18.1046 5 17 5H14V3H17ZM6 6H4V9H6V6ZM10 6H8V9H10V6Z\"></path>\n </svg>\n }\n @case (ICONS.user4Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 20H19V22H5V20ZM12 18C7.58172 18 4 14.4183 4 10C4 5.58172 7.58172 2 12 2C16.4183 2 20 5.58172 20 10C20 14.4183 16.4183 18 12 18ZM12 16C15.3137 16 18 13.3137 18 10C18 6.68629 15.3137 4 12 4C8.68629 4 6 6.68629 6 10C6 13.3137 8.68629 16 12 16Z\"></path>\n </svg>\n }\n @case (ICONS.shapesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9998 1L6 11H18L11.9998 1ZM11.9998 4.8873L14.4676 9H9.53232L11.9998 4.8873ZM6.75 20C5.23122 20 4 18.7688 4 17.25C4 15.7312 5.23122 14.5 6.75 14.5C8.26878 14.5 9.5 15.7312 9.5 17.25C9.5 18.7688 8.26878 20 6.75 20ZM6.75 22C9.37335 22 11.5 19.8734 11.5 17.25C11.5 14.6266 9.37335 12.5 6.75 12.5C4.12665 12.5 2 14.6266 2 17.25C2 19.8734 4.12665 22 6.75 22ZM15 15.5V19.5H19V15.5H15ZM13 21.5V13.5H21V21.5H13Z\"></path>\n </svg>\n }\n @case (ICONS.closeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z\"></path>\n </svg>\n }\n @case (ICONS.eyeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z\"></path>\n </svg>\n }\n @case (ICONS.eyeCloseLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9.34268 18.7819L7.41083 18.2642L8.1983 15.3254C7.00919 14.8874 5.91661 14.2498 4.96116 13.4534L2.80783 15.6067L1.39362 14.1925L3.54695 12.0392C2.35581 10.6103 1.52014 8.87466 1.17578 6.96818L3.14386 6.61035C3.90289 10.8126 7.57931 14.0001 12.0002 14.0001C16.4211 14.0001 20.0976 10.8126 20.8566 6.61035L22.8247 6.96818C22.4803 8.87466 21.6446 10.6103 20.4535 12.0392L22.6068 14.1925L21.1926 15.6067L19.0393 13.4534C18.0838 14.2498 16.9912 14.8874 15.8021 15.3254L16.5896 18.2642L14.6578 18.7819L13.87 15.8418C13.2623 15.9459 12.6376 16.0001 12.0002 16.0001C11.3629 16.0001 10.7381 15.9459 10.1305 15.8418L9.34268 18.7819Z\"></path>\n </svg>\n }\n @case (ICONS.linkedinBoxFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M18.3362 18.339H15.6707V14.1622C15.6707 13.1662 15.6505 11.8845 14.2817 11.8845C12.892 11.8845 12.6797 12.9683 12.6797 14.0887V18.339H10.0142V9.75H12.5747V10.9207H12.6092C12.967 10.2457 13.837 9.53325 15.1367 9.53325C17.8375 9.53325 18.337 11.3108 18.337 13.6245V18.339H18.3362ZM7.00373 8.57475C6.14573 8.57475 5.45648 7.88025 5.45648 7.026C5.45648 6.1725 6.14648 5.47875 7.00373 5.47875C7.85873 5.47875 8.55173 6.1725 8.55173 7.026C8.55173 7.88025 7.85798 8.57475 7.00373 8.57475ZM8.34023 18.339H5.66723V9.75H8.34023V18.339ZM19.6697 3H4.32923C3.59498 3 3.00098 3.5805 3.00098 4.29675V19.7033C3.00098 20.4202 3.59498 21 4.32923 21H19.6675C20.401 21 21.001 20.4202 21.001 19.7033V4.29675C21.001 3.5805 20.401 3 19.6675 3H19.6697Z\"></path>\n </svg>\n }\n @case (ICONS.githubFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.001 2C6.47598 2 2.00098 6.475 2.00098 12C2.00098 16.425 4.86348 20.1625 8.83848 21.4875C9.33848 21.575 9.52598 21.275 9.52598 21.0125C9.52598 20.775 9.51348 19.9875 9.51348 19.15C7.00098 19.6125 6.35098 18.5375 6.15098 17.975C6.03848 17.6875 5.55098 16.8 5.12598 16.5625C4.77598 16.375 4.27598 15.9125 5.11348 15.9C5.90098 15.8875 6.46348 16.625 6.65098 16.925C7.55098 18.4375 8.98848 18.0125 9.56348 17.75C9.65098 17.1 9.91348 16.6625 10.201 16.4125C7.97598 16.1625 5.65098 15.3 5.65098 11.475C5.65098 10.3875 6.03848 9.4875 6.67598 8.7875C6.57598 8.5375 6.22598 7.5125 6.77598 6.1375C6.77598 6.1375 7.61348 5.875 9.52598 7.1625C10.326 6.9375 11.176 6.825 12.026 6.825C12.876 6.825 13.726 6.9375 14.526 7.1625C16.4385 5.8625 17.276 6.1375 17.276 6.1375C17.826 7.5125 17.476 8.5375 17.376 8.7875C18.0135 9.4875 18.401 10.375 18.401 11.475C18.401 15.3125 16.0635 16.1625 13.8385 16.4125C14.201 16.725 14.5135 17.325 14.5135 18.2625C14.5135 19.6 14.501 20.675 14.501 21.0125C14.501 21.275 14.6885 21.5875 15.1885 21.4875C19.259 20.1133 21.9999 16.2963 22.001 12C22.001 6.475 17.526 2 12.001 2Z\"></path>\n </svg>\n }\n @case (ICONS.instagramFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0281 2.00073C14.1535 2.00259 14.7238 2.00855 15.2166 2.02322L15.4107 2.02956C15.6349 2.03753 15.8561 2.04753 16.1228 2.06003C17.1869 2.1092 17.9128 2.27753 18.5503 2.52503C19.2094 2.7792 19.7661 3.12253 20.3219 3.67837C20.8769 4.2342 21.2203 4.79253 21.4753 5.45003C21.7219 6.0867 21.8903 6.81337 21.9403 7.87753C21.9522 8.1442 21.9618 8.3654 21.9697 8.58964L21.976 8.78373C21.9906 9.27647 21.9973 9.84686 21.9994 10.9723L22.0002 11.7179C22.0003 11.809 22.0003 11.903 22.0003 12L22.0002 12.2821L21.9996 13.0278C21.9977 14.1532 21.9918 14.7236 21.9771 15.2163L21.9707 15.4104C21.9628 15.6347 21.9528 15.8559 21.9403 16.1225C21.8911 17.1867 21.7219 17.9125 21.4753 18.55C21.2211 19.2092 20.8769 19.7659 20.3219 20.3217C19.7661 20.8767 19.2069 21.22 18.5503 21.475C17.9128 21.7217 17.1869 21.89 16.1228 21.94C15.8561 21.9519 15.6349 21.9616 15.4107 21.9694L15.2166 21.9757C14.7238 21.9904 14.1535 21.997 13.0281 21.9992L12.2824 22C12.1913 22 12.0973 22 12.0003 22L11.7182 22L10.9725 21.9993C9.8471 21.9975 9.27672 21.9915 8.78397 21.9768L8.58989 21.9705C8.36564 21.9625 8.14444 21.9525 7.87778 21.94C6.81361 21.8909 6.08861 21.7217 5.45028 21.475C4.79194 21.2209 4.23444 20.8767 3.67861 20.3217C3.12278 19.7659 2.78028 19.2067 2.52528 18.55C2.27778 17.9125 2.11028 17.1867 2.06028 16.1225C2.0484 15.8559 2.03871 15.6347 2.03086 15.4104L2.02457 15.2163C2.00994 14.7236 2.00327 14.1532 2.00111 13.0278L2.00098 10.9723C2.00284 9.84686 2.00879 9.27647 2.02346 8.78373L2.02981 8.58964C2.03778 8.3654 2.04778 8.1442 2.06028 7.87753C2.10944 6.81253 2.27778 6.08753 2.52528 5.45003C2.77944 4.7917 3.12278 4.2342 3.67861 3.67837C4.23444 3.12253 4.79278 2.78003 5.45028 2.52503C6.08778 2.27753 6.81278 2.11003 7.87778 2.06003C8.14444 2.04816 8.36564 2.03847 8.58989 2.03062L8.78397 2.02433C9.27672 2.00969 9.8471 2.00302 10.9725 2.00086L13.0281 2.00073ZM12.0003 7.00003C9.23738 7.00003 7.00028 9.23956 7.00028 12C7.00028 14.7629 9.23981 17 12.0003 17C14.7632 17 17.0003 14.7605 17.0003 12C17.0003 9.23713 14.7607 7.00003 12.0003 7.00003ZM12.0003 9.00003C13.6572 9.00003 15.0003 10.3427 15.0003 12C15.0003 13.6569 13.6576 15 12.0003 15C10.3434 15 9.00028 13.6574 9.00028 12C9.00028 10.3431 10.3429 9.00003 12.0003 9.00003ZM17.2503 5.50003C16.561 5.50003 16.0003 6.05994 16.0003 6.74918C16.0003 7.43843 16.5602 7.9992 17.2503 7.9992C17.9395 7.9992 18.5003 7.4393 18.5003 6.74918C18.5003 6.05994 17.9386 5.49917 17.2503 5.50003Z\"></path>\n </svg>\n }\n @case (ICONS.twitterXFill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17.6874 3.0625L12.6907 8.77425L8.37045 3.0625H2.11328L9.58961 12.8387L2.50378 20.9375H5.53795L11.0068 14.6886L15.7863 20.9375H21.8885L14.095 10.6342L20.7198 3.0625H17.6874ZM16.6232 19.1225L5.65436 4.78217H7.45745L18.3034 19.1225H16.6232Z\"></path>\n </svg>\n }\n @case (ICONS.downloadCloud2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13 13V18.585L14.8284 16.7574L16.2426 18.1716L12 22.4142L7.75736 18.1716L9.17157 16.7574L11 18.585V13H13ZM12 2C15.5934 2 18.5544 4.70761 18.9541 8.19395C21.2858 8.83154 23 10.9656 23 13.5C23 16.3688 20.8036 18.7246 18.0006 18.9776L18.0009 16.9644C19.6966 16.7214 21 15.2629 21 13.5C21 11.567 19.433 10 17.5 10C17.2912 10 17.0867 10.0183 16.8887 10.054C16.9616 9.7142 17 9.36158 17 9C17 6.23858 14.7614 4 12 4C9.23858 4 7 6.23858 7 9C7 9.36158 7.03838 9.7142 7.11205 10.0533C6.91331 10.0183 6.70879 10 6.5 10C4.567 10 3 11.567 3 13.5C3 15.2003 4.21241 16.6174 5.81986 16.934L6.00005 16.9646L6.00039 18.9776C3.19696 18.7252 1 16.3692 1 13.5C1 10.9656 2.71424 8.83154 5.04648 8.19411C5.44561 4.70761 8.40661 2 12 2Z\"></path>\n </svg>\n }\n @case (ICONS.globeLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M13.0003 21H18.0003V23H6.00032V21H11.0003V19.9506C7.70689 19.6236 4.88351 17.6987 3.31641 14.9622L5.05319 13.9697C6.43208 16.3776 9.02674 18 12.0003 18C16.4186 18 20.0003 14.4182 20.0003 9.99995C20.0003 7.02637 18.378 4.43171 15.9701 3.05282L16.9626 1.31604C19.9724 3.03965 22.0003 6.28297 22.0003 9.99995C22.0003 15.1853 18.0536 19.4489 13.0003 19.9506V21ZM12.0003 17C8.13433 17 5.00032 13.8659 5.00032 9.99995C5.00032 6.13396 8.13433 2.99995 12.0003 2.99995C15.8663 2.99995 19.0003 6.13396 19.0003 9.99995C19.0003 13.8659 15.8663 17 12.0003 17ZM12.0003 15C14.7617 15 17.0003 12.7614 17.0003 9.99995C17.0003 7.23853 14.7617 4.99995 12.0003 4.99995C9.2389 4.99995 7.00032 7.23853 7.00032 9.99995C7.00032 12.7614 9.2389 15 12.0003 15Z\"></path>\n </svg>\n }\n @case (ICONS.mailSendLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M21 3C21.5523 3 22 3.44772 22 4V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V19H20V7.3L12 14.5L2 5.5V4C2 3.44772 2.44772 3 3 3H21ZM8 15V17H0V15H8ZM5 10V12H0V10H5ZM19.5659 5H4.43414L12 11.8093L19.5659 5Z\"></path>\n </svg>\n }\n @case (ICONS.pagesLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M5 8V20H19V8H5ZM5 6H19V4H5V6ZM20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM7 10H11V14H7V10ZM7 16H17V18H7V16ZM13 11H17V13H13V11Z\"></path>\n </svg>\n }\n @case (ICONS.gitForkLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 5C5.44772 5 5 5.44772 5 6C5 6.55228 5.44772 7 6 7C6.55228 7 7 6.55228 7 6C7 5.44772 6.55228 5 6 5ZM3 6C3 4.34315 4.34315 3 6 3C7.65685 3 9 4.34315 9 6C9 7.30622 8.16519 8.41746 7 8.82929V9C7 10.1046 7.89543 11 9 11H15C16.1046 11 17 10.1046 17 9V8.82929C15.8348 8.41746 15 7.30622 15 6C15 4.34315 16.3431 3 18 3C19.6569 3 21 4.34315 21 6C21 7.30622 20.1652 8.41746 19 8.82929V9C19 11.2091 17.2091 13 15 13H13V15.1707C14.1652 15.5825 15 16.6938 15 18C15 19.6569 13.6569 21 12 21C10.3431 21 9 19.6569 9 18C9 16.6938 9.83481 15.5825 11 15.1707V13H9C6.79086 13 5 11.2091 5 9V8.82929C3.83481 8.41746 3 7.30622 3 6ZM18 5C17.4477 5 17 5.44772 17 6C17 6.55228 17.4477 7 18 7C18.5523 7 19 6.55228 19 6C19 5.44772 18.5523 5 18 5ZM12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18C13 17.4477 12.5523 17 12 17Z\"></path>\n </svg>\n }\n @case (ICONS.gitRepositoryPrivateLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6 10V20H19V10H6ZM18 8H20C20.5523 8 21 8.44772 21 9V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V9C3 8.44772 3.44772 8 4 8H6V7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7V8ZM16 8V7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7V8H16ZM7 11H9V13H7V11ZM7 14H9V16H7V14ZM7 17H9V19H7V17Z\"></path>\n </svg>\n }\n @case (ICONS.starLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12.0006 18.26L4.94715 22.2082L6.52248 14.2799L0.587891 8.7918L8.61493 7.84006L12.0006 0.5L15.3862 7.84006L23.4132 8.7918L17.4787 14.2799L19.054 22.2082L12.0006 18.26ZM12.0006 15.968L16.2473 18.3451L15.2988 13.5717L18.8719 10.2674L14.039 9.69434L12.0006 5.27502L9.96214 9.69434L5.12921 10.2674L8.70231 13.5717L7.75383 18.3451L12.0006 15.968Z\"></path>\n </svg>\n }\n @case (ICONS.calendar2Line) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z\"></path>\n </svg>\n }\n @case (ICONS.macLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M14 18V20L16 21V22H8L7.99639 21.0036L10 20V18H2.9918C2.44405 18 2 17.5511 2 16.9925V4.00748C2 3.45107 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44892 22 4.00748V16.9925C22 17.5489 21.5447 18 21.0082 18H14ZM4 5V14H20V5H4Z\"></path>\n </svg>\n }\n @case (ICONS.more2Fill) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M12 3C10.9 3 10 3.9 10 5C10 6.1 10.9 7 12 7C13.1 7 14 6.1 14 5C14 3.9 13.1 3 12 3ZM12 17C10.9 17 10 17.9 10 19C10 20.1 10.9 21 12 21C13.1 21 14 20.1 14 19C14 17.9 13.1 17 12 17ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z\"></path>\n </svg>\n }\n @case (ICONS.editLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M6.41421 15.89L16.5563 5.74785L15.1421 4.33363L5 14.4758V15.89H6.41421ZM7.24264 17.89H3V13.6473L14.435 2.21231C14.8256 1.82179 15.4587 1.82179 15.8492 2.21231L18.6777 5.04074C19.0682 5.43126 19.0682 6.06443 18.6777 6.45495L7.24264 17.89ZM3 19.89H21V21.89H3V19.89Z\"></path>\n </svg>\n }\n @case (ICONS.deleteBinLine) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path\n d=\"M17 6H22V8H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V8H2V6H7V3C7 2.44772 7.44772 2 8 2H16C16.5523 2 17 2.44772 17 3V6ZM18 8H6V20H18V8ZM9 11H11V17H9V11ZM13 11H15V17H13V11ZM9 4V6H15V4H9Z\"></path>\n </svg>\n }\n }\n</span>\n", styles: [":host{color:inherit;display:inline-flex}:host:has(.icon--left){margin-left:var(--gld-spacing--xxxs)}:host:has(.icon--right){margin-right:var(--gld-spacing--xxxs)}.icon{--gld-icon-size: var(--gld-icon-size--normal);position:relative;color:inherit;font-weight:400;width:var(--gld-icon-size);height:var(--gld-icon-size);margin:auto}.icon--tiny{--gld-icon-size: var(--gld-icon-size--tiny)}.icon--small{--gld-icon-size: var(--gld-icon-size--small)}.icon--medium{--gld-icon-size: var(--gld-icon-size--medium)}.icon--large{--gld-icon-size: var(--gld-icon-size--large)}\n"] }]
229
209
  }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], space: [{ type: i0.Input, args: [{ isSignal: true, alias: "space", required: false }] }], moveTopToBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopToBottom", required: false }] }], moveLeftToRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveLeftToRight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
230
210
 
231
211
  // Angular Imports
@@ -233,10 +213,10 @@ class Button {
233
213
  constructor() {
234
214
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `button-id-${value.trim().split(' ').join('-')}` });
235
215
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `button-name-${value.trim().split(' ').join('-')}` });
236
- this.color = input(ButtonColor.pink, { ...(ngDevMode ? { debugName: "color" } : {}) });
237
- this.size = input(ButtonSize.normal, { ...(ngDevMode ? { debugName: "size" } : {}) });
238
- this.icon = input(null, { ...(ngDevMode ? { debugName: "icon" } : {}) });
239
- this.iconSize = input(undefined, { ...(ngDevMode ? { debugName: "iconSize" } : {}) });
216
+ this.color = input(BUTTON_COLORS.pink, ...(ngDevMode ? [{ debugName: "color" }] : []));
217
+ this.size = input(BUTTON_SIZES.normal, ...(ngDevMode ? [{ debugName: "size" }] : []));
218
+ this.icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
219
+ this.iconSize = input(ICONS_SIZES.normal, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
240
220
  this.moveTopToBottom = input(0, { ...(ngDevMode ? { debugName: "moveTopToBottom" } : {}), transform: numberAttribute });
241
221
  this.moveLeftToRight = input(0, { ...(ngDevMode ? { debugName: "moveLeftToRight" } : {}), transform: numberAttribute });
242
222
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
@@ -250,10 +230,10 @@ class Button {
250
230
  keyup() {
251
231
  this.emitClick();
252
232
  }
253
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
254
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Button, isStandalone: true, selector: "gld-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }} button--{{ size() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--full]=\"full()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content>no content</ng-content>\n </span>\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;height:inherit;max-width:inherit}:host:has(.button--full){width:100%}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs);--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:0;padding:var(--gld-padding);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--pink{--gld-color: var(--gld-pink);--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple);--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard);--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange);--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue);--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green);--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--tiny{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxxs) var(--gld-spacing--xxs)}.button--small{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxs)}.button--normal{--gld-font-size: var(--gld-font-size--normal);--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs)}.button--medium{--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--m)}.button--large{--gld-font-size: var(--gld-font-size--heading-three);--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--l)}.button--disabled{--gld-color: var(--gld-gray);--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020);pointer-events:none;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
233
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
234
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Button, isStandalone: true, selector: "gld-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }} button--{{ size() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--full]=\"full()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content>no content</ng-content>\n </span>\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;height:inherit;max-width:inherit}:host:has(.button--full){width:100%}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs);--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:0;padding:var(--gld-padding);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--pink{--gld-color: var(--gld-pink);--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple);--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard);--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange);--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue);--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green);--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--tiny{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxxs) var(--gld-spacing--xxs)}.button--small{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxs)}.button--normal{--gld-font-size: var(--gld-font-size--normal);--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs)}.button--medium{--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--m)}.button--large{--gld-font-size: var(--gld-font-size--heading-three);--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--l)}.button--disabled{--gld-color: var(--gld-gray);--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020);pointer-events:none;cursor:not-allowed}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
255
235
  }
256
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Button, decorators: [{
236
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Button, decorators: [{
257
237
  type: Component,
258
238
  args: [{ selector: 'gld-button', imports: [Icon], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }} button--{{ size() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--full]=\"full()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content>no content</ng-content>\n </span>\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;height:inherit;max-width:inherit}:host:has(.button--full){width:100%}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs);--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:0;padding:var(--gld-padding);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--pink{--gld-color: var(--gld-pink);--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple);--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard);--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange);--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue);--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green);--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--tiny{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxxs) var(--gld-spacing--xxs)}.button--small{--gld-font-size: var(--gld-font-size--small);--gld-padding: var(--gld-spacing--xxs)}.button--normal{--gld-font-size: var(--gld-font-size--normal);--gld-padding: var(--gld-spacing--xxs) var(--gld-spacing--xs)}.button--medium{--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--m)}.button--large{--gld-font-size: var(--gld-font-size--heading-three);--gld-padding: var(--gld-spacing--xs) var(--gld-spacing--l)}.button--disabled{--gld-color: var(--gld-gray);--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020);pointer-events:none;cursor:not-allowed}\n"] }]
259
239
  }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], moveTopToBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopToBottom", required: false }] }], moveLeftToRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveLeftToRight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], full: [{ type: i0.Input, args: [{ isSignal: true, alias: "full", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
@@ -262,18 +242,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
262
242
  const components$7 = [Icon];
263
243
  class DropdownButton {
264
244
  constructor() {
265
- this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
266
- this.icon = input(null, { ...(ngDevMode ? { debugName: "icon" } : {}) });
267
- this.iconSize = input(IconsSize.normal, { ...(ngDevMode ? { debugName: "iconSize" } : {}) });
268
- this.iconSpace = input(IconsSpace.none, { ...(ngDevMode ? { debugName: "iconSpace" } : {}) });
245
+ this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
246
+ this.icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
247
+ this.iconSize = input(ICONS_SIZES.normal, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
248
+ this.iconSpace = input(ICONS_SPACES.none, ...(ngDevMode ? [{ debugName: "iconSpace" }] : []));
269
249
  this.moveTopToBottom = input(0, { ...(ngDevMode ? { debugName: "moveTopToBottom" } : {}), transform: numberAttribute });
270
250
  this.moveLeftToRight = input(0, { ...(ngDevMode ? { debugName: "moveLeftToRight" } : {}), transform: numberAttribute });
271
- this.direction = input(DropdownDirection.left, { ...(ngDevMode ? { debugName: "direction" } : {}) });
251
+ this.direction = input(DROPDOWN_DIRECTIONS.left, ...(ngDevMode ? [{ debugName: "direction" }] : []));
272
252
  this.changeValue = output();
273
- this.current = signal(null, { ...(ngDevMode ? { debugName: "current" } : {}) });
274
- this.disabled = signal(false, { ...(ngDevMode ? { debugName: "disabled" } : {}) });
275
- this.error = signal(false, { ...(ngDevMode ? { debugName: "error" } : {}) });
276
- this.selected = computed(() => Boolean(this.current() === this.value()), { ...(ngDevMode ? { debugName: "selected" } : {}) });
253
+ this.current = signal(null, ...(ngDevMode ? [{ debugName: "current" }] : []));
254
+ this.disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
255
+ this.error = signal(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
256
+ this.selected = computed(() => Boolean(this.current() === this.value()), ...(ngDevMode ? [{ debugName: "selected" }] : []));
277
257
  this.buttonChild = viewChild('buttonChild', { ...(ngDevMode ? { debugName: "buttonChild" } : {}), read: ElementRef });
278
258
  }
279
259
  select(value) {
@@ -283,20 +263,20 @@ class DropdownButton {
283
263
  keyup(value) {
284
264
  this.select(value);
285
265
  }
286
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
287
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: DropdownButton, isStandalone: true, selector: "gld-dropdown-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, iconSpace: { classPropertyName: "iconSpace", publicName: "iconSpace", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue" }, viewQueries: [{ propertyName: "buttonChild", first: true, predicate: ["buttonChild"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<button\n #buttonChild\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button button--direction-{{ direction() }}\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize()\"\n [space]=\"iconSpace()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content> no content </ng-content>\n </span>\n</button>\n", styles: [":host{position:relative;width:100%}.button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);--gld-height: 40px;padding:var(--gld-spacing--xxs) var(--gld-spacing--xs);width:100%;height:var(--gld-height);background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);text-align:left;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;display:inline-flex;align-items:center;gap:var(--gld-spacing--xxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover);--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--direction-left{justify-content:flex-start}.button--direction-right{justify-content:flex-end}.button--selected,.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
266
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
267
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: DropdownButton, isStandalone: true, selector: "gld-dropdown-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, iconSpace: { classPropertyName: "iconSpace", publicName: "iconSpace", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue" }, viewQueries: [{ propertyName: "buttonChild", first: true, predicate: ["buttonChild"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<button\n #buttonChild\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button button--direction-{{ direction() }}\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize()\"\n [space]=\"iconSpace()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content> no content </ng-content>\n </span>\n</button>\n", styles: [":host{position:relative;width:100%}.button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);--gld-height: 40px;padding:var(--gld-spacing--xxs) var(--gld-spacing--xs);width:100%;height:var(--gld-height);background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);text-align:left;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;display:inline-flex;align-items:center;gap:var(--gld-spacing--xxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover);--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--direction-left{justify-content:flex-start}.button--direction-right{justify-content:flex-end}.button--selected,.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
288
268
  }
289
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownButton, decorators: [{
269
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownButton, decorators: [{
290
270
  type: Component,
291
271
  args: [{ selector: 'gld-dropdown-button', imports: [...components$7], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n #buttonChild\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button button--direction-{{ direction() }}\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <!-- Icon -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [icon]=\"innerIcon\"\n [size]=\"iconSize()\"\n [space]=\"iconSpace()\"\n [disabled]=\"disabled()\" />\n }\n <!-- Content -->\n <span>\n <ng-content> no content </ng-content>\n </span>\n</button>\n", styles: [":host{position:relative;width:100%}.button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);--gld-height: 40px;padding:var(--gld-spacing--xxs) var(--gld-spacing--xs);width:100%;height:var(--gld-height);background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);text-align:left;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;display:inline-flex;align-items:center;gap:var(--gld-spacing--xxs);will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover);--gld-background: var(--gld-background--hover)}.button:active{transform:scale(.95)}.button span{text-transform:capitalize;-webkit-user-select:none;user-select:none}.button--direction-left{justify-content:flex-start}.button--direction-right{justify-content:flex-end}.button--selected,.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"] }]
292
272
  }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], iconSpace: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSpace", required: false }] }], moveTopToBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopToBottom", required: false }] }], moveLeftToRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveLeftToRight", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], changeValue: [{ type: i0.Output, args: ["changeValue"] }], buttonChild: [{ type: i0.ViewChild, args: ['buttonChild', { ...{ read: ElementRef }, isSignal: true }] }] } });
293
273
 
294
274
  // Angular Imports
295
275
  class DropdownMenuTemplate {
296
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownMenuTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
297
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.1", type: DropdownMenuTemplate, isStandalone: true, selector: "[gldDropdownMenuTemplate]", ngImport: i0 }); }
276
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownMenuTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
277
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: DropdownMenuTemplate, isStandalone: true, selector: "[gldDropdownMenuTemplate]", ngImport: i0 }); }
298
278
  }
299
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownMenuTemplate, decorators: [{
279
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownMenuTemplate, decorators: [{
300
280
  type: Directive,
301
281
  args: [{
302
282
  selector: '[gldDropdownMenuTemplate]',
@@ -305,10 +285,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
305
285
 
306
286
  // Angular Imports
307
287
  class InputErrorMessage {
308
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputErrorMessage, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
309
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.1", type: InputErrorMessage, isStandalone: true, selector: "[gldInputErrorMessage]", ngImport: i0 }); }
288
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputErrorMessage, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
289
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: InputErrorMessage, isStandalone: true, selector: "[gldInputErrorMessage]", ngImport: i0 }); }
310
290
  }
311
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputErrorMessage, decorators: [{
291
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputErrorMessage, decorators: [{
312
292
  type: Directive,
313
293
  args: [{
314
294
  selector: '[gldInputErrorMessage]',
@@ -318,16 +298,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
318
298
  // Angular Imports
319
299
  class IconButton {
320
300
  constructor() {
321
- this.icon = input.required({ ...(ngDevMode ? { debugName: "icon" } : {}) });
301
+ this.icon = input.required(...(ngDevMode ? [{ debugName: "icon" }] : []));
322
302
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `button-id-${value.trim().split(' ').join('-')}` });
323
303
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `button-name-${value.trim().split(' ').join('-')}` });
324
- this.iconSize = input(IconsSize.normal, { ...(ngDevMode ? { debugName: "iconSize" } : {}) });
325
- this.space = input(IconsSpace.none, { ...(ngDevMode ? { debugName: "space" } : {}) });
304
+ this.iconSize = input(ICONS_SIZES.normal, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
305
+ this.space = input(ICONS_SPACES.none, ...(ngDevMode ? [{ debugName: "space" }] : []));
326
306
  this.moveTopToBottom = input(0, { ...(ngDevMode ? { debugName: "moveTopToBottom" } : {}), transform: numberAttribute });
327
307
  this.moveLeftToRight = input(0, { ...(ngDevMode ? { debugName: "moveLeftToRight" } : {}), transform: numberAttribute });
328
308
  this.background = input(false, { ...(ngDevMode ? { debugName: "background" } : {}), transform: booleanAttribute });
329
309
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
330
- this.color = input(ButtonColor.pink, { ...(ngDevMode ? { debugName: "color" } : {}) });
310
+ this.color = input(BUTTON_COLORS.pink, ...(ngDevMode ? [{ debugName: "color" }] : []));
331
311
  this.clicked = output();
332
312
  }
333
313
  emitClick() {
@@ -337,10 +317,10 @@ class IconButton {
337
317
  keyup() {
338
318
  this.emitClick();
339
319
  }
340
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: IconButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
341
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: IconButton, isStandalone: true, selector: "gld-icon-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--background]=\"background()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n <gld-icon\n [icon]=\"icon()\"\n [size]=\"iconSize()\"\n [space]=\"space()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [disabled]=\"disabled()\" />\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;max-width:inherit}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button:active{transform:scale(.98)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.button--background{--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple)}.button--purple.button--background{--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard)}.button--mustard.button--background{--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange)}.button--orange.button--background{--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue)}.button--blue.button--background{--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red)}.button--red.button--background{--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green)}.button--green.button--background{--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--disabled{--gld-color: var(--gld-gray-transparent--060);pointer-events:none;cursor:not-allowed}.button--disabled.button--background{--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020)}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
320
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IconButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
321
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: IconButton, isStandalone: true, selector: "gld-icon-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--background]=\"background()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n <gld-icon\n [icon]=\"icon()\"\n [size]=\"iconSize()\"\n [space]=\"space()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [disabled]=\"disabled()\" />\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;max-width:inherit}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button:active{transform:scale(.98)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.button--background{--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple)}.button--purple.button--background{--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard)}.button--mustard.button--background{--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange)}.button--orange.button--background{--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue)}.button--blue.button--background{--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red)}.button--red.button--background{--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green)}.button--green.button--background{--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--disabled{--gld-color: var(--gld-gray-transparent--060);pointer-events:none;cursor:not-allowed}.button--disabled.button--background{--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020)}\n"], dependencies: [{ kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
342
322
  }
343
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: IconButton, decorators: [{
323
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IconButton, decorators: [{
344
324
  type: Component,
345
325
  args: [{ selector: 'gld-icon-button', imports: [Icon], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"button button--{{ color() }}\"\n [class.button--disabled]=\"disabled()\"\n [class.button--background]=\"background()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <!-- Icon -->\n <gld-icon\n [icon]=\"icon()\"\n [size]=\"iconSize()\"\n [space]=\"space()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [disabled]=\"disabled()\" />\n</button>\n\n<!-- Only used by DropdownMenuComponent -->\n<ng-content select=\"[gldDropdownMenuTemplate]\" />\n", styles: [":host{display:inline-block;max-width:inherit}.button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button:active{transform:scale(.98)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.button--background{--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple)}.button--purple.button--background{--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard)}.button--mustard.button--background{--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange)}.button--orange.button--background{--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue)}.button--blue.button--background{--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red)}.button--red.button--background{--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green)}.button--green.button--background{--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--disabled{--gld-color: var(--gld-gray-transparent--060);pointer-events:none;cursor:not-allowed}.button--disabled.button--background{--gld-background: var(--gld-gray-transparent--020);--gld-background--hover: var(--gld-gray-transparent--020)}\n"] }]
346
326
  }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], space: [{ type: i0.Input, args: [{ isSignal: true, alias: "space", required: false }] }], moveTopToBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopToBottom", required: false }] }], moveLeftToRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveLeftToRight", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
@@ -350,25 +330,25 @@ const components$6 = [Button, IconButton];
350
330
  const directives = [DropdownMenuTemplate];
351
331
  class DropdownMenu {
352
332
  constructor() {
353
- this.DropdownType = DropdownType;
333
+ this.DROPDOWN_TYPES = DROPDOWN_TYPES;
354
334
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `dropdown-id-${value.trim().split(' ').join('-')}` });
355
335
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `dropdown-name-${value.trim().split(' ').join('-')}` });
356
- this.type = input.required({ ...(ngDevMode ? { debugName: "type" } : {}) });
357
- this.color = input(ButtonColor.pink, { ...(ngDevMode ? { debugName: "color" } : {}) });
358
- this.size = input(ButtonSize.normal, { ...(ngDevMode ? { debugName: "size" } : {}) });
359
- this.icon = input(null, { ...(ngDevMode ? { debugName: "icon" } : {}) });
360
- this.iconSize = input(undefined, { ...(ngDevMode ? { debugName: "iconSize" } : {}) });
336
+ this.type = input.required(...(ngDevMode ? [{ debugName: "type" }] : []));
337
+ this.color = input(BUTTON_COLORS.pink, ...(ngDevMode ? [{ debugName: "color" }] : []));
338
+ this.size = input(BUTTON_SIZES.normal, ...(ngDevMode ? [{ debugName: "size" }] : []));
339
+ this.icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
340
+ this.iconSize = input(ICONS_SIZES.normal, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
361
341
  this.moveTopToBottom = input(0, { ...(ngDevMode ? { debugName: "moveTopToBottom" } : {}), transform: numberAttribute });
362
342
  this.moveLeftToRight = input(0, { ...(ngDevMode ? { debugName: "moveLeftToRight" } : {}), transform: numberAttribute });
363
343
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
364
344
  this.full = input(false, { ...(ngDevMode ? { debugName: "full" } : {}), transform: booleanAttribute });
365
- this.direction = input(DropdownDirection.right, { ...(ngDevMode ? { debugName: "direction" } : {}) });
345
+ this.direction = input(DROPDOWN_DIRECTIONS.right, ...(ngDevMode ? [{ debugName: "direction" }] : []));
366
346
  this.background = input(false, { ...(ngDevMode ? { debugName: "background" } : {}), transform: booleanAttribute });
367
347
  this.selected = input(false, { ...(ngDevMode ? { debugName: "selected" } : {}), transform: booleanAttribute });
368
- this.initialValue = input(null, { ...(ngDevMode ? { debugName: "initialValue" } : {}) });
348
+ this.initialValue = input(null, ...(ngDevMode ? [{ debugName: "initialValue" }] : []));
369
349
  this.changeValue = output();
370
350
  this.changeFocus = output();
371
- this.dropdownButtonChildren = contentChildren(DropdownButton, { ...(ngDevMode ? { debugName: "dropdownButtonChildren" } : {}) });
351
+ this.dropdownButtonChildren = contentChildren(DropdownButton, ...(ngDevMode ? [{ debugName: "dropdownButtonChildren" }] : []));
372
352
  effect(() => {
373
353
  const initialValue = this.initialValue();
374
354
  if (initialValue)
@@ -392,25 +372,24 @@ class DropdownMenu {
392
372
  updateErrorInChildren(error) {
393
373
  this.dropdownButtonChildren().map((dropdownButton) => dropdownButton.error.set(error));
394
374
  }
395
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
396
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: DropdownMenu, isStandalone: true, selector: "gld-dropdown-menu", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, queries: [{ propertyName: "dropdownButtonChildren", predicate: DropdownButton, isSignal: true }], ngImport: i0, template: "<!-- Button -->\n@if (type() === DropdownType.button) {\n <gld-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [size]=\"size()\"\n [icon]=\"icon()\"\n [iconSize]=\"iconSize()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [full]=\"full()\">\n <ng-content />\n\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-button>\n} @else {\n <!-- Icon Button -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [icon]=\"innerIcon\"\n [iconSize]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [background]=\"background()\">\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-icon-button>\n }\n}\n\n<ng-template #dropdownMenu>\n <!-- Menu -->\n <section\n class=\"dropdown-menu dropdown-menu--{{ type() }} dropdown-menu--{{ size() }}\n dropdown-menu--direction-{{ direction() }}\">\n <ng-content select=\"gld-dropdown-button\">no buttons</ng-content>\n </section>\n</ng-template>\n", styles: [":host{max-width:inherit}.dropdown-menu{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);--gld-dropdown-min-width: 100px;--gld-dropdown-bottom-position: 0;padding:var(--gld-spacing--xxxs);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);background:var(--gld-background);display:none;position:absolute;scale:0;z-index:1;min-width:var(--gld-dropdown-min-width);max-width:inherit}.dropdown-menu--direction-right{left:0;transform-origin:top left;transform:translateY(var(--gld-dropdown-bottom-position))}.dropdown-menu--direction-left{transform-origin:top right;transform:translate(-100%,var(--gld-dropdown-bottom-position))}.dropdown-menu--tiny{--gld-dropdown-bottom-position: 26px}.dropdown-menu--small{--gld-dropdown-bottom-position: 34px}.dropdown-menu--normal{--gld-dropdown-bottom-position: 39px}.dropdown-menu--normal.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 42px}.dropdown-menu--medium{--gld-dropdown-bottom-position: 47px}.dropdown-menu--medium.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 50px}.dropdown-menu--large{--gld-dropdown-bottom-position: 52px}.dropdown-menu--large.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 58px}gld-button:focus-within .dropdown-menu,gld-icon-button:focus-within .dropdown-menu{display:initial;scale:1;z-index:1}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Button, selector: "gld-button", inputs: ["id", "name", "color", "size", "icon", "iconSize", "moveTopToBottom", "moveLeftToRight", "disabled", "full"], outputs: ["clicked"] }, { kind: "component", type: IconButton, selector: "gld-icon-button", inputs: ["icon", "id", "name", "iconSize", "space", "moveTopToBottom", "moveLeftToRight", "background", "disabled", "color"], outputs: ["clicked"] }, { kind: "directive", type: DropdownMenuTemplate, selector: "[gldDropdownMenuTemplate]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
375
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
376
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: DropdownMenu, isStandalone: true, selector: "gld-dropdown-menu", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, full: { classPropertyName: "full", publicName: "full", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, queries: [{ propertyName: "dropdownButtonChildren", predicate: DropdownButton, isSignal: true }], ngImport: i0, template: "<!-- Button -->\n@if (type() === DROPDOWN_TYPES.button) {\n <gld-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [size]=\"size()\"\n [icon]=\"icon()\"\n [iconSize]=\"iconSize()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [full]=\"full()\">\n <ng-content />\n\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-button>\n} @else {\n <!-- Icon Button -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [icon]=\"innerIcon\"\n [iconSize]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [background]=\"background()\">\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-icon-button>\n }\n}\n\n<ng-template #dropdownMenu>\n <!-- Menu -->\n <section\n class=\"dropdown-menu dropdown-menu--{{ type() }} dropdown-menu--{{ size() }}\n dropdown-menu--direction-{{ direction() }}\">\n <ng-content select=\"gld-dropdown-button\">no buttons</ng-content>\n </section>\n</ng-template>\n", styles: [":host{max-width:inherit}.dropdown-menu{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);--gld-dropdown-min-width: 100px;--gld-dropdown-bottom-position: 0;padding:var(--gld-spacing--xxxs);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);background:var(--gld-background);display:none;position:absolute;scale:0;z-index:1;min-width:var(--gld-dropdown-min-width);max-width:inherit}.dropdown-menu--direction-right{left:0;transform-origin:top left;transform:translateY(var(--gld-dropdown-bottom-position))}.dropdown-menu--direction-left{transform-origin:top right;transform:translate(-100%,var(--gld-dropdown-bottom-position))}.dropdown-menu--tiny{--gld-dropdown-bottom-position: 26px}.dropdown-menu--small{--gld-dropdown-bottom-position: 34px}.dropdown-menu--normal{--gld-dropdown-bottom-position: 39px}.dropdown-menu--normal.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 42px}.dropdown-menu--medium{--gld-dropdown-bottom-position: 47px}.dropdown-menu--medium.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 50px}.dropdown-menu--large{--gld-dropdown-bottom-position: 52px}.dropdown-menu--large.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 58px}gld-button:focus-within .dropdown-menu,gld-icon-button:focus-within .dropdown-menu{display:initial;scale:1;z-index:1}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Button, selector: "gld-button", inputs: ["id", "name", "color", "size", "icon", "iconSize", "moveTopToBottom", "moveLeftToRight", "disabled", "full"], outputs: ["clicked"] }, { kind: "component", type: IconButton, selector: "gld-icon-button", inputs: ["icon", "id", "name", "iconSize", "space", "moveTopToBottom", "moveLeftToRight", "background", "disabled", "color"], outputs: ["clicked"] }, { kind: "directive", type: DropdownMenuTemplate, selector: "[gldDropdownMenuTemplate]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
397
377
  }
398
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: DropdownMenu, decorators: [{
378
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: DropdownMenu, decorators: [{
399
379
  type: Component,
400
- args: [{ selector: 'gld-dropdown-menu', imports: [NgTemplateOutlet, ...components$6, directives], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Button -->\n@if (type() === DropdownType.button) {\n <gld-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [size]=\"size()\"\n [icon]=\"icon()\"\n [iconSize]=\"iconSize()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [full]=\"full()\">\n <ng-content />\n\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-button>\n} @else {\n <!-- Icon Button -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [icon]=\"innerIcon\"\n [iconSize]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [background]=\"background()\">\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-icon-button>\n }\n}\n\n<ng-template #dropdownMenu>\n <!-- Menu -->\n <section\n class=\"dropdown-menu dropdown-menu--{{ type() }} dropdown-menu--{{ size() }}\n dropdown-menu--direction-{{ direction() }}\">\n <ng-content select=\"gld-dropdown-button\">no buttons</ng-content>\n </section>\n</ng-template>\n", styles: [":host{max-width:inherit}.dropdown-menu{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);--gld-dropdown-min-width: 100px;--gld-dropdown-bottom-position: 0;padding:var(--gld-spacing--xxxs);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);background:var(--gld-background);display:none;position:absolute;scale:0;z-index:1;min-width:var(--gld-dropdown-min-width);max-width:inherit}.dropdown-menu--direction-right{left:0;transform-origin:top left;transform:translateY(var(--gld-dropdown-bottom-position))}.dropdown-menu--direction-left{transform-origin:top right;transform:translate(-100%,var(--gld-dropdown-bottom-position))}.dropdown-menu--tiny{--gld-dropdown-bottom-position: 26px}.dropdown-menu--small{--gld-dropdown-bottom-position: 34px}.dropdown-menu--normal{--gld-dropdown-bottom-position: 39px}.dropdown-menu--normal.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 42px}.dropdown-menu--medium{--gld-dropdown-bottom-position: 47px}.dropdown-menu--medium.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 50px}.dropdown-menu--large{--gld-dropdown-bottom-position: 52px}.dropdown-menu--large.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 58px}gld-button:focus-within .dropdown-menu,gld-icon-button:focus-within .dropdown-menu{display:initial;scale:1;z-index:1}\n"] }]
380
+ args: [{ selector: 'gld-dropdown-menu', imports: [NgTemplateOutlet, ...components$6, directives], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Button -->\n@if (type() === DROPDOWN_TYPES.button) {\n <gld-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [size]=\"size()\"\n [icon]=\"icon()\"\n [iconSize]=\"iconSize()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [full]=\"full()\">\n <ng-content />\n\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-button>\n} @else {\n <!-- Icon Button -->\n @let innerIcon = icon();\n @if (innerIcon) {\n <gld-icon-button\n #buttonChild\n [id]=\"id()\"\n [name]=\"name()\"\n [color]=\"color()\"\n [icon]=\"innerIcon\"\n [iconSize]=\"iconSize() ?? size()\"\n [disabled]=\"disabled()\"\n [moveTopToBottom]=\"moveTopToBottom()\"\n [moveLeftToRight]=\"moveLeftToRight()\"\n [background]=\"background()\">\n <ng-container gldDropdownMenuTemplate [ngTemplateOutlet]=\"dropdownMenu\" />\n </gld-icon-button>\n }\n}\n\n<ng-template #dropdownMenu>\n <!-- Menu -->\n <section\n class=\"dropdown-menu dropdown-menu--{{ type() }} dropdown-menu--{{ size() }}\n dropdown-menu--direction-{{ direction() }}\">\n <ng-content select=\"gld-dropdown-button\">no buttons</ng-content>\n </section>\n</ng-template>\n", styles: [":host{max-width:inherit}.dropdown-menu{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);--gld-dropdown-min-width: 100px;--gld-dropdown-bottom-position: 0;padding:var(--gld-spacing--xxxs);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);background:var(--gld-background);display:none;position:absolute;scale:0;z-index:1;min-width:var(--gld-dropdown-min-width);max-width:inherit}.dropdown-menu--direction-right{left:0;transform-origin:top left;transform:translateY(var(--gld-dropdown-bottom-position))}.dropdown-menu--direction-left{transform-origin:top right;transform:translate(-100%,var(--gld-dropdown-bottom-position))}.dropdown-menu--tiny{--gld-dropdown-bottom-position: 26px}.dropdown-menu--small{--gld-dropdown-bottom-position: 34px}.dropdown-menu--normal{--gld-dropdown-bottom-position: 39px}.dropdown-menu--normal.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 42px}.dropdown-menu--medium{--gld-dropdown-bottom-position: 47px}.dropdown-menu--medium.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 50px}.dropdown-menu--large{--gld-dropdown-bottom-position: 52px}.dropdown-menu--large.dropdown-menu--iconButton{--gld-dropdown-bottom-position: 58px}gld-button:focus-within .dropdown-menu,gld-icon-button:focus-within .dropdown-menu{display:initial;scale:1;z-index:1}\n"] }]
401
381
  }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], moveTopToBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveTopToBottom", required: false }] }], moveLeftToRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "moveLeftToRight", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], full: [{ type: i0.Input, args: [{ isSignal: true, alias: "full", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], initialValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialValue", required: false }] }], changeValue: [{ type: i0.Output, args: ["changeValue"] }], changeFocus: [{ type: i0.Output, args: ["changeFocus"] }], dropdownButtonChildren: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => DropdownButton), { isSignal: true }] }] } });
402
382
 
403
383
  // Angular Imports
404
384
  class Link {
405
385
  constructor() {
406
- this.LinkType = LinkType;
407
386
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
408
387
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
409
- this.redirect = input('', { ...(ngDevMode ? { debugName: "redirect" } : {}) });
388
+ this.redirect = input('', ...(ngDevMode ? [{ debugName: "redirect" }] : []));
410
389
  this.active = input(false, { ...(ngDevMode ? { debugName: "active" } : {}), transform: booleanAttribute });
411
390
  this.external = input(false, { ...(ngDevMode ? { debugName: "external" } : {}), transform: booleanAttribute });
412
- this.type = input(LinkType.default, { ...(ngDevMode ? { debugName: "type" } : {}) });
413
- this.align = input(LinkAlign.center, { ...(ngDevMode ? { debugName: "align" } : {}) });
391
+ this.type = input(LINK_TYPES.default, ...(ngDevMode ? [{ debugName: "type" }] : []));
392
+ this.align = input(LINK_ALIGNS.center, ...(ngDevMode ? [{ debugName: "align" }] : []));
414
393
  this.clicked = output();
415
394
  }
416
395
  emitClick() {
@@ -419,10 +398,10 @@ class Link {
419
398
  keyup() {
420
399
  this.emitClick();
421
400
  }
422
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Link, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
423
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Link, isStandalone: true, selector: "gld-link", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, redirect: { classPropertyName: "redirect", publicName: "redirect", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, external: { classPropertyName: "external", publicName: "external", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "@if (external()) {\n <!-- It's external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'anchor' }\" />\n} @else {\n <!-- It isn't external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'button' }\" />\n}\n\n<!-- Button Template -->\n<ng-template #buttonTemplate let-buttonType=\"buttonType\">\n @switch (buttonType) {\n @case ('anchor') {\n <a\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n [href]=\"redirect()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n target=\"_blank\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </a>\n }\n @case ('button') {\n @if (redirect()) {\n <!-- It has path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n [routerLink]=\"redirect()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n } @else {\n <!-- It doesn't have path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n }\n }\n }\n</ng-template>\n\n<!-- Content Button Template -->\n<ng-template #contentButtonTemplate>\n <ng-content />\n</ng-template>\n", styles: [":host{position:relative;z-index:1}.link{--gld-color: var(--gld-foreground-color);position:relative;display:inline-flex;align-items:center;padding:0;font:600 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);color:var(--gld-color);background:none;border:none;cursor:pointer;text-decoration:underline;will-change:color;transition:color var(--gld-animation-time--150)}.link--active,.link:active,.link:hover{--gld-color: var(--gld-purple)}.link--left{text-align:left}.link--right{text-align:right}.link--center{text-align:center}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
401
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Link, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
402
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Link, isStandalone: true, selector: "gld-link", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, redirect: { classPropertyName: "redirect", publicName: "redirect", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, external: { classPropertyName: "external", publicName: "external", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "@if (external()) {\n <!-- It's external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'anchor' }\" />\n} @else {\n <!-- It isn't external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'button' }\" />\n}\n\n<!-- Button Template -->\n<ng-template #buttonTemplate let-buttonType=\"buttonType\">\n @switch (buttonType) {\n @case ('anchor') {\n <a\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n [href]=\"redirect()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n target=\"_blank\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </a>\n }\n @case ('button') {\n @if (redirect()) {\n <!-- It has path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n [routerLink]=\"redirect()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n } @else {\n <!-- It doesn't have path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n }\n }\n }\n</ng-template>\n\n<!-- Content Button Template -->\n<ng-template #contentButtonTemplate>\n <ng-content />\n</ng-template>\n", styles: [":host{position:relative;z-index:1}.link{--gld-color: var(--gld-foreground-color);position:relative;display:inline-flex;align-items:center;padding:0;font:600 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);color:var(--gld-color);background:none;border:none;cursor:pointer;text-decoration:underline;will-change:color;transition:color var(--gld-animation-time--150)}.link--active,.link:active,.link:hover{--gld-color: var(--gld-purple)}.link--left{text-align:left}.link--right{text-align:right}.link--center{text-align:center}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
424
403
  }
425
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Link, decorators: [{
404
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Link, decorators: [{
426
405
  type: Component,
427
406
  args: [{ selector: 'gld-link', imports: [NgTemplateOutlet, RouterLink], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (external()) {\n <!-- It's external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'anchor' }\" />\n} @else {\n <!-- It isn't external link -->\n <ng-container\n [ngTemplateOutlet]=\"buttonTemplate\"\n [ngTemplateOutletContext]=\"{ buttonType: 'button' }\" />\n}\n\n<!-- Button Template -->\n<ng-template #buttonTemplate let-buttonType=\"buttonType\">\n @switch (buttonType) {\n @case ('anchor') {\n <a\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n [href]=\"redirect()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n target=\"_blank\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </a>\n }\n @case ('button') {\n @if (redirect()) {\n <!-- It has path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\"\n [routerLink]=\"redirect()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n } @else {\n <!-- It doesn't have path to redirect -->\n <button\n id=\"{{ id() }}\"\n attr.aria-label=\"{{ name() }}\"\n class=\"link link--{{ align() }}\"\n [class.link--active]=\"active()\"\n (click)=\"emitClick()\"\n (keyup.enter)=\"keyup()\">\n <ng-container [ngTemplateOutlet]=\"contentButtonTemplate\" />\n </button>\n }\n }\n }\n</ng-template>\n\n<!-- Content Button Template -->\n<ng-template #contentButtonTemplate>\n <ng-content />\n</ng-template>\n", styles: [":host{position:relative;z-index:1}.link{--gld-color: var(--gld-foreground-color);position:relative;display:inline-flex;align-items:center;padding:0;font:600 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);color:var(--gld-color);background:none;border:none;cursor:pointer;text-decoration:underline;will-change:color;transition:color var(--gld-animation-time--150)}.link--active,.link:active,.link:hover{--gld-color: var(--gld-purple)}.link--left{text-align:left}.link--right{text-align:right}.link--center{text-align:center}\n"] }]
428
407
  }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], redirect: [{ type: i0.Input, args: [{ isSignal: true, alias: "redirect", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], external: [{ type: i0.Input, args: [{ isSignal: true, alias: "external", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
@@ -430,12 +409,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
430
409
  // Angular Imports
431
410
  class ToggleButton {
432
411
  constructor() {
433
- this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
412
+ this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
434
413
  this.changeValue = output();
435
- this.current = signal(null, { ...(ngDevMode ? { debugName: "current" } : {}) });
436
- this.disabled = signal(false, { ...(ngDevMode ? { debugName: "disabled" } : {}) });
437
- this.error = signal(false, { ...(ngDevMode ? { debugName: "error" } : {}) });
438
- this.selected = computed(() => Boolean(this.current() === this.value()), { ...(ngDevMode ? { debugName: "selected" } : {}) });
414
+ this.current = signal(null, ...(ngDevMode ? [{ debugName: "current" }] : []));
415
+ this.disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
416
+ this.error = signal(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
417
+ this.selected = computed(() => Boolean(this.current() === this.value()), ...(ngDevMode ? [{ debugName: "selected" }] : []));
439
418
  }
440
419
  select(value) {
441
420
  this.changeValue.emit(value);
@@ -443,10 +422,10 @@ class ToggleButton {
443
422
  keyup(value) {
444
423
  this.select(value);
445
424
  }
446
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ToggleButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
447
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: ToggleButton, isStandalone: true, selector: "gld-toggle-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { changeValue: "changeValue" }, ngImport: i0, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <ng-content> empty button </ng-content>\n</button>\n", styles: [".button{--gld-background: transparent;--gld-background--hover: var(--gld-pink-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xxxs);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover)}.button:active{transform:scale(.95)}.button--selected{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--selected)}.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
425
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ToggleButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
426
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: ToggleButton, isStandalone: true, selector: "gld-toggle-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { changeValue: "changeValue" }, ngImport: i0, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <ng-content> empty button </ng-content>\n</button>\n", styles: [".button{--gld-background: transparent;--gld-background--hover: var(--gld-pink-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xxxs);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover)}.button:active{transform:scale(.95)}.button--selected{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--selected)}.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
448
427
  }
449
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ToggleButton, decorators: [{
428
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ToggleButton, decorators: [{
450
429
  type: Component,
451
430
  args: [{ selector: 'gld-toggle-button', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n class=\"button\"\n [class.button--selected]=\"selected()\"\n (keyup.enter)=\"keyup(value())\"\n (click)=\"select(value())\">\n <ng-content> empty button </ng-content>\n</button>\n", styles: [".button{--gld-background: transparent;--gld-background--hover: var(--gld-pink-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--selected: var(--gld-pink);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xxxs);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer;will-change:background,transform,color;transition:background var(--gld-animation-time--150),transform var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover{--gld-color: var(--gld-color--hover)}.button:active{transform:scale(.95)}.button--selected{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--selected)}.button--selected:hover{--gld-color: var(--gld-color--selected)}\n"] }]
452
431
  }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], changeValue: [{ type: i0.Output, args: ["changeValue"] }] } });
@@ -456,10 +435,10 @@ class ToggleGroup {
456
435
  constructor() {
457
436
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `toggle-id-${value.trim().split(' ').join('-')}` });
458
437
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `toggle-name-${value.trim().split(' ').join('-')}` });
459
- this.initialValue = input(null, { ...(ngDevMode ? { debugName: "initialValue" } : {}) });
438
+ this.initialValue = input(null, ...(ngDevMode ? [{ debugName: "initialValue" }] : []));
460
439
  this.changeValue = output();
461
440
  this.changeFocus = output();
462
- this.toggleButtonChildren = contentChildren(ToggleButton, { ...(ngDevMode ? { debugName: "toggleButtonChildren" } : {}) });
441
+ this.toggleButtonChildren = contentChildren(ToggleButton, ...(ngDevMode ? [{ debugName: "toggleButtonChildren" }] : []));
463
442
  effect(() => {
464
443
  const initialValue = this.initialValue();
465
444
  if (initialValue)
@@ -482,10 +461,10 @@ class ToggleGroup {
482
461
  updateErrorInChildren(error) {
483
462
  this.toggleButtonChildren().map((toggleButton) => toggleButton.error.set(error));
484
463
  }
485
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
486
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.1", type: ToggleGroup, isStandalone: true, selector: "gld-toggle-group", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, queries: [{ propertyName: "toggleButtonChildren", predicate: ToggleButton, isSignal: true }], ngImport: i0, template: "<section class=\"toggle\" id=\"{{ id() }}\" [attr.name]=\"name()\">\n <ng-content select=\"gld-toggle-button\" />\n</section>\n", styles: [":host{display:inline-block}.toggle{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);padding:2px;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
464
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
465
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.0", type: ToggleGroup, isStandalone: true, selector: "gld-toggle-group", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, queries: [{ propertyName: "toggleButtonChildren", predicate: ToggleButton, isSignal: true }], ngImport: i0, template: "<section class=\"toggle\" id=\"{{ id() }}\" [attr.name]=\"name()\">\n <ng-content select=\"gld-toggle-button\" />\n</section>\n", styles: [":host{display:inline-block}.toggle{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);padding:2px;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
487
466
  }
488
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ToggleGroup, decorators: [{
467
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: ToggleGroup, decorators: [{
489
468
  type: Component,
490
469
  args: [{ selector: 'gld-toggle-group', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"toggle\" id=\"{{ id() }}\" [attr.name]=\"name()\">\n <ng-content select=\"gld-toggle-button\" />\n</section>\n", styles: [":host{display:inline-block}.toggle{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-radius: var(--gld-radius--xxs);padding:2px;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);display:flex}\n"] }]
491
470
  }], ctorParameters: () => [], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], initialValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialValue", required: false }] }], changeValue: [{ type: i0.Output, args: ["changeValue"] }], changeFocus: [{ type: i0.Output, args: ["changeFocus"] }], toggleButtonChildren: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ToggleButton), { isSignal: true }] }] } });
@@ -808,11 +787,11 @@ function mustUnmatch({ controlName, mustUnmatchControlName, errorMessage, }) {
808
787
  class InputError {
809
788
  constructor() {
810
789
  this.Boolean = Boolean;
811
- this.errors = input.required({ ...(ngDevMode ? { debugName: "errors" } : {}) });
790
+ this.errors = input.required(...(ngDevMode ? [{ debugName: "errors" }] : []));
812
791
  this.border = input(false, { ...(ngDevMode ? { debugName: "border" } : {}), transform: booleanAttribute });
813
792
  this.content = contentChildren(InputErrorMessage, { ...(ngDevMode ? { debugName: "content" } : {}), descendants: true });
814
- this.hasContent = signal(false, { ...(ngDevMode ? { debugName: "hasContent" } : {}) });
815
- this.firstErrorKey = signal(null, { ...(ngDevMode ? { debugName: "firstErrorKey" } : {}) });
793
+ this.hasContent = signal(false, ...(ngDevMode ? [{ debugName: "hasContent" }] : []));
794
+ this.firstErrorKey = signal(null, ...(ngDevMode ? [{ debugName: "firstErrorKey" }] : []));
816
795
  effect(() => this.hasContent.set(this.content()?.length ? true : false), {
817
796
  allowSignalWrites: true,
818
797
  });
@@ -821,10 +800,10 @@ class InputError {
821
800
  #resolveFirstErrorKey(errors) {
822
801
  this.firstErrorKey.set(Object.keys(errors || {})[0] ?? null);
823
802
  }
824
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputError, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
825
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: InputError, isStandalone: true, selector: "gld-input-error", inputs: { errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: true, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "content", predicate: InputErrorMessage, descendants: true, isSignal: true }], ngImport: i0, template: "<section class=\"error\" [class.error--with-border]=\"border()\">\n <span class=\"error__message\">\n @if (hasContent()) {\n <ng-content />\n } @else {\n <ng-container [ngTemplateOutlet]=\"errorsMessageDefault\" />\n }\n </span>\n</section>\n\n<ng-template #errorsMessageDefault>\n @switch (firstErrorKey()) {\n @case ('required') {\n This field is required!\n }\n @case ('email') {\n {{ this.errors()?.['email'] }}\n }\n @case ('maxlength') {\n This field must have a maximum of\n {{ this.errors()?.['maxlength'].requiredLength }}\n characters!\n }\n @case ('minlength') {\n This field must have a minimum of\n {{ this.errors()?.['minlength'].requiredLength }}\n characters!\n }\n @case ('isDate') {\n {{ this.errors()?.['isDate'] }}\n }\n @case ('minimumAge') {\n This field must meet the minimum age requirement of\n {{ this.errors()?.['minimumAge'].requiredAge }} years\n }\n @case ('isNaturalNumber') {\n {{ this.errors()?.['isNaturalNumber'] }}\n }\n @case ('mustMatch') {\n {{ this.errors()?.['mustMatch'] }}\n }\n @case ('mustUnmatch') {\n {{ this.errors()?.['mustUnmatch'] }}\n }\n @case ('isString') {\n {{ this.errors()?.['isString'] }}\n }\n @default {\n empty error message\n }\n }\n</ng-template>\n", styles: [".error{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-radius: var(--gld-radius--xxs);--gld-border-color: var(--gld-red);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.error__icon{display:flex;align-items:center}.error__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.error__message:first-letter{text-transform:uppercase}.error--with-border{border-top:var(--gld-border-size) solid var(--gld-border-color)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
803
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputError, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
804
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: InputError, isStandalone: true, selector: "gld-input-error", inputs: { errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: true, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "content", predicate: InputErrorMessage, descendants: true, isSignal: true }], ngImport: i0, template: "<section class=\"error\" [class.error--with-border]=\"border()\">\n <span class=\"error__message\">\n @if (hasContent()) {\n <ng-content />\n } @else {\n <ng-container [ngTemplateOutlet]=\"errorsMessageDefault\" />\n }\n </span>\n</section>\n\n<ng-template #errorsMessageDefault>\n @switch (firstErrorKey()) {\n @case ('required') {\n This field is required!\n }\n @case ('email') {\n {{ this.errors()?.['email'] }}\n }\n @case ('maxlength') {\n This field must have a maximum of\n {{ this.errors()?.['maxlength'].requiredLength }}\n characters!\n }\n @case ('minlength') {\n This field must have a minimum of\n {{ this.errors()?.['minlength'].requiredLength }}\n characters!\n }\n @case ('isDate') {\n {{ this.errors()?.['isDate'] }}\n }\n @case ('minimumAge') {\n This field must meet the minimum age requirement of\n {{ this.errors()?.['minimumAge'].requiredAge }} years\n }\n @case ('isNaturalNumber') {\n {{ this.errors()?.['isNaturalNumber'] }}\n }\n @case ('mustMatch') {\n {{ this.errors()?.['mustMatch'] }}\n }\n @case ('mustUnmatch') {\n {{ this.errors()?.['mustUnmatch'] }}\n }\n @case ('isString') {\n {{ this.errors()?.['isString'] }}\n }\n @default {\n empty error message\n }\n }\n</ng-template>\n", styles: [".error{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-radius: var(--gld-radius--xxs);--gld-border-color: var(--gld-red);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.error__icon{display:flex;align-items:center}.error__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.error__message:first-letter{text-transform:uppercase}.error--with-border{border-top:var(--gld-border-size) solid var(--gld-border-color)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
826
805
  }
827
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputError, decorators: [{
806
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputError, decorators: [{
828
807
  type: Component,
829
808
  args: [{ selector: 'gld-input-error', imports: [NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"error\" [class.error--with-border]=\"border()\">\n <span class=\"error__message\">\n @if (hasContent()) {\n <ng-content />\n } @else {\n <ng-container [ngTemplateOutlet]=\"errorsMessageDefault\" />\n }\n </span>\n</section>\n\n<ng-template #errorsMessageDefault>\n @switch (firstErrorKey()) {\n @case ('required') {\n This field is required!\n }\n @case ('email') {\n {{ this.errors()?.['email'] }}\n }\n @case ('maxlength') {\n This field must have a maximum of\n {{ this.errors()?.['maxlength'].requiredLength }}\n characters!\n }\n @case ('minlength') {\n This field must have a minimum of\n {{ this.errors()?.['minlength'].requiredLength }}\n characters!\n }\n @case ('isDate') {\n {{ this.errors()?.['isDate'] }}\n }\n @case ('minimumAge') {\n This field must meet the minimum age requirement of\n {{ this.errors()?.['minimumAge'].requiredAge }} years\n }\n @case ('isNaturalNumber') {\n {{ this.errors()?.['isNaturalNumber'] }}\n }\n @case ('mustMatch') {\n {{ this.errors()?.['mustMatch'] }}\n }\n @case ('mustUnmatch') {\n {{ this.errors()?.['mustUnmatch'] }}\n }\n @case ('isString') {\n {{ this.errors()?.['isString'] }}\n }\n @default {\n empty error message\n }\n }\n</ng-template>\n", styles: [".error{--gld-color: var(--gld-red);--gld-background: var(--gld-red-transparent--010);--gld-radius: var(--gld-radius--xxs);--gld-border-color: var(--gld-red);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.error__icon{display:flex;align-items:center}.error__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.error__message:first-letter{text-transform:uppercase}.error--with-border{border-top:var(--gld-border-size) solid var(--gld-border-color)}\n"] }]
830
809
  }], ctorParameters: () => [], propDecorators: { errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: true }] }], border: [{ type: i0.Input, args: [{ isSignal: true, alias: "border", required: false }] }], content: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => InputErrorMessage), { ...{
@@ -839,21 +818,22 @@ class Input {
839
818
  constructor() {
840
819
  this.#destroyRef = inject(DestroyRef);
841
820
  this.#changeDetectorRef = inject(ChangeDetectorRef);
842
- this.control = input.required({ ...(ngDevMode ? { debugName: "control" } : {}) });
821
+ this.control = input.required(...(ngDevMode ? [{ debugName: "control" }] : []));
843
822
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
844
823
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
845
- this.label = input('', { ...(ngDevMode ? { debugName: "label" } : {}) });
846
- this.placeholder = input('', { ...(ngDevMode ? { debugName: "placeholder" } : {}) });
847
- this.type = input('text', { ...(ngDevMode ? { debugName: "type" } : {}) });
848
- this.mask = input('', { ...(ngDevMode ? { debugName: "mask" } : {}) });
824
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
825
+ this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
826
+ this.type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
827
+ this.mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
849
828
  this.suffix = input(false, { ...(ngDevMode ? { debugName: "suffix" } : {}), transform: booleanAttribute });
850
- this.innerControl = signal(new FormControl('', { nonNullable: true }), { ...(ngDevMode ? { debugName: "innerControl" } : {}) });
829
+ this.innerControl = signal(new FormControl('', { nonNullable: true }), ...(ngDevMode ? [{ debugName: "innerControl" }] : []));
851
830
  this.hasValidators = signal({
852
831
  required: false,
853
832
  naturalNumber: false,
854
833
  string: false,
855
834
  maxLength: null,
856
- }, { ...(ngDevMode ? { debugName: "hasValidators" } : {}) });
835
+ }, ...(ngDevMode ? [{ debugName: "hasValidators" }] : []));
836
+ // eslint-disable-next-line no-unused-vars
857
837
  this.onChange = (value) => { };
858
838
  this.onTouched = () => { };
859
839
  this.innerControl()
@@ -911,6 +891,7 @@ class Input {
911
891
  if (value !== this.innerControl().value)
912
892
  this.innerControl().setValue(value);
913
893
  }
894
+ // eslint-disable-next-line no-unused-vars
914
895
  registerOnChange(onChange) {
915
896
  // console.log('registerOnChange')
916
897
  this.onChange = onChange;
@@ -955,8 +936,8 @@ class Input {
955
936
  });
956
937
  // console.log('hasValidators', this.hasValidators())
957
938
  }
958
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Input, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
959
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Input, isStandalone: true, selector: "gld-input", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
939
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
940
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Input, isStandalone: true, selector: "gld-input", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
960
941
  {
961
942
  provide: NG_VALUE_ACCESSOR,
962
943
  useExisting: forwardRef(() => Input),
@@ -964,7 +945,7 @@ class Input {
964
945
  },
965
946
  ], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n\n <!-- Input -->\n <input\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [type]=\"type()\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onTouched()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n @if (suffix()) {\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n }\n</section>\n<!-- Errors -->\n@if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n} @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n}\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n <span tabindex=\"-1\" class=\"input-icon\" [class.input-icon--error]=\"errors\">\n <ng-content select=\"[inputSuffix]\" />\n </span>\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:0;display:inline-block;color:var(--gld-color);will-change:transform,color;transition:color var(--gld-animation-time) ease;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
966
947
  }
967
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Input, decorators: [{
948
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Input, decorators: [{
968
949
  type: Component,
969
950
  args: [{ selector: 'gld-input', imports: [ReactiveFormsModule, NgTemplateOutlet, ...components$5], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
970
951
  {
@@ -983,22 +964,23 @@ class InputDate {
983
964
  constructor() {
984
965
  this.#destroyRef = inject(DestroyRef);
985
966
  this.#changeDetectorRef = inject(ChangeDetectorRef);
986
- this.control = input.required({ ...(ngDevMode ? { debugName: "control" } : {}) });
967
+ this.control = input.required(...(ngDevMode ? [{ debugName: "control" }] : []));
987
968
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
988
969
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
989
- this.label = input('', { ...(ngDevMode ? { debugName: "label" } : {}) });
970
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
990
971
  this.min = input('', { ...(ngDevMode ? { debugName: "min" } : {}), transform: (value) => formatISODateToDDMMYYYY({ date: value }) });
991
972
  this.max = input('', { ...(ngDevMode ? { debugName: "max" } : {}), transform: (value) => formatISODateToDDMMYYYY({ date: value }) });
992
- this.placeholder = input('', { ...(ngDevMode ? { debugName: "placeholder" } : {}) });
993
- this.mask = input('', { ...(ngDevMode ? { debugName: "mask" } : {}) });
973
+ this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
974
+ this.mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
994
975
  this.suffix = input(false, { ...(ngDevMode ? { debugName: "suffix" } : {}), transform: booleanAttribute });
995
- this.innerControl = signal(new FormControl('', { nonNullable: true }), { ...(ngDevMode ? { debugName: "innerControl" } : {}) });
976
+ this.innerControl = signal(new FormControl('', { nonNullable: true }), ...(ngDevMode ? [{ debugName: "innerControl" }] : []));
996
977
  this.hasValidators = signal({
997
978
  required: false,
998
979
  naturalNumber: false,
999
980
  string: false,
1000
981
  maxLength: null,
1001
- }, { ...(ngDevMode ? { debugName: "hasValidators" } : {}) });
982
+ }, ...(ngDevMode ? [{ debugName: "hasValidators" }] : []));
983
+ // eslint-disable-next-line no-unused-vars
1002
984
  this.onChange = (value) => { };
1003
985
  this.onTouched = () => { };
1004
986
  this.innerControl()
@@ -1041,6 +1023,7 @@ class InputDate {
1041
1023
  if (value !== this.innerControl().value)
1042
1024
  this.innerControl().setValue(String(value));
1043
1025
  }
1026
+ // eslint-disable-next-line no-unused-vars
1044
1027
  registerOnChange(onChange) {
1045
1028
  // console.log('registerOnChange')
1046
1029
  this.onChange = onChange;
@@ -1085,8 +1068,8 @@ class InputDate {
1085
1068
  });
1086
1069
  // console.log('hasValidators', this.hasValidators())
1087
1070
  }
1088
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputDate, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1089
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: InputDate, isStandalone: true, selector: "gld-input-date", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1071
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputDate, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1072
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: InputDate, isStandalone: true, selector: "gld-input-date", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1090
1073
  {
1091
1074
  provide: NG_VALUE_ACCESSOR,
1092
1075
  useExisting: forwardRef(() => InputDate),
@@ -1094,7 +1077,7 @@ class InputDate {
1094
1077
  },
1095
1078
  ], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n\n <!-- Input -->\n <input\n type=\"date\"\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [attr.min]=\"min()\"\n [attr.max]=\"max()\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onTouched()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n @if (suffix()) {\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n }\n</section>\n<!-- Errors -->\n@if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n} @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n}\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n <span tabindex=\"-1\" class=\"input-icon\" [class.input-icon--error]=\"errors\">\n <ng-content select=\"[inputSuffix]\" />\n </span>\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:0;display:inline-block;color:var(--gld-color);will-change:transform,color;transition:color var(--gld-animation-time) ease;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1096
1079
  }
1097
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputDate, decorators: [{
1080
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputDate, decorators: [{
1098
1081
  type: Component,
1099
1082
  args: [{ selector: 'gld-input-date', imports: [ReactiveFormsModule, NgTemplateOutlet, ...components$4], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1100
1083
  {
@@ -1107,10 +1090,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1107
1090
 
1108
1091
  // Angular Imports
1109
1092
  class InputHint {
1110
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputHint, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1111
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: InputHint, isStandalone: true, selector: "gld-input-hint", ngImport: i0, template: "<section class=\"hint\">\n <span class=\"hint__message\">\n <ng-content>hint empty</ng-content>\n </span>\n</section>\n", styles: [".hint{--gld-color: var(--gld-foreground-color);--gld-background: var(--gld-gray-transparent--020);--gld-radius: var(--gld-radius--xxs);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.hint__icon{display:flex;align-items:center}.hint__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.hint__message:first-letter{text-transform:uppercase}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1093
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputHint, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1094
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: InputHint, isStandalone: true, selector: "gld-input-hint", ngImport: i0, template: "<section class=\"hint\">\n <span class=\"hint__message\">\n <ng-content>hint empty</ng-content>\n </span>\n</section>\n", styles: [".hint{--gld-color: var(--gld-foreground-color);--gld-background: var(--gld-gray-transparent--020);--gld-radius: var(--gld-radius--xxs);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.hint__icon{display:flex;align-items:center}.hint__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.hint__message:first-letter{text-transform:uppercase}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1112
1095
  }
1113
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: InputHint, decorators: [{
1096
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: InputHint, decorators: [{
1114
1097
  type: Component,
1115
1098
  args: [{ selector: 'gld-input-hint', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"hint\">\n <span class=\"hint__message\">\n <ng-content>hint empty</ng-content>\n </span>\n</section>\n", styles: [".hint{--gld-color: var(--gld-foreground-color);--gld-background: var(--gld-gray-transparent--020);--gld-radius: var(--gld-radius--xxs);color:var(--gld-color);background:var(--gld-background);border-radius:0 0 var(--gld-radius) var(--gld-radius);padding:var(--gld-spacing--xxxs) var(--gld-spacing--xxs);display:flex;align-items:flex-start;gap:var(--gld-spacing--xxxs)}.hint__icon{display:flex;align-items:center}.hint__message{font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--small);font-weight:400;line-height:1.25;text-transform:lowercase}.hint__message:first-letter{text-transform:uppercase}\n"] }]
1116
1099
  }] });
@@ -1118,13 +1101,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1118
1101
  // Angular Imports
1119
1102
  class RadioButton {
1120
1103
  constructor() {
1121
- this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
1104
+ this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
1122
1105
  this.changeValue = output();
1123
1106
  this.changeFocus = output();
1124
- this.current = signal(null, { ...(ngDevMode ? { debugName: "current" } : {}) });
1125
- this.disabled = signal(false, { ...(ngDevMode ? { debugName: "disabled" } : {}) });
1126
- this.error = signal(false, { ...(ngDevMode ? { debugName: "error" } : {}) });
1127
- this.selected = computed(() => Boolean(this.current() === this.value()), { ...(ngDevMode ? { debugName: "selected" } : {}) });
1107
+ this.current = signal(null, ...(ngDevMode ? [{ debugName: "current" }] : []));
1108
+ this.disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
1109
+ this.error = signal(false, ...(ngDevMode ? [{ debugName: "error" }] : []));
1110
+ this.selected = computed(() => Boolean(this.current() === this.value()), ...(ngDevMode ? [{ debugName: "selected" }] : []));
1128
1111
  }
1129
1112
  select(value) {
1130
1113
  this.changeValue.emit(value);
@@ -1138,10 +1121,10 @@ class RadioButton {
1138
1121
  onBlur() {
1139
1122
  this.changeFocus.emit(false);
1140
1123
  }
1141
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: RadioButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1142
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: RadioButton, isStandalone: true, selector: "gld-radio-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, ngImport: i0, template: "<button\n class=\"radio\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [class.radio--selected]=\"selected()\"\n [class.radio--disabled]=\"disabled()\"\n [class.radio--error]=\"error()\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n (keyup.enter)=\"keyup(value())\"\n (keyup.escape)=\"onBlur()\"\n (click)=\"select(value())\">\n <span class=\"radio__icon\" [class.radio__icon--selected]=\"selected()\"></span>\n\n <span class=\"radio__label\">\n <ng-content>empty radio button</ng-content>\n </span>\n</button>\n", styles: [":host{display:inline-flex;color:inherit;width:inherit;height:inherit}.radio{--gld-height: 26px;--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-dot-color: var(--gld-blue);--gld-dot-color--outer: var(--gld-gray-transparent--060);--gld-dot-color--outer-hover: var(--gld-blue);--gld-dot-color--outer-selected: var(--gld-blue);--gld-dot-color--outer-error: var(--gld-red);display:inline-flex;justify-content:center;align-items:center;border:none;background:none;gap:var(--gld-spacing--xxs);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-color);height:var(--gld-height);padding:var(--gld-spacing--xxxs);cursor:pointer;-webkit-user-select:none;user-select:none}.radio:hover .radio__icon,.radio:focus .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-hover)}.radio:focus{outline:none}.radio__icon{--gld-size: 20px;width:var(--gld-size);height:var(--gld-size);border-radius:50%;border:var(--gld-border-size) solid var(--gld-dot-color--outer);position:relative;display:flex;justify-content:center;align-items:center}.radio__icon--selected:before{content:\"\";position:absolute;width:calc(var(--gld-size) / 2);height:calc(var(--gld-size) / 2);background:var(--gld-dot-color);border-radius:inherit}.radio__label:first-letter{text-transform:uppercase}.radio--selected{--gld-dot-color--outer: var(--gld-dot-color--outer-selected)}.radio--disabled{--gld-color: var(--gld-color--disabled);--gld-dot-color--outer: var(--gld-color--disabled);pointer-events:none}.radio--error .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-error)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1124
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: RadioButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1125
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: RadioButton, isStandalone: true, selector: "gld-radio-button", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { changeValue: "changeValue", changeFocus: "changeFocus" }, ngImport: i0, template: "<button\n class=\"radio\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [class.radio--selected]=\"selected()\"\n [class.radio--disabled]=\"disabled()\"\n [class.radio--error]=\"error()\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n (keyup.enter)=\"keyup(value())\"\n (keyup.escape)=\"onBlur()\"\n (click)=\"select(value())\">\n <span class=\"radio__icon\" [class.radio__icon--selected]=\"selected()\"></span>\n\n <span class=\"radio__label\">\n <ng-content>empty radio button</ng-content>\n </span>\n</button>\n", styles: [":host{display:inline-flex;color:inherit;width:inherit;height:inherit}.radio{--gld-height: 26px;--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-dot-color: var(--gld-blue);--gld-dot-color--outer: var(--gld-gray-transparent--060);--gld-dot-color--outer-hover: var(--gld-blue);--gld-dot-color--outer-selected: var(--gld-blue);--gld-dot-color--outer-error: var(--gld-red);display:inline-flex;justify-content:center;align-items:center;border:none;background:none;gap:var(--gld-spacing--xxs);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-color);height:var(--gld-height);padding:var(--gld-spacing--xxxs);cursor:pointer;-webkit-user-select:none;user-select:none}.radio:hover .radio__icon,.radio:focus .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-hover)}.radio:focus{outline:none}.radio__icon{--gld-size: 20px;width:var(--gld-size);height:var(--gld-size);border-radius:50%;border:var(--gld-border-size) solid var(--gld-dot-color--outer);position:relative;display:flex;justify-content:center;align-items:center}.radio__icon--selected:before{content:\"\";position:absolute;width:calc(var(--gld-size) / 2);height:calc(var(--gld-size) / 2);background:var(--gld-dot-color);border-radius:inherit}.radio__label:first-letter{text-transform:uppercase}.radio--selected{--gld-dot-color--outer: var(--gld-dot-color--outer-selected)}.radio--disabled{--gld-color: var(--gld-color--disabled);--gld-dot-color--outer: var(--gld-color--disabled);pointer-events:none}.radio--error .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-error)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1143
1126
  }
1144
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: RadioButton, decorators: [{
1127
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: RadioButton, decorators: [{
1145
1128
  type: Component,
1146
1129
  args: [{ selector: 'gld-radio-button', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"radio\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [class.radio--selected]=\"selected()\"\n [class.radio--disabled]=\"disabled()\"\n [class.radio--error]=\"error()\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n (keyup.enter)=\"keyup(value())\"\n (keyup.escape)=\"onBlur()\"\n (click)=\"select(value())\">\n <span class=\"radio__icon\" [class.radio__icon--selected]=\"selected()\"></span>\n\n <span class=\"radio__label\">\n <ng-content>empty radio button</ng-content>\n </span>\n</button>\n", styles: [":host{display:inline-flex;color:inherit;width:inherit;height:inherit}.radio{--gld-height: 26px;--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-dot-color: var(--gld-blue);--gld-dot-color--outer: var(--gld-gray-transparent--060);--gld-dot-color--outer-hover: var(--gld-blue);--gld-dot-color--outer-selected: var(--gld-blue);--gld-dot-color--outer-error: var(--gld-red);display:inline-flex;justify-content:center;align-items:center;border:none;background:none;gap:var(--gld-spacing--xxs);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-color);height:var(--gld-height);padding:var(--gld-spacing--xxxs);cursor:pointer;-webkit-user-select:none;user-select:none}.radio:hover .radio__icon,.radio:focus .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-hover)}.radio:focus{outline:none}.radio__icon{--gld-size: 20px;width:var(--gld-size);height:var(--gld-size);border-radius:50%;border:var(--gld-border-size) solid var(--gld-dot-color--outer);position:relative;display:flex;justify-content:center;align-items:center}.radio__icon--selected:before{content:\"\";position:absolute;width:calc(var(--gld-size) / 2);height:calc(var(--gld-size) / 2);background:var(--gld-dot-color);border-radius:inherit}.radio__label:first-letter{text-transform:uppercase}.radio--selected{--gld-dot-color--outer: var(--gld-dot-color--outer-selected)}.radio--disabled{--gld-color: var(--gld-color--disabled);--gld-dot-color--outer: var(--gld-color--disabled);pointer-events:none}.radio--error .radio__icon{--gld-dot-color--outer: var(--gld-dot-color--outer-error)}\n"] }]
1147
1130
  }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], changeValue: [{ type: i0.Output, args: ["changeValue"] }], changeFocus: [{ type: i0.Output, args: ["changeFocus"] }] } });
@@ -1154,16 +1137,17 @@ class RadioGroup {
1154
1137
  constructor() {
1155
1138
  this.#destroyRef = inject(DestroyRef);
1156
1139
  this.#changeDetectorRef = inject(ChangeDetectorRef);
1157
- this.control = input.required({ ...(ngDevMode ? { debugName: "control" } : {}) });
1140
+ this.control = input.required(...(ngDevMode ? [{ debugName: "control" }] : []));
1158
1141
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
1159
1142
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
1160
- this.label = input('', { ...(ngDevMode ? { debugName: "label" } : {}) });
1161
- this.direction = input(RadioDirection.horizontal, { ...(ngDevMode ? { debugName: "direction" } : {}) });
1162
- this.radioButtonChildren = contentChildren(RadioButton, { ...(ngDevMode ? { debugName: "radioButtonChildren" } : {}) });
1163
- this.innerControl = signal(new FormControl('', { nonNullable: true }), { ...(ngDevMode ? { debugName: "innerControl" } : {}) });
1143
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
1144
+ this.direction = input(RADIO_DIRECTIONS.horizontal, ...(ngDevMode ? [{ debugName: "direction" }] : []));
1145
+ this.radioButtonChildren = contentChildren(RadioButton, ...(ngDevMode ? [{ debugName: "radioButtonChildren" }] : []));
1146
+ this.innerControl = signal(new FormControl('', { nonNullable: true }), ...(ngDevMode ? [{ debugName: "innerControl" }] : []));
1164
1147
  this.hasValidators = signal({
1165
1148
  required: false,
1166
- }, { ...(ngDevMode ? { debugName: "hasValidators" } : {}) });
1149
+ }, ...(ngDevMode ? [{ debugName: "hasValidators" }] : []));
1150
+ // eslint-disable-next-line no-unused-vars
1167
1151
  this.onChange = (value) => { };
1168
1152
  this.onTouched = () => { };
1169
1153
  this.innerControl()
@@ -1215,6 +1199,7 @@ class RadioGroup {
1215
1199
  this.innerControl().setValue(value);
1216
1200
  }
1217
1201
  }
1202
+ // eslint-disable-next-line no-unused-vars
1218
1203
  registerOnChange(onChange) {
1219
1204
  // console.log('registerOnChange')
1220
1205
  this.onChange = onChange;
@@ -1247,8 +1232,8 @@ class RadioGroup {
1247
1232
  });
1248
1233
  // console.log('hasValidators', this.hasValidators())
1249
1234
  }
1250
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: RadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1251
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: RadioGroup, isStandalone: true, selector: "gld-radio-group", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1235
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: RadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1236
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: RadioGroup, isStandalone: true, selector: "gld-radio-group", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1252
1237
  {
1253
1238
  provide: NG_VALUE_ACCESSOR,
1254
1239
  useExisting: forwardRef(() => RadioGroup),
@@ -1256,7 +1241,7 @@ class RadioGroup {
1256
1241
  },
1257
1242
  ], queries: [{ propertyName: "radioButtonChildren", predicate: RadioButton, isSignal: true }], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<article class=\"radio\" [class.radio--disabled]=\"disabled\" id=\"{{ id() }}\" [attr.name]=\"name()\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n <section class=\"radio__items radio__items--{{ direction() }}\">\n <ng-content select=\"gld-radio-button\" />\n </section>\n</article>\n<!-- Errors -->\n@if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error border [errors]=\"control().errors\" />\n </ng-content>\n} @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n}\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n", styles: [".radio{--gld-color: var(--gld-foreground-color);--gld-label-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);margin-bottom:var(--gld-spacing--xxxs)}.radio label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:var(--gld-line-height);color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text;margin-bottom:var(--gld-spacing--xxxs)}.radio label:first-letter{text-transform:uppercase}.radio--disabled .radio__label{--gld-color: var(--gld-color--disabled);pointer-events:none}.radio__items{display:flex;gap:var(--gld-spacing--xxs)}.radio__items--horizontal{align-items:center}.radio__items--vertical{flex-direction:column}\n"], dependencies: [{ kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1258
1243
  }
1259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: RadioGroup, decorators: [{
1244
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: RadioGroup, decorators: [{
1260
1245
  type: Component,
1261
1246
  args: [{ selector: 'gld-radio-group', imports: [...components$3], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1262
1247
  {
@@ -1270,7 +1255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1270
1255
  // Angular Imports
1271
1256
  class SelectOption {
1272
1257
  constructor() {
1273
- this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
1258
+ this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
1274
1259
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
1275
1260
  this.selected = output();
1276
1261
  this.changeFocus = output();
@@ -1288,10 +1273,10 @@ class SelectOption {
1288
1273
  onBlur() {
1289
1274
  this.changeFocus.emit(false);
1290
1275
  }
1291
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: SelectOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1292
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: SelectOption, isStandalone: true, selector: "gld-select-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected", changeFocus: "changeFocus" }, ngImport: i0, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n (keyup.enter)=\"keyup()\"\n (click)=\"select()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\">\n <span><ng-content> an option </ng-content></span>\n</button>\n", styles: [":host{height:var(--gld-height)}button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xs) var(--gld-spacing--s);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;display:flex;align-items:center;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer}button:hover,button:focus{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--hover)}button span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1276
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: SelectOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1277
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: SelectOption, isStandalone: true, selector: "gld-select-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected", changeFocus: "changeFocus" }, ngImport: i0, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n (keyup.enter)=\"keyup()\"\n (click)=\"select()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\">\n <span><ng-content> an option </ng-content></span>\n</button>\n", styles: [":host{height:var(--gld-height)}button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xs) var(--gld-spacing--s);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;display:flex;align-items:center;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer}button:hover,button:focus{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--hover)}button span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1293
1278
  }
1294
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: SelectOption, decorators: [{
1279
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: SelectOption, decorators: [{
1295
1280
  type: Component,
1296
1281
  args: [{ selector: 'gld-select-option', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [tabindex]=\"disabled() ? '-1' : '0'\"\n (keyup.enter)=\"keyup()\"\n (click)=\"select()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\">\n <span><ng-content> an option </ng-content></span>\n</button>\n", styles: [":host{height:var(--gld-height)}button{--gld-background: transparent;--gld-background--hover: var(--gld-gray-transparent--010);--gld-color: var(--gld-foreground-color);--gld-color--hover: var(--gld-blue);--gld-radius: var(--gld-radius--xxxs);padding:var(--gld-spacing--xs) var(--gld-spacing--s);width:100%;height:100%;max-width:100%;background:var(--gld-background);color:var(--gld-color);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;display:flex;align-items:center;-webkit-user-select:none;user-select:none;outline:none;border:none;border-radius:var(--gld-radius);cursor:pointer}button:hover,button:focus{--gld-background: var(--gld-background--hover);--gld-color: var(--gld-color--hover)}button span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}\n"] }]
1297
1282
  }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], changeFocus: [{ type: i0.Output, args: ["changeFocus"] }] } });
@@ -1304,24 +1289,26 @@ class Select {
1304
1289
  constructor() {
1305
1290
  this.#destroyRef = inject(DestroyRef);
1306
1291
  this.#changeDetectorRef = inject(ChangeDetectorRef);
1307
- this.Icons = Icons;
1308
- this.control = input.required({ ...(ngDevMode ? { debugName: "control" } : {}) });
1292
+ this.ICONS = ICONS;
1293
+ this.control = input.required(...(ngDevMode ? [{ debugName: "control" }] : []));
1309
1294
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
1310
1295
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
1311
- this.label = input('', { ...(ngDevMode ? { debugName: "label" } : {}) });
1312
- this.placeholder = input('', { ...(ngDevMode ? { debugName: "placeholder" } : {}) });
1313
- this.mask = input('', { ...(ngDevMode ? { debugName: "mask" } : {}) });
1314
- this.transform = input((value) => String(value), { ...(ngDevMode ? { debugName: "transform" } : {}) });
1315
- this.selectElement = viewChild('selectElement', { ...(ngDevMode ? { debugName: "selectElement" } : {}) });
1316
- this.selectOptionChildren = contentChildren(SelectOption, { ...(ngDevMode ? { debugName: "selectOptionChildren" } : {}) });
1317
- this.innerControl = signal(new FormControl('', { nonNullable: true }), { ...(ngDevMode ? { debugName: "innerControl" } : {}) });
1296
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
1297
+ this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
1298
+ this.mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
1299
+ // eslint-disable-next-line no-unused-vars
1300
+ this.transform = input((value) => String(value), ...(ngDevMode ? [{ debugName: "transform" }] : []));
1301
+ this.selectElement = viewChild('selectElement', ...(ngDevMode ? [{ debugName: "selectElement" }] : []));
1302
+ this.selectOptionChildren = contentChildren(SelectOption, ...(ngDevMode ? [{ debugName: "selectOptionChildren" }] : []));
1303
+ this.innerControl = signal(new FormControl('', { nonNullable: true }), ...(ngDevMode ? [{ debugName: "innerControl" }] : []));
1318
1304
  this.hasValidators = signal({
1319
1305
  required: false,
1320
1306
  naturalNumber: false,
1321
1307
  string: false,
1322
1308
  maxLength: null,
1323
- }, { ...(ngDevMode ? { debugName: "hasValidators" } : {}) });
1324
- this.isMenuOpen = signal(false, { ...(ngDevMode ? { debugName: "isMenuOpen" } : {}) });
1309
+ }, ...(ngDevMode ? [{ debugName: "hasValidators" }] : []));
1310
+ this.isMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "isMenuOpen" }] : []));
1311
+ // eslint-disable-next-line no-unused-vars
1325
1312
  this.onChange = (value) => { };
1326
1313
  this.onTouched = () => { };
1327
1314
  effect(() => {
@@ -1389,6 +1376,7 @@ class Select {
1389
1376
  this.innerControl().setValue(value);
1390
1377
  }
1391
1378
  }
1379
+ // eslint-disable-next-line no-unused-vars
1392
1380
  registerOnChange(onChange) {
1393
1381
  // console.log('registerOnChange')
1394
1382
  this.onChange = onChange;
@@ -1471,16 +1459,16 @@ class Select {
1471
1459
  });
1472
1460
  // console.log('hasValidators', this.hasValidators())
1473
1461
  }
1474
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Select, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1475
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Select, isStandalone: true, selector: "gld-select", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, transform: { classPropertyName: "transform", publicName: "transform", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1462
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Select, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1463
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Select, isStandalone: true, selector: "gld-select", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, transform: { classPropertyName: "transform", publicName: "transform", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1476
1464
  {
1477
1465
  provide: NG_VALUE_ACCESSOR,
1478
1466
  useExisting: forwardRef(() => Select),
1479
1467
  multi: true,
1480
1468
  },
1481
- ], queries: [{ propertyName: "selectOptionChildren", predicate: SelectOption, isSignal: true }], viewQueries: [{ propertyName: "selectElement", first: true, predicate: ["selectElement"], descendants: true, isSignal: true }], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section #selectElement class=\"select\">\n <section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n <!-- Input -->\n <input\n type=\"text\"\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n\n <!-- Menu -->\n <ng-container [ngTemplateOutlet]=\"menuTemplate\" />\n </section>\n <!-- Errors -->\n @if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n } @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n }\n</section>\n\n<!-- Menu Template -->\n<ng-template #menuTemplate>\n <section class=\"select-menu\" [class.select-menu--opened]=\"isMenuOpen()\">\n <ng-content select=\"gld-select-option\" />\n </section>\n</ng-template>\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n @if (control().pending) {\n <gld-icon\n size=\"small\"\n class=\"input-icon input-icon--animated\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.loader4Fill\"\n [disabled]=\"disabled\" />\n } @else {\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--rotated]=\"isMenuOpen()\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.arrowDownSLine\"\n [disabled]=\"disabled\"\n (clicked)=\"arrowIconClicked()\" />\n }\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n\n<!-- FIXME: Verify why this element is here -->\n<!-- Suffix Template -->\n<!-- <ng-template #suffixTemplate>\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.arrowDownSLine\" />\n</ng-template> -->\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:var(--gld-spacing--xxs);color:var(--gld-color);-webkit-user-select:none;user-select:none;will-change:transform,color;transition:transform var(--gld-animation-time) ease,color var(--gld-animation-time) ease-in-out;cursor:pointer}.input-icon--animated{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.input-icon--rotated{transform:rotate(180deg)}.select{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-shadow: light-dark(var(--gld-gray-transparent--040), var(--gld-gray-transparent--020));--gld-height: 40px;--gld-option-items: 0;--gld-option-height: 40px;--gld-animation-time: var(--gld-animation-time--150);--gld-padding: var(--gld-spacing--xxxs);--gld-radius: var(--gld-radius--xxs);position:relative;background:transparent}.select-menu{position:absolute;z-index:1;top:calc(var(--gld-height) + 22px);left:0;height:0;padding:0;display:grid;grid-template-columns:1fr;background:var(--gld-background);box-shadow:inset 0 0 0 var(--gld-border-size) var(--gld-shadow);border-radius:var(--gld-radius);min-width:100%;max-width:100%;max-height:calc(var(--gld-option-height) * 5);overflow-y:auto;will-change:height,padding;transition:var(--gld-animation-time) height ease-in-out,var(--gld-animation-time) padding ease-in-out}.select-menu--opened{height:calc(var(--gld-option-height) * var(--gld-option-items) + var(--gld-padding) * 2);padding:var(--gld-padding)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }, { kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1469
+ ], queries: [{ propertyName: "selectOptionChildren", predicate: SelectOption, isSignal: true }], viewQueries: [{ propertyName: "selectElement", first: true, predicate: ["selectElement"], descendants: true, isSignal: true }], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section #selectElement class=\"select\">\n <section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n <!-- Input -->\n <input\n type=\"text\"\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n\n <!-- Menu -->\n <ng-container [ngTemplateOutlet]=\"menuTemplate\" />\n </section>\n <!-- Errors -->\n @if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n } @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n }\n</section>\n\n<!-- Menu Template -->\n<ng-template #menuTemplate>\n <section class=\"select-menu\" [class.select-menu--opened]=\"isMenuOpen()\">\n <ng-content select=\"gld-select-option\" />\n </section>\n</ng-template>\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n @if (control().pending) {\n <gld-icon\n size=\"small\"\n class=\"input-icon input-icon--animated\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.loader4Fill\"\n [disabled]=\"disabled\" />\n } @else {\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--rotated]=\"isMenuOpen()\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.arrowDownSLine\"\n [disabled]=\"disabled\"\n (clicked)=\"arrowIconClicked()\" />\n }\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n\n<!-- FIXME: Verify why this element is here -->\n<!-- Suffix Template -->\n<!-- <ng-template #suffixTemplate>\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.arrowDownSLine\" />\n</ng-template> -->\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:var(--gld-spacing--xxs);color:var(--gld-color);-webkit-user-select:none;user-select:none;will-change:transform,color;transition:transform var(--gld-animation-time) ease,color var(--gld-animation-time) ease-in-out;cursor:pointer}.input-icon--animated{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.input-icon--rotated{transform:rotate(180deg)}.select{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-shadow: light-dark(var(--gld-gray-transparent--040), var(--gld-gray-transparent--020));--gld-height: 40px;--gld-option-items: 0;--gld-option-height: 40px;--gld-animation-time: var(--gld-animation-time--150);--gld-padding: var(--gld-spacing--xxxs);--gld-radius: var(--gld-radius--xxs);position:relative;background:transparent}.select-menu{position:absolute;z-index:1;top:calc(var(--gld-height) + 22px);left:0;height:0;padding:0;display:grid;grid-template-columns:1fr;background:var(--gld-background);box-shadow:inset 0 0 0 var(--gld-border-size) var(--gld-shadow);border-radius:var(--gld-radius);min-width:100%;max-width:100%;max-height:calc(var(--gld-option-height) * 5);overflow-y:auto;will-change:height,padding;transition:var(--gld-animation-time) height ease-in-out,var(--gld-animation-time) padding ease-in-out}.select-menu--opened{height:calc(var(--gld-option-height) * var(--gld-option-items) + var(--gld-padding) * 2);padding:var(--gld-padding)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Icon, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }, { kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1482
1470
  }
1483
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Select, decorators: [{
1471
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Select, decorators: [{
1484
1472
  type: Component,
1485
1473
  args: [{ selector: 'gld-select', imports: [ReactiveFormsModule, NgTemplateOutlet, ...components$2], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1486
1474
  {
@@ -1488,7 +1476,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1488
1476
  useExisting: forwardRef(() => Select),
1489
1477
  multi: true,
1490
1478
  },
1491
- ], template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section #selectElement class=\"select\">\n <section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n <!-- Input -->\n <input\n type=\"text\"\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n\n <!-- Menu -->\n <ng-container [ngTemplateOutlet]=\"menuTemplate\" />\n </section>\n <!-- Errors -->\n @if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n } @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n }\n</section>\n\n<!-- Menu Template -->\n<ng-template #menuTemplate>\n <section class=\"select-menu\" [class.select-menu--opened]=\"isMenuOpen()\">\n <ng-content select=\"gld-select-option\" />\n </section>\n</ng-template>\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n @if (control().pending) {\n <gld-icon\n size=\"small\"\n class=\"input-icon input-icon--animated\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.loader4Fill\"\n [disabled]=\"disabled\" />\n } @else {\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--rotated]=\"isMenuOpen()\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.arrowDownSLine\"\n [disabled]=\"disabled\"\n (clicked)=\"arrowIconClicked()\" />\n }\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n\n<!-- FIXME: Verify why this element is here -->\n<!-- Suffix Template -->\n<!-- <ng-template #suffixTemplate>\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"Icons.arrowDownSLine\" />\n</ng-template> -->\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:var(--gld-spacing--xxs);color:var(--gld-color);-webkit-user-select:none;user-select:none;will-change:transform,color;transition:transform var(--gld-animation-time) ease,color var(--gld-animation-time) ease-in-out;cursor:pointer}.input-icon--animated{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.input-icon--rotated{transform:rotate(180deg)}.select{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-shadow: light-dark(var(--gld-gray-transparent--040), var(--gld-gray-transparent--020));--gld-height: 40px;--gld-option-items: 0;--gld-option-height: 40px;--gld-animation-time: var(--gld-animation-time--150);--gld-padding: var(--gld-spacing--xxxs);--gld-radius: var(--gld-radius--xxs);position:relative;background:transparent}.select-menu{position:absolute;z-index:1;top:calc(var(--gld-height) + 22px);left:0;height:0;padding:0;display:grid;grid-template-columns:1fr;background:var(--gld-background);box-shadow:inset 0 0 0 var(--gld-border-size) var(--gld-shadow);border-radius:var(--gld-radius);min-width:100%;max-width:100%;max-height:calc(var(--gld-option-height) * 5);overflow-y:auto;will-change:height,padding;transition:var(--gld-animation-time) height ease-in-out,var(--gld-animation-time) padding ease-in-out}.select-menu--opened{height:calc(var(--gld-option-height) * var(--gld-option-items) + var(--gld-padding) * 2);padding:var(--gld-padding)}\n"] }]
1479
+ ], template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section #selectElement class=\"select\">\n <section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n <!-- Input -->\n <input\n type=\"text\"\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n (keyup.escape)=\"onBlur()\" />\n\n <!-- Suffix -->\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n\n <!-- Menu -->\n <ng-container [ngTemplateOutlet]=\"menuTemplate\" />\n </section>\n <!-- Errors -->\n @if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n } @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n }\n</section>\n\n<!-- Menu Template -->\n<ng-template #menuTemplate>\n <section class=\"select-menu\" [class.select-menu--opened]=\"isMenuOpen()\">\n <ng-content select=\"gld-select-option\" />\n </section>\n</ng-template>\n\n<!-- Suffix Template -->\n<ng-template #suffixTemplate>\n @if (control().pending) {\n <gld-icon\n size=\"small\"\n class=\"input-icon input-icon--animated\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.loader4Fill\"\n [disabled]=\"disabled\" />\n } @else {\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--rotated]=\"isMenuOpen()\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.arrowDownSLine\"\n [disabled]=\"disabled\"\n (clicked)=\"arrowIconClicked()\" />\n }\n</ng-template>\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n<!-- <section>status: {{ control().status }}</section> -->\n\n<!-- FIXME: Verify why this element is here -->\n<!-- Suffix Template -->\n<!-- <ng-template #suffixTemplate>\n <gld-icon\n size=\"small\"\n class=\"input-icon\"\n [class.input-icon--error]=\"errors\"\n [icon]=\"ICONS.arrowDownSLine\" />\n</ng-template> -->\n\n<!-- <h3>Debugging</h3> -->\n<!-- <section>errors: {{ control().errors | json }}</section> -->\n<!-- <section>errors: {{ errors }}</section> -->\n<!-- <section>invalid: {{ control().invalid }}</section> -->\n<!-- <section>dirty: {{ control().dirty }}</section> -->\n<!-- <section>touched: {{ control().touched }}</section> -->\n<!-- <section>disable: {{ control().disabled }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-height: 40px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input input{width:100%;min-width:var(--gld-min-with);height:var(--gld-height);padding:var(--gld-spacing--xxs);padding-right:var(--gld-spacing--m);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input input:focus{--gld-border-color: var(--gld-blue)}.input input::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:var(--gld-spacing--xxs);color:var(--gld-color);-webkit-user-select:none;user-select:none;will-change:transform,color;transition:transform var(--gld-animation-time) ease,color var(--gld-animation-time) ease-in-out;cursor:pointer}.input-icon--animated{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.input-icon--rotated{transform:rotate(180deg)}.select{--gld-background: light-dark(var(--gld-whitelight), var(--gld-darkblue));--gld-shadow: light-dark(var(--gld-gray-transparent--040), var(--gld-gray-transparent--020));--gld-height: 40px;--gld-option-items: 0;--gld-option-height: 40px;--gld-animation-time: var(--gld-animation-time--150);--gld-padding: var(--gld-spacing--xxxs);--gld-radius: var(--gld-radius--xxs);position:relative;background:transparent}.select-menu{position:absolute;z-index:1;top:calc(var(--gld-height) + 22px);left:0;height:0;padding:0;display:grid;grid-template-columns:1fr;background:var(--gld-background);box-shadow:inset 0 0 0 var(--gld-border-size) var(--gld-shadow);border-radius:var(--gld-radius);min-width:100%;max-width:100%;max-height:calc(var(--gld-option-height) * 5);overflow-y:auto;will-change:height,padding;transition:var(--gld-animation-time) height ease-in-out,var(--gld-animation-time) padding ease-in-out}.select-menu--opened{height:calc(var(--gld-option-height) * var(--gld-option-items) + var(--gld-padding) * 2);padding:var(--gld-padding)}\n"] }]
1492
1480
  }], ctorParameters: () => [], propDecorators: { control: [{ type: i0.Input, args: [{ isSignal: true, alias: "control", required: true }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], mask: [{ type: i0.Input, args: [{ isSignal: true, alias: "mask", required: false }] }], transform: [{ type: i0.Input, args: [{ isSignal: true, alias: "transform", required: false }] }], selectElement: [{ type: i0.ViewChild, args: ['selectElement', { isSignal: true }] }], selectOptionChildren: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SelectOption), { isSignal: true }] }] } });
1493
1481
 
1494
1482
  // Angular Imports
@@ -1499,22 +1487,23 @@ class Textarea {
1499
1487
  constructor() {
1500
1488
  this.#destroyRef = inject(DestroyRef);
1501
1489
  this.#changeDetectorRef = inject(ChangeDetectorRef);
1502
- this.control = input.required({ ...(ngDevMode ? { debugName: "control" } : {}) });
1490
+ this.control = input.required(...(ngDevMode ? [{ debugName: "control" }] : []));
1503
1491
  this.id = input.required({ ...(ngDevMode ? { debugName: "id" } : {}), transform: (value) => `input-id-${value.trim().split(' ').join('-')}` });
1504
1492
  this.name = input.required({ ...(ngDevMode ? { debugName: "name" } : {}), transform: (value) => `input-name-${value.trim().split(' ').join('-')}` });
1505
- this.label = input('', { ...(ngDevMode ? { debugName: "label" } : {}) });
1506
- this.placeholder = input('', { ...(ngDevMode ? { debugName: "placeholder" } : {}) });
1507
- this.type = input('text', { ...(ngDevMode ? { debugName: "type" } : {}) });
1493
+ this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
1494
+ this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
1495
+ this.type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
1508
1496
  this.suffix = input(false, { ...(ngDevMode ? { debugName: "suffix" } : {}), transform: booleanAttribute });
1497
+ // eslint-disable-next-line no-unused-vars
1509
1498
  this.onChange = (value) => { };
1510
1499
  this.onTouched = () => { };
1511
- this.innerControl = signal(new FormControl('', { nonNullable: true }), { ...(ngDevMode ? { debugName: "innerControl" } : {}) });
1500
+ this.innerControl = signal(new FormControl('', { nonNullable: true }), ...(ngDevMode ? [{ debugName: "innerControl" }] : []));
1512
1501
  this.hasValidators = signal({
1513
1502
  required: false,
1514
1503
  naturalNumber: false,
1515
1504
  string: false,
1516
1505
  maxLength: null,
1517
- }, { ...(ngDevMode ? { debugName: "hasValidators" } : {}) });
1506
+ }, ...(ngDevMode ? [{ debugName: "hasValidators" }] : []));
1518
1507
  this.innerControl()
1519
1508
  .valueChanges.pipe(takeUntilDestroyed(this.#destroyRef))
1520
1509
  .subscribe((value) => {
@@ -1565,6 +1554,7 @@ class Textarea {
1565
1554
  if (value !== this.innerControl().value)
1566
1555
  this.innerControl().setValue(value);
1567
1556
  }
1557
+ // eslint-disable-next-line no-unused-vars
1568
1558
  registerOnChange(onChange) {
1569
1559
  // console.log('registerOnChange')
1570
1560
  this.onChange = onChange;
@@ -1606,8 +1596,8 @@ class Textarea {
1606
1596
  });
1607
1597
  // console.log('hasValidators', this.hasValidators())
1608
1598
  }
1609
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Textarea, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1610
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Textarea, isStandalone: true, selector: "gld-textarea", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1599
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Textarea, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1600
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Textarea, isStandalone: true, selector: "gld-textarea", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
1611
1601
  {
1612
1602
  provide: NG_VALUE_ACCESSOR,
1613
1603
  useExisting: forwardRef(() => Textarea),
@@ -1615,7 +1605,7 @@ class Textarea {
1615
1605
  },
1616
1606
  ], ngImport: i0, template: "@let errors = control().invalid && (control().dirty || control().touched);\n@let disabled = control().disabled || (control().pending && control().disabled);\n\n<section class=\"input\" [class.input--disabled]=\"disabled\" [class.input--error]=\"errors\">\n <!-- Label -->\n @if (label()) {\n <label for=\"{{ id() }}\">\n <span>{{ label() }}</span>\n @if (hasValidators().required) {\n <span>*</span>\n }\n </label>\n }\n\n <!-- Input -->\n <textarea\n id=\"{{ id() }}\"\n name=\"{{ name() }}\"\n [tabindex]=\"disabled ? '-1' : '0'\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"innerControl()\"\n [attr.maxlength]=\"hasValidators().maxLength\"\n (focus)=\"onFocus()\"\n (blur)=\"onTouched()\"\n (keyup.escape)=\"onBlur()\"></textarea>\n\n <!-- Suffix -->\n @if (suffix()) {\n <ng-container [ngTemplateOutlet]=\"suffixTemplate\" />\n }\n</section>\n<!-- Errors -->\n@if (errors) {\n <ng-content select=\"gld-input-error\">\n <gld-input-error [errors]=\"control().errors\" />\n </ng-content>\n} @else {\n <!-- Hint -->\n <ng-content select=\"gld-input-hint\" />\n}\n\n<!-- Suffix emplate -->\n<ng-template #suffixTemplate>\n <span tabindex=\"-1\" class=\"input-icon\" [class.input-icon--error]=\"errors\">\n <ng-content select=\"[inputSuffix]\" />\n </span>\n</ng-template>\n\n<!-- <h3>Debugging</h3>\n<section>errors: {{ errors }}</section>\n<section>invalid: {{ control().invalid }}</section>\n<section>dirty: {{ control().dirty }}</section>\n<section>touched: {{ control().touched }}</section>\n<section>disable: {{ control().disabled }}</section> -->\n", styles: [".input{--gld-color: var(--gld-foreground-color);--gld-color--disabled: var(--gld-gray-transparent--060);--gld-color--error: var(--gld-red);--gld-placeholder-color: var(--gld-gray-transparent--060);--gld-border-color: var(--gld-gray-transparent--060);--gld-label-color: var(--gld-foreground-color);--gld-min-height: 120px;--gld-max-height: 240px;--gld-min-with: 50px;--gld-animation-time: var(--gld-animation-time--150);position:relative;background:transparent}.input label{padding:0;font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;color:var(--gld-label-color);will-change:color;transition:color var(--gld-animation-time) ease;cursor:text}.input textarea{display:flex;width:100%;min-width:var(--gld-min-with);min-height:var(--gld-min-height);max-height:var(--gld-max-height);padding:var(--gld-spacing--xxs);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size--normal);font-weight:400;line-height:1.25;border:none;outline:none;border-bottom:var(--gld-border-size) solid var(--gld-border-color);color:var(--gld-color);background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;resize:vertical;form-sizing:content;will-change:color;transition:color var(--gld-animation-time) ease-in-out}.input textarea:focus{--gld-border-color: var(--gld-blue)}.input textarea::placeholder{color:var(--gld-placeholder-color)}.input--error{--gld-color: var(--gld-color--error);--gld-label-color: var(--gld-color--error);--gld-border-color: var(--gld-color--error);--gld-placeholder-color: var(--gld-color--error)}.input--disabled{--gld-color: var(--gld-color--disabled);--gld-border-color: var(--gld-color--disabled);--gld-label-color: var(--gld-color--disabled);--gld-placeholder-color: var(--gld-color--disabled);pointer-events:none;cursor:not-allowed}.input-icon{position:absolute;right:var(--gld-spacing--xxs);bottom:0;display:inline-block;color:var(--gld-color);will-change:transform,color;transition:color var(--gld-animation-time) ease;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputError, selector: "gld-input-error", inputs: ["errors", "border"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1617
1607
  }
1618
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Textarea, decorators: [{
1608
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Textarea, decorators: [{
1619
1609
  type: Component,
1620
1610
  args: [{ selector: 'gld-textarea', imports: [ReactiveFormsModule, NgTemplateOutlet, ...components$1], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
1621
1611
  {
@@ -1629,16 +1619,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1629
1619
  // Angular Imports
1630
1620
  class Image {
1631
1621
  constructor() {
1632
- this.src = input.required({ ...(ngDevMode ? { debugName: "src" } : {}) });
1633
- this.alt = input.required({ ...(ngDevMode ? { debugName: "alt" } : {}) });
1622
+ this.src = input.required(...(ngDevMode ? [{ debugName: "src" }] : []));
1623
+ this.alt = input.required(...(ngDevMode ? [{ debugName: "alt" }] : []));
1634
1624
  // srcset = input<string>('')
1635
1625
  // sizes = input<string>('')
1636
1626
  this.priority = input(false, { ...(ngDevMode ? { debugName: "priority" } : {}), transform: booleanAttribute });
1637
1627
  }
1638
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Image, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1639
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Image, isStandalone: true, selector: "gld-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- @if (srcset() && sizes()) {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" [ngSrcset]=\"srcset()\" [sizes]=\"sizes()\" />\n } @else {\n <img\n fill\n alt=\"{{ alt() }}\"\n [ngSrc]=\"src()\"\n [ngSrcset]=\"srcset()\"\n [sizes]=\"sizes()\"\n loading=\"lazy\" />\n }\n} @else {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n } @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n }\n} -->\n\n@if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n} @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n}\n", styles: [":host{position:relative;aspect-ratio:1/1;overflow:hidden;display:inline-block;object-fit:inherit;width:inherit;height:inherit}img{width:inherit;height:inherit;max-width:100%;max-height:100%;display:inherit;aspect-ratio:inherit;z-index:inherit;object-fit:inherit;border-radius:inherit;border:inherit;background-color:inherit;-webkit-user-select:none;user-select:none;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1628
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Image, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1629
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Image, isStandalone: true, selector: "gld-image", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<!-- @if (srcset() && sizes()) {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" [ngSrcset]=\"srcset()\" [sizes]=\"sizes()\" />\n } @else {\n <img\n fill\n alt=\"{{ alt() }}\"\n [ngSrc]=\"src()\"\n [ngSrcset]=\"srcset()\"\n [sizes]=\"sizes()\"\n loading=\"lazy\" />\n }\n} @else {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n } @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n }\n} -->\n\n@if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n} @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n}\n", styles: [":host{position:relative;aspect-ratio:1/1;overflow:hidden;display:inline-block;object-fit:inherit;width:inherit;height:inherit}img{width:inherit;height:inherit;max-width:100%;max-height:100%;display:inherit;aspect-ratio:inherit;z-index:inherit;object-fit:inherit;border-radius:inherit;border:inherit;background-color:inherit;-webkit-user-select:none;user-select:none;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1640
1630
  }
1641
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Image, decorators: [{
1631
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Image, decorators: [{
1642
1632
  type: Component,
1643
1633
  args: [{ selector: 'gld-image', imports: [NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- @if (srcset() && sizes()) {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" [ngSrcset]=\"srcset()\" [sizes]=\"sizes()\" />\n } @else {\n <img\n fill\n alt=\"{{ alt() }}\"\n [ngSrc]=\"src()\"\n [ngSrcset]=\"srcset()\"\n [sizes]=\"sizes()\"\n loading=\"lazy\" />\n }\n} @else {\n @if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n } @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n }\n} -->\n\n@if (priority()) {\n <img fill priority alt=\"{{ alt() }}\" [ngSrc]=\"src()\" />\n} @else {\n <img fill alt=\"{{ alt() }}\" [ngSrc]=\"src()\" loading=\"lazy\" />\n}\n", styles: [":host{position:relative;aspect-ratio:1/1;overflow:hidden;display:inline-block;object-fit:inherit;width:inherit;height:inherit}img{width:inherit;height:inherit;max-width:100%;max-height:100%;display:inherit;aspect-ratio:inherit;z-index:inherit;object-fit:inherit;border-radius:inherit;border:inherit;background-color:inherit;-webkit-user-select:none;user-select:none;pointer-events:none}\n"] }]
1644
1634
  }], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: true }] }], priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "priority", required: false }] }] } });
@@ -1649,12 +1639,12 @@ class CircleLoader {
1649
1639
  this.loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute });
1650
1640
  this.background = input(false, { ...(ngDevMode ? { debugName: "background" } : {}), transform: booleanAttribute });
1651
1641
  this.radius = input(false, { ...(ngDevMode ? { debugName: "radius" } : {}), transform: booleanAttribute });
1652
- this.minHeight = input('auto', { ...(ngDevMode ? { debugName: "minHeight" } : {}) });
1642
+ this.minHeight = input('auto', ...(ngDevMode ? [{ debugName: "minHeight" }] : []));
1653
1643
  }
1654
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: CircleLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1655
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: CircleLoader, isStandalone: true, selector: "gld-circle-loader", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<article\n class=\"loader\"\n [class.loader--loading]=\"loading()\"\n [class.loader--background]=\"background()\"\n [class.loader--radius]=\"radius()\"\n [style.minHeight]=\"minHeight()\">\n <!-- Content -->\n <ng-content />\n\n <!-- Loader -->\n @if (loading()) {\n <section class=\"loader-loading\">\n <svg class=\"container\" viewBox=\"0 0 40 40\" height=\"40\" width=\"40\">\n <circle\n class=\"track\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n <circle\n class=\"car\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n </svg>\n </section>\n }\n</article>\n", styles: [":host{width:100%}.loader{--gld-color: var(--gld-foreground-color);--gld-background: light-dark( var(--gld-whitelight-transparent--080), var(--gld-darkblue-transparent--080) );position:relative;color:var(--color)}.loader--radius{border-radius:var(--gld-spacing--xxxs)}.loader-loading{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:1}.loader--background .loader-loading{background:var(--gld-background)}.container{--uib-size: 40px;--uib-color: var(--gld-orange);--uib-speed: .8s;--uib-bg-opacity: .1;width:var(--uib-size);height:var(--uib-size);transform-origin:center;animation:rotate var(--uib-speed) linear infinite;will-change:transform;overflow:visible}.car{fill:none;stroke:var(--uib-color);stroke-dasharray:25,75;stroke-dashoffset:0;stroke-linecap:round;transition:stroke .5s ease}.track{fill:none;stroke:var(--uib-color);opacity:var(--uib-bg-opacity);transition:stroke .5s ease}@keyframes rotate{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1644
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CircleLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1645
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: CircleLoader, isStandalone: true, selector: "gld-circle-loader", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<article\n class=\"loader\"\n [class.loader--loading]=\"loading()\"\n [class.loader--background]=\"background()\"\n [class.loader--radius]=\"radius()\"\n [style.minHeight]=\"minHeight()\">\n <!-- Content -->\n <ng-content />\n\n <!-- Loader -->\n @if (loading()) {\n <section class=\"loader-loading\">\n <svg class=\"container\" viewBox=\"0 0 40 40\" height=\"40\" width=\"40\">\n <circle\n class=\"track\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n <circle\n class=\"car\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n </svg>\n </section>\n }\n</article>\n", styles: [":host{width:100%}.loader{--gld-color: var(--gld-foreground-color);--gld-background: light-dark( var(--gld-whitelight-transparent--080), var(--gld-darkblue-transparent--080) );position:relative;color:var(--color)}.loader--radius{border-radius:var(--gld-spacing--xxxs)}.loader-loading{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:1}.loader--background .loader-loading{background:var(--gld-background)}.container{--uib-size: 40px;--uib-color: var(--gld-orange);--uib-speed: .8s;--uib-bg-opacity: .1;width:var(--uib-size);height:var(--uib-size);transform-origin:center;animation:rotate var(--uib-speed) linear infinite;will-change:transform;overflow:visible}.car{fill:none;stroke:var(--uib-color);stroke-dasharray:25,75;stroke-dashoffset:0;stroke-linecap:round;transition:stroke .5s ease}.track{fill:none;stroke:var(--uib-color);opacity:var(--uib-bg-opacity);transition:stroke .5s ease}@keyframes rotate{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1656
1646
  }
1657
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: CircleLoader, decorators: [{
1647
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CircleLoader, decorators: [{
1658
1648
  type: Component,
1659
1649
  args: [{ selector: 'gld-circle-loader', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<article\n class=\"loader\"\n [class.loader--loading]=\"loading()\"\n [class.loader--background]=\"background()\"\n [class.loader--radius]=\"radius()\"\n [style.minHeight]=\"minHeight()\">\n <!-- Content -->\n <ng-content />\n\n <!-- Loader -->\n @if (loading()) {\n <section class=\"loader-loading\">\n <svg class=\"container\" viewBox=\"0 0 40 40\" height=\"40\" width=\"40\">\n <circle\n class=\"track\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n <circle\n class=\"car\"\n cx=\"20\"\n cy=\"20\"\n r=\"17.5\"\n pathlength=\"100\"\n stroke-width=\"5px\"\n fill=\"none\" />\n </svg>\n </section>\n }\n</article>\n", styles: [":host{width:100%}.loader{--gld-color: var(--gld-foreground-color);--gld-background: light-dark( var(--gld-whitelight-transparent--080), var(--gld-darkblue-transparent--080) );position:relative;color:var(--color)}.loader--radius{border-radius:var(--gld-spacing--xxxs)}.loader-loading{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:1}.loader--background .loader-loading{background:var(--gld-background)}.container{--uib-size: 40px;--uib-color: var(--gld-orange);--uib-speed: .8s;--uib-bg-opacity: .1;width:var(--uib-size);height:var(--uib-size);transform-origin:center;animation:rotate var(--uib-speed) linear infinite;will-change:transform;overflow:visible}.car{fill:none;stroke:var(--uib-color);stroke-dasharray:25,75;stroke-dashoffset:0;stroke-linecap:round;transition:stroke .5s ease}.track{fill:none;stroke:var(--uib-color);opacity:var(--uib-bg-opacity);transition:stroke .5s ease}@keyframes rotate{to{transform:rotate(360deg)}}\n"] }]
1660
1650
  }], propDecorators: { loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }] } });
@@ -1663,18 +1653,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
1663
1653
  const components = [DropdownButton, DropdownMenu, CircleLoader];
1664
1654
  class Table {
1665
1655
  constructor() {
1666
- this.Icons = Icons;
1667
- this.tableColumns = input.required({ ...(ngDevMode ? { debugName: "tableColumns" } : {}) });
1668
- this.emptyMessage = input('', { ...(ngDevMode ? { debugName: "emptyMessage" } : {}) });
1669
- this.tableHeight = input('auto', { ...(ngDevMode ? { debugName: "tableHeight" } : {}) });
1656
+ this.ICONS = ICONS;
1657
+ this.tableColumns = input.required(...(ngDevMode ? [{ debugName: "tableColumns" }] : []));
1658
+ this.emptyMessage = input('', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
1659
+ this.tableHeight = input('auto', ...(ngDevMode ? [{ debugName: "tableHeight" }] : []));
1670
1660
  this.loading = input(true, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute });
1671
1661
  this.selects = input(false, { ...(ngDevMode ? { debugName: "selects" } : {}), transform: booleanAttribute });
1672
1662
  this.selectsAll = input(false, { ...(ngDevMode ? { debugName: "selectsAll" } : {}), transform: booleanAttribute });
1673
1663
  this.search = input(false, { ...(ngDevMode ? { debugName: "search" } : {}), transform: booleanAttribute });
1674
1664
  this.pagination = input(false, { ...(ngDevMode ? { debugName: "pagination" } : {}), transform: booleanAttribute });
1675
1665
  this.tableColumnAction = output();
1676
- this.tableColumnsToShow = computed(() => this.tableColumns().filter((column) => !column.hide), { ...(ngDevMode ? { debugName: "tableColumnsToShow" } : {}) });
1677
- this.tableColumnActions = signal([], { ...(ngDevMode ? { debugName: "tableColumnActions" } : {}) });
1666
+ this.tableColumnsToShow = computed(() => this.tableColumns().filter((column) => !column.hide), ...(ngDevMode ? [{ debugName: "tableColumnsToShow" }] : []));
1667
+ this.tableColumnActions = signal([], ...(ngDevMode ? [{ debugName: "tableColumnActions" }] : []));
1678
1668
  }
1679
1669
  tableActionFunction({ tableColumnActionAsEvent, tableColumns, index }) {
1680
1670
  const tableColumnAction = tableColumnActionAsEvent;
@@ -1698,6 +1688,7 @@ class Table {
1698
1688
  tableColumnStructures.map((column) => {
1699
1689
  structures.map((dataItem) => {
1700
1690
  // We check if the property we pass it exists within the object we receive
1691
+ // eslint-disable-next-line no-prototype-builtins
1701
1692
  if (dataItem?.hasOwnProperty(column.name)) {
1702
1693
  const propertyValue = dataItem[column.name];
1703
1694
  // We check if a column already exists in our array with the name of that property
@@ -1792,29 +1783,29 @@ class Table {
1792
1783
  return { ...previous, [current.name]: current.values[index] };
1793
1784
  }, {});
1794
1785
  }
1795
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Table, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1796
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Table, isStandalone: true, selector: "gld-table", inputs: { tableColumns: { classPropertyName: "tableColumns", publicName: "tableColumns", isSignal: true, isRequired: true, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, tableHeight: { classPropertyName: "tableHeight", publicName: "tableHeight", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, selects: { classPropertyName: "selects", publicName: "selects", isSignal: true, isRequired: false, transformFunction: null }, selectsAll: { classPropertyName: "selectsAll", publicName: "selectsAll", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tableColumnAction: "tableColumnAction" }, ngImport: i0, template: "<!-- Search -->\n@if (search()) {\n <section class=\"table-search\">\n <ng-content select=\"gld-table-search\" />\n </section>\n}\n\n<!-- Table -->\n<article\n class=\"table\"\n [class.table--empty]=\"!tableColumnsToShow().length\"\n [style.height]=\"tableHeight()\">\n <!-- Table Content -->\n <section\n class=\"table-content\"\n [class.table-content--actions]=\"tableColumnActions().length\"\n [class.table-content--selects]=\"selects()\">\n <!-- Loading -->\n @if (loading()) {\n <gld-circle-loader loading background minHeight=\"100px\" />\n } @else {\n <!-- Table Columns -->\n @for (tableColumn of tableColumnsToShow(); track tableColumn) {\n <section\n class=\"table-column\"\n [style.flexBasis]=\"tableColumn.width\"\n [style.flexShrink]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.flexGrow]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.minWidth]=\"tableColumn.minWidth\"\n [style.maxWidth]=\"tableColumn.maxWidth\">\n <section class=\"table-header\">\n <span class=\"table-header-ellipsis\">{{ tableColumn.label }}</span>\n </section>\n @for (value of tableColumn.values; track $index) {\n <section\n class=\"table-cell\"\n [style.justifyContent]=\"tableColumn.justify\"\n [style.textAlign]=\"tableColumn.justify\">\n @if (tableColumn.transform(value) !== undefined) {\n @switch (true) {\n @case (tableColumn.template !== undefined) {\n <ng-container\n [ngTemplateOutlet]=\"tableColumn.template\"\n [ngTemplateOutletContext]=\"{ value: tableColumn.transform(value) }\" />\n }\n @default {\n <span class=\"table-cell-ellipsis\">{{ tableColumn.transform(value) }}</span>\n }\n }\n } @else {\n <span>-</span>\n }\n </section>\n }\n </section>\n } @empty {\n <!-- Empty -->\n <section class=\"table-empty\">\n <p>{{ emptyMessage() ? emptyMessage() : 'We have not data to show yet!' }}</p>\n </section>\n }\n }\n </section>\n\n <!-- Table Actions -->\n @if ((tableColumnActions().length || selects()) && !loading() && tableColumnsToShow().length) {\n <section\n class=\"table-column\"\n [class.table-column--actions]=\"tableColumnActions().length\"\n [class.table-column--selects]=\"selects()\">\n <!-- Header -->\n <section\n class=\"table-header\"\n [class.table-header--actions]=\"tableColumnActions().length\"\n [class.table-header--selects]=\"selects()\">\n <!-- Select All Checkbox -->\n @if (selectsAll()) {\n <!-- <mat-checkbox\n color=\"primary\"\n matTooltip=\"Todo\"\n matTooltipClass=\"Tooltip\"\n class=\"Checkbox\"\n [checked]=\"\n dragAndDropColumnSelected().length === dragAndDropColumns().at(0)?.values?.length\n \"\n [indeterminate]=\"\n !!dragAndDropColumnSelected().length &&\n dragAndDropColumnSelected().length !== dragAndDropColumns().at(0)?.values?.length\n \"\n (change)=\"onSelectOrUnselectAll($event, dragAndDropColumns())\"\n /> -->\n }\n </section>\n @for (value of tableColumnsToShow().at(0)?.values; track $index; let index = $index) {\n <!-- Cell -->\n <section class=\"table-cell table-cell--actions\">\n <!-- Select Checkbox -->\n @if (selects()) {\n <!-- <mat-checkbox\n color=\"primary\"\n class=\"Checkbox\"\n matTooltip=\"Seleccionar\"\n matTooltipClass=\"Tooltip\"\n [checked]=\"isSelected(dragAndDropColumns(), index)\"\n (change)=\"onSelect($event, dragAndDropColumns(), index)\" /> -->\n }\n @if (tableColumnActions()) {\n <!-- Dropdown Menu -->\n <gld-dropdown-menu\n background\n id=\"more button of table cell\"\n name=\"more button of table cell\"\n type=\"iconButton\"\n color=\"blue\"\n iconSize=\"small\"\n direction=\"left\"\n [icon]=\"Icons.more2Fill\"\n (changeValue)=\"\n tableActionFunction({\n tableColumnActionAsEvent: $event,\n tableColumns: tableColumns(),\n index,\n })\n \">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <gld-dropdown-button\n [value]=\"tableColumnAction\"\n [icon]=\"tableColumnAction.icon\"\n iconSize=\"tiny\">\n {{ tableColumnAction.label }}\n </gld-dropdown-button>\n }\n </gld-dropdown-menu>\n <!-- <gld-icon-button\n background\n name=\"more button of table cell\"\n iconSize=\"small\"\n [icon]=\"Icons.more2Fill\"> -->\n <!-- <gld-tile color=\"blue-to-green\" class=\"Menu\">\n <section class=\"Menu-content\">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <button\n class=\"Menu-button {{ tableColumnAction?.classToHover ?? '' }}\"\n [class.Menu-button--hidden]=\"\n !tableColumnAction.showWhen(buildDataStructure({ index }))\n \"\n (click)=\"\n tableActionFunction({\n tableColumnAction,\n tableColumns: tableColumns(),\n index,\n })\n \">\n <gld-icon size=\"tiny\" [icon]=\"tableColumnAction.icon\" />\n <span class=\"Menu-button-ellipsis\">{{ tableColumnAction.label }}</span>\n </button>\n }\n </section>\n </gld-tile> -->\n <!-- </gld-icon-button> -->\n }\n </section>\n }\n </section>\n }\n</article>\n\n<!-- Pagination -->\n@if (pagination()) {\n <section class=\"table-pagination\">\n <ng-content select=\"gld-table-pagination\" />\n </section>\n}\n", styles: [":host{width:100%}.table{--gld-color: var(--gld-foreground-color);--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-border-radius: var(--gld-radius--xxs);--gld-background: var(--gld-background-color);--gld-column-actions-or-selects-width: 40px;--gld-column-actions-and-selects-width: 80px;--gld-header-height: 40px;--gld-cell-height: 40px;--gld-min-height: 100px;min-height:var(--gld-min-height);display:grid;grid-template-columns:1fr;position:relative;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-border-radius);background:var(--gld-background);overflow:hidden}.table-content{display:flex;flex-wrap:nowrap}.table-header,.table-cell{color:var(--color);font-family:var(--gld-font--poppins);padding:var(--gld-spacing--xxs) var(--gld-spacing--s);border-bottom:var(--gld-border-size) solid var(--gld-border-color)}.table-header-ellipsis,.table-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.table-header-ellipsis--hover,.table-cell-ellipsis--hover{cursor:pointer}.table-header{display:flex;align-items:center;font:600 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins);height:var(--gld-header-height)}.table-header.table-header--actions,.table-header.table-header--selects{justify-content:center}.table-header.table-header--actions.table-header--selects{justify-content:flex-start}.table-header--actions{background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-header--actions:before{content:\"\";position:absolute;inset:0}.table-cell{display:flex;align-items:center;height:var(--gld-cell-height);font:400 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins)}.table-cell:last-of-type{margin-bottom:0;border-bottom:none}.table-cell.table-cell--actions,.table-cell.table-cell--selects{justify-content:center;padding:0}.table-cell--actions{position:relative;display:flex;justify-content:center;align-items:center;gap:var(--gld-spacing--xxxs);background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-column{flex:1 1 auto}.table-column--actions,.table-column--selects,.table-column--actions.table-column--selects{position:absolute;top:0;right:0}.table-column--actions.table-column--selects{width:var(--gld-column-actions-and-selects-width)}.table-column--actions,.table-column--selects{width:var(--gld-column-actions-or-selects-width)}.table-empty{width:100%;display:flex;color:var(--gld-color);padding:var(--gld-spacing--xs)}.table-empty p{font:400 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);text-transform:lowercase;margin:auto}.table-empty p:first-letter{text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DropdownButton, selector: "gld-dropdown-button", inputs: ["value", "icon", "iconSize", "iconSpace", "moveTopToBottom", "moveLeftToRight", "direction"], outputs: ["changeValue"] }, { kind: "component", type: DropdownMenu, selector: "gld-dropdown-menu", inputs: ["id", "name", "type", "color", "size", "icon", "iconSize", "moveTopToBottom", "moveLeftToRight", "disabled", "full", "direction", "background", "selected", "initialValue"], outputs: ["changeValue", "changeFocus"] }, { kind: "component", type: CircleLoader, selector: "gld-circle-loader", inputs: ["loading", "background", "radius", "minHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1786
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Table, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1787
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: Table, isStandalone: true, selector: "gld-table", inputs: { tableColumns: { classPropertyName: "tableColumns", publicName: "tableColumns", isSignal: true, isRequired: true, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, tableHeight: { classPropertyName: "tableHeight", publicName: "tableHeight", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, selects: { classPropertyName: "selects", publicName: "selects", isSignal: true, isRequired: false, transformFunction: null }, selectsAll: { classPropertyName: "selectsAll", publicName: "selectsAll", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tableColumnAction: "tableColumnAction" }, ngImport: i0, template: "<!-- Search -->\n@if (search()) {\n <section class=\"table-search\">\n <ng-content select=\"gld-table-search\" />\n </section>\n}\n\n<!-- Table -->\n<article\n class=\"table\"\n [class.table--empty]=\"!tableColumnsToShow().length\"\n [style.height]=\"tableHeight()\">\n <!-- Table Content -->\n <section\n class=\"table-content\"\n [class.table-content--actions]=\"tableColumnActions().length\"\n [class.table-content--selects]=\"selects()\">\n <!-- Loading -->\n @if (loading()) {\n <gld-circle-loader loading background minHeight=\"100px\" />\n } @else {\n <!-- Table Columns -->\n @for (tableColumn of tableColumnsToShow(); track tableColumn) {\n <section\n class=\"table-column\"\n [style.flexBasis]=\"tableColumn.width\"\n [style.flexShrink]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.flexGrow]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.minWidth]=\"tableColumn.minWidth\"\n [style.maxWidth]=\"tableColumn.maxWidth\">\n <section class=\"table-header\">\n <span class=\"table-header-ellipsis\">{{ tableColumn.label }}</span>\n </section>\n @for (value of tableColumn.values; track $index) {\n <section\n class=\"table-cell\"\n [style.justifyContent]=\"tableColumn.justify\"\n [style.textAlign]=\"tableColumn.justify\">\n @if (tableColumn.transform(value) !== undefined) {\n @switch (true) {\n @case (tableColumn.template !== undefined) {\n <ng-container\n [ngTemplateOutlet]=\"tableColumn.template\"\n [ngTemplateOutletContext]=\"{ value: tableColumn.transform(value) }\" />\n }\n @default {\n <span class=\"table-cell-ellipsis\">{{ tableColumn.transform(value) }}</span>\n }\n }\n } @else {\n <span>-</span>\n }\n </section>\n }\n </section>\n } @empty {\n <!-- Empty -->\n <section class=\"table-empty\">\n <p>{{ emptyMessage() ? emptyMessage() : 'We have not data to show yet!' }}</p>\n </section>\n }\n }\n </section>\n\n <!-- Table Actions -->\n @if ((tableColumnActions().length || selects()) && !loading() && tableColumnsToShow().length) {\n <section\n class=\"table-column\"\n [class.table-column--actions]=\"tableColumnActions().length\"\n [class.table-column--selects]=\"selects()\">\n <!-- Header -->\n <section\n class=\"table-header\"\n [class.table-header--actions]=\"tableColumnActions().length\"\n [class.table-header--selects]=\"selects()\">\n <!-- Select All Checkbox -->\n @if (selectsAll()) {\n <!-- <mat-checkbox\n color=\"primary\"\n matTooltip=\"Todo\"\n matTooltipClass=\"Tooltip\"\n class=\"Checkbox\"\n [checked]=\"\n dragAndDropColumnSelected().length === dragAndDropColumns().at(0)?.values?.length\n \"\n [indeterminate]=\"\n !!dragAndDropColumnSelected().length &&\n dragAndDropColumnSelected().length !== dragAndDropColumns().at(0)?.values?.length\n \"\n (change)=\"onSelectOrUnselectAll($event, dragAndDropColumns())\"\n /> -->\n }\n </section>\n @for (value of tableColumnsToShow().at(0)?.values; track $index; let index = $index) {\n <!-- Cell -->\n <section class=\"table-cell table-cell--actions\">\n <!-- Select Checkbox -->\n @if (selects()) {\n <!-- <mat-checkbox\n color=\"primary\"\n class=\"Checkbox\"\n matTooltip=\"Seleccionar\"\n matTooltipClass=\"Tooltip\"\n [checked]=\"isSelected(dragAndDropColumns(), index)\"\n (change)=\"onSelect($event, dragAndDropColumns(), index)\" /> -->\n }\n @if (tableColumnActions()) {\n <!-- Dropdown Menu -->\n <gld-dropdown-menu\n background\n id=\"more button of table cell\"\n name=\"more button of table cell\"\n type=\"iconButton\"\n color=\"blue\"\n iconSize=\"small\"\n direction=\"left\"\n [icon]=\"ICONS.more2Fill\"\n (changeValue)=\"\n tableActionFunction({\n tableColumnActionAsEvent: $event,\n tableColumns: tableColumns(),\n index,\n })\n \">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <gld-dropdown-button\n [value]=\"tableColumnAction\"\n [icon]=\"tableColumnAction.icon\"\n iconSize=\"tiny\">\n {{ tableColumnAction.label }}\n </gld-dropdown-button>\n }\n </gld-dropdown-menu>\n <!-- <gld-icon-button\n background\n name=\"more button of table cell\"\n iconSize=\"small\"\n [icon]=\"ICONS.more2Fill\"> -->\n <!-- <gld-tile color=\"blue-to-green\" class=\"Menu\">\n <section class=\"Menu-content\">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <button\n class=\"Menu-button {{ tableColumnAction?.classToHover ?? '' }}\"\n [class.Menu-button--hidden]=\"\n !tableColumnAction.showWhen(buildDataStructure({ index }))\n \"\n (click)=\"\n tableActionFunction({\n tableColumnAction,\n tableColumns: tableColumns(),\n index,\n })\n \">\n <gld-icon size=\"tiny\" [icon]=\"tableColumnAction.icon\" />\n <span class=\"Menu-button-ellipsis\">{{ tableColumnAction.label }}</span>\n </button>\n }\n </section>\n </gld-tile> -->\n <!-- </gld-icon-button> -->\n }\n </section>\n }\n </section>\n }\n</article>\n\n<!-- Pagination -->\n@if (pagination()) {\n <section class=\"table-pagination\">\n <ng-content select=\"gld-table-pagination\" />\n </section>\n}\n", styles: [":host{width:100%}.table{--gld-color: var(--gld-foreground-color);--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-border-radius: var(--gld-radius--xxs);--gld-background: var(--gld-background-color);--gld-column-actions-or-selects-width: 40px;--gld-column-actions-and-selects-width: 80px;--gld-header-height: 40px;--gld-cell-height: 40px;--gld-min-height: 100px;min-height:var(--gld-min-height);display:grid;grid-template-columns:1fr;position:relative;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-border-radius);background:var(--gld-background);overflow:hidden}.table-content{display:flex;flex-wrap:nowrap}.table-header,.table-cell{color:var(--color);font-family:var(--gld-font--poppins);padding:var(--gld-spacing--xxs) var(--gld-spacing--s);border-bottom:var(--gld-border-size) solid var(--gld-border-color)}.table-header-ellipsis,.table-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.table-header-ellipsis--hover,.table-cell-ellipsis--hover{cursor:pointer}.table-header{display:flex;align-items:center;font:600 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins);height:var(--gld-header-height)}.table-header.table-header--actions,.table-header.table-header--selects{justify-content:center}.table-header.table-header--actions.table-header--selects{justify-content:flex-start}.table-header--actions{background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-header--actions:before{content:\"\";position:absolute;inset:0}.table-cell{display:flex;align-items:center;height:var(--gld-cell-height);font:400 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins)}.table-cell:last-of-type{margin-bottom:0;border-bottom:none}.table-cell.table-cell--actions,.table-cell.table-cell--selects{justify-content:center;padding:0}.table-cell--actions{position:relative;display:flex;justify-content:center;align-items:center;gap:var(--gld-spacing--xxxs);background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-column{flex:1 1 auto}.table-column--actions,.table-column--selects,.table-column--actions.table-column--selects{position:absolute;top:0;right:0}.table-column--actions.table-column--selects{width:var(--gld-column-actions-and-selects-width)}.table-column--actions,.table-column--selects{width:var(--gld-column-actions-or-selects-width)}.table-empty{width:100%;display:flex;color:var(--gld-color);padding:var(--gld-spacing--xs)}.table-empty p{font:400 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);text-transform:lowercase;margin:auto}.table-empty p:first-letter{text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DropdownButton, selector: "gld-dropdown-button", inputs: ["value", "icon", "iconSize", "iconSpace", "moveTopToBottom", "moveLeftToRight", "direction"], outputs: ["changeValue"] }, { kind: "component", type: DropdownMenu, selector: "gld-dropdown-menu", inputs: ["id", "name", "type", "color", "size", "icon", "iconSize", "moveTopToBottom", "moveLeftToRight", "disabled", "full", "direction", "background", "selected", "initialValue"], outputs: ["changeValue", "changeFocus"] }, { kind: "component", type: CircleLoader, selector: "gld-circle-loader", inputs: ["loading", "background", "radius", "minHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1797
1788
  }
1798
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Table, decorators: [{
1789
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Table, decorators: [{
1799
1790
  type: Component,
1800
- args: [{ selector: 'gld-table', imports: [NgTemplateOutlet, ...components], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Search -->\n@if (search()) {\n <section class=\"table-search\">\n <ng-content select=\"gld-table-search\" />\n </section>\n}\n\n<!-- Table -->\n<article\n class=\"table\"\n [class.table--empty]=\"!tableColumnsToShow().length\"\n [style.height]=\"tableHeight()\">\n <!-- Table Content -->\n <section\n class=\"table-content\"\n [class.table-content--actions]=\"tableColumnActions().length\"\n [class.table-content--selects]=\"selects()\">\n <!-- Loading -->\n @if (loading()) {\n <gld-circle-loader loading background minHeight=\"100px\" />\n } @else {\n <!-- Table Columns -->\n @for (tableColumn of tableColumnsToShow(); track tableColumn) {\n <section\n class=\"table-column\"\n [style.flexBasis]=\"tableColumn.width\"\n [style.flexShrink]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.flexGrow]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.minWidth]=\"tableColumn.minWidth\"\n [style.maxWidth]=\"tableColumn.maxWidth\">\n <section class=\"table-header\">\n <span class=\"table-header-ellipsis\">{{ tableColumn.label }}</span>\n </section>\n @for (value of tableColumn.values; track $index) {\n <section\n class=\"table-cell\"\n [style.justifyContent]=\"tableColumn.justify\"\n [style.textAlign]=\"tableColumn.justify\">\n @if (tableColumn.transform(value) !== undefined) {\n @switch (true) {\n @case (tableColumn.template !== undefined) {\n <ng-container\n [ngTemplateOutlet]=\"tableColumn.template\"\n [ngTemplateOutletContext]=\"{ value: tableColumn.transform(value) }\" />\n }\n @default {\n <span class=\"table-cell-ellipsis\">{{ tableColumn.transform(value) }}</span>\n }\n }\n } @else {\n <span>-</span>\n }\n </section>\n }\n </section>\n } @empty {\n <!-- Empty -->\n <section class=\"table-empty\">\n <p>{{ emptyMessage() ? emptyMessage() : 'We have not data to show yet!' }}</p>\n </section>\n }\n }\n </section>\n\n <!-- Table Actions -->\n @if ((tableColumnActions().length || selects()) && !loading() && tableColumnsToShow().length) {\n <section\n class=\"table-column\"\n [class.table-column--actions]=\"tableColumnActions().length\"\n [class.table-column--selects]=\"selects()\">\n <!-- Header -->\n <section\n class=\"table-header\"\n [class.table-header--actions]=\"tableColumnActions().length\"\n [class.table-header--selects]=\"selects()\">\n <!-- Select All Checkbox -->\n @if (selectsAll()) {\n <!-- <mat-checkbox\n color=\"primary\"\n matTooltip=\"Todo\"\n matTooltipClass=\"Tooltip\"\n class=\"Checkbox\"\n [checked]=\"\n dragAndDropColumnSelected().length === dragAndDropColumns().at(0)?.values?.length\n \"\n [indeterminate]=\"\n !!dragAndDropColumnSelected().length &&\n dragAndDropColumnSelected().length !== dragAndDropColumns().at(0)?.values?.length\n \"\n (change)=\"onSelectOrUnselectAll($event, dragAndDropColumns())\"\n /> -->\n }\n </section>\n @for (value of tableColumnsToShow().at(0)?.values; track $index; let index = $index) {\n <!-- Cell -->\n <section class=\"table-cell table-cell--actions\">\n <!-- Select Checkbox -->\n @if (selects()) {\n <!-- <mat-checkbox\n color=\"primary\"\n class=\"Checkbox\"\n matTooltip=\"Seleccionar\"\n matTooltipClass=\"Tooltip\"\n [checked]=\"isSelected(dragAndDropColumns(), index)\"\n (change)=\"onSelect($event, dragAndDropColumns(), index)\" /> -->\n }\n @if (tableColumnActions()) {\n <!-- Dropdown Menu -->\n <gld-dropdown-menu\n background\n id=\"more button of table cell\"\n name=\"more button of table cell\"\n type=\"iconButton\"\n color=\"blue\"\n iconSize=\"small\"\n direction=\"left\"\n [icon]=\"Icons.more2Fill\"\n (changeValue)=\"\n tableActionFunction({\n tableColumnActionAsEvent: $event,\n tableColumns: tableColumns(),\n index,\n })\n \">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <gld-dropdown-button\n [value]=\"tableColumnAction\"\n [icon]=\"tableColumnAction.icon\"\n iconSize=\"tiny\">\n {{ tableColumnAction.label }}\n </gld-dropdown-button>\n }\n </gld-dropdown-menu>\n <!-- <gld-icon-button\n background\n name=\"more button of table cell\"\n iconSize=\"small\"\n [icon]=\"Icons.more2Fill\"> -->\n <!-- <gld-tile color=\"blue-to-green\" class=\"Menu\">\n <section class=\"Menu-content\">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <button\n class=\"Menu-button {{ tableColumnAction?.classToHover ?? '' }}\"\n [class.Menu-button--hidden]=\"\n !tableColumnAction.showWhen(buildDataStructure({ index }))\n \"\n (click)=\"\n tableActionFunction({\n tableColumnAction,\n tableColumns: tableColumns(),\n index,\n })\n \">\n <gld-icon size=\"tiny\" [icon]=\"tableColumnAction.icon\" />\n <span class=\"Menu-button-ellipsis\">{{ tableColumnAction.label }}</span>\n </button>\n }\n </section>\n </gld-tile> -->\n <!-- </gld-icon-button> -->\n }\n </section>\n }\n </section>\n }\n</article>\n\n<!-- Pagination -->\n@if (pagination()) {\n <section class=\"table-pagination\">\n <ng-content select=\"gld-table-pagination\" />\n </section>\n}\n", styles: [":host{width:100%}.table{--gld-color: var(--gld-foreground-color);--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-border-radius: var(--gld-radius--xxs);--gld-background: var(--gld-background-color);--gld-column-actions-or-selects-width: 40px;--gld-column-actions-and-selects-width: 80px;--gld-header-height: 40px;--gld-cell-height: 40px;--gld-min-height: 100px;min-height:var(--gld-min-height);display:grid;grid-template-columns:1fr;position:relative;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-border-radius);background:var(--gld-background);overflow:hidden}.table-content{display:flex;flex-wrap:nowrap}.table-header,.table-cell{color:var(--color);font-family:var(--gld-font--poppins);padding:var(--gld-spacing--xxs) var(--gld-spacing--s);border-bottom:var(--gld-border-size) solid var(--gld-border-color)}.table-header-ellipsis,.table-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.table-header-ellipsis--hover,.table-cell-ellipsis--hover{cursor:pointer}.table-header{display:flex;align-items:center;font:600 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins);height:var(--gld-header-height)}.table-header.table-header--actions,.table-header.table-header--selects{justify-content:center}.table-header.table-header--actions.table-header--selects{justify-content:flex-start}.table-header--actions{background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-header--actions:before{content:\"\";position:absolute;inset:0}.table-cell{display:flex;align-items:center;height:var(--gld-cell-height);font:400 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins)}.table-cell:last-of-type{margin-bottom:0;border-bottom:none}.table-cell.table-cell--actions,.table-cell.table-cell--selects{justify-content:center;padding:0}.table-cell--actions{position:relative;display:flex;justify-content:center;align-items:center;gap:var(--gld-spacing--xxxs);background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-column{flex:1 1 auto}.table-column--actions,.table-column--selects,.table-column--actions.table-column--selects{position:absolute;top:0;right:0}.table-column--actions.table-column--selects{width:var(--gld-column-actions-and-selects-width)}.table-column--actions,.table-column--selects{width:var(--gld-column-actions-or-selects-width)}.table-empty{width:100%;display:flex;color:var(--gld-color);padding:var(--gld-spacing--xs)}.table-empty p{font:400 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);text-transform:lowercase;margin:auto}.table-empty p:first-letter{text-transform:uppercase}\n"] }]
1791
+ args: [{ selector: 'gld-table', imports: [NgTemplateOutlet, ...components], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Search -->\n@if (search()) {\n <section class=\"table-search\">\n <ng-content select=\"gld-table-search\" />\n </section>\n}\n\n<!-- Table -->\n<article\n class=\"table\"\n [class.table--empty]=\"!tableColumnsToShow().length\"\n [style.height]=\"tableHeight()\">\n <!-- Table Content -->\n <section\n class=\"table-content\"\n [class.table-content--actions]=\"tableColumnActions().length\"\n [class.table-content--selects]=\"selects()\">\n <!-- Loading -->\n @if (loading()) {\n <gld-circle-loader loading background minHeight=\"100px\" />\n } @else {\n <!-- Table Columns -->\n @for (tableColumn of tableColumnsToShow(); track tableColumn) {\n <section\n class=\"table-column\"\n [style.flexBasis]=\"tableColumn.width\"\n [style.flexShrink]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.flexGrow]=\"tableColumn.width === 'auto' ? '1' : '0'\"\n [style.minWidth]=\"tableColumn.minWidth\"\n [style.maxWidth]=\"tableColumn.maxWidth\">\n <section class=\"table-header\">\n <span class=\"table-header-ellipsis\">{{ tableColumn.label }}</span>\n </section>\n @for (value of tableColumn.values; track $index) {\n <section\n class=\"table-cell\"\n [style.justifyContent]=\"tableColumn.justify\"\n [style.textAlign]=\"tableColumn.justify\">\n @if (tableColumn.transform(value) !== undefined) {\n @switch (true) {\n @case (tableColumn.template !== undefined) {\n <ng-container\n [ngTemplateOutlet]=\"tableColumn.template\"\n [ngTemplateOutletContext]=\"{ value: tableColumn.transform(value) }\" />\n }\n @default {\n <span class=\"table-cell-ellipsis\">{{ tableColumn.transform(value) }}</span>\n }\n }\n } @else {\n <span>-</span>\n }\n </section>\n }\n </section>\n } @empty {\n <!-- Empty -->\n <section class=\"table-empty\">\n <p>{{ emptyMessage() ? emptyMessage() : 'We have not data to show yet!' }}</p>\n </section>\n }\n }\n </section>\n\n <!-- Table Actions -->\n @if ((tableColumnActions().length || selects()) && !loading() && tableColumnsToShow().length) {\n <section\n class=\"table-column\"\n [class.table-column--actions]=\"tableColumnActions().length\"\n [class.table-column--selects]=\"selects()\">\n <!-- Header -->\n <section\n class=\"table-header\"\n [class.table-header--actions]=\"tableColumnActions().length\"\n [class.table-header--selects]=\"selects()\">\n <!-- Select All Checkbox -->\n @if (selectsAll()) {\n <!-- <mat-checkbox\n color=\"primary\"\n matTooltip=\"Todo\"\n matTooltipClass=\"Tooltip\"\n class=\"Checkbox\"\n [checked]=\"\n dragAndDropColumnSelected().length === dragAndDropColumns().at(0)?.values?.length\n \"\n [indeterminate]=\"\n !!dragAndDropColumnSelected().length &&\n dragAndDropColumnSelected().length !== dragAndDropColumns().at(0)?.values?.length\n \"\n (change)=\"onSelectOrUnselectAll($event, dragAndDropColumns())\"\n /> -->\n }\n </section>\n @for (value of tableColumnsToShow().at(0)?.values; track $index; let index = $index) {\n <!-- Cell -->\n <section class=\"table-cell table-cell--actions\">\n <!-- Select Checkbox -->\n @if (selects()) {\n <!-- <mat-checkbox\n color=\"primary\"\n class=\"Checkbox\"\n matTooltip=\"Seleccionar\"\n matTooltipClass=\"Tooltip\"\n [checked]=\"isSelected(dragAndDropColumns(), index)\"\n (change)=\"onSelect($event, dragAndDropColumns(), index)\" /> -->\n }\n @if (tableColumnActions()) {\n <!-- Dropdown Menu -->\n <gld-dropdown-menu\n background\n id=\"more button of table cell\"\n name=\"more button of table cell\"\n type=\"iconButton\"\n color=\"blue\"\n iconSize=\"small\"\n direction=\"left\"\n [icon]=\"ICONS.more2Fill\"\n (changeValue)=\"\n tableActionFunction({\n tableColumnActionAsEvent: $event,\n tableColumns: tableColumns(),\n index,\n })\n \">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <gld-dropdown-button\n [value]=\"tableColumnAction\"\n [icon]=\"tableColumnAction.icon\"\n iconSize=\"tiny\">\n {{ tableColumnAction.label }}\n </gld-dropdown-button>\n }\n </gld-dropdown-menu>\n <!-- <gld-icon-button\n background\n name=\"more button of table cell\"\n iconSize=\"small\"\n [icon]=\"ICONS.more2Fill\"> -->\n <!-- <gld-tile color=\"blue-to-green\" class=\"Menu\">\n <section class=\"Menu-content\">\n @for (tableColumnAction of tableColumnActions(); track tableColumnAction.type) {\n <button\n class=\"Menu-button {{ tableColumnAction?.classToHover ?? '' }}\"\n [class.Menu-button--hidden]=\"\n !tableColumnAction.showWhen(buildDataStructure({ index }))\n \"\n (click)=\"\n tableActionFunction({\n tableColumnAction,\n tableColumns: tableColumns(),\n index,\n })\n \">\n <gld-icon size=\"tiny\" [icon]=\"tableColumnAction.icon\" />\n <span class=\"Menu-button-ellipsis\">{{ tableColumnAction.label }}</span>\n </button>\n }\n </section>\n </gld-tile> -->\n <!-- </gld-icon-button> -->\n }\n </section>\n }\n </section>\n }\n</article>\n\n<!-- Pagination -->\n@if (pagination()) {\n <section class=\"table-pagination\">\n <ng-content select=\"gld-table-pagination\" />\n </section>\n}\n", styles: [":host{width:100%}.table{--gld-color: var(--gld-foreground-color);--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) );--gld-border-radius: var(--gld-radius--xxs);--gld-background: var(--gld-background-color);--gld-column-actions-or-selects-width: 40px;--gld-column-actions-and-selects-width: 80px;--gld-header-height: 40px;--gld-cell-height: 40px;--gld-min-height: 100px;min-height:var(--gld-min-height);display:grid;grid-template-columns:1fr;position:relative;border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-border-radius);background:var(--gld-background);overflow:hidden}.table-content{display:flex;flex-wrap:nowrap}.table-header,.table-cell{color:var(--color);font-family:var(--gld-font--poppins);padding:var(--gld-spacing--xxs) var(--gld-spacing--s);border-bottom:var(--gld-border-size) solid var(--gld-border-color)}.table-header-ellipsis,.table-cell-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.table-header-ellipsis--hover,.table-cell-ellipsis--hover{cursor:pointer}.table-header{display:flex;align-items:center;font:600 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins);height:var(--gld-header-height)}.table-header.table-header--actions,.table-header.table-header--selects{justify-content:center}.table-header.table-header--actions.table-header--selects{justify-content:flex-start}.table-header--actions{background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-header--actions:before{content:\"\";position:absolute;inset:0}.table-cell{display:flex;align-items:center;height:var(--gld-cell-height);font:400 var(--gld-font-size--small)/var(--gld-line-height) var(--gld-font--poppins)}.table-cell:last-of-type{margin-bottom:0;border-bottom:none}.table-cell.table-cell--actions,.table-cell.table-cell--selects{justify-content:center;padding:0}.table-cell--actions{position:relative;display:flex;justify-content:center;align-items:center;gap:var(--gld-spacing--xxxs);background:var(--gld-background);border-left:var(--gld-border-size) solid var(--gld-border-color)}.table-column{flex:1 1 auto}.table-column--actions,.table-column--selects,.table-column--actions.table-column--selects{position:absolute;top:0;right:0}.table-column--actions.table-column--selects{width:var(--gld-column-actions-and-selects-width)}.table-column--actions,.table-column--selects{width:var(--gld-column-actions-or-selects-width)}.table-empty{width:100%;display:flex;color:var(--gld-color);padding:var(--gld-spacing--xs)}.table-empty p{font:400 var(--gld-font-size--normal)/var(--gld-line-height) var(--gld-font--poppins);text-transform:lowercase;margin:auto}.table-empty p:first-letter{text-transform:uppercase}\n"] }]
1801
1792
  }], propDecorators: { tableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableColumns", required: true }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], tableHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableHeight", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], selects: [{ type: i0.Input, args: [{ isSignal: true, alias: "selects", required: false }] }], selectsAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectsAll", required: false }] }], search: [{ type: i0.Input, args: [{ isSignal: true, alias: "search", required: false }] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: false }] }], tableColumnAction: [{ type: i0.Output, args: ["tableColumnAction"] }] } });
1802
1793
 
1803
1794
  // Angular Imports
1804
1795
  class TablePagination {
1805
1796
  constructor() {
1806
- this.Icons = Icons;
1807
- this.pagination = input.required({ ...(ngDevMode ? { debugName: "pagination" } : {}) });
1797
+ this.Icons = ICONS;
1798
+ this.pagination = input.required(...(ngDevMode ? [{ debugName: "pagination" }] : []));
1808
1799
  this.page = output();
1809
1800
  this.changeToNext = output();
1810
1801
  this.changeToPrevious = output();
1811
- this.currentPage = signal(0, { ...(ngDevMode ? { debugName: "currentPage" } : {}) });
1802
+ this.currentPage = signal(0, ...(ngDevMode ? [{ debugName: "currentPage" }] : []));
1812
1803
  this.maxPages = computed(() => {
1813
1804
  if (this.pagination().itemsPerPage > this.pagination().maxItems)
1814
1805
  return 1;
1815
1806
  else
1816
1807
  return Math.ceil(this.pagination().maxItems / this.pagination().itemsPerPage);
1817
- }, { ...(ngDevMode ? { debugName: "maxPages" } : {}) });
1808
+ }, ...(ngDevMode ? [{ debugName: "maxPages" }] : []));
1818
1809
  effect(() => this.page.emit(this.currentPage()));
1819
1810
  effect(() => {
1820
1811
  const initialPage = this.pagination().initialPage;
@@ -1840,10 +1831,10 @@ class TablePagination {
1840
1831
  }
1841
1832
  this.changeToPrevious.emit(this.currentPage());
1842
1833
  }
1843
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TablePagination, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1844
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: TablePagination, isStandalone: true, selector: "gld-table-pagination", inputs: { pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { page: "page", changeToNext: "changeToNext", changeToPrevious: "changeToPrevious" }, ngImport: i0, template: "<article class=\"Pagination\">\n <section class=\"Pagination-info\">\n <p class=\"Pagination-label\">P\u00E1gina {{ currentPage() }} de {{ maxPages() }}</p>\n </section>\n <section class=\"Pagination-actions\">\n <!-- <gld-icon-button\n class=\"\"\n name=\"button-next\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowLeftSLine\"\n (clicked)=\"previousPage()\" />\n <gld-icon-button\n class=\"\"\n name=\"button-previous\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowRightSLine\"\n (clicked)=\"nextPage()\" /> -->\n </section>\n</article>\n", styles: [".Pagination{--color: var(--darkblue);--height: 40px;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing--s);margin:var(--spacing--s) 0;height:var(--height);padding-left:var(--spacing--s)}.Pagination.Theme--dark{--color: var(--whitelight)}.Pagination-label{margin:0;font:600 var(--font-size--normal) var(--font--poppins);color:var(--color)}.Pagination-actions{display:flex;gap:var(--spacing--xxxs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1834
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TablePagination, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1835
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: TablePagination, isStandalone: true, selector: "gld-table-pagination", inputs: { pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { page: "page", changeToNext: "changeToNext", changeToPrevious: "changeToPrevious" }, ngImport: i0, template: "<article class=\"Pagination\">\n <section class=\"Pagination-info\">\n <p class=\"Pagination-label\">P\u00E1gina {{ currentPage() }} de {{ maxPages() }}</p>\n </section>\n <section class=\"Pagination-actions\">\n <!-- <gld-icon-button\n class=\"\"\n name=\"button-next\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowLeftSLine\"\n (clicked)=\"previousPage()\" />\n <gld-icon-button\n class=\"\"\n name=\"button-previous\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowRightSLine\"\n (clicked)=\"nextPage()\" /> -->\n </section>\n</article>\n", styles: [".Pagination{--color: var(--darkblue);--height: 40px;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing--s);margin:var(--spacing--s) 0;height:var(--height);padding-left:var(--spacing--s)}.Pagination.Theme--dark{--color: var(--whitelight)}.Pagination-label{margin:0;font:600 var(--font-size--normal) var(--font--poppins);color:var(--color)}.Pagination-actions{display:flex;gap:var(--spacing--xxxs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1845
1836
  }
1846
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TablePagination, decorators: [{
1837
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TablePagination, decorators: [{
1847
1838
  type: Component,
1848
1839
  args: [{ selector: 'gld-table-pagination', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<article class=\"Pagination\">\n <section class=\"Pagination-info\">\n <p class=\"Pagination-label\">P\u00E1gina {{ currentPage() }} de {{ maxPages() }}</p>\n </section>\n <section class=\"Pagination-actions\">\n <!-- <gld-icon-button\n class=\"\"\n name=\"button-next\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowLeftSLine\"\n (clicked)=\"previousPage()\" />\n <gld-icon-button\n class=\"\"\n name=\"button-previous\"\n iconSize=\"small\"\n [icon]=\"Icons.arrowRightSLine\"\n (clicked)=\"nextPage()\" /> -->\n </section>\n</article>\n", styles: [".Pagination{--color: var(--darkblue);--height: 40px;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing--s);margin:var(--spacing--s) 0;height:var(--height);padding-left:var(--spacing--s)}.Pagination.Theme--dark{--color: var(--whitelight)}.Pagination-label{margin:0;font:600 var(--font-size--normal) var(--font--poppins);color:var(--color)}.Pagination-actions{display:flex;gap:var(--spacing--xxxs)}\n"] }]
1849
1840
  }], ctorParameters: () => [], propDecorators: { pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: true }] }], page: [{ type: i0.Output, args: ["page"] }], changeToNext: [{ type: i0.Output, args: ["changeToNext"] }], changeToPrevious: [{ type: i0.Output, args: ["changeToPrevious"] }] } });
@@ -1853,18 +1844,18 @@ class TableSearch {
1853
1844
  #formBuilder;
1854
1845
  constructor() {
1855
1846
  this.#formBuilder = inject(FormBuilder);
1856
- this.Icons = Icons;
1857
- this.placeholder = input('buscar', { ...(ngDevMode ? { debugName: "placeholder" } : {}) });
1858
- this.width = input('auto', { ...(ngDevMode ? { debugName: "width" } : {}) });
1859
- this.debounceTime = input(250, { ...(ngDevMode ? { debugName: "debounceTime" } : {}) });
1847
+ this.ICONS = ICONS;
1848
+ this.placeholder = input('buscar', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
1849
+ this.width = input('auto', ...(ngDevMode ? [{ debugName: "width" }] : []));
1850
+ this.debounceTime = input(250, ...(ngDevMode ? [{ debugName: "debounceTime" }] : []));
1860
1851
  this.searching = output();
1861
1852
  this.control = this.#formBuilder.control('');
1862
1853
  this.control.valueChanges
1863
1854
  .pipe(debounceTime(this.debounceTime()))
1864
1855
  .subscribe((value) => {
1865
1856
  const action = value?.length
1866
- ? TableSearchAction.searching
1867
- : TableSearchAction.cleared;
1857
+ ? TABLE_SEARCH_ACTIONS.searching
1858
+ : TABLE_SEARCH_ACTIONS.cleared;
1868
1859
  const searching = value?.length ? value : '';
1869
1860
  this.searching.emit({
1870
1861
  action,
@@ -1872,26 +1863,26 @@ class TableSearch {
1872
1863
  });
1873
1864
  });
1874
1865
  }
1875
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TableSearch, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1876
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: TableSearch, isStandalone: true, selector: "gld-table-search", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searching: "searching" }, ngImport: i0, template: "<article class=\"Search\">\n <section class=\"Input\" [style.width]=\"width()\">\n <!-- <gld-icon [icon]=\"Icons.search2Line\" /> -->\n\n <input\n id=\"search\"\n name=\"search\"\n type=\"search\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"control\" />\n </section>\n</article>\n", styles: [".Search{margin-bottom:24px}.Input{--radius: 100px;--background: var(--whitelight);--color: var(--darkblue);--placeholder-color: var(--gray);--border-color: var(--gray);--outline-color: var(--blue);--label-color: var(--darkblue);--height: 40px;--min-with: 350px;--icon-size: 20px;--animation-time: var(--animation-time--150);position:relative}.Input input{position:relative;width:100%;min-width:var(--min-with);height:var(--height);padding:12px 24px 12px calc(24px + var(--icon-size) + 12px);font-size:16px;font-family:inherit;color:var(--color);background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius)}.Input input:focus{outline-color:var(--outline-color)}.Input input::placeholder{color:var(--color)}.Input gld-icon{position:absolute;left:24px;top:calc(50% - 11px);z-index:1;color:var(--border-color)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1866
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TableSearch, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1867
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: TableSearch, isStandalone: true, selector: "gld-table-search", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searching: "searching" }, ngImport: i0, template: "<article class=\"Search\">\n <section class=\"Input\" [style.width]=\"width()\">\n <!-- <gld-icon [icon]=\"ICONS.search2Line\" /> -->\n\n <input\n id=\"search\"\n name=\"search\"\n type=\"search\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"control\" />\n </section>\n</article>\n", styles: [".Search{margin-bottom:24px}.Input{--radius: 100px;--background: var(--whitelight);--color: var(--darkblue);--placeholder-color: var(--gray);--border-color: var(--gray);--outline-color: var(--blue);--label-color: var(--darkblue);--height: 40px;--min-with: 350px;--icon-size: 20px;--animation-time: var(--animation-time--150);position:relative}.Input input{position:relative;width:100%;min-width:var(--min-with);height:var(--height);padding:12px 24px 12px calc(24px + var(--icon-size) + 12px);font-size:16px;font-family:inherit;color:var(--color);background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius)}.Input input:focus{outline-color:var(--outline-color)}.Input input::placeholder{color:var(--color)}.Input gld-icon{position:absolute;left:24px;top:calc(50% - 11px);z-index:1;color:var(--border-color)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1877
1868
  }
1878
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TableSearch, decorators: [{
1869
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TableSearch, decorators: [{
1879
1870
  type: Component,
1880
- args: [{ selector: 'gld-table-search', imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<article class=\"Search\">\n <section class=\"Input\" [style.width]=\"width()\">\n <!-- <gld-icon [icon]=\"Icons.search2Line\" /> -->\n\n <input\n id=\"search\"\n name=\"search\"\n type=\"search\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"control\" />\n </section>\n</article>\n", styles: [".Search{margin-bottom:24px}.Input{--radius: 100px;--background: var(--whitelight);--color: var(--darkblue);--placeholder-color: var(--gray);--border-color: var(--gray);--outline-color: var(--blue);--label-color: var(--darkblue);--height: 40px;--min-with: 350px;--icon-size: 20px;--animation-time: var(--animation-time--150);position:relative}.Input input{position:relative;width:100%;min-width:var(--min-with);height:var(--height);padding:12px 24px 12px calc(24px + var(--icon-size) + 12px);font-size:16px;font-family:inherit;color:var(--color);background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius)}.Input input:focus{outline-color:var(--outline-color)}.Input input::placeholder{color:var(--color)}.Input gld-icon{position:absolute;left:24px;top:calc(50% - 11px);z-index:1;color:var(--border-color)}\n"] }]
1871
+ args: [{ selector: 'gld-table-search', imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<article class=\"Search\">\n <section class=\"Input\" [style.width]=\"width()\">\n <!-- <gld-icon [icon]=\"ICONS.search2Line\" /> -->\n\n <input\n id=\"search\"\n name=\"search\"\n type=\"search\"\n [placeholder]=\"placeholder()\"\n [formControl]=\"control\" />\n </section>\n</article>\n", styles: [".Search{margin-bottom:24px}.Input{--radius: 100px;--background: var(--whitelight);--color: var(--darkblue);--placeholder-color: var(--gray);--border-color: var(--gray);--outline-color: var(--blue);--label-color: var(--darkblue);--height: 40px;--min-with: 350px;--icon-size: 20px;--animation-time: var(--animation-time--150);position:relative}.Input input{position:relative;width:100%;min-width:var(--min-with);height:var(--height);padding:12px 24px 12px calc(24px + var(--icon-size) + 12px);font-size:16px;font-family:inherit;color:var(--color);background:var(--background);border:1px solid var(--border-color);border-radius:var(--radius)}.Input input:focus{outline-color:var(--outline-color)}.Input input::placeholder{color:var(--color)}.Input gld-icon{position:absolute;left:24px;top:calc(50% - 11px);z-index:1;color:var(--border-color)}\n"] }]
1881
1872
  }], ctorParameters: () => [], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], debounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceTime", required: false }] }], searching: [{ type: i0.Output, args: ["searching"] }] } });
1882
1873
 
1883
1874
  // Angular Imports
1884
1875
  class Tile {
1885
1876
  constructor() {
1886
- this.color = input(TileColor.default, { ...(ngDevMode ? { debugName: "color" } : {}) });
1887
- this.paddingSize = input(TilePaddingSize.zero, { ...(ngDevMode ? { debugName: "paddingSize" } : {}) });
1877
+ this.color = input(TILE_COLORS.default, ...(ngDevMode ? [{ debugName: "color" }] : []));
1878
+ this.paddingSize = input(TILE_PADDING_SIZES.zero, ...(ngDevMode ? [{ debugName: "paddingSize" }] : []));
1888
1879
  this.background = input(false, { ...(ngDevMode ? { debugName: "background" } : {}), transform: booleanAttribute });
1889
1880
  this.hover = input(false, { ...(ngDevMode ? { debugName: "hover" } : {}), transform: booleanAttribute });
1890
1881
  }
1891
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Tile, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1892
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.1", type: Tile, isStandalone: true, selector: "gld-tile", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, paddingSize: { classPropertyName: "paddingSize", publicName: "paddingSize", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<article\n class=\"tile tile--{{ color() }} tile--padding-{{ paddingSize() }}\"\n [class.tile--background]=\"background()\"\n [class.tile--hover]=\"hover()\">\n <section class=\"tile-content\">\n <ng-content />\n </section>\n</article>\n", styles: [":host{width:100%;height:auto;position:relative;z-index:1}.tile{--gld-background: initial;--gld-background--hover: initial;--gld-border-color: transparent;--gld-padding-size: 0;--gld-radius: var(--gld-radius--xxs);width:inherit;height:inherit;position:relative;padding:var(--gld-padding-size);background:var(--gld-background);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);overflow:hidden;will-change:background;transition:background var(--gld-animation-time--150)}.tile--hover:hover,.tile--hover:focus{background:var(--gld-background--hover)}.tile.tile--hover{cursor:pointer}.tile--default{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) )}.tile--default.tile--background{--gld-background: var(--gld-gray-transparent--010)}.tile--default.tile--hover{--gld-background--hover: var(--gld-gray-transparent--020)}.tile--blue{--gld-border-color: var(--gld-blue-transparent--020)}.tile--blue.tile--background{--gld-background: var(--gld-blue-transparent--005)}.tile--blue.tile--hover{--gld-background--hover: var(--gld-blue-transparent--010)}.tile--green{--gld-border-color: var(--gld-green-transparent--020)}.tile--green.tile--background{--gld-background: var(--gld-green-transparent--005)}.tile--green.tile--hover{--gld-background--hover: var(--gld-green-transparent--010)}.tile--purple{--gld-border-color: var(--gld-purple-transparent--020)}.tile--purple.tile--background{--gld-background: var(--gld-purple-transparent--005)}.tile--purple.tile--hover{--gld-background--hover: var(--gld-purple-transparent--010)}.tile--mustard{--gld-border-color: var(--gld-mustard-transparent--020)}.tile--mustard.tile--background{--gld-background: var(--gld-mustard-transparent--005)}.tile--mustard.tile--hover{--gld-background--hover: var(--gld-mustard-transparent--010)}.tile--orange{--gld-border-color: var(--gld-orange-transparent--020)}.tile--orange.tile--background{--gld-background: var(--gld-orange-transparent--005)}.tile--orange.tile--hover{--gld-background--hover: var(--gld-orange-transparent--010)}.tile--pink{--gld-border-color: var(--gld-pink-transparent--020)}.tile--pink.tile--background{--gld-background: var(--gld-pink-transparent--005)}.tile--pink.tile--hover{--gld-background--hover: var(--gld-pink-transparent--010)}.tile--red{--gld-border-color: var(--gld-red-transparent--020)}.tile--red.tile--background{--gld-background: var(--gld-red-transparent--005)}.tile--red.tile--hover{--gld-background--hover: var(--gld-red-transparent--010)}.tile--padding-tiny{--gld-padding-size: var(--gld-spacing--xxxs)}.tile--padding-small{--gld-padding-size: var(--gld-spacing--xs)}.tile--padding-normal{--gld-padding-size: var(--gld-spacing--s)}.tile--padding-medium{--gld-padding-size: var(--gld-spacing--l)}.tile--padding-large{--gld-padding-size: var(--gld-spacing--xl)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1882
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Tile, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1883
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.0", type: Tile, isStandalone: true, selector: "gld-tile", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, paddingSize: { classPropertyName: "paddingSize", publicName: "paddingSize", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, hover: { classPropertyName: "hover", publicName: "hover", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<article\n class=\"tile tile--{{ color() }} tile--padding-{{ paddingSize() }}\"\n [class.tile--background]=\"background()\"\n [class.tile--hover]=\"hover()\">\n <section class=\"tile-content\">\n <ng-content />\n </section>\n</article>\n", styles: [":host{width:100%;height:auto;position:relative;z-index:1}.tile{--gld-background: initial;--gld-background--hover: initial;--gld-border-color: transparent;--gld-padding-size: 0;--gld-radius: var(--gld-radius--xxs);width:inherit;height:inherit;position:relative;padding:var(--gld-padding-size);background:var(--gld-background);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);overflow:hidden;will-change:background;transition:background var(--gld-animation-time--150)}.tile--hover:hover,.tile--hover:focus{background:var(--gld-background--hover)}.tile.tile--hover{cursor:pointer}.tile--default{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) )}.tile--default.tile--background{--gld-background: var(--gld-gray-transparent--010)}.tile--default.tile--hover{--gld-background--hover: var(--gld-gray-transparent--020)}.tile--blue{--gld-border-color: var(--gld-blue-transparent--020)}.tile--blue.tile--background{--gld-background: var(--gld-blue-transparent--005)}.tile--blue.tile--hover{--gld-background--hover: var(--gld-blue-transparent--010)}.tile--green{--gld-border-color: var(--gld-green-transparent--020)}.tile--green.tile--background{--gld-background: var(--gld-green-transparent--005)}.tile--green.tile--hover{--gld-background--hover: var(--gld-green-transparent--010)}.tile--purple{--gld-border-color: var(--gld-purple-transparent--020)}.tile--purple.tile--background{--gld-background: var(--gld-purple-transparent--005)}.tile--purple.tile--hover{--gld-background--hover: var(--gld-purple-transparent--010)}.tile--mustard{--gld-border-color: var(--gld-mustard-transparent--020)}.tile--mustard.tile--background{--gld-background: var(--gld-mustard-transparent--005)}.tile--mustard.tile--hover{--gld-background--hover: var(--gld-mustard-transparent--010)}.tile--orange{--gld-border-color: var(--gld-orange-transparent--020)}.tile--orange.tile--background{--gld-background: var(--gld-orange-transparent--005)}.tile--orange.tile--hover{--gld-background--hover: var(--gld-orange-transparent--010)}.tile--pink{--gld-border-color: var(--gld-pink-transparent--020)}.tile--pink.tile--background{--gld-background: var(--gld-pink-transparent--005)}.tile--pink.tile--hover{--gld-background--hover: var(--gld-pink-transparent--010)}.tile--red{--gld-border-color: var(--gld-red-transparent--020)}.tile--red.tile--background{--gld-background: var(--gld-red-transparent--005)}.tile--red.tile--hover{--gld-background--hover: var(--gld-red-transparent--010)}.tile--padding-tiny{--gld-padding-size: var(--gld-spacing--xxxs)}.tile--padding-small{--gld-padding-size: var(--gld-spacing--xs)}.tile--padding-normal{--gld-padding-size: var(--gld-spacing--s)}.tile--padding-medium{--gld-padding-size: var(--gld-spacing--l)}.tile--padding-large{--gld-padding-size: var(--gld-spacing--xl)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1893
1884
  }
1894
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Tile, decorators: [{
1885
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Tile, decorators: [{
1895
1886
  type: Component,
1896
1887
  args: [{ selector: 'gld-tile', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<article\n class=\"tile tile--{{ color() }} tile--padding-{{ paddingSize() }}\"\n [class.tile--background]=\"background()\"\n [class.tile--hover]=\"hover()\">\n <section class=\"tile-content\">\n <ng-content />\n </section>\n</article>\n", styles: [":host{width:100%;height:auto;position:relative;z-index:1}.tile{--gld-background: initial;--gld-background--hover: initial;--gld-border-color: transparent;--gld-padding-size: 0;--gld-radius: var(--gld-radius--xxs);width:inherit;height:inherit;position:relative;padding:var(--gld-padding-size);background:var(--gld-background);border:var(--gld-border-size) solid var(--gld-border-color);border-radius:var(--gld-radius);overflow:hidden;will-change:background;transition:background var(--gld-animation-time--150)}.tile--hover:hover,.tile--hover:focus{background:var(--gld-background--hover)}.tile.tile--hover{cursor:pointer}.tile--default{--gld-border-color: light-dark( var(--gld-gray-transparent--040), var(--gld-gray-transparent--020) )}.tile--default.tile--background{--gld-background: var(--gld-gray-transparent--010)}.tile--default.tile--hover{--gld-background--hover: var(--gld-gray-transparent--020)}.tile--blue{--gld-border-color: var(--gld-blue-transparent--020)}.tile--blue.tile--background{--gld-background: var(--gld-blue-transparent--005)}.tile--blue.tile--hover{--gld-background--hover: var(--gld-blue-transparent--010)}.tile--green{--gld-border-color: var(--gld-green-transparent--020)}.tile--green.tile--background{--gld-background: var(--gld-green-transparent--005)}.tile--green.tile--hover{--gld-background--hover: var(--gld-green-transparent--010)}.tile--purple{--gld-border-color: var(--gld-purple-transparent--020)}.tile--purple.tile--background{--gld-background: var(--gld-purple-transparent--005)}.tile--purple.tile--hover{--gld-background--hover: var(--gld-purple-transparent--010)}.tile--mustard{--gld-border-color: var(--gld-mustard-transparent--020)}.tile--mustard.tile--background{--gld-background: var(--gld-mustard-transparent--005)}.tile--mustard.tile--hover{--gld-background--hover: var(--gld-mustard-transparent--010)}.tile--orange{--gld-border-color: var(--gld-orange-transparent--020)}.tile--orange.tile--background{--gld-background: var(--gld-orange-transparent--005)}.tile--orange.tile--hover{--gld-background--hover: var(--gld-orange-transparent--010)}.tile--pink{--gld-border-color: var(--gld-pink-transparent--020)}.tile--pink.tile--background{--gld-background: var(--gld-pink-transparent--005)}.tile--pink.tile--hover{--gld-background--hover: var(--gld-pink-transparent--010)}.tile--red{--gld-border-color: var(--gld-red-transparent--020)}.tile--red.tile--background{--gld-background: var(--gld-red-transparent--005)}.tile--red.tile--hover{--gld-background--hover: var(--gld-red-transparent--010)}.tile--padding-tiny{--gld-padding-size: var(--gld-spacing--xxxs)}.tile--padding-small{--gld-padding-size: var(--gld-spacing--xs)}.tile--padding-normal{--gld-padding-size: var(--gld-spacing--s)}.tile--padding-medium{--gld-padding-size: var(--gld-spacing--l)}.tile--padding-large{--gld-padding-size: var(--gld-spacing--xl)}\n"] }]
1897
1888
  }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], paddingSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingSize", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], hover: [{ type: i0.Input, args: [{ isSignal: true, alias: "hover", required: false }] }] } });
@@ -1906,8 +1897,8 @@ const AuthenticationStore = signalStore(withState(initialAuthenticationState), w
1906
1897
  signin: (parameters) => {
1907
1898
  const { accessToken, refreshToken, saveCookie = true } = parameters;
1908
1899
  if (saveCookie) {
1909
- cookiesService.set(CookiesKeys.accessToken, accessToken);
1910
- cookiesService.set(CookiesKeys.refreshToken, refreshToken);
1900
+ cookiesService.set(COOKIES_KEYS.accessToken, accessToken);
1901
+ cookiesService.set(COOKIES_KEYS.refreshToken, refreshToken);
1911
1902
  }
1912
1903
  patchState(store, (previous) => ({
1913
1904
  ...previous,
@@ -1917,8 +1908,8 @@ const AuthenticationStore = signalStore(withState(initialAuthenticationState), w
1917
1908
  }));
1918
1909
  },
1919
1910
  signout: () => {
1920
- cookiesService.delete(CookiesKeys.accessToken);
1921
- cookiesService.delete(CookiesKeys.refreshToken);
1911
+ cookiesService.delete(COOKIES_KEYS.accessToken);
1912
+ cookiesService.delete(COOKIES_KEYS.refreshToken);
1922
1913
  patchState(store, (previous) => ({
1923
1914
  ...previous,
1924
1915
  logged: false,
@@ -1941,7 +1932,7 @@ class Authentication {
1941
1932
  this.router = inject(Router);
1942
1933
  this.http = inject(HttpClient);
1943
1934
  this.authenticationStore = inject(AuthenticationStore);
1944
- this.iamgldApi = computed(() => this.environment.iamgldApi, { ...(ngDevMode ? { debugName: "iamgldApi" } : {}) });
1935
+ this.iamgldApi = computed(() => this.environment.iamgldApi, ...(ngDevMode ? [{ debugName: "iamgldApi" }] : []));
1945
1936
  }
1946
1937
  signin(parameters) {
1947
1938
  const { email, password } = parameters;
@@ -1994,10 +1985,10 @@ class Authentication {
1994
1985
  }
1995
1986
  }));
1996
1987
  }
1997
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Authentication, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1998
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Authentication }); }
1988
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Authentication, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1989
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Authentication }); }
1999
1990
  }
2000
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Authentication, decorators: [{
1991
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Authentication, decorators: [{
2001
1992
  type: Injectable
2002
1993
  }] });
2003
1994
 
@@ -2011,10 +2002,10 @@ class CustomPreloadingStrategy {
2011
2002
  }
2012
2003
  return of(null);
2013
2004
  }
2014
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: CustomPreloadingStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2015
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: CustomPreloadingStrategy, providedIn: 'root' }); }
2005
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CustomPreloadingStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2006
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CustomPreloadingStrategy, providedIn: 'root' }); }
2016
2007
  }
2017
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: CustomPreloadingStrategy, decorators: [{
2008
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: CustomPreloadingStrategy, decorators: [{
2018
2009
  type: Injectable,
2019
2010
  args: [{ providedIn: 'root' }]
2020
2011
  }] });
@@ -2030,10 +2021,10 @@ class Environments {
2030
2021
  getEnvironmentLabel() {
2031
2022
  return this.environment.environmentType;
2032
2023
  }
2033
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Environments, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2034
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Environments }); }
2024
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Environments, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2025
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Environments }); }
2035
2026
  }
2036
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Environments, decorators: [{
2027
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Environments, decorators: [{
2037
2028
  type: Injectable
2038
2029
  }] });
2039
2030
 
@@ -2041,7 +2032,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImpor
2041
2032
  class Theme {
2042
2033
  constructor() {
2043
2034
  this.rendererFactory = inject(RendererFactory2);
2044
- this.allThemes = [UiTheme.dark, UiTheme.light, UiTheme.system];
2035
+ this.allThemes = [UI_THEMES.dark, UI_THEMES.light, UI_THEMES.system];
2045
2036
  this.renderer = this.rendererFactory.createRenderer(null, null);
2046
2037
  }
2047
2038
  changeTheme(theme) {
@@ -2052,10 +2043,10 @@ class Theme {
2052
2043
  this.renderer.addClass(document.body, theme);
2053
2044
  }
2054
2045
  }
2055
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Theme, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2056
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Theme }); }
2046
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Theme, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2047
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Theme }); }
2057
2048
  }
2058
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Theme, decorators: [{
2049
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Theme, decorators: [{
2059
2050
  type: Injectable
2060
2051
  }], ctorParameters: () => [] });
2061
2052
 
@@ -2070,10 +2061,10 @@ class Transloco {
2070
2061
  getLanguage() {
2071
2062
  return this.translocoService.getActiveLang();
2072
2063
  }
2073
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Transloco, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2074
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Transloco }); }
2064
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Transloco, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2065
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Transloco }); }
2075
2066
  }
2076
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: Transloco, decorators: [{
2067
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: Transloco, decorators: [{
2077
2068
  type: Injectable
2078
2069
  }] });
2079
2070
  class TranslocoHttpLoader {
@@ -2083,17 +2074,17 @@ class TranslocoHttpLoader {
2083
2074
  getTranslation(lang) {
2084
2075
  return this.httpClient.get(`public/i18n/${lang}.json`);
2085
2076
  }
2086
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TranslocoHttpLoader, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2087
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TranslocoHttpLoader }); }
2077
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TranslocoHttpLoader, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2078
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TranslocoHttpLoader }); }
2088
2079
  }
2089
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: TranslocoHttpLoader, decorators: [{
2080
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TranslocoHttpLoader, decorators: [{
2090
2081
  type: Injectable
2091
2082
  }] });
2092
2083
 
2093
2084
  // Store Imports
2094
2085
  const initialThemeState = {
2095
- theme: UiTheme.system,
2096
- iconTheme: Icons.macLine,
2086
+ theme: UI_THEMES.system,
2087
+ iconTheme: ICONS.macLine,
2097
2088
  };
2098
2089
  const ThemeStore = signalStore(withState(initialThemeState), withHooks({
2099
2090
  onInit(store) {
@@ -2118,8 +2109,8 @@ const isLogged = () => {
2118
2109
  const isBrowser = typeof window !== 'undefined';
2119
2110
  if (!isBrowser)
2120
2111
  return false;
2121
- const accessToken = cookiesService.get(CookiesKeys.accessToken);
2122
- const refreshToken = cookiesService.get(CookiesKeys.refreshToken);
2112
+ const accessToken = cookiesService.get(COOKIES_KEYS.accessToken);
2113
+ const refreshToken = cookiesService.get(COOKIES_KEYS.refreshToken);
2123
2114
  if (accessToken && refreshToken) {
2124
2115
  if (!authenticationStore.logged()) {
2125
2116
  authenticationStore.signin({ accessToken, refreshToken });
@@ -2139,8 +2130,8 @@ const isLogged = () => {
2139
2130
  // Angular Imports
2140
2131
  const addToken = (request, next) => {
2141
2132
  const authenticationStore = inject(AuthenticationStore);
2142
- const logged = computed(() => authenticationStore.logged(), { ...(ngDevMode ? { debugName: "logged" } : {}) });
2143
- const accessToken = computed(() => authenticationStore.accessToken(), { ...(ngDevMode ? { debugName: "accessToken" } : {}) });
2133
+ const logged = computed(() => authenticationStore.logged(), ...(ngDevMode ? [{ debugName: "logged" }] : []));
2134
+ const accessToken = computed(() => authenticationStore.accessToken(), ...(ngDevMode ? [{ debugName: "accessToken" }] : []));
2144
2135
  let cloneRequest = request;
2145
2136
  if (logged() && request.headers.has('Authorization')) {
2146
2137
  cloneRequest = request.clone({
@@ -2156,16 +2147,16 @@ const changeLanguage = (request, next) => {
2156
2147
  let cloneRequest = request;
2157
2148
  if (request.headers.has('Language')) {
2158
2149
  if (request.method.toLowerCase() === 'get') {
2159
- let language = TranslocoLanguageName.english;
2150
+ let language = TRANSLOCO_LANGUAGE_NAMES.english;
2160
2151
  switch (transloco.getLanguage()) {
2161
- case TranslocoLanguageKey.english:
2162
- language = TranslocoLanguageName.english;
2152
+ case TRANSLOCO_LANGUAGE_KEYS.english:
2153
+ language = TRANSLOCO_LANGUAGE_NAMES.english;
2163
2154
  break;
2164
- case TranslocoLanguageKey.spanish:
2165
- language = TranslocoLanguageName.spanish;
2155
+ case TRANSLOCO_LANGUAGE_KEYS.spanish:
2156
+ language = TRANSLOCO_LANGUAGE_NAMES.spanish;
2166
2157
  break;
2167
2158
  default:
2168
- language = TranslocoLanguageName.english;
2159
+ language = TRANSLOCO_LANGUAGE_NAMES.english;
2169
2160
  break;
2170
2161
  }
2171
2162
  const params = new HttpParams({ fromObject: { language } });
@@ -2180,10 +2171,10 @@ const changeLanguage = (request, next) => {
2180
2171
  const refreshToken = (request, next) => {
2181
2172
  const authenticationStore = inject(AuthenticationStore);
2182
2173
  const authentication = inject(Authentication);
2183
- const logged = computed(() => authenticationStore.logged(), { ...(ngDevMode ? { debugName: "logged" } : {}) });
2184
- const accessToken = computed(() => authenticationStore.accessToken(), { ...(ngDevMode ? { debugName: "accessToken" } : {}) });
2185
- const refreshToken = computed(() => authenticationStore.refreshToken(), { ...(ngDevMode ? { debugName: "refreshToken" } : {}) });
2186
- const refreshAccessTokenInProgress = signal(false, { ...(ngDevMode ? { debugName: "refreshAccessTokenInProgress" } : {}) });
2174
+ const logged = computed(() => authenticationStore.logged(), ...(ngDevMode ? [{ debugName: "logged" }] : []));
2175
+ const accessToken = computed(() => authenticationStore.accessToken(), ...(ngDevMode ? [{ debugName: "accessToken" }] : []));
2176
+ const refreshToken = computed(() => authenticationStore.refreshToken(), ...(ngDevMode ? [{ debugName: "refreshToken" }] : []));
2177
+ const refreshAccessTokenInProgress = signal(false, ...(ngDevMode ? [{ debugName: "refreshAccessTokenInProgress" }] : []));
2187
2178
  const doSameRequestCallStack = new Subject();
2188
2179
  const handlerRefreshAccessToken = (request, next) => {
2189
2180
  if (refreshAccessTokenInProgress()) {
@@ -2227,5 +2218,5 @@ const refreshToken = (request, next) => {
2227
2218
  * Generated bundle index. Do not edit.
2228
2219
  */
2229
2220
 
2230
- export { Authentication, AuthenticationStore, Button, ButtonColor, ButtonSize, CircleLoader, CookiesKeys, CustomPreloadingStrategy, DropdownButton, DropdownDirection, DropdownMenu, DropdownMenuTemplate, DropdownType, EnvironmentType, Environments, Icon, IconButton, Icons, IconsSize, IconsSpace, Image, Input, InputDate, InputError, InputErrorMessage, InputHint, Link, LinkAlign, LinkType, MAX_DAY, MAX_MONTH, MIN_DAY, MIN_MONTH, NATURAL_NUMBER_REGEX, NATURAL_NUMBER_REGEX_TO_CLEAN, RadioButton, RadioDirection, RadioGroup, SERVICES_ENVIRONMENT_TOKEN, STORES_ENVIRONMENT_TOKEN, STRING_REGEX, STRING_REGEX_TO_CLEAN, Select, SelectOption, SelectType, THEMES, Table, TableColumnActionType, TablePagination, TableSearch, TableSearchAction, Textarea, Theme, ThemeStore, Tile, TileColor, TilePaddingSize, ToggleButton, ToggleGroup, Transloco, TranslocoHttpLoader, TranslocoLanguageKey, TranslocoLanguageName, UiTheme, YEAR_LENGTH, addDaysToISODate, addToken, addYearsToISODate, capitalizeFirstLetter, changeLanguage, formatDDMMYYYYToISODate, formatDateToISODate, formatISODateToDDMMYYYY, formatISODateToDate, initialAuthenticationState, initialThemeState, isDate, isDocument, isEmail, isFormSelectItem, isLogged, isNaturalNumber, isString, minimumAge, mustMatch, mustUnmatch, refreshToken, updateValueWithMask };
2221
+ export { Authentication, AuthenticationStore, BUTTON_COLORS, BUTTON_SIZES, Button, COOKIES_KEYS, CircleLoader, CustomPreloadingStrategy, DROPDOWN_DIRECTIONS, DROPDOWN_TYPES, DropdownButton, DropdownMenu, DropdownMenuTemplate, ENVIRONMENT_TYPES, Environments, ICONS, ICONS_SIZES, ICONS_SPACES, Icon, IconButton, Image, Input, InputDate, InputError, InputErrorMessage, InputHint, LINK_ALIGNS, LINK_TYPES, Link, MAX_DAY, MAX_MONTH, MIN_DAY, MIN_MONTH, NATURAL_NUMBER_REGEX, NATURAL_NUMBER_REGEX_TO_CLEAN, RADIO_DIRECTIONS, RadioButton, RadioGroup, SELECT_TYPES, SERVICES_ENVIRONMENT_TOKEN, STORES_ENVIRONMENT_TOKEN, STRING_REGEX, STRING_REGEX_TO_CLEAN, Select, SelectOption, TABLE_COLUMN_ACTION_TYPES, TABLE_SEARCH_ACTIONS, THEMES, TILE_COLORS, TILE_PADDING_SIZES, TRANSLOCO_LANGUAGE_KEYS, TRANSLOCO_LANGUAGE_NAMES, Table, TablePagination, TableSearch, Textarea, Theme, ThemeStore, Tile, ToggleButton, ToggleGroup, Transloco, TranslocoHttpLoader, UI_THEMES, YEAR_LENGTH, addDaysToISODate, addToken, addYearsToISODate, capitalizeFirstLetter, changeLanguage, formatDDMMYYYYToISODate, formatDateToISODate, formatISODateToDDMMYYYY, formatISODateToDate, initialAuthenticationState, initialThemeState, isDate, isDocument, isEmail, isFormSelectItem, isLogged, isNaturalNumber, isString, minimumAge, mustMatch, mustUnmatch, refreshToken, updateValueWithMask };
2231
2222
  //# sourceMappingURL=iamgld-ui.mjs.map