origam 2.30.0 → 2.31.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.
- package/CHANGELOG.md +13 -0
- package/dist/src/assets/css/main.css +1 -1
- package/dist/src/assets/css/tokens/dark.css +12 -0
- package/dist/src/assets/css/tokens/light.css +6 -0
- package/dist/src/assets/scss/tokens/_dark.scss +12 -0
- package/dist/src/assets/scss/tokens/_light.scss +6 -0
- package/dist/src/components/Blockquote/OrigamBlockquote.vue +3 -1
- package/dist/src/components/Chip/OrigamChip.vue +13 -1
- package/dist/src/components/TextMask/OrigamTextMask.vue +3 -1
- package/dist/src/components/Title/OrigamTitle.vue +3 -1
- package/dist/src/composables/Commons/typography.composable.cjs +1 -1
- package/dist/src/composables/Commons/typography.composable.js +2 -1
- package/dist/src/enums/Commons/text-transform.enum.cjs +13 -0
- package/dist/src/enums/Commons/text-transform.enum.d.ts +13 -0
- package/dist/src/enums/Commons/text-transform.enum.js +7 -0
- package/dist/src/enums/index.cjs +11 -0
- package/dist/src/enums/index.d.ts +1 -0
- package/dist/src/enums/index.js +1 -0
- package/dist/src/interfaces/Chip/chip.interface.d.ts +1 -1
- package/dist/src/interfaces/Commons/typography.interface.d.ts +22 -3
- package/dist/src/types/Commons/text-transform.type.cjs +1 -0
- package/dist/src/types/Commons/text-transform.type.d.ts +9 -0
- package/dist/src/types/Commons/text-transform.type.js +0 -0
- package/dist/src/types/index.cjs +11 -0
- package/dist/src/types/index.d.ts +1 -0
- package/dist/src/types/index.js +1 -0
- package/dist/src/types/tokens.type.d.ts +1 -1
- package/package.json +1 -1
|
@@ -469,6 +469,9 @@
|
|
|
469
469
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
470
470
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
471
471
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
472
|
+
--origam-chip---font-family: initial;
|
|
473
|
+
--origam-chip---letter-spacing: initial;
|
|
474
|
+
--origam-chip---text-transform: initial;
|
|
472
475
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
473
476
|
--origam-chip---density: 0px;
|
|
474
477
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -2376,6 +2379,7 @@
|
|
|
2376
2379
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
2377
2380
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
2378
2381
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
2382
|
+
--origam-title---text-transform: initial;
|
|
2379
2383
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
2380
2384
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
2381
2385
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -2704,6 +2708,7 @@
|
|
|
2704
2708
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
2705
2709
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
2706
2710
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
2711
|
+
--origam-blockquote---text-transform: initial;
|
|
2707
2712
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
2708
2713
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
2709
2714
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -2888,6 +2893,7 @@
|
|
|
2888
2893
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
2889
2894
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
2890
2895
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
2896
|
+
--origam-text-mask---text-transform: initial;
|
|
2891
2897
|
--origam-text-mask__animation---duration-default: 3s;
|
|
2892
2898
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
2893
2899
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -3483,6 +3489,9 @@
|
|
|
3483
3489
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
3484
3490
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
3485
3491
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
3492
|
+
--origam-chip---font-family: initial;
|
|
3493
|
+
--origam-chip---letter-spacing: initial;
|
|
3494
|
+
--origam-chip---text-transform: initial;
|
|
3486
3495
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
3487
3496
|
--origam-chip---density: 0px;
|
|
3488
3497
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -5389,6 +5398,7 @@
|
|
|
5389
5398
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
5390
5399
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
5391
5400
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
5401
|
+
--origam-title---text-transform: initial;
|
|
5392
5402
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
5393
5403
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
5394
5404
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -5717,6 +5727,7 @@
|
|
|
5717
5727
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
5718
5728
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
5719
5729
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
5730
|
+
--origam-blockquote---text-transform: initial;
|
|
5720
5731
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
5721
5732
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
5722
5733
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -5901,6 +5912,7 @@
|
|
|
5901
5912
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
5902
5913
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
5903
5914
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
5915
|
+
--origam-text-mask---text-transform: initial;
|
|
5904
5916
|
--origam-text-mask__animation---duration-default: 3s;
|
|
5905
5917
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
5906
5918
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -369,6 +369,9 @@
|
|
|
369
369
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
370
370
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
371
371
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
372
|
+
--origam-chip---font-family: initial;
|
|
373
|
+
--origam-chip---letter-spacing: initial;
|
|
374
|
+
--origam-chip---text-transform: initial;
|
|
372
375
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
373
376
|
--origam-chip---density: 0px;
|
|
374
377
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -2290,6 +2293,7 @@
|
|
|
2290
2293
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
2291
2294
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
2292
2295
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
2296
|
+
--origam-title---text-transform: initial;
|
|
2293
2297
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
2294
2298
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
2295
2299
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -2618,6 +2622,7 @@
|
|
|
2618
2622
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
2619
2623
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
2620
2624
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
2625
|
+
--origam-blockquote---text-transform: initial;
|
|
2621
2626
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
2622
2627
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
2623
2628
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -2802,6 +2807,7 @@
|
|
|
2802
2807
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
2803
2808
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
2804
2809
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
2810
|
+
--origam-text-mask---text-transform: initial;
|
|
2805
2811
|
--origam-text-mask__animation---duration-default: 3s;
|
|
2806
2812
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
2807
2813
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -469,6 +469,9 @@
|
|
|
469
469
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
470
470
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
471
471
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
472
|
+
--origam-chip---font-family: initial;
|
|
473
|
+
--origam-chip---letter-spacing: initial;
|
|
474
|
+
--origam-chip---text-transform: initial;
|
|
472
475
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
473
476
|
--origam-chip---density: 0px;
|
|
474
477
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -2376,6 +2379,7 @@
|
|
|
2376
2379
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
2377
2380
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
2378
2381
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
2382
|
+
--origam-title---text-transform: initial;
|
|
2379
2383
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
2380
2384
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
2381
2385
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -2704,6 +2708,7 @@
|
|
|
2704
2708
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
2705
2709
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
2706
2710
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
2711
|
+
--origam-blockquote---text-transform: initial;
|
|
2707
2712
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
2708
2713
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
2709
2714
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -2888,6 +2893,7 @@
|
|
|
2888
2893
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
2889
2894
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
2890
2895
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
2896
|
+
--origam-text-mask---text-transform: initial;
|
|
2891
2897
|
--origam-text-mask__animation---duration-default: 3s;
|
|
2892
2898
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
2893
2899
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -3483,6 +3489,9 @@
|
|
|
3483
3489
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
3484
3490
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
3485
3491
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
3492
|
+
--origam-chip---font-family: initial;
|
|
3493
|
+
--origam-chip---letter-spacing: initial;
|
|
3494
|
+
--origam-chip---text-transform: initial;
|
|
3486
3495
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
3487
3496
|
--origam-chip---density: 0px;
|
|
3488
3497
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -5389,6 +5398,7 @@
|
|
|
5389
5398
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
5390
5399
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
5391
5400
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
5401
|
+
--origam-title---text-transform: initial;
|
|
5392
5402
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
5393
5403
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
5394
5404
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -5717,6 +5727,7 @@
|
|
|
5717
5727
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
5718
5728
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
5719
5729
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
5730
|
+
--origam-blockquote---text-transform: initial;
|
|
5720
5731
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
5721
5732
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
5722
5733
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -5901,6 +5912,7 @@
|
|
|
5901
5912
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
5902
5913
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
5903
5914
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
5915
|
+
--origam-text-mask---text-transform: initial;
|
|
5904
5916
|
--origam-text-mask__animation---duration-default: 3s;
|
|
5905
5917
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
5906
5918
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -369,6 +369,9 @@
|
|
|
369
369
|
--origam-chip---border-radius: var(--origam-radius---full);
|
|
370
370
|
--origam-chip---border-radius-label: var(--origam-radius---sm);
|
|
371
371
|
--origam-chip---font-weight: var(--origam-font__weight---regular);
|
|
372
|
+
--origam-chip---font-family: initial;
|
|
373
|
+
--origam-chip---letter-spacing: initial;
|
|
374
|
+
--origam-chip---text-transform: initial;
|
|
372
375
|
--origam-chip---opacity-disabled: var(--origam-opacity---32);
|
|
373
376
|
--origam-chip---density: 0px;
|
|
374
377
|
--origam-chip---overlay-opacity: var(--origam-opacity---0);
|
|
@@ -2290,6 +2293,7 @@
|
|
|
2290
2293
|
--origam-title---font-family: var(--origam-font__family---sans);
|
|
2291
2294
|
--origam-title---font-weight: var(--origam-font__weight---semibold);
|
|
2292
2295
|
--origam-title---letter-spacing: var(--origam-font__letterSpacing---tight);
|
|
2296
|
+
--origam-title---text-transform: initial;
|
|
2293
2297
|
--origam-title---line-height: var(--origam-font__lineHeight---tight);
|
|
2294
2298
|
--origam-title---margin-block-start: var(--origam-space---0);
|
|
2295
2299
|
--origam-title---margin-block-end: var(--origam-space---0);
|
|
@@ -2618,6 +2622,7 @@
|
|
|
2618
2622
|
--origam-blockquote---font-weight: var(--origam-font__weight---regular);
|
|
2619
2623
|
--origam-blockquote---line-height: var(--origam-font__lineHeight---relaxed);
|
|
2620
2624
|
--origam-blockquote---letter-spacing: var(--origam-font__letterSpacing---normal);
|
|
2625
|
+
--origam-blockquote---text-transform: initial;
|
|
2621
2626
|
--origam-blockquote---color: var(--origam-color__text---primary);
|
|
2622
2627
|
--origam-blockquote__accent---color: var(--origam-color__action--primary---bg);
|
|
2623
2628
|
--origam-blockquote__accent---width: 4px;
|
|
@@ -2802,6 +2807,7 @@
|
|
|
2802
2807
|
--origam-text-mask---font-size-default: var(--origam-font__size---5xl);
|
|
2803
2808
|
--origam-text-mask---font-weight-default: var(--origam-font__weight---bold);
|
|
2804
2809
|
--origam-text-mask---line-height-default: var(--origam-font__lineHeight---tight);
|
|
2810
|
+
--origam-text-mask---text-transform: initial;
|
|
2805
2811
|
--origam-text-mask__animation---duration-default: 3s;
|
|
2806
2812
|
--origam-text-mask__animation---easing-default: var(--origam-motion__easing---standard);
|
|
2807
2813
|
--origam-empty-state---padding-block: var(--origam-space---10);
|
|
@@ -135,7 +135,8 @@ const props = defineProps({
|
|
|
135
135
|
fontWeight: { type: null, required: false },
|
|
136
136
|
lineHeight: { type: null, required: false },
|
|
137
137
|
letterSpacing: { type: null, required: false },
|
|
138
|
-
fontStyle: { type: String, required: false }
|
|
138
|
+
fontStyle: { type: String, required: false },
|
|
139
|
+
textTransform: { type: null, required: false }
|
|
139
140
|
});
|
|
140
141
|
defineEmits([]);
|
|
141
142
|
defineSlots();
|
|
@@ -272,6 +273,7 @@ defineExpose({
|
|
|
272
273
|
font-weight: var(--origam-blockquote---resolved-font-weight);
|
|
273
274
|
line-height: var(--origam-blockquote---resolved-line-height);
|
|
274
275
|
letter-spacing: var(--origam-blockquote---resolved-letter-spacing);
|
|
276
|
+
text-transform: var(--origam-blockquote---text-transform, inherit);
|
|
275
277
|
color: var(--origam-blockquote---color, var(--origam-color__text---primary, #171717));
|
|
276
278
|
box-sizing: border-box;
|
|
277
279
|
}
|
|
@@ -245,8 +245,11 @@ const props = defineProps({
|
|
|
245
245
|
activeClass: { type: String, required: false },
|
|
246
246
|
hover: { type: [Boolean, Object], required: false },
|
|
247
247
|
hoverClass: { type: String, required: false },
|
|
248
|
+
fontFamily: { type: null, required: false },
|
|
248
249
|
fontSize: { type: null, required: false },
|
|
249
|
-
fontWeight: { type: null, required: false }
|
|
250
|
+
fontWeight: { type: null, required: false },
|
|
251
|
+
letterSpacing: { type: null, required: false },
|
|
252
|
+
textTransform: { type: null, required: false }
|
|
250
253
|
});
|
|
251
254
|
const emits = defineEmits(["update:modelValue", "click", "click:close", "click:append", "click:prepend", "group:selected"]);
|
|
252
255
|
defineSlots();
|
|
@@ -423,7 +426,16 @@ defineExpose({
|
|
|
423
426
|
// Pinning `content-box` here keeps the token math identical no
|
|
424
427
|
// matter which tag ends up on the root.
|
|
425
428
|
box-sizing: content-box;
|
|
429
|
+
// #1101 — `font-family` / `letter-spacing` : lus par le var GENERIQUE
|
|
430
|
+
// que `useTypography` emet en inline quand la prop est posee. Le
|
|
431
|
+
// generique n'est volontairement declare dans AUCUNE feuille (meme
|
|
432
|
+
// regle que `---font-size`) : un token statique porteur de ce nom
|
|
433
|
+
// gagnerait toujours et figerait la valeur heritee du contexte. Sans
|
|
434
|
+
// prop, le repli `inherit` laisse le chip heriter, comme avant.
|
|
435
|
+
font-family: var(--origam-chip---font-family, inherit);
|
|
426
436
|
font-weight: var(--origam-chip---font-weight, 400);
|
|
437
|
+
letter-spacing: var(--origam-chip---letter-spacing, inherit);
|
|
438
|
+
text-transform: var(--origam-chip---text-transform, inherit);
|
|
427
439
|
max-width: 100%;
|
|
428
440
|
min-width: 0;
|
|
429
441
|
overflow: hidden;
|
|
@@ -34,7 +34,8 @@ const props = defineProps({
|
|
|
34
34
|
fontWeight: { type: null, required: false },
|
|
35
35
|
lineHeight: { type: null, required: false },
|
|
36
36
|
letterSpacing: { type: null, required: false },
|
|
37
|
-
fontStyle: { type: String, required: false }
|
|
37
|
+
fontStyle: { type: String, required: false },
|
|
38
|
+
textTransform: { type: null, required: false }
|
|
38
39
|
});
|
|
39
40
|
defineEmits([]);
|
|
40
41
|
defineSlots();
|
|
@@ -89,6 +90,7 @@ defineExpose({
|
|
|
89
90
|
font-family: var(--origam-text-mask---font-family, inherit);
|
|
90
91
|
line-height: var(--origam-text-mask---line-height, var(--origam-text-mask---line-height-default));
|
|
91
92
|
letter-spacing: var(--origam-text-mask---letter-spacing, normal);
|
|
93
|
+
text-transform: var(--origam-text-mask---text-transform, inherit);
|
|
92
94
|
}
|
|
93
95
|
|
|
94
96
|
.origam-text-mask--align-left {
|
|
@@ -83,7 +83,8 @@ const props = defineProps({
|
|
|
83
83
|
fontWeight: { type: null, required: false },
|
|
84
84
|
lineHeight: { type: null, required: false },
|
|
85
85
|
letterSpacing: { type: null, required: false },
|
|
86
|
-
fontStyle: { type: String, required: false }
|
|
86
|
+
fontStyle: { type: String, required: false },
|
|
87
|
+
textTransform: { type: null, required: false }
|
|
87
88
|
});
|
|
88
89
|
const { filterProps } = useProps(props);
|
|
89
90
|
defineEmits([]);
|
|
@@ -137,6 +138,7 @@ defineExpose({
|
|
|
137
138
|
font-size: var(--origam-title---font-size, var(--origam-title---font-size-md));
|
|
138
139
|
font-weight: var(--origam-title---font-weight);
|
|
139
140
|
letter-spacing: var(--origam-title---letter-spacing);
|
|
141
|
+
text-transform: var(--origam-title---text-transform, inherit);
|
|
140
142
|
line-height: var(--origam-title---line-height);
|
|
141
143
|
// ⛔ #950 — zero-specificity default. `:where(&)` compiles to
|
|
142
144
|
// `:where(.origam-title[data-v-hash])` = (0,0,0), so the
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.useTypography = useTypography;
|
|
7
7
|
var _vue = require("vue");
|
|
8
8
|
const TYPOGRAPHY_TOKEN_MAP = [["fontFamily", "font-family", "font__family"], ["fontSize", "font-size", "font__size"], ["fontWeight", "font-weight", "font__weight"], ["lineHeight", "line-height", "font__lineHeight"], ["letterSpacing", "letter-spacing", "font__letterSpacing"]];
|
|
9
|
-
const TYPOGRAPHY_PASSTHROUGH_MAP = [["fontStyle", "font-style"]];
|
|
9
|
+
const TYPOGRAPHY_PASSTHROUGH_MAP = [["fontStyle", "font-style"], ["textTransform", "text-transform"]];
|
|
10
10
|
function useTypography(props, varPrefix) {
|
|
11
11
|
const typographyStyles = (0, _vue.computed)(() => {
|
|
12
12
|
const styles = {};
|
|
@@ -7,7 +7,8 @@ const TYPOGRAPHY_TOKEN_MAP = [
|
|
|
7
7
|
["letterSpacing", "letter-spacing", "font__letterSpacing"]
|
|
8
8
|
];
|
|
9
9
|
const TYPOGRAPHY_PASSTHROUGH_MAP = [
|
|
10
|
-
["fontStyle", "font-style"]
|
|
10
|
+
["fontStyle", "font-style"],
|
|
11
|
+
["textTransform", "text-transform"]
|
|
11
12
|
];
|
|
12
13
|
export function useTypography(props, varPrefix) {
|
|
13
14
|
const typographyStyles = computed(() => {
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TEXT_TRANSFORM = void 0;
|
|
7
|
+
var TEXT_TRANSFORM = exports.TEXT_TRANSFORM = /* @__PURE__ */(TEXT_TRANSFORM2 => {
|
|
8
|
+
TEXT_TRANSFORM2["NONE"] = "none";
|
|
9
|
+
TEXT_TRANSFORM2["UPPERCASE"] = "uppercase";
|
|
10
|
+
TEXT_TRANSFORM2["LOWERCASE"] = "lowercase";
|
|
11
|
+
TEXT_TRANSFORM2["CAPITALIZE"] = "capitalize";
|
|
12
|
+
return TEXT_TRANSFORM2;
|
|
13
|
+
})(TEXT_TRANSFORM || {});
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/*********************************************************
|
|
2
|
+
* TEXT_TRANSFORM
|
|
3
|
+
*
|
|
4
|
+
* @description
|
|
5
|
+
* Mots-cles `text-transform` acceptes par `ITypographyProps.textTransform`,
|
|
6
|
+
* emis verbatim (aucune echelle de design, aucun groupe de tokens).
|
|
7
|
+
********************************************************/
|
|
8
|
+
export declare enum TEXT_TRANSFORM {
|
|
9
|
+
NONE = "none",
|
|
10
|
+
UPPERCASE = "uppercase",
|
|
11
|
+
LOWERCASE = "lowercase",
|
|
12
|
+
CAPITALIZE = "capitalize"
|
|
13
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export var TEXT_TRANSFORM = /* @__PURE__ */ ((TEXT_TRANSFORM2) => {
|
|
2
|
+
TEXT_TRANSFORM2["NONE"] = "none";
|
|
3
|
+
TEXT_TRANSFORM2["UPPERCASE"] = "uppercase";
|
|
4
|
+
TEXT_TRANSFORM2["LOWERCASE"] = "lowercase";
|
|
5
|
+
TEXT_TRANSFORM2["CAPITALIZE"] = "capitalize";
|
|
6
|
+
return TEXT_TRANSFORM2;
|
|
7
|
+
})(TEXT_TRANSFORM || {});
|
package/dist/src/enums/index.cjs
CHANGED
|
@@ -553,6 +553,17 @@ Object.keys(_letterSpacing).forEach(function (key) {
|
|
|
553
553
|
}
|
|
554
554
|
});
|
|
555
555
|
});
|
|
556
|
+
var _textTransform = require("./Commons/text-transform.enum.cjs");
|
|
557
|
+
Object.keys(_textTransform).forEach(function (key) {
|
|
558
|
+
if (key === "default" || key === "__esModule") return;
|
|
559
|
+
if (key in exports && exports[key] === _textTransform[key]) return;
|
|
560
|
+
Object.defineProperty(exports, key, {
|
|
561
|
+
enumerable: true,
|
|
562
|
+
get: function () {
|
|
563
|
+
return _textTransform[key];
|
|
564
|
+
}
|
|
565
|
+
});
|
|
566
|
+
});
|
|
556
567
|
var _lineHeight = require("./Commons/line-height.enum.cjs");
|
|
557
568
|
Object.keys(_lineHeight).forEach(function (key) {
|
|
558
569
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -48,6 +48,7 @@ export * from './Commons/font-family.enum';
|
|
|
48
48
|
export * from './Commons/font-size.enum';
|
|
49
49
|
export * from './Commons/font-weight.enum';
|
|
50
50
|
export * from './Commons/letter-spacing.enum';
|
|
51
|
+
export * from './Commons/text-transform.enum';
|
|
51
52
|
export * from './Commons/line-height.enum';
|
|
52
53
|
export * from './Commons/loader.enum';
|
|
53
54
|
export * from './Commons/theme.enum';
|
package/dist/src/enums/index.js
CHANGED
|
@@ -48,6 +48,7 @@ export * from "./Commons/font-family.enum.js";
|
|
|
48
48
|
export * from "./Commons/font-size.enum.js";
|
|
49
49
|
export * from "./Commons/font-weight.enum.js";
|
|
50
50
|
export * from "./Commons/letter-spacing.enum.js";
|
|
51
|
+
export * from "./Commons/text-transform.enum.js";
|
|
51
52
|
export * from "./Commons/line-height.enum.js";
|
|
52
53
|
export * from "./Commons/loader.enum.js";
|
|
53
54
|
export * from "./Commons/theme.enum.js";
|
|
@@ -15,7 +15,7 @@ import type { IRoundedProps } from '../Commons/rounded.interface';
|
|
|
15
15
|
import type { ISizeProps } from '../Commons/size.interface';
|
|
16
16
|
import type { ITypographyProps } from '../Commons/typography.interface';
|
|
17
17
|
import type { TIcon } from '../../types/Icon/icon.type';
|
|
18
|
-
export interface IChipProps extends ICommonsComponentProps, IAdjacentProps, ITagProps, IColorProps, IBgColorProps, IRippleProps, IBorderProps, IRoundedProps, IPaddingProps, IMarginProps, IDensityProps, IGroupItemProps, ILinkProps, ISizeProps, IElevationProps, IActiveProps, IHoverProps, Pick<ITypographyProps, 'fontSize' | 'fontWeight'> {
|
|
18
|
+
export interface IChipProps extends ICommonsComponentProps, IAdjacentProps, ITagProps, IColorProps, IBgColorProps, IRippleProps, IBorderProps, IRoundedProps, IPaddingProps, IMarginProps, IDensityProps, IGroupItemProps, ILinkProps, ISizeProps, IElevationProps, IActiveProps, IHoverProps, Pick<ITypographyProps, 'fontFamily' | 'fontSize' | 'fontWeight' | 'letterSpacing' | 'textTransform'> {
|
|
19
19
|
closable?: boolean;
|
|
20
20
|
closeIcon?: TIcon;
|
|
21
21
|
closeLabel?: string;
|
|
@@ -3,6 +3,7 @@ import type { TFontSize } from '../../types/Commons/font-size.type';
|
|
|
3
3
|
import type { TFontWeight } from '../../types/Commons/font-weight.type';
|
|
4
4
|
import type { TLetterSpacing } from '../../types/Commons/letter-spacing.type';
|
|
5
5
|
import type { TLineHeight } from '../../types/Commons/line-height.type';
|
|
6
|
+
import type { TTextTransform } from '../../types/Commons/text-transform.type';
|
|
6
7
|
/**
|
|
7
8
|
* Cross-cutting typography surface — the font equivalent of
|
|
8
9
|
* `IColorProps` / `IBorderProps` / `IMarginProps`. Every prop is optional
|
|
@@ -11,9 +12,9 @@ import type { TLineHeight } from '../../types/Commons/line-height.type';
|
|
|
11
12
|
* emitted).
|
|
12
13
|
*
|
|
13
14
|
* The first FIVE props are primitive font token KEYS, wrapped into
|
|
14
|
-
* `var(--origam-font__{group}---{value})`. `fontStyle`
|
|
15
|
-
*
|
|
16
|
-
* design scale — see
|
|
15
|
+
* `var(--origam-font__{group}---{value})`. `fontStyle` and `textTransform`
|
|
16
|
+
* are PASSTHROUGHS: CSS keywords emitted verbatim, because neither
|
|
17
|
+
* `font-style` nor `text-transform` has a design scale — see their notes below.
|
|
17
18
|
*
|
|
18
19
|
* | Prop | CSS property | Primitive token group |
|
|
19
20
|
* |-----------------|-------------------|------------------------------|
|
|
@@ -23,6 +24,7 @@ import type { TLineHeight } from '../../types/Commons/line-height.type';
|
|
|
23
24
|
* | `lineHeight` | `line-height` | `--origam-font__lineHeight---*` |
|
|
24
25
|
* | `letterSpacing` | `letter-spacing` | `--origam-font__letterSpacing---*` |
|
|
25
26
|
* | `fontStyle` | `font-style` | *none — passthrough, see below* |
|
|
27
|
+
* | `textTransform` | `text-transform` | *none — passthrough, see below* |
|
|
26
28
|
*
|
|
27
29
|
* Collision-free names by design: `fontSize` / `fontWeight` / `fontFamily`
|
|
28
30
|
* (not `size` / `weight` / `family`) so the surface composes with
|
|
@@ -97,4 +99,21 @@ export interface ITypographyProps {
|
|
|
97
99
|
* forcer un effet sans le signaler.
|
|
98
100
|
********************************************************/
|
|
99
101
|
fontStyle?: string;
|
|
102
|
+
/*********************************************************
|
|
103
|
+
* textTransform
|
|
104
|
+
*
|
|
105
|
+
* @description
|
|
106
|
+
* Casse du texte (`none` · `uppercase` · `lowercase` · `capitalize`),
|
|
107
|
+
* emise LITTERALEMENT dans `--origam-{prefix}---text-transform`.
|
|
108
|
+
* Second membre PASSTHROUGH : `text-transform` est un mot-cle CSS, pas
|
|
109
|
+
* un echelon d'echelle, et aucun groupe `--origam-font__textTransform---*`
|
|
110
|
+
* n'existe.
|
|
111
|
+
*
|
|
112
|
+
* @description
|
|
113
|
+
* ⚠️ N'a d'EFFET que si la SCSS du composant lit le var GENERIQUE
|
|
114
|
+
* `--origam-{prefix}---text-transform`. Adoptants : `OrigamChip`, `OrigamTitle`, `OrigamTextMask`, `OrigamBlockquote`.
|
|
115
|
+
* Ne pas ajouter la prop a un autre composant sans cabler sa SCSS ET
|
|
116
|
+
* prouver l'effet en navigateur.
|
|
117
|
+
********************************************************/
|
|
118
|
+
textTransform?: TTextTransform;
|
|
100
119
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { TEXT_TRANSFORM } from '../../enums/Commons/text-transform.enum';
|
|
2
|
+
/*********************************************************
|
|
3
|
+
* TTextTransform
|
|
4
|
+
*
|
|
5
|
+
* @description
|
|
6
|
+
* Mots-cles `text-transform` (none · uppercase · lowercase · capitalize),
|
|
7
|
+
* emis verbatim, sans groupe de tokens.
|
|
8
|
+
********************************************************/
|
|
9
|
+
export type TTextTransform = `${TEXT_TRANSFORM}`;
|
|
File without changes
|
package/dist/src/types/index.cjs
CHANGED
|
@@ -564,6 +564,17 @@ Object.keys(_letterSpacing).forEach(function (key) {
|
|
|
564
564
|
}
|
|
565
565
|
});
|
|
566
566
|
});
|
|
567
|
+
var _textTransform = require("./Commons/text-transform.type.cjs");
|
|
568
|
+
Object.keys(_textTransform).forEach(function (key) {
|
|
569
|
+
if (key === "default" || key === "__esModule") return;
|
|
570
|
+
if (key in exports && exports[key] === _textTransform[key]) return;
|
|
571
|
+
Object.defineProperty(exports, key, {
|
|
572
|
+
enumerable: true,
|
|
573
|
+
get: function () {
|
|
574
|
+
return _textTransform[key];
|
|
575
|
+
}
|
|
576
|
+
});
|
|
577
|
+
});
|
|
567
578
|
var _lineHeight = require("./Commons/line-height.type.cjs");
|
|
568
579
|
Object.keys(_lineHeight).forEach(function (key) {
|
|
569
580
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -49,6 +49,7 @@ export * from './Commons/font-family.type';
|
|
|
49
49
|
export * from './Commons/font-size.type';
|
|
50
50
|
export * from './Commons/font-weight.type';
|
|
51
51
|
export * from './Commons/letter-spacing.type';
|
|
52
|
+
export * from './Commons/text-transform.type';
|
|
52
53
|
export * from './Commons/line-height.type';
|
|
53
54
|
export * from './Commons/rounded.type';
|
|
54
55
|
export * from './Commons/dimension.type';
|
package/dist/src/types/index.js
CHANGED
|
@@ -49,6 +49,7 @@ export * from "./Commons/font-family.type.js";
|
|
|
49
49
|
export * from "./Commons/font-size.type.js";
|
|
50
50
|
export * from "./Commons/font-weight.type.js";
|
|
51
51
|
export * from "./Commons/letter-spacing.type.js";
|
|
52
|
+
export * from "./Commons/text-transform.type.js";
|
|
52
53
|
export * from "./Commons/line-height.type.js";
|
|
53
54
|
export * from "./Commons/rounded.type.js";
|
|
54
55
|
export * from "./Commons/dimension.type.js";
|