@sarasanalytics-com/design-system 0.0.27 → 0.0.28

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 (8) hide show
  1. package/esm2022/lib/card/card.component.mjs +11 -3
  2. package/esm2022/lib/card-carousel/card-carousel.component.mjs +2 -2
  3. package/esm2022/lib/scrolling-cards/scrolling-cards.component.mjs +1 -1
  4. package/fesm2022/sarasanalytics-com-design-system.mjs +12 -4
  5. package/fesm2022/sarasanalytics-com-design-system.mjs.map +1 -1
  6. package/lib/card/card.component.d.ts +3 -1
  7. package/package.json +2 -2
  8. package/styles/styles.css +0 -329
package/lib/card/card.component.d.ts CHANGED
@@ -9,6 +9,8 @@ export declare class CardComponent {
9
9
  chip: ChipInterface | null;
10
10
  body: string;
11
11
  avatar: string;
12
+ image: string;
13
+ imageWidth: string;
12
14
  avatarSize: string;
13
15
  icon: string;
14
16
  iconSize: string;
@@ -19,5 +21,5 @@ export declare class CardComponent {
19
21
  cardStyles: any;
20
22
  ngOnChanges(changes: SimpleChanges): void;
21
23
  static ɵfac: i0.ɵɵFactoryDeclaration<CardComponent, never>;
22
- static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "sa-card", never, { "title": { "alias": "title"; "required": false; }; "showCardHeader": { "alias": "showCardHeader"; "required": false; }; "showCardBody": { "alias": "showCardBody"; "required": false; }; "customWrapperClass": { "alias": "customWrapperClass"; "required": false; }; "chip": { "alias": "chip"; "required": false; }; "body": { "alias": "body"; "required": false; }; "avatar": { "alias": "avatar"; "required": false; }; "avatarSize": { "alias": "avatarSize"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "iconSize": { "alias": "iconSize"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "logoIcon": { "alias": "logoIcon"; "required": false; }; "width": { "alias": "width"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, {}, never, ["sa-card-icon", "sa-card-title-actions", "sa-card-title-header", "sa-card-title-actions", "sa-card-footer-actions"], true, never>;
24
+ static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "sa-card", never, { "title": { "alias": "title"; "required": false; }; "showCardHeader": { "alias": "showCardHeader"; "required": false; }; "showCardBody": { "alias": "showCardBody"; "required": false; }; "customWrapperClass": { "alias": "customWrapperClass"; "required": false; }; "chip": { "alias": "chip"; "required": false; }; "body": { "alias": "body"; "required": false; }; "avatar": { "alias": "avatar"; "required": false; }; "image": { "alias": "image"; "required": false; }; "imageWidth": { "alias": "imageWidth"; "required": false; }; "avatarSize": { "alias": "avatarSize"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "iconSize": { "alias": "iconSize"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "logoIcon": { "alias": "logoIcon"; "required": false; }; "width": { "alias": "width"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, {}, never, ["sa-card-icon", "sa-card-title-actions", "sa-card-title-header", "sa-card-title-actions", "sa-card-footer-actions"], true, never>;
23
25
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sarasanalytics-com/design-system",
3
- "version": "0.0.27",
3
+ "version": "0.0.28",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^17.2.0",
6
6
  "@angular/core": "^17.2.0"
@@ -22,4 +22,4 @@
22
22
  "default": "./fesm2022/sarasanalytics-com-design-system.mjs"
23
23
  }
24
24
  }
25
- }
25
+ }
package/styles/styles.css DELETED
@@ -1,329 +0,0 @@
1
-
2
- /*
3
- 1. Use a more-intuitive box-sizing model.
4
- */
5
- *, *::before, *::after {
6
- box-sizing: border-box;
7
- }
8
-
9
- html,
10
- body {
11
- height: 100%;
12
- }
13
-
14
- body {
15
- margin: 0;
16
- font-family: Roboto, "Helvetica Neue", sans-serif;
17
- }
18
-
19
- :root {
20
- --font: 'Roboto';
21
- --font-roboto: 'Roboto';
22
- --font-inter: 'Inter';
23
- --font-poppins: "Poppins";
24
- --font-helvetica: "Helvetica";
25
- --small-2px: 2px;
26
- --small-4px: 4px;
27
- --small-6px: 6px;
28
- --small-8px: 8px;
29
- --small-12px: 12px;
30
- --small-14px: 14px;
31
- --small-16px: 16px;
32
- --small-18px: 18px;
33
- --medium-20px: 20px;
34
- --medium-24px: 24px;
35
- --medium-28px: 28px;
36
- --medium-32px: 32px;
37
- --medium-36px: 36px;
38
- --large-40px: 40px;
39
- --large-42px: 42px;
40
- --large-44px: 44px;
41
- --large-48px: 48px;
42
- --large-56px: 56px;
43
- --large-64px: 64px;
44
- --form-email-icon-color: #33961F;
45
- }
46
-
47
- .insights-theme {
48
- --primary-50: #EAFFFD;
49
- --primary-100: #CAFFFB;
50
- --primary-200: #9CFFFA;
51
- --primary-300: #00DDEA;
52
- --primary-400: #00AFC4;
53
- --primary-500: #008597;
54
- --primary-600: #0B6E7F;
55
- --primary-700: #0E5B6B;
56
- --primary-800: #023D4A;
57
- --primary-900: #01303A;
58
- --secondary-50: #FFF3EB;
59
- --secondary-100: #FFD8C0;
60
- --secondary-200: #FFC6A2;
61
- --secondary-300: #FEAB78;
62
- --secondary-400: #FE9B5D;
63
- --secondary-500: #FE8235;
64
- --secondary-600: #E77630;
65
- --secondary-700: #B45C26;
66
- --secondary-800: #8C481D;
67
- --secondary-900: #6B3716;
68
- --grey-50: #E9EAEB;
69
- --grey-100: #BAC0C1;
70
- --grey-200: #98A1A3;
71
- --grey-300: #697779;
72
- --grey-400: #4C5C5F;
73
- --grey-500: #1F3437;
74
- --grey-600: #1C2F32;
75
- --grey-700: #162527;
76
- --grey-800: #111C1E;
77
- --grey-900: #0D1517;
78
- --semantic-success-50: #EBF5E9;
79
- --semantic-success-100: #C0DEBA;
80
- --semantic-success-200: #A1CF98;
81
- --semantic-success-300: #76B969;
82
- --semantic-success-400: #5CAB4C;
83
- --semantic-success-500: #33961F;
84
- --semantic-success-600: #2E891C;
85
- --semantic-success-700: #246B16;
86
- --semantic-success-800: #1C5311;
87
- --semantic-success-900: #153F0D;
88
- --semantic-error-50: #F8E9E9;
89
- --semantic-error-100: #EBBCB9;
90
- --semantic-error-200: #E19C98;
91
- --semantic-error-300: #D36E68;
92
- --semantic-error-400: #CA524B;
93
- --semantic-error-500: #BD271E;
94
- --semantic-error-600: #AC231B;
95
- --semantic-error-700: #861C15;
96
- --semantic-error-800: #681511;
97
- --semantic-error-900: #4F100D;
98
- --semantic-purple-50: #F3EFFD;
99
- --semantic-purple-100: #D8CCFA;
100
- --semantic-purple-200: #C6B4F7;
101
- --semantic-purple-300: #AB92F4;
102
- --semantic-purple-400: #9B7DF1;
103
- --semantic-purple-500: #815BED;
104
- --semantic-purple-600: #7654D9;
105
- --semantic-purple-700: #5C41A9;
106
- --semantic-purple-800: #483383;
107
- --semantic-purple-900: #372764;
108
- --semantic-yellow-50: #FEF6E6;
109
- --semantic-yellow-100: #FBE2B3;
110
- --semantic-yellow-200: #F9D58E;
111
- --semantic-yellow-300: #F6C15A;
112
- --semantic-yellow-400: #F5B53A;
113
- --text-highemphasis: #1B1F20;
114
- --text-mediumemphasis: #697779;
115
- --text-lowemphasis: #98A2A3;
116
- --text-white: #FFFFFF;
117
- --text-primary: #008597;
118
- --text-success: #33961F;
119
- --text-error: #BD271E;
120
- --icon-white: #FFFFFF;
121
- --semantic-yellow-500: #F2A209;
122
- --semantic-yellow-600: #DC9408;
123
- --semantic-yellow-700: #AC7406;
124
- --semantic-yellow-800: #855A05;
125
- --semantic-yellow-900: #664404;
126
- --structural-white: #FFFFFF;
127
- --icon-grey1: #757575;
128
- --structural-primarytint: #F5F9FA;
129
- --structural-neutral1: #F9F9F9;
130
- --structural-neutral2: #FFFAFA;
131
- --logo-color-primary: #008597;
132
- --logo-color-secondary: #9CFFFA;
133
- }
134
-
135
- .saras-theme {
136
- --primary-50: #E8F1FC;
137
- --primary-100: #B8D4F7;
138
- --primary-200: #96C0F3;
139
- --primary-300: #66A2ED;
140
- --primary-400: #4992E9;
141
- --primary-500: #1B77E4;
142
- --primary-600: #196CCF;
143
- --primary-700: #1354A2;
144
- --primary-800: #0F417D;
145
- --primary-900: #0B3160;
146
- --secondary-50: #FFF3EB;
147
- --secondary-100: #FFD8C0;
148
- --secondary-200: #FFC6A2;
149
- --secondary-300: #FEAB78;
150
- --secondary-400: #FE9B5D;
151
- --secondary-500: #FE8235;
152
- --secondary-600: #E77630;
153
- --secondary-700: #B45C26;
154
- --secondary-800: #8C481D;
155
- --secondary-900: #6B3716;
156
- --grey-50: #E9E9EB;
157
- --grey-100: #BABDC1;
158
- --grey-200: #989CA3;
159
- --grey-300: #697079;
160
- --grey-400: #4C545F;
161
- --grey-500: #1F2937;
162
- --grey-600: #1C2532;
163
- --grey-700: #161D27;
164
- --grey-800: #11161E;
165
- --grey-900: #0D1117;
166
- --semantic-success-50: #EBF5E9;
167
- --semantic-success-100: #C0DEBA;
168
- --semantic-success-200: #A1CF98;
169
- --semantic-success-300: #76B969;
170
- --semantic-success-400: #5CAB4C;
171
- --semantic-success-500: #33961F;
172
- --semantic-success-600: #2E891C;
173
- --semantic-success-700: #246B16;
174
- --semantic-success-800: #1C5311;
175
- --semantic-success-900: #153F0D;
176
- --semantic-error-50: #F8E9E9;
177
- --semantic-error-100: #EBBCB9;
178
- --semantic-error-200: #E19C98;
179
- --semantic-error-300: #D36E68;
180
- --semantic-error-400: #CA524B;
181
- --semantic-error-500: #BD271E;
182
- --semantic-error-600: #AC231B;
183
- --semantic-error-700: #861C15;
184
- --semantic-error-800: #681511;
185
- --semantic-error-900: #4F100D;
186
- --semantic-purple-50: #F3EFFD;
187
- --semantic-purple-100: #D8CCFA;
188
- --semantic-purple-200: #C6B4F7;
189
- --semantic-purple-300: #AB92F4;
190
- --semantic-purple-400: #9B7DF1;
191
- --semantic-purple-500: #815BED;
192
- --semantic-purple-600: #7654D9;
193
- --semantic-purple-700: #5C41A9;
194
- --semantic-purple-800: #483383;
195
- --semantic-purple-900: #372764;
196
- --semantic-yellow-50: #FEF6E6;
197
- --semantic-yellow-100: #FBE2B3;
198
- --semantic-yellow-200: #F9D58E;
199
- --semantic-yellow-300: #F6C15A;
200
- --semantic-yellow-400: #F5B53A;
201
- --text-highemphasis: #1B1D20;
202
- --text-mediumemphasis: #697079;
203
- --text-lowemphasis: #989CA3;
204
- --text-white: #FFFFFF;
205
- --text-primary: #1B77E4;
206
- --text-success: #33961F;
207
- --text-error: #BD271E;
208
- --icon-white: #FFFFFF;
209
- --semantic-yellow-500: #F2A209;
210
- --semantic-yellow-600: #DC9408;
211
- --semantic-yellow-700: #AC7406;
212
- --semantic-yellow-800: #855A05;
213
- --semantic-yellow-900: #664404;
214
- --structural-white: #FFFFFF;
215
- --icon-grey1: #757575;
216
- --structural-primarytint: #FAFCFF;
217
- --structural-neutral1: #F9F9F9;
218
- --structural-neutral2: #FFFAFA;
219
- --logo-color-primary: #1B77E4;
220
- --logo-color-secondary: #96C0F3;
221
- }
222
-
223
- .purple-theme {
224
- --primary-50: #F4EBFF;
225
- --primary-100: #E9D7FE;
226
- --primary-200: #D6BBFB;
227
- --primary-300: #B692F6;
228
- --primary-400: #9E77ED;
229
- --primary-500: #7F56D9;
230
- --primary-600: #53389E;
231
- --primary-700: #53389E;
232
- --primary-800: #42307D;
233
- --primary-900: #2C1C5F;
234
- --secondary-50: #FFF3EB;
235
- --secondary-100: #FFD8C0;
236
- --secondary-200: #FFC6A2;
237
- --secondary-300: #FEAB78;
238
- --secondary-400: #FE9B5D;
239
- --secondary-500: #FE8235;
240
- --secondary-600: #E77630;
241
- --secondary-700: #B45C26;
242
- --secondary-800: #8C481D;
243
- --secondary-900: #6B3716;
244
- --grey-50: #F2F4F7;
245
- --grey-100: #EAECF0;
246
- --grey-200: #D0D5DD;
247
- --grey-300: #98A2B3;
248
- --grey-400: #475467;
249
- --grey-500: #344054;
250
- --grey-600: #1D2939;
251
- --grey-700: #1D2939;
252
- --grey-800: #101828;
253
- --grey-900: #0C111D;
254
- --semantic-success-50: #EBF5E9;
255
- --semantic-success-100: #C0DEBA;
256
- --semantic-success-200: #A1CF98;
257
- --semantic-success-300: #76B969;
258
- --semantic-success-400: #5CAB4C;
259
- --semantic-success-500: #33961F;
260
- --semantic-success-600: #2E891C;
261
- --semantic-success-700: #246B16;
262
- --semantic-success-800: #1C5311;
263
- --semantic-success-900: #153F0D;
264
- --semantic-error-50: #F8E9E9;
265
- --semantic-error-100: #EBBCB9;
266
- --semantic-error-200: #E19C98;
267
- --semantic-error-300: #D36E68;
268
- --semantic-error-400: #CA524B;
269
- --semantic-error-500: #BD271E;
270
- --semantic-error-600: #AC231B;
271
- --semantic-error-700: #861C15;
272
- --semantic-error-800: #681511;
273
- --semantic-error-900: #4F100D;
274
- --semantic-purple-50: #F3EFFD;
275
- --semantic-purple-100: #D8CCFA;
276
- --semantic-purple-200: #C6B4F7;
277
- --semantic-purple-300: #AB92F4;
278
- --semantic-purple-400: #9B7DF1;
279
- --semantic-purple-500: #815BED;
280
- --semantic-purple-600: #7654D9;
281
- --semantic-purple-700: #5C41A9;
282
- --semantic-purple-800: #483383;
283
- --semantic-purple-900: #372764;
284
- --semantic-yellow-50: #FEF6E6;
285
- --semantic-yellow-100: #FBE2B3;
286
- --semantic-yellow-200: #F9D58E;
287
- --semantic-yellow-300: #F6C15A;
288
- --semantic-yellow-400: #F5B53A;
289
- --text-highemphasis: #1C1B20;
290
- --text-mediumemphasis: #6D6979;
291
- --text-lowemphasis: #9A98A3;
292
- --text-white: #FFFFFF;
293
- --text-primary: #815BED;
294
- --text-success: #33961F;
295
- --text-error: #BD271E;
296
- --icon-white: #FFFFFF;
297
- --semantic-yellow-500: #F2A209;
298
- --semantic-yellow-600: #DC9408;
299
- --semantic-yellow-700: #AC7406;
300
- --semantic-yellow-800: #855A05;
301
- --semantic-yellow-900: #664404;
302
- --structural-white: #FFFFFF;
303
- --icon-grey1: #757575;
304
- --structural-primarytint: #FBFAFF;
305
- --structural-neutral1: #F9F9F9;
306
- --structural-neutral2: #FFFAFA;
307
- --logo-color-primary: #7F56D9;
308
- --logo-color-secondary: #D6BBFB;
309
- }
310
-
311
- .ag-header {
312
- font-family: var(--font);
313
- font-size: 14px;
314
- font-weight: 400;
315
- height: 20px;
316
- line-height: 20px;
317
- }
318
-
319
- .ag-header-cell lib-grid-cell {
320
- width: 100%;
321
- }
322
-
323
- .ag-header-cell-label {
324
- font-family: var(--font);
325
- font-size: 14px;
326
- font-weight: 400;
327
- line-height: 20px;
328
- margin-left: 10px;
329
- }