@xsolla/switch-theme-customization 0.161.3-pr315.1779889787 → 0.162.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/index.js CHANGED
@@ -30,23 +30,14 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
30
  // src/index.ts
31
31
  var index_exports = {};
32
32
  __export(index_exports, {
33
- DELETED_LEGACY_TYPO_VARS: () => DELETED_LEGACY_TYPO_VARS,
34
- PentagramResolver: () => PentagramResolver,
35
33
  base: () => base10,
36
34
  baseDark: () => baseDark,
37
- buildBaseColorsFromPentagram: () => buildBaseColorsFromPentagram,
38
35
  createDarkScheme: () => createDarkScheme,
39
- createResolver: () => createResolver,
40
36
  createScheme: () => createScheme,
41
37
  emails: () => emails,
42
38
  emailsDark: () => emailsDark,
43
39
  emailsThemes: () => emailsThemes,
44
- flattenPentagramShapeToVars: () => flattenPentagramShapeToVars,
45
40
  generateWithScheme: () => generateWithScheme,
46
- mapHandCraftedPentagramToLegacy: () => mapHandCraftedPentagramToLegacy,
47
- mapPentagramShapeToLegacy: () => mapPentagramShapeToLegacy,
48
- mapPentagramThemeToLegacy: () => mapPentagramThemeToLegacy,
49
- mapPentagramTypoToLegacy: () => mapPentagramTypoToLegacy,
50
41
  palettes: () => palettes,
51
42
  payStationDarkScheme: () => payStationDarkScheme,
52
43
  payStationScheme: () => payStationScheme,
@@ -54,23 +45,17 @@ __export(index_exports, {
54
45
  paystation4Dark: () => paystation4Dark,
55
46
  paystation4Gaijin: () => paystation4Gaijin,
56
47
  paystation4Nexters: () => paystation4Nexters,
57
- paystation4PentagramDark: () => paystation4PentagramDark,
58
- paystation4PentagramLight: () => paystation4PentagramLight,
59
48
  paystation4Take2: () => paystation4Take2,
60
49
  paystation4Themes: () => paystation4Themes,
61
50
  primaryPalette: () => primaryPalette,
62
51
  publisherV2: () => publisherV2,
63
52
  publisherV2Dark: () => publisherV2Dark,
64
53
  publisherV2Themes: () => publisherV2Themes,
65
- resolveForDesktop: () => resolveForDesktop,
66
- resolveForMobile: () => resolveForMobile,
67
- shapePrimitives: () => shape_primitives_default,
68
54
  themeGenerator: () => themeGenerator,
69
55
  themes: () => themes,
70
56
  themesBaseColors: () => themesBaseColors,
71
57
  themesBaseColorsArray: () => themesBaseColorsArray,
72
- themesColorsScheme: () => themesColorsScheme,
73
- typoPrimitives: () => typo_primitives_default
58
+ themesColorsScheme: () => themesColorsScheme
74
59
  });
75
60
  module.exports = __toCommonJS(index_exports);
76
61
 
@@ -1978,6 +1963,41 @@ var publisherV2Themes = {
1978
1963
  dark: publisherV2Dark
1979
1964
  };
1980
1965
 
1966
+ // src/themes/baseColors.ts
1967
+ var themesBaseColorsArray = [
1968
+ { theme: "publisherV2", baseColors: base8 },
1969
+ { theme: "publisherV2Dark", baseColors: base9 },
1970
+ { theme: "paystation4", baseColors: base2 },
1971
+ { theme: "paystation4Dark", baseColors: base },
1972
+ { theme: "paystation4Take2", baseColors: base3 },
1973
+ { theme: "paystation4Gaijin", baseColors: base4 },
1974
+ { theme: "paystation4Nexters", baseColors: base5 },
1975
+ { theme: "emails", baseColors: base7 },
1976
+ { theme: "emailsDark", baseColors: base6 }
1977
+ ];
1978
+ var themesBaseColors = {
1979
+ publisherV2: base8,
1980
+ publisherV2Dark: base9,
1981
+ paystation4: base2,
1982
+ paystation4Dark: base,
1983
+ paystation4Take2: base3,
1984
+ paystation4Gaijin: base4,
1985
+ paystation4Nexters: base5,
1986
+ emails: base7,
1987
+ emailsDark: base6
1988
+ };
1989
+ var themesColorsScheme = {
1990
+ publisherV2: publisherV2LightScheme,
1991
+ publisherV2Dark: publisherV2DarkScheme,
1992
+ paystation4: ps4LightScheme,
1993
+ paystation4Dark: ps4DarkScheme,
1994
+ paystation4Take2: ps4Take2Scheme,
1995
+ paystation4Gaijin: ps4GaijinScheme,
1996
+ paystation4Nexters: ps4NextersScheme,
1997
+ emails: emailsLightScheme,
1998
+ emailsDark: emailsDarkScheme
1999
+ };
2000
+
1981
2001
  // src/themes/pentagram/presets/pay-station-dark.ts
1982
2002
  var import_colord10 = require("colord");
1983
2003
  var baseDark = {
@@ -2642,201 +2662,6 @@ var createScheme = (b) => ({
2642
2662
  });
2643
2663
  var payStationScheme = createScheme(base10);
2644
2664
 
2645
- // src/themes/pentagram/mappers/scheme-to-legacy.ts
2646
- function mapThemeSchemeToLegacy(scheme) {
2647
- return {
2648
- core: {
2649
- background: {
2650
- primary: scheme.background.primary,
2651
- secondary: scheme.layer.float,
2652
- ghost: scheme.overlay.mono,
2653
- tone: scheme.layer.scrim,
2654
- selection: "transparent",
2655
- // deleted in Pentagram
2656
- hover: "transparent",
2657
- // deleted in Pentagram
2658
- brand: scheme.background.brand.secondary,
2659
- brandSecondary: scheme.background.brandExtra.secondary,
2660
- success: scheme.background.success.secondary,
2661
- warning: scheme.background.warning.secondary,
2662
- alert: scheme.background.alert.secondary,
2663
- neutral: scheme.background.neutral.secondary
2664
- },
2665
- divider: {
2666
- divider: scheme.border.secondary
2667
- },
2668
- text: {
2669
- primary: scheme.content.primary,
2670
- secondary: scheme.content.secondary,
2671
- tertiary: scheme.content.tertiary,
2672
- brand: scheme.content.brand.primary,
2673
- brandSecondary: scheme.content.brandExtra.primary,
2674
- success: scheme.content.success.primary,
2675
- warning: scheme.content.warning.primary,
2676
- alert: scheme.content.alert.primary,
2677
- neutral: scheme.content.neutral.primary
2678
- },
2679
- link: {
2680
- link: scheme.control.link.primary,
2681
- linkHover: scheme.control.link.primaryHover,
2682
- linkMinor: scheme.control.link.secondary,
2683
- linkMinorHover: scheme.control.link.secondaryHover
2684
- }
2685
- },
2686
- control: {
2687
- primary: {
2688
- bg: scheme.control.brand.primary.bg,
2689
- bgHover: scheme.control.brand.primary.bgHover,
2690
- bgPress: scheme.control.brand.primary.bgPress,
2691
- bgDisabled: scheme.control.brand.primary.bgDisable,
2692
- border: scheme.control.brand.primary.border,
2693
- borderHover: scheme.control.brand.primary.borderHover,
2694
- borderPress: scheme.control.brand.primary.borderPress
2695
- },
2696
- secondary: {
2697
- bg: scheme.control.brand.secondary.bg,
2698
- bgHover: scheme.control.brand.secondary.bgHover,
2699
- bgPress: scheme.control.brand.secondary.bgPress,
2700
- border: scheme.control.brand.secondary.border,
2701
- borderHover: scheme.control.brand.secondary.borderHover,
2702
- borderPress: scheme.control.brand.secondary.borderPress
2703
- },
2704
- default: {
2705
- bg: scheme.control.mono.primary.bg,
2706
- bgHover: scheme.control.mono.primary.bgHover,
2707
- bgPress: scheme.control.mono.primary.bgPress,
2708
- border: scheme.control.mono.primary.border,
2709
- borderHover: scheme.control.mono.primary.borderHover,
2710
- borderPress: scheme.control.mono.primary.borderPress
2711
- },
2712
- input: {
2713
- bg: scheme.control.input.bg,
2714
- bgHover: scheme.control.input.bgHover,
2715
- bgDisabled: scheme.control.input.bgDisable,
2716
- border: scheme.control.input.border,
2717
- borderHover: scheme.control.input.borderHover,
2718
- borderDisabled: scheme.control.input.borderDisable,
2719
- text: scheme.control.input.text,
2720
- textDisabled: scheme.control.input.textDisable,
2721
- placeholder: scheme.control.input.placeholder
2722
- },
2723
- focus: {
2724
- bg: scheme.control.focus.bg,
2725
- border: scheme.control.focus.border
2726
- },
2727
- alert: {
2728
- bg: scheme.control.alert.secondary.bg,
2729
- bgHover: scheme.control.alert.secondary.bgHover,
2730
- bgPress: scheme.control.alert.secondary.bgPress,
2731
- border: scheme.control.alert.secondary.border,
2732
- borderHover: scheme.control.alert.secondary.borderHover,
2733
- borderPress: scheme.control.alert.secondary.borderPress
2734
- },
2735
- check: {
2736
- bg: scheme.control.check.bg,
2737
- bgHover: scheme.control.check.bgHover,
2738
- bgDisabled: scheme.control.check.bgDisable
2739
- },
2740
- faint: {
2741
- bg: scheme.control.faint.bg,
2742
- bgHover: scheme.control.faint.bgHover,
2743
- border: scheme.control.faint.border,
2744
- borderHover: scheme.control.faint.borderHover
2745
- },
2746
- toggle: {
2747
- bg: scheme.control.switch.bg,
2748
- bgHover: scheme.control.switch.bgHover
2749
- },
2750
- text: {
2751
- active: scheme.control.brand.text.primary,
2752
- secondary: scheme.control.brand.text.secondary,
2753
- default: scheme.control.mono.text.primary,
2754
- primary: scheme.control.text.primary,
2755
- disabled: scheme.control.brand.text.disable,
2756
- faint: scheme.control.check.icon,
2757
- alert: scheme.control.alert.text.secondary
2758
- }
2759
- }
2760
- };
2761
- }
2762
-
2763
- // src/themes/pentagram/pentagram.ts
2764
- function convertToLegacyBase(pentagramBase) {
2765
- return {
2766
- content: pentagramBase.content.toRgbString(),
2767
- // Primary content color
2768
- surface: pentagramBase.background.toRgbString(),
2769
- // Background/surface color
2770
- project: pentagramBase.brand.toRgbString(),
2771
- // Primary brand color
2772
- accent: pentagramBase.brandExtra.toRgbString(),
2773
- // Secondary brand color
2774
- phantom: pentagramBase.mono.toRgbString(),
2775
- // Neutral/mono color
2776
- path: pentagramBase.brand.toRgbString(),
2777
- // Path color (same as brand)
2778
- success: pentagramBase.success.toRgbString(),
2779
- warning: pentagramBase.warning.toRgbString(),
2780
- alert: pentagramBase.alert.toRgbString(),
2781
- neutral: pentagramBase.neutral.toRgbString()
2782
- };
2783
- }
2784
- var paystation4PentagramLight = {
2785
- colors: {
2786
- base: convertToLegacyBase(base10),
2787
- ...mapThemeSchemeToLegacy(payStationScheme)
2788
- },
2789
- typo,
2790
- misc,
2791
- shadows,
2792
- globalStyle: "pentagram"
2793
- };
2794
- var paystation4PentagramDark = {
2795
- colors: {
2796
- base: convertToLegacyBase(baseDark),
2797
- ...mapThemeSchemeToLegacy(payStationDarkScheme)
2798
- },
2799
- typo,
2800
- misc,
2801
- shadows,
2802
- globalStyle: "pentagram"
2803
- };
2804
-
2805
- // src/themes/baseColors.ts
2806
- var themesBaseColorsArray = [
2807
- { theme: "publisherV2", baseColors: base8 },
2808
- { theme: "publisherV2Dark", baseColors: base9 },
2809
- { theme: "paystation4", baseColors: base2 },
2810
- { theme: "paystation4Dark", baseColors: base },
2811
- { theme: "paystation4Take2", baseColors: base3 },
2812
- { theme: "paystation4Gaijin", baseColors: base4 },
2813
- { theme: "paystation4Nexters", baseColors: base5 },
2814
- { theme: "emails", baseColors: base7 },
2815
- { theme: "emailsDark", baseColors: base6 }
2816
- ];
2817
- var themesBaseColors = {
2818
- publisherV2: base8,
2819
- publisherV2Dark: base9,
2820
- paystation4: base2,
2821
- paystation4Dark: base,
2822
- paystation4Take2: base3,
2823
- paystation4Gaijin: base4,
2824
- paystation4Nexters: base5,
2825
- emails: base7,
2826
- emailsDark: base6
2827
- };
2828
- var themesColorsScheme = {
2829
- publisherV2: publisherV2LightScheme,
2830
- publisherV2Dark: publisherV2DarkScheme,
2831
- paystation4: ps4LightScheme,
2832
- paystation4Dark: ps4DarkScheme,
2833
- paystation4Take2: ps4Take2Scheme,
2834
- paystation4Gaijin: ps4GaijinScheme,
2835
- paystation4Nexters: ps4NextersScheme,
2836
- emails: emailsLightScheme,
2837
- emailsDark: emailsDarkScheme
2838
- };
2839
-
2840
2665
  // src/themes/index.ts
2841
2666
  var themes = {
2842
2667
  paystation4,
@@ -2847,9 +2672,7 @@ var themes = {
2847
2672
  emails,
2848
2673
  emailsDark,
2849
2674
  publisherV2,
2850
- publisherV2Dark,
2851
- paystation4PentagramLight,
2852
- paystation4PentagramDark
2675
+ publisherV2Dark
2853
2676
  };
2854
2677
 
2855
2678
  // src/palettes/primaryPalette.ts
@@ -3105,1062 +2928,16 @@ var applyPentagramColors = (schemeBase, overrides) => {
3105
2928
  });
3106
2929
  return result;
3107
2930
  };
3108
-
3109
- // src/pentagram-to-legacy/pentagram-resolver.ts
3110
- var FONT_SIZE_SCALE = {
3111
- "75": { desktop: "10px", mobile: "10px" },
3112
- "100": { desktop: "12px", mobile: "11px" },
3113
- "125": { desktop: "14px", mobile: "12px" },
3114
- "150": { desktop: "16px", mobile: "14px" },
3115
- "175": { desktop: "18px", mobile: "16px" },
3116
- "200": { desktop: "20px", mobile: "18px" },
3117
- "250": { desktop: "24px", mobile: "20px" },
3118
- "300": { desktop: "28px", mobile: "24px" },
3119
- "350": { desktop: "32px", mobile: "28px" },
3120
- "450": { desktop: "40px", mobile: "32px" },
3121
- "550": { desktop: "48px", mobile: "40px" },
3122
- "650": { desktop: "56px", mobile: "48px" },
3123
- "750": { desktop: "64px", mobile: "56px" }
3124
- };
3125
- var LINE_HEIGHT_DISPLAY = {
3126
- "75": { desktop: "10px", mobile: "10px" },
3127
- "100": { desktop: "12px", mobile: "11px" },
3128
- "125": { desktop: "14px", mobile: "12px" },
3129
- "150": { desktop: "16px", mobile: "14px" },
3130
- "175": { desktop: "18px", mobile: "16px" },
3131
- "200": { desktop: "20px", mobile: "18px" },
3132
- "250": { desktop: "24px", mobile: "20px" },
3133
- "300": { desktop: "28px", mobile: "24px" },
3134
- "350": { desktop: "32px", mobile: "28px" },
3135
- "450": { desktop: "40px", mobile: "32px" },
3136
- "550": { desktop: "48px", mobile: "40px" },
3137
- "650": { desktop: "56px", mobile: "48px" },
3138
- "750": { desktop: "64px", mobile: "56px" }
3139
- };
3140
- var LINE_HEIGHT_COMPACT = {
3141
- "75": { desktop: "14px", mobile: "13px" },
3142
- "100": { desktop: "16px", mobile: "14px" },
3143
- "125": { desktop: "18px", mobile: "16px" },
3144
- "150": { desktop: "20px", mobile: "18px" },
3145
- "175": { desktop: "24px", mobile: "20px" },
3146
- "200": { desktop: "26px", mobile: "24px" },
3147
- "250": { desktop: "30px", mobile: "26px" },
3148
- "300": { desktop: "36px", mobile: "30px" },
3149
- "350": { desktop: "42px", mobile: "36px" },
3150
- "450": { desktop: "52px", mobile: "42px" },
3151
- "550": { desktop: "62px", mobile: "52px" },
3152
- "650": { desktop: "72px", mobile: "62px" },
3153
- "750": { desktop: "82px", mobile: "72px" }
3154
- };
3155
- var LINE_HEIGHT_TEXT = {
3156
- "75": { desktop: "14px", mobile: "13px" },
3157
- "100": { desktop: "18px", mobile: "14px" },
3158
- "125": { desktop: "20px", mobile: "16px" },
3159
- "150": { desktop: "22px", mobile: "18px" },
3160
- "175": { desktop: "26px", mobile: "20px" },
3161
- "200": { desktop: "28px", mobile: "24px" },
3162
- "250": { desktop: "34px", mobile: "26px" },
3163
- "300": { desktop: "40px", mobile: "30px" },
3164
- "350": { desktop: "44px", mobile: "36px" },
3165
- "450": { desktop: "56px", mobile: "42px" },
3166
- "550": { desktop: "66px", mobile: "52px" },
3167
- "650": { desktop: "78px", mobile: "62px" },
3168
- "750": { desktop: "88px", mobile: "72px" }
3169
- };
3170
- var TYPOGRAPHY_SCALE_FONT_SIZE = {
3171
- "200": "10px",
3172
- "300": "12px",
3173
- "400": "14px",
3174
- "500": "16px",
3175
- "600": "18px"
3176
- };
3177
- var TYPOGRAPHY_SCALE_LINE_HEIGHT = {
3178
- "200": "16px",
3179
- "300": "18px",
3180
- "400": "20px",
3181
- "500": "22px",
3182
- "600": "24px"
3183
- };
3184
- var SPACING_SCALE = {
3185
- "50": "2px",
3186
- "75": "4px",
3187
- "100": "6px",
3188
- "150": "8px",
3189
- "200": "10px",
3190
- "250": "12px",
3191
- "300": "16px",
3192
- "400": "20px",
3193
- "500": "24px",
3194
- "600": "32px",
3195
- "800": "48px",
3196
- "1000": "64px"
3197
- };
3198
- var FONT_FAMILY = {
3199
- compact: "'Aktiv Grotesk', sans-serif",
3200
- display: "'Pilat Wide', 'Aktiv Grotesk', sans-serif",
3201
- text: "'Aktiv Grotesk', sans-serif"
3202
- };
3203
- var RADIUS_SCALE = {
3204
- "25": "2px",
3205
- "50": "4px",
3206
- "75": "6px",
3207
- "100": "8px",
3208
- "150": "12px",
3209
- "200": "16px",
3210
- "999": "999px"
3211
- };
3212
- var STROKE_SCALE = {
3213
- "1": "1px",
3214
- "2": "2px",
3215
- "3": "3px"
3216
- };
3217
- var PentagramResolver = class {
3218
- viewport;
3219
- constructor(viewport = "desktop") {
3220
- this.viewport = viewport;
3221
- }
3222
- setViewport(viewport) {
3223
- this.viewport = viewport;
3224
- }
3225
- /**
3226
- * Resolve a single alias to a concrete value.
3227
- *
3228
- * @param alias - Alias string like "300" (fontSize), "display/300" (lineHeight), or "radius/100"
3229
- * @param context - Optional context hint: 'fontSize' or 'lineHeight'
3230
- * @returns Resolved value (e.g., "28px") or original if not an alias
3231
- */
3232
- resolve(alias, context) {
3233
- if (typeof alias !== "string") {
3234
- return alias;
3235
- }
3236
- if (this.isResolved(alias)) {
3237
- return alias;
3238
- }
3239
- if (/^\d+$/.test(alias) && context !== "lineHeight") {
3240
- const value = FONT_SIZE_SCALE[alias];
3241
- return value ? value[this.viewport] : alias;
3242
- }
3243
- if (alias.startsWith("display/")) {
3244
- const step = alias.replace("display/", "");
3245
- const value = LINE_HEIGHT_DISPLAY[step];
3246
- return value ? value[this.viewport] : alias;
3247
- }
3248
- if (alias.startsWith("compact/")) {
3249
- const step = alias.replace("compact/", "");
3250
- const value = LINE_HEIGHT_COMPACT[step];
3251
- return value ? value[this.viewport] : alias;
3252
- }
3253
- if (alias.startsWith("text/")) {
3254
- const step = alias.replace("text/", "");
3255
- const value = LINE_HEIGHT_TEXT[step];
3256
- return value ? value[this.viewport] : alias;
3257
- }
3258
- if (alias.startsWith("font-size/")) {
3259
- const step = alias.replace("font-size/", "");
3260
- const value = FONT_SIZE_SCALE[step];
3261
- return value ? value[this.viewport] : alias;
3262
- }
3263
- if (alias.startsWith("line-height/display/")) {
3264
- const step = alias.replace("line-height/display/", "");
3265
- const value = LINE_HEIGHT_DISPLAY[step];
3266
- return value ? value[this.viewport] : alias;
3267
- }
3268
- if (alias.startsWith("line-height/compact/")) {
3269
- const step = alias.replace("line-height/compact/", "");
3270
- const value = LINE_HEIGHT_COMPACT[step];
3271
- return value ? value[this.viewport] : alias;
3272
- }
3273
- if (alias.startsWith("line-height/text/")) {
3274
- const step = alias.replace("line-height/text/", "");
3275
- const value = LINE_HEIGHT_TEXT[step];
3276
- return value ? value[this.viewport] : alias;
3277
- }
3278
- if (alias.startsWith("typography-scale/font-size/")) {
3279
- const step = alias.replace("typography-scale/font-size/", "");
3280
- return TYPOGRAPHY_SCALE_FONT_SIZE[step] ?? alias;
3281
- }
3282
- if (alias.startsWith("typography-scale/line-height/")) {
3283
- const step = alias.replace("typography-scale/line-height/", "");
3284
- return TYPOGRAPHY_SCALE_LINE_HEIGHT[step] ?? alias;
3285
- }
3286
- if (alias.startsWith("spacing/")) {
3287
- const step = alias.replace("spacing/", "");
3288
- return SPACING_SCALE[step] ?? alias;
3289
- }
3290
- if (FONT_FAMILY[alias]) {
3291
- return FONT_FAMILY[alias];
3292
- }
3293
- if (alias.startsWith("radius/")) {
3294
- const step = alias.replace("radius/", "");
3295
- return RADIUS_SCALE[step] ?? alias;
3296
- }
3297
- if (alias.startsWith("stroke/")) {
3298
- const step = alias.replace("stroke/", "");
3299
- return STROKE_SCALE[step] ?? alias;
3300
- }
3301
- return alias;
3302
- }
3303
- /**
3304
- * Recursively resolve all aliases in an object.
3305
- *
3306
- * @param obj - Object containing alias strings
3307
- * @returns New object with all aliases resolved to concrete values
3308
- */
3309
- resolveObject(obj) {
3310
- if (obj === null || obj === void 0) {
3311
- return obj;
3312
- }
3313
- if (typeof obj === "string" || typeof obj === "number") {
3314
- return this.resolve(obj);
3315
- }
3316
- if (Array.isArray(obj)) {
3317
- return obj.map((item) => this.resolveObject(item));
3318
- }
3319
- if (typeof obj === "object") {
3320
- const input = obj;
3321
- const result = {};
3322
- if ("scale" in input && typeof input.scale === "string" && Object.keys(input).length === 1) {
3323
- const scale = input.scale;
3324
- return {
3325
- fontSize: TYPOGRAPHY_SCALE_FONT_SIZE[scale] ?? `${scale}px`,
3326
- lineHeight: TYPOGRAPHY_SCALE_LINE_HEIGHT[scale] ?? `${scale}px`
3327
- };
3328
- }
3329
- for (const [key, value] of Object.entries(input)) {
3330
- if (key === "fontSize" && typeof value === "string") {
3331
- result[key] = this.resolve(value, "fontSize");
3332
- } else if (key === "lineHeight" && typeof value === "string") {
3333
- result[key] = this.resolve(value, "lineHeight");
3334
- } else {
3335
- result[key] = this.resolveObject(value);
3336
- }
3337
- }
3338
- return result;
3339
- }
3340
- return obj;
3341
- }
3342
- /**
3343
- * Check if a value is already resolved (not an alias).
3344
- */
3345
- isResolved(value) {
3346
- return /^\d+(\.\d+)?(px|em|rem|%|vw|vh|pt|cm|mm|in)$/i.test(value) || value.startsWith("rgb") || value.startsWith("#") || value.startsWith("var(") || value === "transparent" || value === "inherit" || value === "none";
3347
- }
3348
- };
3349
- function createResolver(viewport = "desktop") {
3350
- return new PentagramResolver(viewport);
3351
- }
3352
- function resolveForDesktop(obj) {
3353
- return new PentagramResolver("desktop").resolveObject(obj);
3354
- }
3355
- function resolveForMobile(obj) {
3356
- return new PentagramResolver("mobile").resolveObject(obj);
3357
- }
3358
-
3359
- // src/pentagram-to-legacy/map-pentagram-typo-to-legacy.ts
3360
- function extractControlTypo(size, defaultFontWeight = 400) {
3361
- if (!size) {
3362
- return {
3363
- fontSize: "14px",
3364
- lineHeight: "20px",
3365
- fontWeight: defaultFontWeight
3366
- };
3367
- }
3368
- const typo4 = size.typography ?? size;
3369
- return {
3370
- fontSize: typo4.fontSize ?? "14px",
3371
- lineHeight: typo4.lineHeight ?? "20px",
3372
- fontWeight: defaultFontWeight
3373
- };
3374
- }
3375
- function buildBasicStyle(variant, useAccent = false) {
3376
- const fontWeight = useAccent ? variant.accent?.fontWeight ?? 500 : variant.default?.fontWeight ?? 400;
3377
- return {
3378
- fontSize: variant.fontSize,
3379
- lineHeight: variant.lineHeight,
3380
- fontWeight
3381
- };
3382
- }
3383
- function buildParagraphStyle(variant) {
3384
- return {
3385
- fontSize: variant.fontSize,
3386
- lineHeight: variant.paragraph?.lineHeight ?? variant.lineHeight,
3387
- fontWeight: variant.default?.fontWeight ?? 400
3388
- };
3389
- }
3390
- var DEFAULT_FONT_FAMILY = `'GraphikLCWebUikit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif`;
3391
- function mapPentagramTypoToLegacy(pentagram, fontFamily = DEFAULT_FONT_FAMILY) {
3392
- const { heading, basic, control } = pentagram;
3393
- return {
3394
- fontFamily,
3395
- core: {
3396
- // heading.h1 → core.h1
3397
- h1: {
3398
- fontSize: heading.h1.fontSize,
3399
- lineHeight: heading.h1.lineHeight,
3400
- fontWeight: heading.h1.fontWeight ?? 700
3401
- },
3402
- // heading.h2 → core.h2
3403
- h2: {
3404
- fontSize: heading.h2.fontSize,
3405
- lineHeight: heading.h2.lineHeight,
3406
- fontWeight: heading.h2.fontWeight ?? 700
3407
- },
3408
- // heading.h3 → core.h3
3409
- h3: {
3410
- fontSize: heading.h3.fontSize,
3411
- lineHeight: heading.h3.lineHeight,
3412
- fontWeight: heading.h3.fontWeight ?? 700
3413
- },
3414
- // heading.h4 → core.h4
3415
- h4: {
3416
- fontSize: heading.h4.fontSize,
3417
- lineHeight: heading.h4.lineHeight,
3418
- fontWeight: heading.h4.fontWeight ?? 700
3419
- },
3420
- // basic.bodyMd → core.bodyMd
3421
- bodyMd: buildBasicStyle(basic.bodyMd, false),
3422
- // basic.bodyMd.accent → core.bodyMdAccent
3423
- bodyMdAccent: buildBasicStyle(basic.bodyMd, true),
3424
- // basic.bodyLg.accent → core.bodyLgAccent
3425
- bodyLgAccent: buildBasicStyle(basic.bodyLg, true),
3426
- // basic.bodyMd.paragraph → core.paragraph
3427
- paragraph: buildParagraphStyle(basic.bodyMd),
3428
- // basic.bodyMd → core.label (same as bodyMd)
3429
- label: buildBasicStyle(basic.bodyMd, false),
3430
- // basic.bodySm → core.minor
3431
- minor: buildBasicStyle(basic.bodySm, false)
3432
- },
3433
- components: {
3434
- // control.button.* → components.button.*
3435
- button: {
3436
- sm: extractControlTypo(control.button.sm, 500),
3437
- md: extractControlTypo(control.button.md, 500),
3438
- lg: extractControlTypo(control.button.lg, 500)
3439
- },
3440
- // control.input.* → components.input.*
3441
- input: {
3442
- sm: extractControlTypo(control.input.sm, 400),
3443
- md: extractControlTypo(control.input.md, 400),
3444
- lg: extractControlTypo(control.input.lg, 400)
3445
- },
3446
- // control.tab.* → components.tab.*
3447
- tab: {
3448
- sm: extractControlTypo(control.tab.sm, 500),
3449
- md: extractControlTypo(control.tab.md, 500),
3450
- lg: extractControlTypo(control.tab.lg, 500)
3451
- },
3452
- // control.checkbox.* + control.radio.* → components.check.*
3453
- // (checkbox and radio share the same legacy component)
3454
- check: {
3455
- sm: extractControlTypo(control.checkbox?.sm ?? control.radio?.sm, 400),
3456
- md: extractControlTypo(control.checkbox?.md ?? control.radio?.md, 400),
3457
- lg: extractControlTypo(control.checkbox?.lg ?? control.radio?.lg, 400)
3458
- },
3459
- // basic.bodyMd/bodySm/bodyXs → components.label.lg/md/sm
3460
- label: {
3461
- sm: buildBasicStyle(basic.bodyXs, false),
3462
- md: buildBasicStyle(basic.bodySm, false),
3463
- lg: buildBasicStyle(basic.bodyMd, false)
3464
- }
3465
- }
3466
- };
3467
- }
3468
- var DELETED_LEGACY_TYPO_VARS = [
3469
- "components.heading",
3470
- "components.fieldGroup",
3471
- "core.strong",
3472
- "core.bodyLg"
3473
- ];
3474
-
3475
- // src/pentagram-to-legacy/map-pentagram-shape-to-legacy.ts
3476
- function getShapeBorderRadius(shape, preferredSize = "md", fallback = "8px") {
3477
- if (!shape) return fallback;
3478
- const size = shape[preferredSize] ?? shape["lg"] ?? shape["sm"] ?? Object.values(shape)[0];
3479
- return size?.borderRadius ?? fallback;
3480
- }
3481
- function getShapeBorderWidth(shape, preferredSize = "md", fallback = "1px") {
3482
- if (!shape) return fallback;
3483
- const size = shape[preferredSize] ?? shape["lg"] ?? shape["sm"] ?? Object.values(shape)[0];
3484
- return size?.borderWidth ?? size?.borderWeight ?? fallback;
3485
- }
3486
- function mapPentagramShapeToLegacy(pentagram, existingMisc) {
3487
- const buttonRadius = getShapeBorderRadius(pentagram.button, "md", "8px");
3488
- const inputRadius = getShapeBorderRadius(pentagram.input, "md", "8px");
3489
- const checkboxRadius = getShapeBorderRadius(pentagram.checkbox, "md", "4px");
3490
- const tagRadius = getShapeBorderRadius(pentagram.tag, "md", "8px");
3491
- const popupRadius = pentagram.modal?.borderRadius ?? pentagram.contextMenu?.md?.borderRadius ?? pentagram.tooltip?.md?.borderRadius ?? "8px";
3492
- const borderWidth = getShapeBorderWidth(pentagram.button, "md", "2px");
3493
- const buttonSm = pentagram.button?.sm?.borderRadius ?? "4px";
3494
- const buttonMd = pentagram.button?.md?.borderRadius ?? "6px";
3495
- const buttonLg = pentagram.button?.lg?.borderRadius ?? "8px";
3496
- const buttonXl = pentagram.button?.xl?.borderRadius ?? "8px";
3497
- return {
3498
- borderRadiusScale: {
3499
- sm: existingMisc?.borderRadiusScale?.sm ?? buttonSm,
3500
- md: existingMisc?.borderRadiusScale?.md ?? buttonMd,
3501
- lg: existingMisc?.borderRadiusScale?.lg ?? buttonLg,
3502
- xl: existingMisc?.borderRadiusScale?.xl ?? buttonXl
3503
- },
3504
- borderWidth: existingMisc?.borderWidth ?? borderWidth,
3505
- borderRadius: {
3506
- input: inputRadius,
3507
- button: buttonRadius,
3508
- buttonIcon: buttonRadius,
3509
- popup: popupRadius,
3510
- checkbox: checkboxRadius,
3511
- tag: tagRadius
3512
- },
3513
- minWidth: {
3514
- button: existingMisc?.minWidth?.button ?? "40px"
3515
- }
3516
- };
3517
- }
3518
- function flattenPentagramShapeToVars(pentagram) {
3519
- const vars = {};
3520
- function addSizedComponent(name, shape) {
3521
- if (!shape) return;
3522
- for (const [size, props] of Object.entries(shape)) {
3523
- if (props.borderRadius) {
3524
- vars[`shape-${name}-${size}-borderRadius`] = props.borderRadius;
3525
- }
3526
- if (props.borderWidth ?? props.borderWeight) {
3527
- vars[`shape-${name}-${size}-borderWidth`] = props.borderWidth ?? props.borderWeight;
3528
- }
3529
- }
3530
- }
3531
- addSizedComponent("button", pentagram.button);
3532
- addSizedComponent("input", pentagram.input);
3533
- addSizedComponent("checkbox", pentagram.checkbox);
3534
- addSizedComponent("tab", pentagram.tabItem);
3535
- addSizedComponent("tag", pentagram.tag);
3536
- addSizedComponent("radio", pentagram.radio);
3537
- addSizedComponent("switch", pentagram.switch);
3538
- addSizedComponent("segmented", pentagram.segmented);
3539
- addSizedComponent("segmentedItem", pentagram.segmentedItem);
3540
- addSizedComponent("tooltip", pentagram.tooltip);
3541
- addSizedComponent("contextMenu", pentagram.contextMenu);
3542
- addSizedComponent("avatar", pentagram.avatar);
3543
- addSizedComponent("toggleButtonGroup", pentagram.toggleButtonGroup);
3544
- if (pentagram.modal?.borderRadius) {
3545
- vars["shape-modal-borderRadius"] = pentagram.modal.borderRadius;
3546
- }
3547
- if (pentagram.cell?.borderRadius) {
3548
- vars["shape-cell-borderRadius"] = pentagram.cell.borderRadius;
3549
- }
3550
- if (pentagram.toast?.borderRadius) {
3551
- vars["shape-toast-borderRadius"] = pentagram.toast.borderRadius;
3552
- }
3553
- return vars;
3554
- }
3555
-
3556
- // src/pentagram-to-legacy/map-handcrafted-pentagram-to-legacy.ts
3557
- function mapHandCraftedPentagramToLegacy(pentagram) {
3558
- return {
3559
- core: {
3560
- background: {
3561
- primary: pentagram.background.primary,
3562
- secondary: pentagram.layer.float,
3563
- ghost: pentagram.overlay.mono,
3564
- tone: pentagram.layer.scrim,
3565
- selection: "transparent",
3566
- // deleted in Pentagram
3567
- hover: "transparent",
3568
- // deleted in Pentagram
3569
- brand: pentagram.background.brandSecondary,
3570
- brandSecondary: pentagram.background.brandExtraSecondary,
3571
- success: pentagram.background.successSecondary,
3572
- warning: pentagram.background.warningSecondary,
3573
- alert: pentagram.background.alertSecondary,
3574
- neutral: pentagram.background.neutralSecondary
3575
- },
3576
- divider: {
3577
- divider: pentagram.border.secondary
3578
- },
3579
- text: {
3580
- primary: pentagram.content.primary,
3581
- secondary: pentagram.content.secondary,
3582
- tertiary: pentagram.content.tertiary,
3583
- brand: pentagram.content.brandPrimary,
3584
- brandSecondary: pentagram.content.brandExtraPrimary,
3585
- success: pentagram.content.successPrimary,
3586
- warning: pentagram.content.warningPrimary,
3587
- alert: pentagram.content.alertPrimary,
3588
- neutral: pentagram.content.neutralPrimary
3589
- },
3590
- link: {
3591
- link: pentagram.control.link.primary,
3592
- linkHover: pentagram.control.link.primaryHover,
3593
- linkMinor: pentagram.control.link.secondary,
3594
- linkMinorHover: pentagram.control.link.secondaryHover
3595
- }
3596
- },
3597
- control: {
3598
- primary: {
3599
- bg: pentagram.control.brand.primary.bg,
3600
- bgHover: pentagram.control.brand.primary.bgHover,
3601
- bgPress: pentagram.control.brand.primary.bgPress,
3602
- bgDisabled: pentagram.control.brand.primary.bgDisable,
3603
- border: pentagram.control.brand.primary.border,
3604
- borderHover: pentagram.control.brand.primary.borderHover,
3605
- borderPress: pentagram.control.brand.primary.borderPress
3606
- },
3607
- secondary: {
3608
- bg: pentagram.control.brand.secondary.bg,
3609
- bgHover: pentagram.control.brand.secondary.bgHover,
3610
- bgPress: pentagram.control.brand.secondary.bgPress,
3611
- border: pentagram.control.brand.secondary.border,
3612
- borderHover: pentagram.control.brand.secondary.borderHover,
3613
- borderPress: pentagram.control.brand.secondary.borderPress
3614
- },
3615
- default: {
3616
- bg: pentagram.control.mono.primary.bg,
3617
- bgHover: pentagram.control.mono.primary.bgHover,
3618
- bgPress: pentagram.control.mono.primary.bgPress,
3619
- border: pentagram.control.mono.primary.border,
3620
- borderHover: pentagram.control.mono.primary.borderHover,
3621
- borderPress: pentagram.control.mono.primary.borderPress
3622
- },
3623
- input: {
3624
- bg: pentagram.control.input.bg,
3625
- bgHover: pentagram.control.input.bgHover,
3626
- bgDisabled: pentagram.control.input.bgDisable,
3627
- border: pentagram.control.input.border,
3628
- borderHover: pentagram.control.input.borderHover,
3629
- borderDisabled: pentagram.control.input.borderDisable,
3630
- text: pentagram.control.input.text,
3631
- textDisabled: pentagram.control.input.textDisable,
3632
- placeholder: pentagram.control.input.placeholder
3633
- },
3634
- focus: {
3635
- bg: pentagram.control.focus.bg,
3636
- border: pentagram.control.focus.border
3637
- },
3638
- alert: {
3639
- bg: pentagram.control.alert.secondary.bg,
3640
- bgHover: pentagram.control.alert.secondary.bgHover,
3641
- bgPress: pentagram.control.alert.secondary.bgPress,
3642
- border: pentagram.control.alert.secondary.border,
3643
- borderHover: pentagram.control.alert.secondary.borderHover,
3644
- borderPress: pentagram.control.alert.secondary.borderPress
3645
- },
3646
- check: {
3647
- bg: pentagram.control.check.bg,
3648
- bgHover: pentagram.control.check.bgHover,
3649
- bgDisabled: pentagram.control.check.bgDisable
3650
- },
3651
- faint: {
3652
- bg: pentagram.control.faint.bg,
3653
- bgHover: pentagram.control.faint.bgHover,
3654
- border: pentagram.control.faint.border,
3655
- borderHover: pentagram.control.faint.borderHover
3656
- },
3657
- toggle: {
3658
- bg: pentagram.control.switch.bg,
3659
- bgHover: pentagram.control.switch.bgHover
3660
- },
3661
- text: {
3662
- active: pentagram.control.brand.text.primary,
3663
- secondary: pentagram.control.brand.text.secondary,
3664
- default: pentagram.control.mono.text.primary,
3665
- primary: pentagram.control.text.primary,
3666
- disabled: pentagram.control.brand.text.disable,
3667
- faint: pentagram.control.check.icon,
3668
- alert: pentagram.control.alert.text.secondary
3669
- }
3670
- }
3671
- };
3672
- }
3673
-
3674
- // src/pentagram-to-legacy/map-pentagram-theme-to-legacy.ts
3675
- function buildBaseColorsFromPentagram(colors) {
3676
- return {
3677
- content: colors.content.primary,
3678
- surface: colors.background.primary,
3679
- project: colors.control.brand.primary.bg,
3680
- accent: colors.control.brand.text.primary,
3681
- phantom: colors.border.secondary,
3682
- path: colors.control.link.primary,
3683
- success: colors.content.successPrimary,
3684
- warning: colors.content.warningPrimary,
3685
- alert: colors.content.alertPrimary,
3686
- neutral: colors.content.neutralPrimary
3687
- };
3688
- }
3689
- function mapPentagramThemeToLegacy(pentagram, viewport = "desktop") {
3690
- const resolver = createResolver(viewport);
3691
- const resolvedTypo = resolver.resolveObject(pentagram.typo);
3692
- const resolvedShape = resolver.resolveObject(pentagram.shape);
3693
- return {
3694
- colors: {
3695
- base: buildBaseColorsFromPentagram(pentagram.colors),
3696
- ...mapHandCraftedPentagramToLegacy(pentagram.colors)
3697
- },
3698
- typo: mapPentagramTypoToLegacy(resolvedTypo),
3699
- misc: mapPentagramShapeToLegacy(resolvedShape),
3700
- shadows: pentagram.shadows
3701
- };
3702
- }
3703
-
3704
- // src/pentagram-primitives/typo-primitives.json
3705
- var typo_primitives_default = {
3706
- heading: {
3707
- h1: {
3708
- fontSize: "450",
3709
- lineHeight: "display/450",
3710
- fontWeight: 700
3711
- },
3712
- h2: {
3713
- fontSize: "350",
3714
- lineHeight: "display/350",
3715
- fontWeight: 700
3716
- },
3717
- h3: {
3718
- fontSize: "300",
3719
- lineHeight: "display/300",
3720
- fontWeight: 700
3721
- },
3722
- h4: {
3723
- fontSize: "250",
3724
- lineHeight: "display/250",
3725
- fontWeight: 700
3726
- },
3727
- h5: {
3728
- fontSize: "200",
3729
- lineHeight: "display/200",
3730
- fontWeight: 700
3731
- }
3732
- },
3733
- basic: {
3734
- display: {
3735
- fontFamily: "compact",
3736
- fontSize: "300",
3737
- lineHeight: "compact/300",
3738
- fontWeight: 500
3739
- },
3740
- bodyLg: {
3741
- fontSize: "175",
3742
- lineHeight: "compact/175",
3743
- default: {
3744
- fontWeight: 400
3745
- },
3746
- accent: {
3747
- fontWeight: 500
3748
- },
3749
- paragraph: {
3750
- spacing: "spacing/250",
3751
- lineHeight: "text/175"
3752
- }
3753
- },
3754
- bodyMd: {
3755
- fontSize: "150",
3756
- lineHeight: "compact/150",
3757
- default: {
3758
- fontWeight: 400
3759
- },
3760
- accent: {
3761
- fontWeight: 500
3762
- },
3763
- paragraph: {
3764
- spacing: "spacing/200",
3765
- lineHeight: "text/150"
3766
- }
3767
- },
3768
- bodySm: {
3769
- fontSize: "125",
3770
- lineHeight: "compact/125",
3771
- default: {
3772
- fontWeight: 400
3773
- },
3774
- accent: {
3775
- fontWeight: 500
3776
- },
3777
- paragraph: {
3778
- spacing: "spacing/150",
3779
- lineHeight: "text/125"
3780
- }
3781
- },
3782
- bodyXs: {
3783
- fontSize: "100",
3784
- lineHeight: "compact/100",
3785
- default: {
3786
- fontWeight: 400
3787
- },
3788
- accent: {
3789
- fontWeight: 500
3790
- },
3791
- paragraph: {
3792
- spacing: "spacing/100",
3793
- lineHeight: "text/100"
3794
- }
3795
- },
3796
- bodyXxs: {
3797
- fontSize: "75",
3798
- lineHeight: "compact/75",
3799
- default: {
3800
- fontWeight: 400
3801
- },
3802
- accent: {
3803
- fontWeight: 500
3804
- },
3805
- paragraph: {
3806
- spacing: "spacing/75",
3807
- lineHeight: "text/75"
3808
- }
3809
- }
3810
- },
3811
- control: {
3812
- button: {
3813
- xl: { scale: "600" },
3814
- lg: { scale: "500" },
3815
- md: { scale: "400" },
3816
- sm: { scale: "300" },
3817
- xs: { scale: "200" }
3818
- },
3819
- input: {
3820
- xl: { scale: "600" },
3821
- lg: { scale: "500" },
3822
- md: { scale: "400" },
3823
- sm: { scale: "300" },
3824
- xs: { scale: "200" }
3825
- },
3826
- checkbox: {
3827
- xl: { scale: "600" },
3828
- lg: { scale: "500" },
3829
- md: { scale: "400" },
3830
- sm: { scale: "300" }
3831
- },
3832
- tab: {
3833
- xl: { scale: "600" },
3834
- lg: { scale: "500" },
3835
- md: { scale: "400" },
3836
- sm: { scale: "300" },
3837
- xs: { scale: "300" }
3838
- },
3839
- radio: {
3840
- xl: { scale: "600" },
3841
- lg: { scale: "500" },
3842
- md: { scale: "400" },
3843
- sm: { scale: "300" }
3844
- },
3845
- segmentedItem: {
3846
- xl: { scale: "500" },
3847
- lg: { scale: "400" },
3848
- md: { scale: "300" },
3849
- sm: { scale: "200" }
3850
- },
3851
- tag: {
3852
- xl: { scale: "600" },
3853
- lg: { scale: "500" },
3854
- md: { scale: "400" },
3855
- sm: { scale: "300" },
3856
- xs: { scale: "200" }
3857
- },
3858
- toggleButton: {
3859
- xl: { scale: "600" },
3860
- lg: { scale: "500" },
3861
- md: { scale: "400" },
3862
- sm: { scale: "300" },
3863
- xs: { scale: "200" }
3864
- }
3865
- }
3866
- };
3867
-
3868
- // src/pentagram-primitives/shape-primitives.json
3869
- var shape_primitives_default = {
3870
- button: {
3871
- xl: {
3872
- borderRadius: "radius/100",
3873
- borderWidth: "stroke/1"
3874
- },
3875
- lg: {
3876
- borderRadius: "radius/100",
3877
- borderWidth: "stroke/1"
3878
- },
3879
- md: {
3880
- borderRadius: "radius/75",
3881
- borderWidth: "stroke/1"
3882
- },
3883
- sm: {
3884
- borderRadius: "radius/50",
3885
- borderWidth: "stroke/1"
3886
- },
3887
- xs: {
3888
- borderRadius: "radius/50",
3889
- borderWidth: "stroke/1"
3890
- }
3891
- },
3892
- checkbox: {
3893
- xl: {
3894
- borderRadius: "radius/50",
3895
- borderWidth: "stroke/1"
3896
- },
3897
- lg: {
3898
- borderRadius: "radius/50",
3899
- borderWidth: "stroke/1"
3900
- },
3901
- md: {
3902
- borderRadius: "radius/50",
3903
- borderWidth: "stroke/1"
3904
- },
3905
- sm: {
3906
- borderRadius: "radius/50",
3907
- borderWidth: "stroke/1"
3908
- }
3909
- },
3910
- input: {
3911
- xl: {
3912
- borderRadius: "radius/100",
3913
- borderWidth: "stroke/1"
3914
- },
3915
- lg: {
3916
- borderRadius: "radius/100",
3917
- borderWidth: "stroke/1"
3918
- },
3919
- md: {
3920
- borderRadius: "radius/100",
3921
- borderWidth: "stroke/1"
3922
- },
3923
- sm: {
3924
- borderRadius: "radius/50",
3925
- borderWidth: "stroke/1"
3926
- },
3927
- xs: {
3928
- borderRadius: "radius/50",
3929
- borderWidth: "stroke/1"
3930
- }
3931
- },
3932
- cell: {
3933
- borderRadius: "radius/100",
3934
- borderWidth: "stroke/1"
3935
- },
3936
- modal: {
3937
- borderRadius: "radius/100"
3938
- },
3939
- toast: {
3940
- borderRadius: "radius/50",
3941
- borderWidth: "0px"
3942
- },
3943
- segmentedItem: {
3944
- xl: {
3945
- borderRadius: "radius/50",
3946
- borderWeight: "stroke/1"
3947
- },
3948
- lg: {
3949
- borderRadius: "radius/50",
3950
- borderWeight: "stroke/1"
3951
- },
3952
- md: {
3953
- borderRadius: "radius/50",
3954
- borderWeight: "stroke/1"
3955
- },
3956
- sm: {
3957
- borderRadius: "radius/25",
3958
- borderWeight: "stroke/1"
3959
- }
3960
- },
3961
- segmented: {
3962
- xl: {
3963
- borderRadius: "radius/100",
3964
- borderWeight: "stroke/1"
3965
- },
3966
- lg: {
3967
- borderRadius: "radius/100",
3968
- borderWeight: "stroke/1"
3969
- },
3970
- md: {
3971
- borderRadius: "radius/100",
3972
- borderWeight: "stroke/1"
3973
- },
3974
- sm: {
3975
- borderRadius: "radius/50",
3976
- borderWeight: "stroke/1"
3977
- }
3978
- },
3979
- switch: {
3980
- xl: {
3981
- borderRadius: "radius/50",
3982
- borderWeight: "stroke/1"
3983
- },
3984
- lg: {
3985
- borderRadius: "radius/50",
3986
- borderWeight: "stroke/1"
3987
- },
3988
- md: {
3989
- borderRadius: "radius/50",
3990
- borderWeight: "stroke/1"
3991
- },
3992
- sm: {
3993
- borderRadius: "radius/50",
3994
- borderWeight: "stroke/1"
3995
- }
3996
- },
3997
- knob: {
3998
- xl: {
3999
- borderRadius: "radius/25"
4000
- },
4001
- lg: {
4002
- borderRadius: "radius/25"
4003
- },
4004
- md: {
4005
- borderRadius: "radius/25"
4006
- },
4007
- sm: {
4008
- borderRadius: "radius/25"
4009
- }
4010
- },
4011
- tabItem: {
4012
- xl: {
4013
- borderRadius: "radius/100"
4014
- },
4015
- lg: {
4016
- borderRadius: "radius/100"
4017
- },
4018
- md: {
4019
- borderRadius: "radius/50"
4020
- },
4021
- sm: {
4022
- borderRadius: "radius/50"
4023
- }
4024
- },
4025
- tag: {
4026
- xl: {
4027
- borderRadius: "radius/100",
4028
- borderWidth: "stroke/1"
4029
- },
4030
- lg: {
4031
- borderRadius: "radius/100",
4032
- borderWidth: "stroke/1"
4033
- },
4034
- md: {
4035
- borderRadius: "radius/75",
4036
- borderWidth: "stroke/1"
4037
- },
4038
- sm: {
4039
- borderRadius: "radius/50",
4040
- borderWidth: "stroke/1"
4041
- },
4042
- xs: {
4043
- borderRadius: "radius/50",
4044
- borderWidth: "stroke/1"
4045
- }
4046
- },
4047
- tagLabel: {
4048
- borderRadius: "0px"
4049
- },
4050
- tooltip: {
4051
- xl: {
4052
- borderRadius: "radius/100"
4053
- },
4054
- lg: {
4055
- borderRadius: "radius/100"
4056
- },
4057
- md: {
4058
- borderRadius: "radius/100"
4059
- },
4060
- sm: {
4061
- borderRadius: "radius/50"
4062
- }
4063
- },
4064
- radio: {
4065
- xl: {
4066
- borderRadius: "radius/999",
4067
- borderWidth: "stroke/1"
4068
- },
4069
- lg: {
4070
- borderRadius: "radius/999",
4071
- borderWidth: "stroke/1"
4072
- },
4073
- md: {
4074
- borderRadius: "radius/999",
4075
- borderWidth: "stroke/1"
4076
- },
4077
- sm: {
4078
- borderRadius: "radius/999",
4079
- borderWidth: "stroke/1"
4080
- }
4081
- },
4082
- contextMenu: {
4083
- xl: {
4084
- borderRadius: "radius/100"
4085
- },
4086
- lg: {
4087
- borderRadius: "radius/100"
4088
- },
4089
- md: {
4090
- borderRadius: "radius/100"
4091
- },
4092
- sm: {
4093
- borderRadius: "radius/50"
4094
- }
4095
- },
4096
- avatar: {
4097
- xl: {
4098
- borderRadius: "radius/100",
4099
- borderWidth: "stroke/2"
4100
- },
4101
- lg: {
4102
- borderRadius: "radius/75",
4103
- borderWidth: "stroke/2"
4104
- },
4105
- md: {
4106
- borderRadius: "radius/75",
4107
- borderWidth: "stroke/2"
4108
- },
4109
- sm: {
4110
- borderRadius: "radius/50",
4111
- borderWidth: "stroke/2"
4112
- },
4113
- xs: {
4114
- borderRadius: "radius/50",
4115
- borderWidth: "stroke/2"
4116
- },
4117
- xxs: {
4118
- borderRadius: "radius/25",
4119
- borderWidth: "stroke/2"
4120
- }
4121
- },
4122
- toggleButtonGroup: {
4123
- xl: {
4124
- borderRadius: "radius/100",
4125
- borderWidth: "stroke/1"
4126
- },
4127
- lg: {
4128
- borderRadius: "radius/100",
4129
- borderWidth: "stroke/1"
4130
- },
4131
- md: {
4132
- borderRadius: "radius/75",
4133
- borderWidth: "stroke/1"
4134
- },
4135
- sm: {
4136
- borderRadius: "radius/50",
4137
- borderWidth: "stroke/1"
4138
- },
4139
- xs: {
4140
- borderRadius: "radius/50",
4141
- borderWidth: "stroke/1"
4142
- }
4143
- }
4144
- };
4145
2931
  // Annotate the CommonJS export names for ESM import in node:
4146
2932
  0 && (module.exports = {
4147
- DELETED_LEGACY_TYPO_VARS,
4148
- PentagramResolver,
4149
2933
  base,
4150
2934
  baseDark,
4151
- buildBaseColorsFromPentagram,
4152
2935
  createDarkScheme,
4153
- createResolver,
4154
2936
  createScheme,
4155
2937
  emails,
4156
2938
  emailsDark,
4157
2939
  emailsThemes,
4158
- flattenPentagramShapeToVars,
4159
2940
  generateWithScheme,
4160
- mapHandCraftedPentagramToLegacy,
4161
- mapPentagramShapeToLegacy,
4162
- mapPentagramThemeToLegacy,
4163
- mapPentagramTypoToLegacy,
4164
2941
  palettes,
4165
2942
  payStationDarkScheme,
4166
2943
  payStationScheme,
@@ -4168,22 +2945,16 @@ var shape_primitives_default = {
4168
2945
  paystation4Dark,
4169
2946
  paystation4Gaijin,
4170
2947
  paystation4Nexters,
4171
- paystation4PentagramDark,
4172
- paystation4PentagramLight,
4173
2948
  paystation4Take2,
4174
2949
  paystation4Themes,
4175
2950
  primaryPalette,
4176
2951
  publisherV2,
4177
2952
  publisherV2Dark,
4178
2953
  publisherV2Themes,
4179
- resolveForDesktop,
4180
- resolveForMobile,
4181
- shapePrimitives,
4182
2954
  themeGenerator,
4183
2955
  themes,
4184
2956
  themesBaseColors,
4185
2957
  themesBaseColorsArray,
4186
- themesColorsScheme,
4187
- typoPrimitives
2958
+ themesColorsScheme
4188
2959
  });
4189
2960
  //# sourceMappingURL=index.js.map