igloo-d2c-components 1.0.27 → 1.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 (6) hide show
  1. package/dist/cjs/index.js +37 -0
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/esm/index.js +37 -0
  4. package/dist/esm/index.js.map +1 -1
  5. package/dist/types/themes/typography.d.ts +4 -0
  6. package/package.json +1 -1
package/dist/cjs/index.js CHANGED
@@ -113,11 +113,13 @@ const iglooTypography = {
113
113
  fontStyle: 'normal',
114
114
  fontWeight: 700,
115
115
  lineHeight: '48px',
116
+ wordSpacing: '-5px',
116
117
  '@media (max-width:600px)': {
117
118
  fontSize: '24px',
118
119
  fontStyle: 'normal',
119
120
  fontWeight: 700,
120
121
  lineHeight: '30px',
122
+ wordSpacing: '-5px',
121
123
  },
122
124
  },
123
125
  h2: {
@@ -125,11 +127,13 @@ const iglooTypography = {
125
127
  fontStyle: 'normal',
126
128
  fontWeight: 700,
127
129
  lineHeight: '26px',
130
+ wordSpacing: '-5px',
128
131
  '@media (max-width:600px)': {
129
132
  fontSize: '14px',
130
133
  fontStyle: 'normal',
131
134
  fontWeight: 700,
132
135
  lineHeight: '22px',
136
+ wordSpacing: '-5px',
133
137
  },
134
138
  },
135
139
  h3: {
@@ -137,11 +141,13 @@ const iglooTypography = {
137
141
  fontStyle: 'normal',
138
142
  fontWeight: 600,
139
143
  lineHeight: '24px',
144
+ wordSpacing: '-5px',
140
145
  '@media (max-width:600px)': {
141
146
  fontSize: '14px',
142
147
  fontStyle: 'normal',
143
148
  fontWeight: 600,
144
149
  lineHeight: '20px',
150
+ wordSpacing: '-5px',
145
151
  },
146
152
  },
147
153
  h4: {
@@ -149,11 +155,13 @@ const iglooTypography = {
149
155
  fontStyle: 'normal',
150
156
  fontWeight: 600,
151
157
  lineHeight: '24px',
158
+ wordSpacing: '-5px',
152
159
  '@media (max-width:600px)': {
153
160
  fontSize: '14px',
154
161
  fontStyle: 'normal',
155
162
  fontWeight: 500,
156
163
  lineHeight: '18px',
164
+ wordSpacing: '-5px',
157
165
  },
158
166
  },
159
167
  bodyStrongLarge: {
@@ -161,11 +169,13 @@ const iglooTypography = {
161
169
  fontStyle: 'normal',
162
170
  fontWeight: 500,
163
171
  lineHeight: '20px',
172
+ wordSpacing: '-5px',
164
173
  '@media (max-width:600px)': {
165
174
  fontSize: '14px',
166
175
  fontStyle: 'normal',
167
176
  fontWeight: 400,
168
177
  lineHeight: '18px',
178
+ wordSpacing: '-5px',
169
179
  },
170
180
  },
171
181
  bodyStrongMedium: {
@@ -173,23 +183,27 @@ const iglooTypography = {
173
183
  fontStyle: 'normal',
174
184
  fontWeight: 500,
175
185
  lineHeight: '18px',
186
+ wordSpacing: '-5px',
176
187
  },
177
188
  bodyStrongSmall: {
178
189
  fontSize: '12px',
179
190
  fontStyle: 'normal',
180
191
  fontWeight: 500,
181
192
  lineHeight: '16px',
193
+ wordSpacing: '-5px',
182
194
  },
183
195
  bodyLarge: {
184
196
  fontSize: '16px',
185
197
  fontStyle: 'normal',
186
198
  fontWeight: 400,
187
199
  lineHeight: '20px',
200
+ wordSpacing: '-5px',
188
201
  '@media (max-width:600px)': {
189
202
  fontSize: '14px',
190
203
  fontStyle: 'normal',
191
204
  fontWeight: 400,
192
205
  lineHeight: '18px',
206
+ wordSpacing: '-5px',
193
207
  },
194
208
  },
195
209
  bodyMedium: {
@@ -197,18 +211,21 @@ const iglooTypography = {
197
211
  fontStyle: 'normal',
198
212
  fontWeight: 400,
199
213
  lineHeight: '20px',
214
+ wordSpacing: '-5px',
200
215
  },
201
216
  bodySmall: {
202
217
  fontSize: '12px',
203
218
  fontStyle: 'normal',
204
219
  fontWeight: 400,
205
220
  lineHeight: '16px',
221
+ wordSpacing: '-5px',
206
222
  },
207
223
  smallText: {
208
224
  fontSize: '8px',
209
225
  fontStyle: 'normal',
210
226
  fontWeight: 500,
211
227
  lineHeight: '16px',
228
+ wordSpacing: '-5px',
212
229
  },
213
230
  };
214
231
  /**
@@ -264,6 +281,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
264
281
  fontWeight: 700,
265
282
  lineHeight: '72px',
266
283
  letterSpacing: 0,
284
+ wordSpacing: '-5px',
267
285
  },
268
286
  // Display Medium - MetLife Circular Bold 45/52
269
287
  displayMediumFigma: {
@@ -272,6 +290,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
272
290
  fontWeight: 700,
273
291
  lineHeight: '52px',
274
292
  letterSpacing: 0,
293
+ wordSpacing: '-5px',
275
294
  },
276
295
  // Display Small - MetLife Circular Bold 34/44
277
296
  displaySmallFigma: {
@@ -280,6 +299,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
280
299
  fontWeight: 700,
281
300
  lineHeight: '44px',
282
301
  letterSpacing: 0,
302
+ wordSpacing: '-5px',
283
303
  },
284
304
  /* ========================================
285
305
  * HEADLINE VARIANTS (PC/Desktop)
@@ -293,6 +313,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
293
313
  fontWeight: 700,
294
314
  lineHeight: '44px',
295
315
  letterSpacing: 0,
316
+ wordSpacing: '-5px',
296
317
  },
297
318
  // Headline Medium (H2) - MetLife Circular Bold 22/26
298
319
  headlineMedium: {
@@ -301,6 +322,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
301
322
  fontWeight: 700,
302
323
  lineHeight: '26px',
303
324
  letterSpacing: 0,
325
+ wordSpacing: '-5px',
304
326
  },
305
327
  // Headline Small (H3) - MetLife Circular Bold 18/24
306
328
  headlineSmall: {
@@ -309,6 +331,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
309
331
  fontWeight: 700,
310
332
  lineHeight: '24px',
311
333
  letterSpacing: 0,
334
+ wordSpacing: '-5px',
312
335
  },
313
336
  /* ========================================
314
337
  * TITLE VARIANTS (Mobile)
@@ -328,6 +351,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
328
351
  fontWeight: 700,
329
352
  lineHeight: '38px',
330
353
  letterSpacing: 0,
354
+ wordSpacing: '-5px',
331
355
  },
332
356
  // Title Medium (H2) - MetLife Circular Bold 16/24
333
357
  titleMedium: {
@@ -336,6 +360,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
336
360
  fontWeight: 700,
337
361
  lineHeight: '24px',
338
362
  letterSpacing: 0,
363
+ wordSpacing: '-5px',
339
364
  },
340
365
  // Title Small (H3) - MetLife Circular Bold 14/20
341
366
  titleSmall: {
@@ -344,12 +369,14 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
344
369
  fontWeight: 700,
345
370
  lineHeight: '20px',
346
371
  letterSpacing: 0,
372
+ wordSpacing: '-5px',
347
373
  }, titleTiny: {
348
374
  fontSize: '10px',
349
375
  fontStyle: 'normal',
350
376
  fontWeight: 700,
351
377
  lineHeight: '20px',
352
378
  letterSpacing: 0,
379
+ wordSpacing: '-5px',
353
380
  },
354
381
  /* ========================================
355
382
  * BODY STRONG VARIANTS
@@ -363,6 +390,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
363
390
  fontWeight: 500,
364
391
  lineHeight: '20px',
365
392
  letterSpacing: 0,
393
+ wordSpacing: '-5px',
366
394
  },
367
395
  // Body Medium Strong - MetLife Circular Medium 14/18
368
396
  bodyMediumStrong: {
@@ -371,6 +399,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
371
399
  fontWeight: 500,
372
400
  lineHeight: '18px',
373
401
  letterSpacing: 0,
402
+ wordSpacing: '-5px',
374
403
  },
375
404
  // Body Small Strong - MetLife Circular Medium 12/16
376
405
  bodySmallStrong: {
@@ -379,6 +408,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
379
408
  fontWeight: 500,
380
409
  lineHeight: '16px',
381
410
  letterSpacing: 0,
411
+ wordSpacing: '-5px',
382
412
  },
383
413
  /* ========================================
384
414
  * BODY VARIANTS
@@ -392,6 +422,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
392
422
  fontWeight: 400,
393
423
  lineHeight: '20px',
394
424
  letterSpacing: 0,
425
+ wordSpacing: '-5px',
395
426
  },
396
427
  // Body Medium - MetLife Circular Normal 14/18
397
428
  bodyMediumFigma: {
@@ -400,6 +431,7 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
400
431
  fontWeight: 400,
401
432
  lineHeight: '18px',
402
433
  letterSpacing: 0,
434
+ wordSpacing: '-5px',
403
435
  },
404
436
  // Body Small - MetLife Circular Normal 12/16
405
437
  bodySmallFigma: {
@@ -408,27 +440,32 @@ const ammetlifeTypography = Object.assign(Object.assign({}, iglooTypography), {
408
440
  fontWeight: 400,
409
441
  lineHeight: '16px',
410
442
  letterSpacing: 0,
443
+ wordSpacing: '-5px',
411
444
  }, bodyTinyFigma: {
412
445
  fontSize: '9px',
413
446
  fontStyle: 'normal',
414
447
  fontWeight: 400,
415
448
  lineHeight: 'normal',
416
449
  letterSpacing: 0,
450
+ wordSpacing: '-5px',
417
451
  }, textFieldMedium: {
418
452
  fontSize: '14px',
419
453
  fontStyle: 'normal',
420
454
  fontWeight: 500,
421
455
  lineHeight: '18px',
456
+ wordSpacing: '-5px',
422
457
  }, textFieldNormal: {
423
458
  fontSize: '12px',
424
459
  fontStyle: 'normal',
425
460
  fontWeight: 400,
426
461
  lineHeight: '16px',
462
+ wordSpacing: '-5px',
427
463
  }, optionButton: {
428
464
  fontSize: '14px',
429
465
  fontStyle: 'normal',
430
466
  fontWeight: 700,
431
467
  lineHeight: '20px',
468
+ wordSpacing: '-5px',
432
469
  } });
433
470
  /**
434
471
  * Typography Registry