Private
Public Access
1
0

feat: Fluent UI Outlook Lite + connections mockup

This commit is contained in:
2026-04-14 18:52:25 +00:00
parent 1199eff6c3
commit dfa4010406
34820 changed files with 1003813 additions and 205 deletions

187
node_modules/@fluentui/tokens/lib/alias/darkColor.js generated vendored Normal file
View File

@@ -0,0 +1,187 @@
/* !!! DO NOT EDIT !!! */ /* This file has been generated by the token pipeline */ import { black, blackAlpha, grey, grey10Alpha, grey12Alpha, grey14Alpha, white, whiteAlpha } from "../global/colors.js";
export const generateColorTokens = (brand)=>({
colorNeutralForeground1: white,
colorNeutralForeground1Hover: white,
colorNeutralForeground1Pressed: white,
colorNeutralForeground1Selected: white,
colorNeutralForeground2: grey[84],
colorNeutralForeground2Hover: white,
colorNeutralForeground2Pressed: white,
colorNeutralForeground2Selected: white,
colorNeutralForeground2BrandHover: brand[100],
colorNeutralForeground2BrandPressed: brand[90],
colorNeutralForeground2BrandSelected: brand[100],
colorNeutralForeground3: grey[68],
colorNeutralForeground3Hover: grey[84],
colorNeutralForeground3Pressed: grey[84],
colorNeutralForeground3Selected: grey[84],
colorNeutralForeground3BrandHover: brand[100],
colorNeutralForeground3BrandPressed: brand[90],
colorNeutralForeground3BrandSelected: brand[100],
colorNeutralForeground4: grey[60],
colorNeutralForeground5: grey[68],
colorNeutralForeground5Hover: white,
colorNeutralForeground5Pressed: white,
colorNeutralForeground5Selected: white,
colorNeutralForegroundDisabled: grey[36],
colorNeutralForegroundInvertedDisabled: whiteAlpha[40],
colorBrandForegroundLink: brand[100],
colorBrandForegroundLinkHover: brand[110],
colorBrandForegroundLinkPressed: brand[90],
colorBrandForegroundLinkSelected: brand[100],
colorNeutralForeground2Link: grey[84],
colorNeutralForeground2LinkHover: white,
colorNeutralForeground2LinkPressed: white,
colorNeutralForeground2LinkSelected: white,
colorCompoundBrandForeground1: brand[100],
colorCompoundBrandForeground1Hover: brand[110],
colorCompoundBrandForeground1Pressed: brand[90],
colorBrandForeground1: brand[100],
colorBrandForeground2: brand[110],
colorBrandForeground2Hover: brand[130],
colorBrandForeground2Pressed: brand[160],
colorNeutralForeground1Static: grey[14],
colorNeutralForegroundStaticInverted: white,
colorNeutralForegroundInverted: grey[14],
colorNeutralForegroundInvertedHover: grey[14],
colorNeutralForegroundInvertedPressed: grey[14],
colorNeutralForegroundInvertedSelected: grey[14],
colorNeutralForegroundInverted2: grey[14],
colorNeutralForegroundOnBrand: white,
colorNeutralForegroundInvertedLink: white,
colorNeutralForegroundInvertedLinkHover: white,
colorNeutralForegroundInvertedLinkPressed: white,
colorNeutralForegroundInvertedLinkSelected: white,
colorBrandForegroundInverted: brand[80],
colorBrandForegroundInvertedHover: brand[70],
colorBrandForegroundInvertedPressed: brand[60],
colorBrandForegroundOnLight: brand[80],
colorBrandForegroundOnLightHover: brand[70],
colorBrandForegroundOnLightPressed: brand[50],
colorBrandForegroundOnLightSelected: brand[60],
colorNeutralBackground1: grey[16],
colorNeutralBackground1Hover: grey[24],
colorNeutralBackground1Pressed: grey[12],
colorNeutralBackground1Selected: grey[22],
colorNeutralBackground2: grey[12],
colorNeutralBackground2Hover: grey[20],
colorNeutralBackground2Pressed: grey[8],
colorNeutralBackground2Selected: grey[18],
colorNeutralBackground3: grey[8],
colorNeutralBackground3Hover: grey[16],
colorNeutralBackground3Pressed: grey[4],
colorNeutralBackground3Selected: grey[14],
colorNeutralBackground4: grey[4],
colorNeutralBackground4Hover: grey[12],
colorNeutralBackground4Pressed: black,
colorNeutralBackground4Selected: grey[10],
colorNeutralBackground5: black,
colorNeutralBackground5Hover: grey[8],
colorNeutralBackground5Pressed: grey[2],
colorNeutralBackground5Selected: grey[6],
colorNeutralBackground6: grey[20],
colorNeutralBackground7: '#00000000',
colorNeutralBackground7Hover: grey[10],
colorNeutralBackground7Pressed: grey[4],
colorNeutralBackground7Selected: '#00000000',
colorNeutralBackground8: grey[16],
colorNeutralBackgroundInverted: white,
colorNeutralBackgroundInvertedHover: grey[96],
colorNeutralBackgroundInvertedPressed: grey[88],
colorNeutralBackgroundInvertedSelected: grey[92],
colorNeutralBackgroundStatic: grey[24],
colorNeutralBackgroundAlpha: grey10Alpha[50],
colorNeutralBackgroundAlpha2: grey12Alpha[70],
colorSubtleBackground: 'transparent',
colorSubtleBackgroundHover: grey[22],
colorSubtleBackgroundPressed: grey[18],
colorSubtleBackgroundSelected: grey[20],
colorSubtleBackgroundLightAlphaHover: grey14Alpha[80],
colorSubtleBackgroundLightAlphaPressed: grey14Alpha[50],
colorSubtleBackgroundLightAlphaSelected: 'transparent',
colorSubtleBackgroundInverted: 'transparent',
colorSubtleBackgroundInvertedHover: blackAlpha[10],
colorSubtleBackgroundInvertedPressed: blackAlpha[30],
colorSubtleBackgroundInvertedSelected: blackAlpha[20],
colorTransparentBackground: 'transparent',
colorTransparentBackgroundHover: 'transparent',
colorTransparentBackgroundPressed: 'transparent',
colorTransparentBackgroundSelected: 'transparent',
colorNeutralBackgroundDisabled: grey[8],
colorNeutralBackgroundDisabled2: grey[16],
colorNeutralBackgroundInvertedDisabled: whiteAlpha[10],
colorNeutralStencil1: grey[34],
colorNeutralStencil2: grey[20],
colorNeutralStencil1Alpha: whiteAlpha[10],
colorNeutralStencil2Alpha: whiteAlpha[5],
colorBackgroundOverlay: blackAlpha[50],
colorScrollbarOverlay: whiteAlpha[60],
colorBrandBackground: brand[70],
colorBrandBackgroundHover: brand[80],
colorBrandBackgroundPressed: brand[40],
colorBrandBackgroundSelected: brand[60],
colorCompoundBrandBackground: brand[100],
colorCompoundBrandBackgroundHover: brand[110],
colorCompoundBrandBackgroundPressed: brand[90],
colorBrandBackgroundStatic: brand[80],
colorBrandBackground2: brand[20],
colorBrandBackground2Hover: brand[40],
colorBrandBackground2Pressed: brand[10],
colorBrandBackground3Static: brand[60],
colorBrandBackground4Static: brand[40],
colorBrandBackgroundInverted: white,
colorBrandBackgroundInvertedHover: brand[160],
colorBrandBackgroundInvertedPressed: brand[140],
colorBrandBackgroundInvertedSelected: brand[150],
colorNeutralCardBackground: grey[20],
colorNeutralCardBackgroundHover: grey[24],
colorNeutralCardBackgroundPressed: grey[18],
colorNeutralCardBackgroundSelected: grey[22],
colorNeutralCardBackgroundDisabled: grey[8],
colorNeutralStrokeAccessible: grey[68],
colorNeutralStrokeAccessibleHover: grey[74],
colorNeutralStrokeAccessiblePressed: grey[70],
colorNeutralStrokeAccessibleSelected: brand[100],
colorNeutralStroke1: grey[40],
colorNeutralStroke1Hover: grey[46],
colorNeutralStroke1Pressed: grey[42],
colorNeutralStroke1Selected: grey[44],
colorNeutralStroke2: grey[32],
colorNeutralStroke3: grey[24],
colorNeutralStroke4: grey[24],
colorNeutralStroke4Hover: grey[18],
colorNeutralStroke4Pressed: grey[14],
colorNeutralStroke4Selected: grey[24],
colorNeutralStrokeSubtle: grey[4],
colorNeutralStrokeOnBrand: grey[16],
colorNeutralStrokeOnBrand2: white,
colorNeutralStrokeOnBrand2Hover: white,
colorNeutralStrokeOnBrand2Pressed: white,
colorNeutralStrokeOnBrand2Selected: white,
colorBrandStroke1: brand[100],
colorBrandStroke2: brand[50],
colorBrandStroke2Hover: brand[50],
colorBrandStroke2Pressed: brand[30],
colorBrandStroke2Contrast: brand[50],
colorCompoundBrandStroke: brand[100],
colorCompoundBrandStrokeHover: brand[110],
colorCompoundBrandStrokePressed: brand[90],
colorNeutralStrokeDisabled: grey[26],
colorNeutralStrokeDisabled2: grey[24],
colorNeutralStrokeInvertedDisabled: whiteAlpha[40],
colorTransparentStroke: 'transparent',
colorTransparentStrokeInteractive: 'transparent',
colorTransparentStrokeDisabled: 'transparent',
colorNeutralStrokeAlpha: whiteAlpha[10],
colorNeutralStrokeAlpha2: whiteAlpha[20],
colorStrokeFocus1: black,
colorStrokeFocus2: white,
colorNeutralShadowAmbient: 'rgba(0,0,0,0.24)',
colorNeutralShadowKey: 'rgba(0,0,0,0.28)',
colorNeutralShadowAmbientLighter: 'rgba(0,0,0,0.12)',
colorNeutralShadowKeyLighter: 'rgba(0,0,0,0.14)',
colorNeutralShadowAmbientDarker: 'rgba(0,0,0,0.40)',
colorNeutralShadowKeyDarker: 'rgba(0,0,0,0.48)',
colorBrandShadowAmbient: 'rgba(0,0,0,0.30)',
colorBrandShadowKey: 'rgba(0,0,0,0.25)'
});

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,69 @@
/* color palette used in both darkTheme and teamsDarkTheme */ import { statusSharedColors, personaSharedColors, mappedStatusColors } from "../global/colorPalette.js";
import { statusSharedColorNames, personaSharedColorNames } from "../sharedColorNames.js";
import { statusColorMapping } from "../statusColorMapping.js";
const statusColorPaletteTokens = statusSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background1`]: statusSharedColors[sharedColor].shade40,
[`colorPalette${color}Background2`]: statusSharedColors[sharedColor].shade30,
[`colorPalette${color}Background3`]: statusSharedColors[sharedColor].primary,
[`colorPalette${color}Foreground1`]: statusSharedColors[sharedColor].tint30,
[`colorPalette${color}Foreground2`]: statusSharedColors[sharedColor].tint40,
[`colorPalette${color}Foreground3`]: statusSharedColors[sharedColor].tint20,
[`colorPalette${color}BorderActive`]: statusSharedColors[sharedColor].tint30,
[`colorPalette${color}Border1`]: statusSharedColors[sharedColor].primary,
[`colorPalette${color}Border2`]: statusSharedColors[sharedColor].tint20
};
return Object.assign(acc, sharedColorTokens);
}, {});
// one-off patches
statusColorPaletteTokens.colorPaletteRedForeground3 = statusSharedColors.red.tint30;
statusColorPaletteTokens.colorPaletteRedBorder2 = statusSharedColors.red.tint30;
statusColorPaletteTokens.colorPaletteGreenForeground3 = statusSharedColors.green.tint40;
statusColorPaletteTokens.colorPaletteGreenBorder2 = statusSharedColors.green.tint40;
statusColorPaletteTokens.colorPaletteDarkOrangeForeground3 = statusSharedColors.darkOrange.tint30;
statusColorPaletteTokens.colorPaletteDarkOrangeBorder2 = statusSharedColors.darkOrange.tint30;
statusColorPaletteTokens.colorPaletteRedForegroundInverted = statusSharedColors.red.primary;
statusColorPaletteTokens.colorPaletteGreenForegroundInverted = statusSharedColors.green.primary;
statusColorPaletteTokens.colorPaletteYellowForegroundInverted = statusSharedColors.yellow.shade30;
const personaColorPaletteTokens = personaSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background2`]: personaSharedColors[sharedColor].shade30,
[`colorPalette${color}Foreground2`]: personaSharedColors[sharedColor].tint40,
[`colorPalette${color}BorderActive`]: personaSharedColors[sharedColor].tint30
};
return Object.assign(acc, sharedColorTokens);
}, {});
// one-off patches
personaColorPaletteTokens.colorPaletteDarkRedBackground2 = personaSharedColors.darkRed.shade20;
personaColorPaletteTokens.colorPalettePlumBackground2 = personaSharedColors.plum.shade20;
export const colorPaletteTokens = {
...statusColorPaletteTokens,
...personaColorPaletteTokens
};
export const colorStatusTokens = Object.entries(statusColorMapping).reduce((acc, [statusColor, sharedColor])=>{
const color = statusColor.slice(0, 1).toUpperCase() + statusColor.slice(1);
// TODO: double check the mapping with design - see the one-off patches above
const statusColorTokens = {
[`colorStatus${color}Background1`]: mappedStatusColors[sharedColor].shade40,
[`colorStatus${color}Background2`]: mappedStatusColors[sharedColor].shade30,
[`colorStatus${color}Background3`]: mappedStatusColors[sharedColor].primary,
[`colorStatus${color}Foreground1`]: mappedStatusColors[sharedColor].tint30,
[`colorStatus${color}Foreground2`]: mappedStatusColors[sharedColor].tint40,
[`colorStatus${color}Foreground3`]: mappedStatusColors[sharedColor].tint20,
[`colorStatus${color}BorderActive`]: mappedStatusColors[sharedColor].tint30,
[`colorStatus${color}ForegroundInverted`]: mappedStatusColors[sharedColor].shade10,
[`colorStatus${color}Border1`]: mappedStatusColors[sharedColor].primary,
[`colorStatus${color}Border2`]: mappedStatusColors[sharedColor].tint20
};
return Object.assign(acc, statusColorTokens);
}, {});
// one-off overrides for colorStatus tokens
colorStatusTokens.colorStatusDangerBackground3Hover = mappedStatusColors[statusColorMapping.danger].shade10;
colorStatusTokens.colorStatusDangerBackground3Pressed = mappedStatusColors[statusColorMapping.danger].shade20;
colorStatusTokens.colorStatusDangerForeground3 = mappedStatusColors[statusColorMapping.danger].tint40;
colorStatusTokens.colorStatusDangerBorder2 = mappedStatusColors[statusColorMapping.danger].tint30;
colorStatusTokens.colorStatusSuccessForeground3 = mappedStatusColors[statusColorMapping.success].tint40;
colorStatusTokens.colorStatusSuccessBorder2 = mappedStatusColors[statusColorMapping.success].tint40;
colorStatusTokens.colorStatusWarningForegroundInverted = mappedStatusColors[statusColorMapping.warning].shade20;

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,187 @@
/* !!! DO NOT EDIT !!! */ /* This file has been generated by the token pipeline */ import { blackAlpha, hcButtonFace, hcButtonText, hcCanvas, hcCanvasText, hcDisabled, hcHighlight, hcHighlightText, hcHyperlink } from "../global/colors.js";
export const generateColorTokens = ()=>({
colorNeutralForeground1: hcCanvasText,
colorNeutralForeground1Hover: hcHighlightText,
colorNeutralForeground1Pressed: hcHighlightText,
colorNeutralForeground1Selected: hcHighlightText,
colorNeutralForeground2: hcCanvasText,
colorNeutralForeground2Hover: hcHighlightText,
colorNeutralForeground2Pressed: hcHighlightText,
colorNeutralForeground2Selected: hcHighlightText,
colorNeutralForeground2BrandHover: hcHighlightText,
colorNeutralForeground2BrandPressed: hcHighlightText,
colorNeutralForeground2BrandSelected: hcHighlightText,
colorNeutralForeground3: hcCanvasText,
colorNeutralForeground3Hover: hcHighlightText,
colorNeutralForeground3Pressed: hcHighlightText,
colorNeutralForeground3Selected: hcHighlightText,
colorNeutralForeground3BrandHover: hcHighlightText,
colorNeutralForeground3BrandPressed: hcHighlightText,
colorNeutralForeground3BrandSelected: hcHighlightText,
colorNeutralForeground4: hcCanvasText,
colorNeutralForeground5: hcCanvasText,
colorNeutralForeground5Hover: hcHighlightText,
colorNeutralForeground5Pressed: hcHighlightText,
colorNeutralForeground5Selected: hcHighlightText,
colorNeutralForegroundDisabled: hcDisabled,
colorNeutralForegroundInvertedDisabled: hcDisabled,
colorBrandForegroundLink: hcHyperlink,
colorBrandForegroundLinkHover: hcHyperlink,
colorBrandForegroundLinkPressed: hcHyperlink,
colorBrandForegroundLinkSelected: hcHyperlink,
colorNeutralForeground2Link: hcHyperlink,
colorNeutralForeground2LinkHover: hcHyperlink,
colorNeutralForeground2LinkPressed: hcHyperlink,
colorNeutralForeground2LinkSelected: hcHyperlink,
colorCompoundBrandForeground1: hcHighlight,
colorCompoundBrandForeground1Hover: hcHighlight,
colorCompoundBrandForeground1Pressed: hcHighlight,
colorBrandForeground1: hcCanvasText,
colorBrandForeground2: hcCanvasText,
colorBrandForeground2Hover: hcCanvasText,
colorBrandForeground2Pressed: hcCanvasText,
colorNeutralForeground1Static: hcCanvas,
colorNeutralForegroundStaticInverted: hcCanvasText,
colorNeutralForegroundInverted: hcHighlightText,
colorNeutralForegroundInvertedHover: hcHighlightText,
colorNeutralForegroundInvertedPressed: hcHighlightText,
colorNeutralForegroundInvertedSelected: hcHighlightText,
colorNeutralForegroundInverted2: hcCanvasText,
colorNeutralForegroundOnBrand: hcButtonText,
colorNeutralForegroundInvertedLink: hcHyperlink,
colorNeutralForegroundInvertedLinkHover: hcHyperlink,
colorNeutralForegroundInvertedLinkPressed: hcHyperlink,
colorNeutralForegroundInvertedLinkSelected: hcHyperlink,
colorBrandForegroundInverted: hcCanvasText,
colorBrandForegroundInvertedHover: hcHighlightText,
colorBrandForegroundInvertedPressed: hcHighlightText,
colorBrandForegroundOnLight: hcButtonText,
colorBrandForegroundOnLightHover: hcHighlightText,
colorBrandForegroundOnLightPressed: hcHighlightText,
colorBrandForegroundOnLightSelected: hcHighlightText,
colorNeutralBackground1: hcCanvas,
colorNeutralBackground1Hover: hcHighlight,
colorNeutralBackground1Pressed: hcHighlight,
colorNeutralBackground1Selected: hcHighlight,
colorNeutralBackground2: hcCanvas,
colorNeutralBackground2Hover: hcHighlight,
colorNeutralBackground2Pressed: hcHighlight,
colorNeutralBackground2Selected: hcHighlight,
colorNeutralBackground3: hcCanvas,
colorNeutralBackground3Hover: hcHighlight,
colorNeutralBackground3Pressed: hcHighlight,
colorNeutralBackground3Selected: hcHighlight,
colorNeutralBackground4: hcCanvas,
colorNeutralBackground4Hover: hcHighlight,
colorNeutralBackground4Pressed: hcHighlight,
colorNeutralBackground4Selected: hcHighlight,
colorNeutralBackground5: hcCanvas,
colorNeutralBackground5Hover: hcHighlight,
colorNeutralBackground5Pressed: hcHighlight,
colorNeutralBackground5Selected: hcHighlight,
colorNeutralBackground6: hcCanvas,
colorNeutralBackground7: hcCanvas,
colorNeutralBackground7Hover: hcHighlight,
colorNeutralBackground7Pressed: hcHighlight,
colorNeutralBackground7Selected: hcHighlight,
colorNeutralBackground8: hcCanvas,
colorNeutralBackgroundInverted: hcCanvas,
colorNeutralBackgroundInvertedHover: hcHighlight,
colorNeutralBackgroundInvertedPressed: hcHighlight,
colorNeutralBackgroundInvertedSelected: hcHighlight,
colorNeutralBackgroundStatic: hcCanvas,
colorNeutralBackgroundAlpha: hcCanvas,
colorNeutralBackgroundAlpha2: hcCanvas,
colorSubtleBackground: 'transparent',
colorSubtleBackgroundHover: hcHighlight,
colorSubtleBackgroundPressed: hcHighlight,
colorSubtleBackgroundSelected: hcHighlight,
colorSubtleBackgroundLightAlphaHover: hcHighlight,
colorSubtleBackgroundLightAlphaPressed: hcHighlight,
colorSubtleBackgroundLightAlphaSelected: hcHighlight,
colorSubtleBackgroundInverted: 'transparent',
colorSubtleBackgroundInvertedHover: hcHighlight,
colorSubtleBackgroundInvertedPressed: hcHighlight,
colorSubtleBackgroundInvertedSelected: hcHighlight,
colorTransparentBackground: 'transparent',
colorTransparentBackgroundHover: hcHighlight,
colorTransparentBackgroundPressed: hcHighlight,
colorTransparentBackgroundSelected: hcHighlight,
colorNeutralBackgroundDisabled: hcCanvas,
colorNeutralBackgroundDisabled2: hcDisabled,
colorNeutralBackgroundInvertedDisabled: hcCanvas,
colorNeutralStencil1: hcCanvasText,
colorNeutralStencil2: hcCanvasText,
colorNeutralStencil1Alpha: hcCanvasText,
colorNeutralStencil2Alpha: hcCanvasText,
colorBackgroundOverlay: blackAlpha[50],
colorScrollbarOverlay: hcButtonFace,
colorBrandBackground: hcButtonFace,
colorBrandBackgroundHover: hcHighlight,
colorBrandBackgroundPressed: hcHighlight,
colorBrandBackgroundSelected: hcHighlight,
colorCompoundBrandBackground: hcHighlight,
colorCompoundBrandBackgroundHover: hcHighlight,
colorCompoundBrandBackgroundPressed: hcHighlight,
colorBrandBackgroundStatic: hcCanvas,
colorBrandBackground2: hcCanvas,
colorBrandBackground2Hover: hcCanvas,
colorBrandBackground2Pressed: hcCanvas,
colorBrandBackground3Static: hcCanvas,
colorBrandBackground4Static: hcCanvas,
colorBrandBackgroundInverted: hcButtonFace,
colorBrandBackgroundInvertedHover: hcHighlight,
colorBrandBackgroundInvertedPressed: hcHighlight,
colorBrandBackgroundInvertedSelected: hcHighlight,
colorNeutralCardBackground: hcCanvas,
colorNeutralCardBackgroundHover: hcHighlight,
colorNeutralCardBackgroundPressed: hcHighlight,
colorNeutralCardBackgroundSelected: hcHighlight,
colorNeutralCardBackgroundDisabled: hcCanvas,
colorNeutralStrokeAccessible: hcCanvasText,
colorNeutralStrokeAccessibleHover: hcHighlight,
colorNeutralStrokeAccessiblePressed: hcHighlight,
colorNeutralStrokeAccessibleSelected: hcHighlight,
colorNeutralStroke1: hcCanvasText,
colorNeutralStroke1Hover: hcHighlight,
colorNeutralStroke1Pressed: hcHighlight,
colorNeutralStroke1Selected: hcHighlight,
colorNeutralStroke2: hcCanvasText,
colorNeutralStroke3: hcCanvasText,
colorNeutralStroke4: hcCanvasText,
colorNeutralStroke4Hover: hcHighlight,
colorNeutralStroke4Pressed: hcHighlight,
colorNeutralStroke4Selected: hcHighlight,
colorNeutralStrokeSubtle: hcCanvasText,
colorNeutralStrokeOnBrand: hcCanvas,
colorNeutralStrokeOnBrand2: hcCanvasText,
colorNeutralStrokeOnBrand2Hover: hcCanvasText,
colorNeutralStrokeOnBrand2Pressed: hcCanvasText,
colorNeutralStrokeOnBrand2Selected: hcCanvasText,
colorBrandStroke1: hcCanvasText,
colorBrandStroke2: hcCanvasText,
colorBrandStroke2Hover: hcHighlight,
colorBrandStroke2Pressed: hcHighlight,
colorBrandStroke2Contrast: hcCanvas,
colorCompoundBrandStroke: hcHighlight,
colorCompoundBrandStrokeHover: hcHighlight,
colorCompoundBrandStrokePressed: hcHighlight,
colorNeutralStrokeDisabled: hcDisabled,
colorNeutralStrokeDisabled2: hcDisabled,
colorNeutralStrokeInvertedDisabled: hcDisabled,
colorTransparentStroke: hcCanvasText,
colorTransparentStrokeInteractive: hcHighlight,
colorTransparentStrokeDisabled: hcDisabled,
colorNeutralStrokeAlpha: hcCanvasText,
colorNeutralStrokeAlpha2: hcCanvas,
colorStrokeFocus1: hcCanvas,
colorStrokeFocus2: hcHighlight,
colorNeutralShadowAmbient: 'rgba(0,0,0,0.24)',
colorNeutralShadowKey: 'rgba(0,0,0,0.28)',
colorNeutralShadowAmbientLighter: 'rgba(0,0,0,0.12)',
colorNeutralShadowKeyLighter: 'rgba(0,0,0,0.14)',
colorNeutralShadowAmbientDarker: 'rgba(0,0,0,0.40)',
colorNeutralShadowKeyDarker: 'rgba(0,0,0,0.48)',
colorBrandShadowAmbient: 'rgba(0,0,0,0.30)',
colorBrandShadowKey: 'rgba(0,0,0,0.25)'
});

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,55 @@
import { hcHighlight, hcCanvas, hcCanvasText } from "../global/colors.js";
import { statusSharedColorNames, personaSharedColorNames } from "../sharedColorNames.js";
import { statusColorMapping } from "../statusColorMapping.js";
const statusColorPaletteTokens = statusSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background1`]: hcCanvas,
[`colorPalette${color}Background2`]: hcCanvas,
[`colorPalette${color}Background3`]: hcCanvasText,
[`colorPalette${color}Foreground1`]: hcCanvasText,
[`colorPalette${color}Foreground2`]: hcCanvasText,
[`colorPalette${color}Foreground3`]: hcCanvasText,
[`colorPalette${color}BorderActive`]: hcHighlight,
[`colorPalette${color}Border1`]: hcCanvasText,
[`colorPalette${color}Border2`]: hcCanvasText
};
return Object.assign(acc, sharedColorTokens);
}, {});
// one-off patches
statusColorPaletteTokens.colorPaletteRedForegroundInverted = hcCanvasText;
statusColorPaletteTokens.colorPaletteGreenForegroundInverted = hcCanvasText;
statusColorPaletteTokens.colorPaletteYellowForegroundInverted = hcCanvasText;
const personaColorPaletteTokens = personaSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background2`]: hcCanvas,
[`colorPalette${color}Foreground2`]: hcCanvasText,
[`colorPalette${color}BorderActive`]: hcHighlight
};
return Object.assign(acc, sharedColorTokens);
}, {});
export const colorPaletteTokens = {
...statusColorPaletteTokens,
...personaColorPaletteTokens
};
export const colorStatusTokens = Object.entries(statusColorMapping).reduce((acc, [statusColor, sharedColor])=>{
const color = statusColor.slice(0, 1).toUpperCase() + statusColor.slice(1);
// TODO: double check the mapping with design
const statusColorTokens = {
[`colorStatus${color}Background1`]: hcCanvas,
[`colorStatus${color}Background2`]: hcCanvas,
[`colorStatus${color}Background3`]: hcCanvasText,
[`colorStatus${color}Foreground1`]: hcCanvasText,
[`colorStatus${color}Foreground2`]: hcCanvasText,
[`colorStatus${color}Foreground3`]: hcCanvasText,
[`colorStatus${color}BorderActive`]: hcHighlight,
[`colorStatus${color}ForegroundInverted`]: hcCanvasText,
[`colorStatus${color}Border1`]: hcCanvasText,
[`colorStatus${color}Border2`]: hcCanvasText
};
return Object.assign(acc, statusColorTokens);
}, {});
// one-off overrides for colorStatus tokens
colorStatusTokens.colorStatusDangerBackground3Hover = hcHighlight;
colorStatusTokens.colorStatusDangerBackground3Pressed = hcHighlight;

File diff suppressed because one or more lines are too long

187
node_modules/@fluentui/tokens/lib/alias/lightColor.js generated vendored Normal file
View File

@@ -0,0 +1,187 @@
/* !!! DO NOT EDIT !!! */ /* This file has been generated by the token pipeline */ import { black, blackAlpha, grey, white, whiteAlpha } from "../global/colors.js";
export const generateColorTokens = (brand)=>({
colorNeutralForeground1: grey[14],
colorNeutralForeground1Hover: grey[14],
colorNeutralForeground1Pressed: grey[14],
colorNeutralForeground1Selected: grey[14],
colorNeutralForeground2: grey[26],
colorNeutralForeground2Hover: grey[14],
colorNeutralForeground2Pressed: grey[14],
colorNeutralForeground2Selected: grey[14],
colorNeutralForeground2BrandHover: brand[80],
colorNeutralForeground2BrandPressed: brand[70],
colorNeutralForeground2BrandSelected: brand[80],
colorNeutralForeground3: grey[38],
colorNeutralForeground3Hover: grey[26],
colorNeutralForeground3Pressed: grey[26],
colorNeutralForeground3Selected: grey[26],
colorNeutralForeground3BrandHover: brand[80],
colorNeutralForeground3BrandPressed: brand[70],
colorNeutralForeground3BrandSelected: brand[80],
colorNeutralForeground4: grey[44],
colorNeutralForeground5: grey[38],
colorNeutralForeground5Hover: grey[14],
colorNeutralForeground5Pressed: grey[14],
colorNeutralForeground5Selected: grey[14],
colorNeutralForegroundDisabled: grey[74],
colorNeutralForegroundInvertedDisabled: whiteAlpha[40],
colorBrandForegroundLink: brand[70],
colorBrandForegroundLinkHover: brand[60],
colorBrandForegroundLinkPressed: brand[40],
colorBrandForegroundLinkSelected: brand[70],
colorNeutralForeground2Link: grey[26],
colorNeutralForeground2LinkHover: grey[14],
colorNeutralForeground2LinkPressed: grey[14],
colorNeutralForeground2LinkSelected: grey[14],
colorCompoundBrandForeground1: brand[80],
colorCompoundBrandForeground1Hover: brand[70],
colorCompoundBrandForeground1Pressed: brand[60],
colorBrandForeground1: brand[80],
colorBrandForeground2: brand[70],
colorBrandForeground2Hover: brand[60],
colorBrandForeground2Pressed: brand[30],
colorNeutralForeground1Static: grey[14],
colorNeutralForegroundStaticInverted: white,
colorNeutralForegroundInverted: white,
colorNeutralForegroundInvertedHover: white,
colorNeutralForegroundInvertedPressed: white,
colorNeutralForegroundInvertedSelected: white,
colorNeutralForegroundInverted2: white,
colorNeutralForegroundOnBrand: white,
colorNeutralForegroundInvertedLink: white,
colorNeutralForegroundInvertedLinkHover: white,
colorNeutralForegroundInvertedLinkPressed: white,
colorNeutralForegroundInvertedLinkSelected: white,
colorBrandForegroundInverted: brand[100],
colorBrandForegroundInvertedHover: brand[110],
colorBrandForegroundInvertedPressed: brand[100],
colorBrandForegroundOnLight: brand[80],
colorBrandForegroundOnLightHover: brand[70],
colorBrandForegroundOnLightPressed: brand[50],
colorBrandForegroundOnLightSelected: brand[60],
colorNeutralBackground1: white,
colorNeutralBackground1Hover: grey[96],
colorNeutralBackground1Pressed: grey[88],
colorNeutralBackground1Selected: grey[92],
colorNeutralBackground2: grey[98],
colorNeutralBackground2Hover: grey[94],
colorNeutralBackground2Pressed: grey[86],
colorNeutralBackground2Selected: grey[90],
colorNeutralBackground3: grey[96],
colorNeutralBackground3Hover: grey[92],
colorNeutralBackground3Pressed: grey[84],
colorNeutralBackground3Selected: grey[88],
colorNeutralBackground4: grey[94],
colorNeutralBackground4Hover: grey[98],
colorNeutralBackground4Pressed: grey[96],
colorNeutralBackground4Selected: white,
colorNeutralBackground5: grey[92],
colorNeutralBackground5Hover: grey[96],
colorNeutralBackground5Pressed: grey[94],
colorNeutralBackground5Selected: grey[98],
colorNeutralBackground6: grey[90],
colorNeutralBackground7: '#00000000',
colorNeutralBackground7Hover: grey[92],
colorNeutralBackground7Pressed: grey[84],
colorNeutralBackground7Selected: '#00000000',
colorNeutralBackground8: grey[99],
colorNeutralBackgroundInverted: grey[16],
colorNeutralBackgroundInvertedHover: grey[24],
colorNeutralBackgroundInvertedPressed: grey[12],
colorNeutralBackgroundInvertedSelected: grey[22],
colorNeutralBackgroundStatic: grey[20],
colorNeutralBackgroundAlpha: whiteAlpha[50],
colorNeutralBackgroundAlpha2: whiteAlpha[80],
colorSubtleBackground: 'transparent',
colorSubtleBackgroundHover: grey[96],
colorSubtleBackgroundPressed: grey[88],
colorSubtleBackgroundSelected: grey[92],
colorSubtleBackgroundLightAlphaHover: whiteAlpha[70],
colorSubtleBackgroundLightAlphaPressed: whiteAlpha[50],
colorSubtleBackgroundLightAlphaSelected: 'transparent',
colorSubtleBackgroundInverted: 'transparent',
colorSubtleBackgroundInvertedHover: blackAlpha[10],
colorSubtleBackgroundInvertedPressed: blackAlpha[30],
colorSubtleBackgroundInvertedSelected: blackAlpha[20],
colorTransparentBackground: 'transparent',
colorTransparentBackgroundHover: 'transparent',
colorTransparentBackgroundPressed: 'transparent',
colorTransparentBackgroundSelected: 'transparent',
colorNeutralBackgroundDisabled: grey[94],
colorNeutralBackgroundDisabled2: white,
colorNeutralBackgroundInvertedDisabled: whiteAlpha[10],
colorNeutralStencil1: grey[90],
colorNeutralStencil2: grey[98],
colorNeutralStencil1Alpha: blackAlpha[10],
colorNeutralStencil2Alpha: blackAlpha[5],
colorBackgroundOverlay: blackAlpha[40],
colorScrollbarOverlay: blackAlpha[50],
colorBrandBackground: brand[80],
colorBrandBackgroundHover: brand[70],
colorBrandBackgroundPressed: brand[40],
colorBrandBackgroundSelected: brand[60],
colorCompoundBrandBackground: brand[80],
colorCompoundBrandBackgroundHover: brand[70],
colorCompoundBrandBackgroundPressed: brand[60],
colorBrandBackgroundStatic: brand[80],
colorBrandBackground2: brand[160],
colorBrandBackground2Hover: brand[150],
colorBrandBackground2Pressed: brand[130],
colorBrandBackground3Static: brand[60],
colorBrandBackground4Static: brand[40],
colorBrandBackgroundInverted: white,
colorBrandBackgroundInvertedHover: brand[160],
colorBrandBackgroundInvertedPressed: brand[140],
colorBrandBackgroundInvertedSelected: brand[150],
colorNeutralCardBackground: grey[98],
colorNeutralCardBackgroundHover: white,
colorNeutralCardBackgroundPressed: grey[96],
colorNeutralCardBackgroundSelected: grey[92],
colorNeutralCardBackgroundDisabled: grey[94],
colorNeutralStrokeAccessible: grey[38],
colorNeutralStrokeAccessibleHover: grey[34],
colorNeutralStrokeAccessiblePressed: grey[30],
colorNeutralStrokeAccessibleSelected: brand[80],
colorNeutralStroke1: grey[82],
colorNeutralStroke1Hover: grey[78],
colorNeutralStroke1Pressed: grey[70],
colorNeutralStroke1Selected: grey[74],
colorNeutralStroke2: grey[88],
colorNeutralStroke3: grey[94],
colorNeutralStroke4: grey[92],
colorNeutralStroke4Hover: grey[88],
colorNeutralStroke4Pressed: grey[84],
colorNeutralStroke4Selected: grey[92],
colorNeutralStrokeSubtle: grey[88],
colorNeutralStrokeOnBrand: white,
colorNeutralStrokeOnBrand2: white,
colorNeutralStrokeOnBrand2Hover: white,
colorNeutralStrokeOnBrand2Pressed: white,
colorNeutralStrokeOnBrand2Selected: white,
colorBrandStroke1: brand[80],
colorBrandStroke2: brand[140],
colorBrandStroke2Hover: brand[120],
colorBrandStroke2Pressed: brand[80],
colorBrandStroke2Contrast: brand[140],
colorCompoundBrandStroke: brand[80],
colorCompoundBrandStrokeHover: brand[70],
colorCompoundBrandStrokePressed: brand[60],
colorNeutralStrokeDisabled: grey[88],
colorNeutralStrokeDisabled2: grey[92],
colorNeutralStrokeInvertedDisabled: whiteAlpha[40],
colorTransparentStroke: 'transparent',
colorTransparentStrokeInteractive: 'transparent',
colorTransparentStrokeDisabled: 'transparent',
colorNeutralStrokeAlpha: blackAlpha[5],
colorNeutralStrokeAlpha2: whiteAlpha[20],
colorStrokeFocus1: white,
colorStrokeFocus2: black,
colorNeutralShadowAmbient: 'rgba(0,0,0,0.12)',
colorNeutralShadowKey: 'rgba(0,0,0,0.14)',
colorNeutralShadowAmbientLighter: 'rgba(0,0,0,0.06)',
colorNeutralShadowKeyLighter: 'rgba(0,0,0,0.07)',
colorNeutralShadowAmbientDarker: 'rgba(0,0,0,0.20)',
colorNeutralShadowKeyDarker: 'rgba(0,0,0,0.24)',
colorBrandShadowAmbient: 'rgba(0,0,0,0.30)',
colorBrandShadowKey: 'rgba(0,0,0,0.25)'
});

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,59 @@
import { statusSharedColors, personaSharedColors, mappedStatusColors } from "../global/colorPalette.js";
import { statusSharedColorNames, personaSharedColorNames } from "../sharedColorNames.js";
import { statusColorMapping } from "../statusColorMapping.js";
const statusColorPaletteTokens = statusSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background1`]: statusSharedColors[sharedColor].tint60,
[`colorPalette${color}Background2`]: statusSharedColors[sharedColor].tint40,
[`colorPalette${color}Background3`]: statusSharedColors[sharedColor].primary,
[`colorPalette${color}Foreground1`]: statusSharedColors[sharedColor].shade10,
[`colorPalette${color}Foreground2`]: statusSharedColors[sharedColor].shade30,
[`colorPalette${color}Foreground3`]: statusSharedColors[sharedColor].primary,
[`colorPalette${color}BorderActive`]: statusSharedColors[sharedColor].primary,
[`colorPalette${color}Border1`]: statusSharedColors[sharedColor].tint40,
[`colorPalette${color}Border2`]: statusSharedColors[sharedColor].primary
};
return Object.assign(acc, sharedColorTokens);
}, {});
// one-off patch for yellow
statusColorPaletteTokens.colorPaletteYellowForeground1 = statusSharedColors.yellow.shade30;
statusColorPaletteTokens.colorPaletteRedForegroundInverted = statusSharedColors.red.tint20;
statusColorPaletteTokens.colorPaletteGreenForegroundInverted = statusSharedColors.green.tint20;
statusColorPaletteTokens.colorPaletteYellowForegroundInverted = statusSharedColors.yellow.tint40;
const personaColorPaletteTokens = personaSharedColorNames.reduce((acc, sharedColor)=>{
const color = sharedColor.slice(0, 1).toUpperCase() + sharedColor.slice(1);
const sharedColorTokens = {
[`colorPalette${color}Background2`]: personaSharedColors[sharedColor].tint40,
[`colorPalette${color}Foreground2`]: personaSharedColors[sharedColor].shade30,
[`colorPalette${color}BorderActive`]: personaSharedColors[sharedColor].primary
};
return Object.assign(acc, sharedColorTokens);
}, {});
export const colorPaletteTokens = {
...statusColorPaletteTokens,
...personaColorPaletteTokens
};
export const colorStatusTokens = Object.entries(statusColorMapping).reduce((acc, [statusColor, sharedColor])=>{
const color = statusColor.slice(0, 1).toUpperCase() + statusColor.slice(1);
// TODO: double check the mapping with design
const statusColorTokens = {
[`colorStatus${color}Background1`]: mappedStatusColors[sharedColor].tint60,
[`colorStatus${color}Background2`]: mappedStatusColors[sharedColor].tint40,
[`colorStatus${color}Background3`]: mappedStatusColors[sharedColor].primary,
[`colorStatus${color}Foreground1`]: mappedStatusColors[sharedColor].shade10,
[`colorStatus${color}Foreground2`]: mappedStatusColors[sharedColor].shade30,
[`colorStatus${color}Foreground3`]: mappedStatusColors[sharedColor].primary,
[`colorStatus${color}ForegroundInverted`]: mappedStatusColors[sharedColor].tint30,
[`colorStatus${color}BorderActive`]: mappedStatusColors[sharedColor].primary,
[`colorStatus${color}Border1`]: mappedStatusColors[sharedColor].tint40,
[`colorStatus${color}Border2`]: mappedStatusColors[sharedColor].primary
};
return Object.assign(acc, statusColorTokens);
}, {});
// one-off overrides for colorStatus tokens
colorStatusTokens.colorStatusDangerBackground3Hover = mappedStatusColors[statusColorMapping.danger].shade10;
colorStatusTokens.colorStatusDangerBackground3Pressed = mappedStatusColors[statusColorMapping.danger].shade20;
colorStatusTokens.colorStatusWarningForeground1 = mappedStatusColors[statusColorMapping.warning].shade20;
colorStatusTokens.colorStatusWarningForeground3 = mappedStatusColors[statusColorMapping.warning].shade20;
colorStatusTokens.colorStatusWarningBorder2 = mappedStatusColors[statusColorMapping.warning].shade20;

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,187 @@
/* !!! DO NOT EDIT !!! */ /* This file has been generated by the token pipeline */ import { black, blackAlpha, grey, grey10Alpha, grey12Alpha, grey14Alpha, white, whiteAlpha } from "../global/colors.js";
export const generateColorTokens = (brand)=>({
colorNeutralForeground1: white,
colorNeutralForeground1Hover: white,
colorNeutralForeground1Pressed: white,
colorNeutralForeground1Selected: white,
colorNeutralForeground2: grey[84],
colorNeutralForeground2Hover: white,
colorNeutralForeground2Pressed: white,
colorNeutralForeground2Selected: white,
colorNeutralForeground2BrandHover: brand[100],
colorNeutralForeground2BrandPressed: brand[90],
colorNeutralForeground2BrandSelected: brand[100],
colorNeutralForeground3: grey[68],
colorNeutralForeground3Hover: grey[84],
colorNeutralForeground3Pressed: grey[84],
colorNeutralForeground3Selected: grey[84],
colorNeutralForeground3BrandHover: brand[100],
colorNeutralForeground3BrandPressed: brand[90],
colorNeutralForeground3BrandSelected: brand[100],
colorNeutralForeground4: grey[60],
colorNeutralForeground5: grey[68],
colorNeutralForeground5Hover: white,
colorNeutralForeground5Pressed: white,
colorNeutralForeground5Selected: white,
colorNeutralForegroundDisabled: grey[36],
colorNeutralForegroundInvertedDisabled: whiteAlpha[40],
colorBrandForegroundLink: brand[100],
colorBrandForegroundLinkHover: brand[110],
colorBrandForegroundLinkPressed: brand[90],
colorBrandForegroundLinkSelected: brand[100],
colorNeutralForeground2Link: grey[84],
colorNeutralForeground2LinkHover: white,
colorNeutralForeground2LinkPressed: white,
colorNeutralForeground2LinkSelected: white,
colorCompoundBrandForeground1: brand[100],
colorCompoundBrandForeground1Hover: brand[110],
colorCompoundBrandForeground1Pressed: brand[90],
colorBrandForeground1: brand[100],
colorBrandForeground2: brand[120],
colorBrandForeground2Hover: brand[130],
colorBrandForeground2Pressed: brand[160],
colorNeutralForeground1Static: grey[14],
colorNeutralForegroundStaticInverted: white,
colorNeutralForegroundInverted: grey[14],
colorNeutralForegroundInvertedHover: grey[14],
colorNeutralForegroundInvertedPressed: grey[14],
colorNeutralForegroundInvertedSelected: grey[14],
colorNeutralForegroundInverted2: grey[14],
colorNeutralForegroundOnBrand: white,
colorNeutralForegroundInvertedLink: white,
colorNeutralForegroundInvertedLinkHover: white,
colorNeutralForegroundInvertedLinkPressed: white,
colorNeutralForegroundInvertedLinkSelected: white,
colorBrandForegroundInverted: brand[80],
colorBrandForegroundInvertedHover: brand[70],
colorBrandForegroundInvertedPressed: brand[60],
colorBrandForegroundOnLight: brand[80],
colorBrandForegroundOnLightHover: brand[70],
colorBrandForegroundOnLightPressed: brand[50],
colorBrandForegroundOnLightSelected: brand[60],
colorNeutralBackground1: grey[16],
colorNeutralBackground1Hover: grey[24],
colorNeutralBackground1Pressed: grey[12],
colorNeutralBackground1Selected: grey[22],
colorNeutralBackground2: grey[14],
colorNeutralBackground2Hover: grey[22],
colorNeutralBackground2Pressed: grey[10],
colorNeutralBackground2Selected: grey[20],
colorNeutralBackground3: grey[12],
colorNeutralBackground3Hover: grey[20],
colorNeutralBackground3Pressed: grey[8],
colorNeutralBackground3Selected: grey[18],
colorNeutralBackground4: grey[8],
colorNeutralBackground4Hover: grey[16],
colorNeutralBackground4Pressed: grey[4],
colorNeutralBackground4Selected: grey[14],
colorNeutralBackground5: grey[4],
colorNeutralBackground5Hover: grey[12],
colorNeutralBackground5Pressed: black,
colorNeutralBackground5Selected: grey[10],
colorNeutralBackground6: grey[20],
colorNeutralBackground7: '#00000000',
colorNeutralBackground7Hover: grey[10],
colorNeutralBackground7Pressed: grey[4],
colorNeutralBackground7Selected: '#00000000',
colorNeutralBackground8: grey[16],
colorNeutralBackgroundInverted: white,
colorNeutralBackgroundInvertedHover: grey[96],
colorNeutralBackgroundInvertedPressed: grey[88],
colorNeutralBackgroundInvertedSelected: grey[92],
colorNeutralBackgroundStatic: grey[24],
colorNeutralBackgroundAlpha: grey10Alpha[50],
colorNeutralBackgroundAlpha2: grey12Alpha[70],
colorSubtleBackground: 'transparent',
colorSubtleBackgroundHover: grey[22],
colorSubtleBackgroundPressed: grey[18],
colorSubtleBackgroundSelected: grey[20],
colorSubtleBackgroundLightAlphaHover: grey14Alpha[80],
colorSubtleBackgroundLightAlphaPressed: grey14Alpha[50],
colorSubtleBackgroundLightAlphaSelected: 'transparent',
colorSubtleBackgroundInverted: 'transparent',
colorSubtleBackgroundInvertedHover: blackAlpha[10],
colorSubtleBackgroundInvertedPressed: blackAlpha[30],
colorSubtleBackgroundInvertedSelected: blackAlpha[20],
colorTransparentBackground: 'transparent',
colorTransparentBackgroundHover: 'transparent',
colorTransparentBackgroundPressed: 'transparent',
colorTransparentBackgroundSelected: 'transparent',
colorNeutralBackgroundDisabled: grey[8],
colorNeutralBackgroundDisabled2: grey[16],
colorNeutralBackgroundInvertedDisabled: whiteAlpha[10],
colorNeutralStencil1: grey[34],
colorNeutralStencil2: grey[20],
colorNeutralStencil1Alpha: whiteAlpha[10],
colorNeutralStencil2Alpha: whiteAlpha[5],
colorBackgroundOverlay: blackAlpha[50],
colorScrollbarOverlay: whiteAlpha[60],
colorBrandBackground: brand[70],
colorBrandBackgroundHover: brand[80],
colorBrandBackgroundPressed: brand[40],
colorBrandBackgroundSelected: brand[60],
colorCompoundBrandBackground: brand[100],
colorCompoundBrandBackgroundHover: brand[110],
colorCompoundBrandBackgroundPressed: brand[90],
colorBrandBackgroundStatic: brand[80],
colorBrandBackground2: brand[20],
colorBrandBackground2Hover: brand[40],
colorBrandBackground2Pressed: brand[10],
colorBrandBackground3Static: brand[60],
colorBrandBackground4Static: brand[40],
colorBrandBackgroundInverted: white,
colorBrandBackgroundInvertedHover: brand[160],
colorBrandBackgroundInvertedPressed: brand[140],
colorBrandBackgroundInvertedSelected: brand[150],
colorNeutralCardBackground: grey[20],
colorNeutralCardBackgroundHover: grey[24],
colorNeutralCardBackgroundPressed: grey[18],
colorNeutralCardBackgroundSelected: grey[22],
colorNeutralCardBackgroundDisabled: grey[8],
colorNeutralStrokeAccessible: grey[68],
colorNeutralStrokeAccessibleHover: grey[74],
colorNeutralStrokeAccessiblePressed: grey[70],
colorNeutralStrokeAccessibleSelected: brand[100],
colorNeutralStroke1: grey[40],
colorNeutralStroke1Hover: grey[46],
colorNeutralStroke1Pressed: grey[42],
colorNeutralStroke1Selected: grey[44],
colorNeutralStroke2: grey[32],
colorNeutralStroke3: grey[24],
colorNeutralStroke4: grey[24],
colorNeutralStroke4Hover: grey[18],
colorNeutralStroke4Pressed: grey[14],
colorNeutralStroke4Selected: grey[24],
colorNeutralStrokeSubtle: grey[4],
colorNeutralStrokeOnBrand: grey[16],
colorNeutralStrokeOnBrand2: white,
colorNeutralStrokeOnBrand2Hover: white,
colorNeutralStrokeOnBrand2Pressed: white,
colorNeutralStrokeOnBrand2Selected: white,
colorBrandStroke1: brand[100],
colorBrandStroke2: brand[50],
colorBrandStroke2Hover: brand[50],
colorBrandStroke2Pressed: brand[30],
colorBrandStroke2Contrast: brand[50],
colorCompoundBrandStroke: brand[90],
colorCompoundBrandStrokeHover: brand[100],
colorCompoundBrandStrokePressed: brand[80],
colorNeutralStrokeDisabled: grey[26],
colorNeutralStrokeDisabled2: grey[24],
colorNeutralStrokeInvertedDisabled: whiteAlpha[40],
colorTransparentStroke: 'transparent',
colorTransparentStrokeInteractive: 'transparent',
colorTransparentStrokeDisabled: 'transparent',
colorNeutralStrokeAlpha: whiteAlpha[10],
colorNeutralStrokeAlpha2: whiteAlpha[20],
colorStrokeFocus1: black,
colorStrokeFocus2: white,
colorNeutralShadowAmbient: 'rgba(0,0,0,0.24)',
colorNeutralShadowKey: 'rgba(0,0,0,0.28)',
colorNeutralShadowAmbientLighter: 'rgba(0,0,0,0.12)',
colorNeutralShadowKeyLighter: 'rgba(0,0,0,0.14)',
colorNeutralShadowAmbientDarker: 'rgba(0,0,0,0.40)',
colorNeutralShadowKeyDarker: 'rgba(0,0,0,0.48)',
colorBrandShadowAmbient: 'rgba(0,0,0,0.30)',
colorBrandShadowKey: 'rgba(0,0,0,0.25)'
});

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
import { fontFamilies as globalFontFamilies } from "../global/fonts.js";
export const fontFamilies = {
...globalFontFamilies,
fontFamilyBase: '-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Apple Color Emoji", "Segoe UI Emoji", sans-serif'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/alias/teamsFontFamilies.ts"],"sourcesContent":["import { fontFamilies as globalFontFamilies } from '../global/fonts';\n\nexport const fontFamilies = {\n ...globalFontFamilies,\n fontFamilyBase:\n '-apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, \"Apple Color Emoji\", \"Segoe UI Emoji\", sans-serif',\n};\n"],"names":["fontFamilies","globalFontFamilies","fontFamilyBase"],"mappings":"AAAA,SAASA,gBAAgBC,kBAAkB,QAAQ,qBAAkB;AAErE,OAAO,MAAMD,eAAe;IAC1B,GAAGC,kBAAkB;IACrBC,gBACE;AACJ,EAAE"}

View File

@@ -0,0 +1,13 @@
export const borderRadius = {
borderRadiusNone: '0',
borderRadiusSmall: '2px',
borderRadiusMedium: '4px',
borderRadiusLarge: '6px',
borderRadiusXLarge: '8px',
borderRadius2XLarge: '12px',
borderRadius3XLarge: '16px',
borderRadius4XLarge: '24px',
borderRadius5XLarge: '32px',
borderRadius6XLarge: '40px',
borderRadiusCircular: '10000px'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/borderRadius.ts"],"sourcesContent":["import type { BorderRadiusTokens } from '../types';\n\nexport const borderRadius: BorderRadiusTokens = {\n borderRadiusNone: '0',\n borderRadiusSmall: '2px',\n borderRadiusMedium: '4px',\n borderRadiusLarge: '6px',\n borderRadiusXLarge: '8px',\n borderRadius2XLarge: '12px',\n borderRadius3XLarge: '16px',\n borderRadius4XLarge: '24px',\n borderRadius5XLarge: '32px',\n borderRadius6XLarge: '40px',\n borderRadiusCircular: '10000px',\n};\n"],"names":["borderRadius","borderRadiusNone","borderRadiusSmall","borderRadiusMedium","borderRadiusLarge","borderRadiusXLarge","borderRadius2XLarge","borderRadius3XLarge","borderRadius4XLarge","borderRadius5XLarge","borderRadius6XLarge","borderRadiusCircular"],"mappings":"AAEA,OAAO,MAAMA,eAAmC;IAC9CC,kBAAkB;IAClBC,mBAAmB;IACnBC,oBAAoB;IACpBC,mBAAmB;IACnBC,oBAAoB;IACpBC,qBAAqB;IACrBC,qBAAqB;IACrBC,qBAAqB;IACrBC,qBAAqB;IACrBC,qBAAqB;IACrBC,sBAAsB;AACxB,EAAE"}

View File

@@ -0,0 +1,72 @@
export const brandWeb = {
10: `#061724`,
20: `#082338`,
30: `#0a2e4a`,
40: `#0c3b5e`,
50: `#0e4775`,
60: `#0f548c`,
70: `#115ea3`,
80: `#0f6cbd`,
90: `#2886de`,
100: `#479ef5`,
110: `#62abf5`,
120: `#77b7f7`,
130: `#96c6fa`,
140: `#b4d6fa`,
150: `#cfe4fa`,
160: `#ebf3fc`
};
export const brandTeams = {
10: `#2b2b40`,
20: `#2f2f4a`,
30: `#333357`,
40: `#383966`,
50: `#3d3e78`,
60: `#444791`,
70: `#4f52b2`,
80: `#5b5fc7`,
90: `#7579eb`,
100: `#7f85f5`,
110: `#9299f7`,
120: `#aab1fa`,
130: `#b6bcfa`,
140: `#c5cbfa`,
150: `#dce0fa`,
160: `#e8ebfa`
};
export const brandOffice = {
10: `#29130b`,
20: `#4d2415`,
30: `#792000`,
40: `#99482b`,
50: `#a52c00`,
60: `#c33400`,
70: `#e06a3f`,
80: `#d83b01`,
90: `#dd4f1b`,
100: `#fe7948`,
110: `#ff865a`,
120: `#ff9973`,
130: `#e8825d`,
140: `#ffb498`,
150: `#f4beaa`,
160: `#f9dcd1`
};
export const brandTeamsV21 = {
10: `#29274f`,
20: `#2f2a5e`,
30: `#352e70`,
40: `#3b3185`,
50: `#44359e`,
60: `#4d3aba`,
70: `#5a40db`,
80: `#654cf5`,
90: `#7769fa`,
100: `#887dff`,
110: `#9791ff`,
120: `#aba8ff`,
130: `#bab8ff`,
140: `#c8c7ff`,
150: `#dcdbff`,
160: `#e8e8ff`
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/brandColors.ts"],"sourcesContent":["import type { BrandVariants } from '../types';\n\nexport const brandWeb: BrandVariants = {\n 10: `#061724`,\n 20: `#082338`,\n 30: `#0a2e4a`,\n 40: `#0c3b5e`,\n 50: `#0e4775`,\n 60: `#0f548c`,\n 70: `#115ea3`,\n 80: `#0f6cbd`,\n 90: `#2886de`,\n 100: `#479ef5`,\n 110: `#62abf5`,\n 120: `#77b7f7`,\n 130: `#96c6fa`,\n 140: `#b4d6fa`,\n 150: `#cfe4fa`,\n 160: `#ebf3fc`,\n};\n\nexport const brandTeams: BrandVariants = {\n 10: `#2b2b40`,\n 20: `#2f2f4a`,\n 30: `#333357`,\n 40: `#383966`,\n 50: `#3d3e78`,\n 60: `#444791`,\n 70: `#4f52b2`,\n 80: `#5b5fc7`,\n 90: `#7579eb`,\n 100: `#7f85f5`,\n 110: `#9299f7`,\n 120: `#aab1fa`,\n 130: `#b6bcfa`,\n 140: `#c5cbfa`,\n 150: `#dce0fa`,\n 160: `#e8ebfa`,\n};\n\nexport const brandOffice: BrandVariants = {\n 10: `#29130b`,\n 20: `#4d2415`,\n 30: `#792000`,\n 40: `#99482b`,\n 50: `#a52c00`,\n 60: `#c33400`,\n 70: `#e06a3f`,\n 80: `#d83b01`,\n 90: `#dd4f1b`,\n 100: `#fe7948`,\n 110: `#ff865a`,\n 120: `#ff9973`,\n 130: `#e8825d`,\n 140: `#ffb498`,\n 150: `#f4beaa`,\n 160: `#f9dcd1`,\n};\n\nexport const brandTeamsV21: BrandVariants = {\n 10: `#29274f`,\n 20: `#2f2a5e`,\n 30: `#352e70`,\n 40: `#3b3185`,\n 50: `#44359e`,\n 60: `#4d3aba`,\n 70: `#5a40db`,\n 80: `#654cf5`,\n 90: `#7769fa`,\n 100: `#887dff`,\n 110: `#9791ff`,\n 120: `#aba8ff`,\n 130: `#bab8ff`,\n 140: `#c8c7ff`,\n 150: `#dcdbff`,\n 160: `#e8e8ff`,\n};\n"],"names":["brandWeb","brandTeams","brandOffice","brandTeamsV21"],"mappings":"AAEA,OAAO,MAAMA,WAA0B;IACrC,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;AAChB,EAAE;AAEF,OAAO,MAAMC,aAA4B;IACvC,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;AAChB,EAAE;AAEF,OAAO,MAAMC,cAA6B;IACxC,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;AAChB,EAAE;AAEF,OAAO,MAAMC,gBAA+B;IAC1C,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,IAAI,CAAC,OAAO,CAAC;IACb,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;IACd,KAAK,CAAC,OAAO,CAAC;AAChB,EAAE"}

View File

@@ -0,0 +1,45 @@
import { red, green, darkOrange, yellow, berry, lightGreen, marigold, darkRed, cranberry, pumpkin, peach, gold, brass, brown, forest, seafoam, darkGreen, lightTeal, teal, steel, blue, royalBlue, cornflower, navy, lavender, purple, grape, lilac, pink, magenta, plum, beige, mink, platinum, anchor, orange } from "./colors.js";
export const statusSharedColors = {
red,
green,
darkOrange,
yellow,
berry,
lightGreen,
marigold
};
export const personaSharedColors = {
darkRed,
cranberry,
pumpkin,
peach,
gold,
brass,
brown,
forest,
seafoam,
darkGreen,
lightTeal,
teal,
steel,
blue,
royalBlue,
cornflower,
navy,
lavender,
purple,
grape,
lilac,
pink,
magenta,
plum,
beige,
mink,
platinum,
anchor
};
export const mappedStatusColors = {
cranberry,
green,
orange
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/colorPalette.ts"],"sourcesContent":["import {\n red,\n green,\n darkOrange,\n yellow,\n berry,\n lightGreen,\n marigold,\n darkRed,\n cranberry,\n pumpkin,\n peach,\n gold,\n brass,\n brown,\n forest,\n seafoam,\n darkGreen,\n lightTeal,\n teal,\n steel,\n blue,\n royalBlue,\n cornflower,\n navy,\n lavender,\n purple,\n grape,\n lilac,\n pink,\n magenta,\n plum,\n beige,\n mink,\n platinum,\n anchor,\n orange,\n} from './colors';\nimport { MappedStatusColors, PersonaSharedColors, StatusSharedColors } from '../types';\n\nexport const statusSharedColors: StatusSharedColors = {\n red,\n green,\n darkOrange,\n yellow,\n berry,\n lightGreen,\n marigold,\n};\n\nexport const personaSharedColors: PersonaSharedColors = {\n darkRed,\n cranberry,\n pumpkin,\n peach,\n gold,\n brass,\n brown,\n forest,\n seafoam,\n darkGreen,\n lightTeal,\n teal,\n steel,\n blue,\n royalBlue,\n cornflower,\n navy,\n lavender,\n purple,\n grape,\n lilac,\n pink,\n magenta,\n plum,\n beige,\n mink,\n platinum,\n anchor,\n};\n\nexport const mappedStatusColors: MappedStatusColors = {\n cranberry,\n green,\n orange,\n};\n"],"names":["red","green","darkOrange","yellow","berry","lightGreen","marigold","darkRed","cranberry","pumpkin","peach","gold","brass","brown","forest","seafoam","darkGreen","lightTeal","teal","steel","blue","royalBlue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","orange","statusSharedColors","personaSharedColors","mappedStatusColors"],"mappings":"AAAA,SACEA,GAAG,EACHC,KAAK,EACLC,UAAU,EACVC,MAAM,EACNC,KAAK,EACLC,UAAU,EACVC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,KAAK,EACLC,IAAI,EACJC,KAAK,EACLC,KAAK,EACLC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,IAAI,EACJC,KAAK,EACLC,IAAI,EACJC,SAAS,EACTC,UAAU,EACVC,IAAI,EACJC,QAAQ,EACRC,MAAM,EACNC,KAAK,EACLC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,IAAI,EACJC,KAAK,EACLC,IAAI,EACJC,QAAQ,EACRC,MAAM,EACNC,MAAM,QACD,cAAW;AAGlB,OAAO,MAAMC,qBAAyC;IACpDpC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;AACF,EAAE;AAEF,OAAO,MAAM+B,sBAA2C;IACtD9B;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;IACAC;AACF,EAAE;AAEF,OAAO,MAAMI,qBAAyC;IACpD9B;IACAP;IACAkC;AACF,EAAE"}

808
node_modules/@fluentui/tokens/lib/global/colors.js generated vendored Normal file
View File

@@ -0,0 +1,808 @@
/* !!! DO NOT EDIT !!! */ /* This file has been generated by the token pipeline */ export const grey = {
'2': '#050505',
'4': '#0a0a0a',
'6': '#0f0f0f',
'8': '#141414',
'10': '#1a1a1a',
'12': '#1f1f1f',
'14': '#242424',
'16': '#292929',
'18': '#2e2e2e',
'20': '#333333',
'22': '#383838',
'24': '#3d3d3d',
'26': '#424242',
'28': '#474747',
'30': '#4d4d4d',
'32': '#525252',
'34': '#575757',
'36': '#5c5c5c',
'38': '#616161',
'40': '#666666',
'42': '#6b6b6b',
'44': '#707070',
'46': '#757575',
'48': '#7a7a7a',
'50': '#808080',
'52': '#858585',
'54': '#8a8a8a',
'56': '#8f8f8f',
'58': '#949494',
'60': '#999999',
'62': '#9e9e9e',
'64': '#a3a3a3',
'66': '#a8a8a8',
'68': '#adadad',
'70': '#b3b3b3',
'72': '#b8b8b8',
'74': '#bdbdbd',
'76': '#c2c2c2',
'78': '#c7c7c7',
'80': '#cccccc',
'82': '#d1d1d1',
'84': '#d6d6d6',
'86': '#dbdbdb',
'88': '#e0e0e0',
'90': '#e6e6e6',
'92': '#ebebeb',
'94': '#f0f0f0',
'96': '#f5f5f5',
'98': '#fafafa',
'99': '#fcfcfc'
};
export const whiteAlpha = {
'5': 'rgba(255, 255, 255, 0.05)',
'10': 'rgba(255, 255, 255, 0.1)',
'20': 'rgba(255, 255, 255, 0.2)',
'30': 'rgba(255, 255, 255, 0.3)',
'40': 'rgba(255, 255, 255, 0.4)',
'50': 'rgba(255, 255, 255, 0.5)',
'60': 'rgba(255, 255, 255, 0.6)',
'70': 'rgba(255, 255, 255, 0.7)',
'80': 'rgba(255, 255, 255, 0.8)',
'90': 'rgba(255, 255, 255, 0.9)'
};
export const blackAlpha = {
'5': 'rgba(0, 0, 0, 0.05)',
'10': 'rgba(0, 0, 0, 0.1)',
'20': 'rgba(0, 0, 0, 0.2)',
'30': 'rgba(0, 0, 0, 0.3)',
'40': 'rgba(0, 0, 0, 0.4)',
'50': 'rgba(0, 0, 0, 0.5)',
'60': 'rgba(0, 0, 0, 0.6)',
'70': 'rgba(0, 0, 0, 0.7)',
'80': 'rgba(0, 0, 0, 0.8)',
'90': 'rgba(0, 0, 0, 0.9)'
};
export const grey10Alpha = {
'5': 'rgba(26, 26, 26, 0.05)',
'10': 'rgba(26, 26, 26, 0.1)',
'20': 'rgba(26, 26, 26, 0.2)',
'30': 'rgba(26, 26, 26, 0.3)',
'40': 'rgba(26, 26, 26, 0.4)',
'50': 'rgba(26, 26, 26, 0.5)',
'60': 'rgba(26, 26, 26, 0.6)',
'70': 'rgba(26, 26, 26, 0.7)',
'80': 'rgba(26, 26, 26, 0.8)',
'90': 'rgba(26, 26, 26, 0.9)'
};
export const grey12Alpha = {
'5': 'rgba(31, 31, 31, 0.05)',
'10': 'rgba(31, 31, 31, 0.1)',
'20': 'rgba(31, 31, 31, 0.2)',
'30': 'rgba(31, 31, 31, 0.3)',
'40': 'rgba(31, 31, 31, 0.4)',
'50': 'rgba(31, 31, 31, 0.5)',
'60': 'rgba(31, 31, 31, 0.6)',
'70': 'rgba(31, 31, 31, 0.7)',
'80': 'rgba(31, 31, 31, 0.8)',
'90': 'rgba(31, 31, 31, 0.9)'
};
export const grey14Alpha = {
'5': 'rgba(36, 36, 36, 0.05)',
'10': 'rgba(36, 36, 36, 0.1)',
'20': 'rgba(36, 36, 36, 0.2)',
'30': 'rgba(36, 36, 36, 0.3)',
'40': 'rgba(36, 36, 36, 0.4)',
'50': 'rgba(36, 36, 36, 0.5)',
'60': 'rgba(36, 36, 36, 0.6)',
'70': 'rgba(36, 36, 36, 0.7)',
'80': 'rgba(36, 36, 36, 0.8)',
'90': 'rgba(36, 36, 36, 0.9)'
};
export const white = '#ffffff';
export const black = '#000000';
export const hcHyperlink = '#ffff00';
export const hcHighlight = '#1aebff';
export const hcDisabled = '#3ff23f';
export const hcCanvas = '#000000';
export const hcCanvasText = '#ffffff';
export const hcHighlightText = '#000000';
export const hcButtonText = '#000000';
export const hcButtonFace = '#ffffff';
export const darkRed = {
shade50: '#130204',
shade40: '#230308',
shade30: '#420610',
shade20: '#590815',
shade10: '#690a19',
primary: '#750b1c',
tint10: '#861b2c',
tint20: '#962f3f',
tint30: '#ac4f5e',
tint40: '#d69ca5',
tint50: '#e9c7cd',
tint60: '#f9f0f2'
};
export const burgundy = {
shade50: '#1a0607',
shade40: '#310b0d',
shade30: '#5c1519',
shade20: '#7d1d21',
shade10: '#942228',
primary: '#a4262c',
tint10: '#af393e',
tint20: '#ba4d52',
tint30: '#c86c70',
tint40: '#e4afb2',
tint50: '#f0d3d4',
tint60: '#fbf4f4'
};
export const cranberry = {
shade50: '#200205',
shade40: '#3b0509',
shade30: '#6e0811',
shade20: '#960b18',
shade10: '#b10e1c',
primary: '#c50f1f',
tint10: '#cc2635',
tint20: '#d33f4c',
tint30: '#dc626d',
tint40: '#eeacb2',
tint50: '#f6d1d5',
tint60: '#fdf3f4'
};
export const red = {
shade50: '#210809',
shade40: '#3f1011',
shade30: '#751d1f',
shade20: '#9f282b',
shade10: '#bc2f32',
primary: '#d13438',
tint10: '#d7494c',
tint20: '#dc5e62',
tint30: '#e37d80',
tint40: '#f1bbbc',
tint50: '#f8dadb',
tint60: '#fdf6f6'
};
export const darkOrange = {
shade50: '#230900',
shade40: '#411200',
shade30: '#7a2101',
shade20: '#a62d01',
shade10: '#c43501',
primary: '#da3b01',
tint10: '#de501c',
tint20: '#e36537',
tint30: '#e9835e',
tint40: '#f4bfab',
tint50: '#f9dcd1',
tint60: '#fdf6f3'
};
export const bronze = {
shade50: '#1b0a01',
shade40: '#321303',
shade30: '#5e2405',
shade20: '#7f3107',
shade10: '#963a08',
primary: '#a74109',
tint10: '#b2521e',
tint20: '#bc6535',
tint30: '#ca8057',
tint40: '#e5bba4',
tint50: '#f1d9cc',
tint60: '#fbf5f2'
};
export const pumpkin = {
shade50: '#200d03',
shade40: '#3d1805',
shade30: '#712d09',
shade20: '#9a3d0c',
shade10: '#b6480e',
primary: '#ca5010',
tint10: '#d06228',
tint20: '#d77440',
tint30: '#df8e64',
tint40: '#efc4ad',
tint50: '#f7dfd2',
tint60: '#fdf7f4'
};
export const orange = {
shade50: '#271002',
shade40: '#4a1e04',
shade30: '#8a3707',
shade20: '#bc4b09',
shade10: '#de590b',
primary: '#f7630c',
tint10: '#f87528',
tint20: '#f98845',
tint30: '#faa06b',
tint40: '#fdcfb4',
tint50: '#fee5d7',
tint60: '#fff9f5'
};
export const peach = {
shade50: '#291600',
shade40: '#4d2a00',
shade30: '#8f4e00',
shade20: '#c26a00',
shade10: '#e67e00',
primary: '#ff8c00',
tint10: '#ff9a1f',
tint20: '#ffa83d',
tint30: '#ffba66',
tint40: '#ffddb3',
tint50: '#ffedd6',
tint60: '#fffaf5'
};
export const marigold = {
shade50: '#251a00',
shade40: '#463100',
shade30: '#835b00',
shade20: '#b27c00',
shade10: '#d39300',
primary: '#eaa300',
tint10: '#edad1c',
tint20: '#efb839',
tint30: '#f2c661',
tint40: '#f9e2ae',
tint50: '#fcefd3',
tint60: '#fefbf4'
};
export const yellow = {
shade50: '#282400',
shade40: '#4c4400',
shade30: '#817400',
shade20: '#c0ad00',
shade10: '#e4cc00',
primary: '#fde300',
tint10: '#fde61e',
tint20: '#fdea3d',
tint30: '#feee66',
tint40: '#fef7b2',
tint50: '#fffad6',
tint60: '#fffef5'
};
export const gold = {
shade50: '#1f1900',
shade40: '#3a2f00',
shade30: '#6c5700',
shade20: '#937700',
shade10: '#ae8c00',
primary: '#c19c00',
tint10: '#c8a718',
tint20: '#d0b232',
tint30: '#dac157',
tint40: '#ecdfa5',
tint50: '#f5eece',
tint60: '#fdfbf2'
};
export const brass = {
shade50: '#181202',
shade40: '#2e2103',
shade30: '#553e06',
shade20: '#745408',
shade10: '#89640a',
primary: '#986f0b',
tint10: '#a47d1e',
tint20: '#b18c34',
tint30: '#c1a256',
tint40: '#e0cea2',
tint50: '#efe4cb',
tint60: '#fbf8f2'
};
export const brown = {
shade50: '#170e07',
shade40: '#2b1a0e',
shade30: '#50301a',
shade20: '#6c4123',
shade10: '#804d29',
primary: '#8e562e',
tint10: '#9c663f',
tint20: '#a97652',
tint30: '#bb8f6f',
tint40: '#ddc3b0',
tint50: '#edded3',
tint60: '#faf7f4'
};
export const darkBrown = {
shade50: '#0c0704',
shade40: '#170c08',
shade30: '#2b1710',
shade20: '#3a1f15',
shade10: '#452519',
primary: '#4d291c',
tint10: '#623a2b',
tint20: '#784d3e',
tint30: '#946b5c',
tint40: '#caada3',
tint50: '#e3d2cb',
tint60: '#f8f3f2'
};
export const lime = {
shade50: '#121b06',
shade40: '#23330b',
shade30: '#405f14',
shade20: '#57811b',
shade10: '#689920',
primary: '#73aa24',
tint10: '#81b437',
tint20: '#90be4c',
tint30: '#a4cc6c',
tint40: '#cfe5af',
tint50: '#e5f1d3',
tint60: '#f8fcf4'
};
export const forest = {
shade50: '#0c1501',
shade40: '#162702',
shade30: '#294903',
shade20: '#376304',
shade10: '#427505',
primary: '#498205',
tint10: '#599116',
tint20: '#6ba02b',
tint30: '#85b44c',
tint40: '#bdd99b',
tint50: '#dbebc7',
tint60: '#f6faf0'
};
export const seafoam = {
shade50: '#002111',
shade40: '#003d20',
shade30: '#00723b',
shade20: '#009b51',
shade10: '#00b85f',
primary: '#00cc6a',
tint10: '#19d279',
tint20: '#34d889',
tint30: '#5ae0a0',
tint40: '#a8f0cd',
tint50: '#cff7e4',
tint60: '#f3fdf8'
};
export const lightGreen = {
shade50: '#031a02',
shade40: '#063004',
shade30: '#0b5a08',
shade20: '#0e7a0b',
shade10: '#11910d',
primary: '#13a10e',
tint10: '#27ac22',
tint20: '#3db838',
tint30: '#5ec75a',
tint40: '#a7e3a5',
tint50: '#cef0cd',
tint60: '#f2fbf2'
};
export const green = {
shade50: '#031403',
shade40: '#052505',
shade30: '#094509',
shade20: '#0c5e0c',
shade10: '#0e700e',
primary: '#107c10',
tint10: '#218c21',
tint20: '#359b35',
tint30: '#54b054',
tint40: '#9fd89f',
tint50: '#c9eac9',
tint60: '#f1faf1'
};
export const darkGreen = {
shade50: '#021102',
shade40: '#032003',
shade30: '#063b06',
shade20: '#085108',
shade10: '#0a5f0a',
primary: '#0b6a0b',
tint10: '#1a7c1a',
tint20: '#2d8e2d',
tint30: '#4da64d',
tint40: '#9ad29a',
tint50: '#c6e7c6',
tint60: '#f0f9f0'
};
export const lightTeal = {
shade50: '#001d1f',
shade40: '#00373a',
shade30: '#00666d',
shade20: '#008b94',
shade10: '#00a5af',
primary: '#00b7c3',
tint10: '#18bfca',
tint20: '#32c8d1',
tint30: '#58d3db',
tint40: '#a6e9ed',
tint50: '#cef3f5',
tint60: '#f2fcfd'
};
export const teal = {
shade50: '#001516',
shade40: '#012728',
shade30: '#02494c',
shade20: '#026467',
shade10: '#037679',
primary: '#038387',
tint10: '#159195',
tint20: '#2aa0a4',
tint30: '#4cb4b7',
tint40: '#9bd9db',
tint50: '#c7ebec',
tint60: '#f0fafa'
};
export const darkTeal = {
shade50: '#001010',
shade40: '#001f1f',
shade30: '#003939',
shade20: '#004e4e',
shade10: '#005c5c',
primary: '#006666',
tint10: '#0e7878',
tint20: '#218b8b',
tint30: '#41a3a3',
tint40: '#92d1d1',
tint50: '#c2e7e7',
tint60: '#eff9f9'
};
export const cyan = {
shade50: '#00181e',
shade40: '#002e38',
shade30: '#005669',
shade20: '#00748f',
shade10: '#008aa9',
primary: '#0099bc',
tint10: '#18a4c4',
tint20: '#31afcc',
tint30: '#56bfd7',
tint40: '#a4deeb',
tint50: '#cdedf4',
tint60: '#f2fafc'
};
export const steel = {
shade50: '#000f12',
shade40: '#001b22',
shade30: '#00333f',
shade20: '#004555',
shade10: '#005265',
primary: '#005b70',
tint10: '#0f6c81',
tint20: '#237d92',
tint30: '#4496a9',
tint40: '#94c8d4',
tint50: '#c3e1e8',
tint60: '#eff7f9'
};
export const lightBlue = {
shade50: '#091823',
shade40: '#112d42',
shade30: '#20547c',
shade20: '#2c72a8',
shade10: '#3487c7',
primary: '#3a96dd',
tint10: '#4fa1e1',
tint20: '#65ade5',
tint30: '#83bdeb',
tint40: '#bfddf5',
tint50: '#dcedfa',
tint60: '#f6fafe'
};
export const blue = {
shade50: '#001322',
shade40: '#002440',
shade30: '#004377',
shade20: '#005ba1',
shade10: '#006cbf',
primary: '#0078d4',
tint10: '#1a86d9',
tint20: '#3595de',
tint30: '#5caae5',
tint40: '#a9d3f2',
tint50: '#d0e7f8',
tint60: '#f3f9fd'
};
export const royalBlue = {
shade50: '#000c16',
shade40: '#00172a',
shade30: '#002c4e',
shade20: '#003b6a',
shade10: '#00467e',
primary: '#004e8c',
tint10: '#125e9a',
tint20: '#286fa8',
tint30: '#4a89ba',
tint40: '#9abfdc',
tint50: '#c7dced',
tint60: '#f0f6fa'
};
export const darkBlue = {
shade50: '#000910',
shade40: '#00111f',
shade30: '#002039',
shade20: '#002b4e',
shade10: '#00335c',
primary: '#003966',
tint10: '#0e4a78',
tint20: '#215c8b',
tint30: '#4178a3',
tint40: '#92b5d1',
tint50: '#c2d6e7',
tint60: '#eff4f9'
};
export const cornflower = {
shade50: '#0d1126',
shade40: '#182047',
shade30: '#2c3c85',
shade20: '#3c51b4',
shade10: '#4760d5',
primary: '#4f6bed',
tint10: '#637cef',
tint20: '#778df1',
tint30: '#93a4f4',
tint40: '#c8d1fa',
tint50: '#e1e6fc',
tint60: '#f7f9fe'
};
export const navy = {
shade50: '#00061d',
shade40: '#000c36',
shade30: '#001665',
shade20: '#001e89',
shade10: '#0023a2',
primary: '#0027b4',
tint10: '#173bbd',
tint20: '#3050c6',
tint30: '#546fd2',
tint40: '#a3b2e8',
tint50: '#ccd5f3',
tint60: '#f2f4fc'
};
export const lavender = {
shade50: '#120f25',
shade40: '#221d46',
shade30: '#3f3682',
shade20: '#5649b0',
shade10: '#6656d1',
primary: '#7160e8',
tint10: '#8172eb',
tint20: '#9184ee',
tint30: '#a79cf1',
tint40: '#d2ccf8',
tint50: '#e7e4fb',
tint60: '#f9f8fe'
};
export const purple = {
shade50: '#0f0717',
shade40: '#1c0e2b',
shade30: '#341a51',
shade20: '#46236e',
shade10: '#532982',
primary: '#5c2e91',
tint10: '#6b3f9e',
tint20: '#7c52ab',
tint30: '#9470bd',
tint40: '#c6b1de',
tint50: '#e0d3ed',
tint60: '#f7f4fb'
};
export const darkPurple = {
shade50: '#0a0411',
shade40: '#130820',
shade30: '#240f3c',
shade20: '#311552',
shade10: '#3a1861',
primary: '#401b6c',
tint10: '#512b7e',
tint20: '#633e8f',
tint30: '#7e5ca7',
tint40: '#b9a3d3',
tint50: '#d8cce7',
tint60: '#f5f2f9'
};
export const orchid = {
shade50: '#16101d',
shade40: '#281e37',
shade30: '#4c3867',
shade20: '#674c8c',
shade10: '#795aa6',
primary: '#8764b8',
tint10: '#9373c0',
tint20: '#a083c9',
tint30: '#b29ad4',
tint40: '#d7caea',
tint50: '#e9e2f4',
tint60: '#f9f8fc'
};
export const grape = {
shade50: '#160418',
shade40: '#29072e',
shade30: '#4c0d55',
shade20: '#671174',
shade10: '#7a1589',
primary: '#881798',
tint10: '#952aa4',
tint20: '#a33fb1',
tint30: '#b55fc1',
tint40: '#d9a7e0',
tint50: '#eaceef',
tint60: '#faf2fb'
};
export const berry = {
shade50: '#1f091d',
shade40: '#3a1136',
shade30: '#6d2064',
shade20: '#932b88',
shade10: '#af33a1',
primary: '#c239b3',
tint10: '#c94cbc',
tint20: '#d161c4',
tint30: '#da7ed0',
tint40: '#edbbe7',
tint50: '#f5daf2',
tint60: '#fdf5fc'
};
export const lilac = {
shade50: '#1c0b1f',
shade40: '#35153a',
shade30: '#63276d',
shade20: '#863593',
shade10: '#9f3faf',
primary: '#b146c2',
tint10: '#ba58c9',
tint20: '#c36bd1',
tint30: '#cf87da',
tint40: '#e6bfed',
tint50: '#f2dcf5',
tint60: '#fcf6fd'
};
export const pink = {
shade50: '#24091b',
shade40: '#441232',
shade30: '#80215d',
shade20: '#ad2d7e',
shade10: '#cd3595',
primary: '#e43ba6',
tint10: '#e750b0',
tint20: '#ea66ba',
tint30: '#ef85c8',
tint40: '#f7c0e3',
tint50: '#fbddf0',
tint60: '#fef6fb'
};
export const hotPink = {
shade50: '#240016',
shade40: '#44002a',
shade30: '#7f004e',
shade20: '#ad006a',
shade10: '#cc007e',
primary: '#e3008c',
tint10: '#e61c99',
tint20: '#ea38a6',
tint30: '#ee5fb7',
tint40: '#f7adda',
tint50: '#fbd2eb',
tint60: '#fef4fa'
};
export const magenta = {
shade50: '#1f0013',
shade40: '#390024',
shade30: '#6b0043',
shade20: '#91005a',
shade10: '#ac006b',
primary: '#bf0077',
tint10: '#c71885',
tint20: '#ce3293',
tint30: '#d957a8',
tint40: '#eca5d1',
tint50: '#f5cee6',
tint60: '#fcf2f9'
};
export const plum = {
shade50: '#13000c',
shade40: '#240017',
shade30: '#43002b',
shade20: '#5a003b',
shade10: '#6b0045',
primary: '#77004d',
tint10: '#87105d',
tint20: '#98246f',
tint30: '#ad4589',
tint40: '#d696c0',
tint50: '#e9c4dc',
tint60: '#faf0f6'
};
export const beige = {
shade50: '#141313',
shade40: '#252323',
shade30: '#444241',
shade20: '#5d5958',
shade10: '#6e6968',
primary: '#7a7574',
tint10: '#8a8584',
tint20: '#9a9594',
tint30: '#afabaa',
tint40: '#d7d4d4',
tint50: '#eae8e8',
tint60: '#faf9f9'
};
export const mink = {
shade50: '#0f0e0e',
shade40: '#1c1b1a',
shade30: '#343231',
shade20: '#474443',
shade10: '#54514f',
primary: '#5d5a58',
tint10: '#706d6b',
tint20: '#84817e',
tint30: '#9e9b99',
tint40: '#cecccb',
tint50: '#e5e4e3',
tint60: '#f8f8f8'
};
export const silver = {
shade50: '#151818',
shade40: '#282d2e',
shade30: '#4a5356',
shade20: '#657174',
shade10: '#78868a',
primary: '#859599',
tint10: '#92a1a5',
tint20: '#a0aeb1',
tint30: '#b3bfc2',
tint40: '#d8dfe0',
tint50: '#eaeeef',
tint60: '#fafbfb'
};
export const platinum = {
shade50: '#111314',
shade40: '#1f2426',
shade30: '#3b4447',
shade20: '#505c60',
shade10: '#5f6d71',
primary: '#69797e',
tint10: '#79898d',
tint20: '#89989d',
tint30: '#a0adb2',
tint40: '#cdd6d8',
tint50: '#e4e9ea',
tint60: '#f8f9fa'
};
export const anchor = {
shade50: '#090a0b',
shade40: '#111315',
shade30: '#202427',
shade20: '#2b3135',
shade10: '#333a3f',
primary: '#394146',
tint10: '#4d565c',
tint20: '#626c72',
tint30: '#808a90',
tint40: '#bcc3c7',
tint50: '#dbdfe1',
tint60: '#f6f7f8'
};
export const charcoal = {
shade50: '#090909',
shade40: '#111111',
shade30: '#202020',
shade20: '#2b2b2b',
shade10: '#333333',
primary: '#393939',
tint10: '#515151',
tint20: '#686868',
tint30: '#888888',
tint40: '#c4c4c4',
tint50: '#dfdfdf',
tint60: '#f7f7f7'
};

File diff suppressed because one or more lines are too long

11
node_modules/@fluentui/tokens/lib/global/curves.js generated vendored Normal file
View File

@@ -0,0 +1,11 @@
export const curves = {
curveAccelerateMax: 'cubic-bezier(0.9,0.1,1,0.2)',
curveAccelerateMid: 'cubic-bezier(1,0,1,1)',
curveAccelerateMin: 'cubic-bezier(0.8,0,0.78,1)',
curveDecelerateMax: 'cubic-bezier(0.1,0.9,0.2,1)',
curveDecelerateMid: 'cubic-bezier(0,0,0,1)',
curveDecelerateMin: 'cubic-bezier(0.33,0,0.1,1)',
curveEasyEaseMax: 'cubic-bezier(0.8,0,0.2,1)',
curveEasyEase: 'cubic-bezier(0.33,0,0.67,1)',
curveLinear: 'cubic-bezier(0,0,1,1)'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/curves.ts"],"sourcesContent":["import type { CurveTokens } from '../types';\n\nexport const curves: CurveTokens = {\n curveAccelerateMax: 'cubic-bezier(0.9,0.1,1,0.2)',\n curveAccelerateMid: 'cubic-bezier(1,0,1,1)',\n curveAccelerateMin: 'cubic-bezier(0.8,0,0.78,1)',\n curveDecelerateMax: 'cubic-bezier(0.1,0.9,0.2,1)',\n curveDecelerateMid: 'cubic-bezier(0,0,0,1)',\n curveDecelerateMin: 'cubic-bezier(0.33,0,0.1,1)',\n curveEasyEaseMax: 'cubic-bezier(0.8,0,0.2,1)',\n curveEasyEase: 'cubic-bezier(0.33,0,0.67,1)',\n curveLinear: 'cubic-bezier(0,0,1,1)',\n};\n"],"names":["curves","curveAccelerateMax","curveAccelerateMid","curveAccelerateMin","curveDecelerateMax","curveDecelerateMid","curveDecelerateMin","curveEasyEaseMax","curveEasyEase","curveLinear"],"mappings":"AAEA,OAAO,MAAMA,SAAsB;IACjCC,oBAAoB;IACpBC,oBAAoB;IACpBC,oBAAoB;IACpBC,oBAAoB;IACpBC,oBAAoB;IACpBC,oBAAoB;IACpBC,kBAAkB;IAClBC,eAAe;IACfC,aAAa;AACf,EAAE"}

10
node_modules/@fluentui/tokens/lib/global/durations.js generated vendored Normal file
View File

@@ -0,0 +1,10 @@
export const durations = {
durationUltraFast: '50ms',
durationFaster: '100ms',
durationFast: '150ms',
durationNormal: '200ms',
durationGentle: '250ms',
durationSlow: '300ms',
durationSlower: '400ms',
durationUltraSlow: '500ms'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/durations.ts"],"sourcesContent":["import type { DurationTokens } from '../types';\n\nexport const durations: DurationTokens = {\n durationUltraFast: '50ms',\n durationFaster: '100ms',\n durationFast: '150ms',\n durationNormal: '200ms',\n durationGentle: '250ms',\n durationSlow: '300ms',\n durationSlower: '400ms',\n durationUltraSlow: '500ms',\n};\n"],"names":["durations","durationUltraFast","durationFaster","durationFast","durationNormal","durationGentle","durationSlow","durationSlower","durationUltraSlow"],"mappings":"AAEA,OAAO,MAAMA,YAA4B;IACvCC,mBAAmB;IACnBC,gBAAgB;IAChBC,cAAc;IACdC,gBAAgB;IAChBC,gBAAgB;IAChBC,cAAc;IACdC,gBAAgB;IAChBC,mBAAmB;AACrB,EAAE"}

35
node_modules/@fluentui/tokens/lib/global/fonts.js generated vendored Normal file
View File

@@ -0,0 +1,35 @@
export const fontSizes = {
fontSizeBase100: '10px',
fontSizeBase200: '12px',
fontSizeBase300: '14px',
fontSizeBase400: '16px',
fontSizeBase500: '20px',
fontSizeBase600: '24px',
fontSizeHero700: '28px',
fontSizeHero800: '32px',
fontSizeHero900: '40px',
fontSizeHero1000: '68px'
};
export const lineHeights = {
lineHeightBase100: '14px',
lineHeightBase200: '16px',
lineHeightBase300: '20px',
lineHeightBase400: '22px',
lineHeightBase500: '28px',
lineHeightBase600: '32px',
lineHeightHero700: '36px',
lineHeightHero800: '40px',
lineHeightHero900: '52px',
lineHeightHero1000: '92px'
};
export const fontWeights = {
fontWeightRegular: 400,
fontWeightMedium: 500,
fontWeightSemibold: 600,
fontWeightBold: 700
};
export const fontFamilies = {
fontFamilyBase: "'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif",
fontFamilyMonospace: "Consolas, 'Courier New', Courier, monospace",
fontFamilyNumeric: "Bahnschrift, 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif"
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/fonts.ts"],"sourcesContent":["import type { FontFamilyTokens, FontSizeTokens, FontWeightTokens, LineHeightTokens } from '../types';\n\nexport const fontSizes: FontSizeTokens = {\n fontSizeBase100: '10px',\n fontSizeBase200: '12px',\n fontSizeBase300: '14px',\n fontSizeBase400: '16px',\n fontSizeBase500: '20px',\n fontSizeBase600: '24px',\n\n fontSizeHero700: '28px',\n fontSizeHero800: '32px',\n fontSizeHero900: '40px',\n fontSizeHero1000: '68px',\n};\n\nexport const lineHeights: LineHeightTokens = {\n lineHeightBase100: '14px',\n lineHeightBase200: '16px',\n lineHeightBase300: '20px',\n lineHeightBase400: '22px',\n lineHeightBase500: '28px',\n lineHeightBase600: '32px',\n\n lineHeightHero700: '36px',\n lineHeightHero800: '40px',\n lineHeightHero900: '52px',\n lineHeightHero1000: '92px',\n};\n\nexport const fontWeights: FontWeightTokens = {\n fontWeightRegular: 400,\n fontWeightMedium: 500,\n fontWeightSemibold: 600,\n fontWeightBold: 700,\n};\n\nexport const fontFamilies: FontFamilyTokens = {\n fontFamilyBase:\n \"'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif\",\n fontFamilyMonospace: \"Consolas, 'Courier New', Courier, monospace\",\n fontFamilyNumeric:\n \"Bahnschrift, 'Segoe UI', 'Segoe UI Web (West European)', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif\",\n};\n"],"names":["fontSizes","fontSizeBase100","fontSizeBase200","fontSizeBase300","fontSizeBase400","fontSizeBase500","fontSizeBase600","fontSizeHero700","fontSizeHero800","fontSizeHero900","fontSizeHero1000","lineHeights","lineHeightBase100","lineHeightBase200","lineHeightBase300","lineHeightBase400","lineHeightBase500","lineHeightBase600","lineHeightHero700","lineHeightHero800","lineHeightHero900","lineHeightHero1000","fontWeights","fontWeightRegular","fontWeightMedium","fontWeightSemibold","fontWeightBold","fontFamilies","fontFamilyBase","fontFamilyMonospace","fontFamilyNumeric"],"mappings":"AAEA,OAAO,MAAMA,YAA4B;IACvCC,iBAAiB;IACjBC,iBAAiB;IACjBC,iBAAiB;IACjBC,iBAAiB;IACjBC,iBAAiB;IACjBC,iBAAiB;IAEjBC,iBAAiB;IACjBC,iBAAiB;IACjBC,iBAAiB;IACjBC,kBAAkB;AACpB,EAAE;AAEF,OAAO,MAAMC,cAAgC;IAC3CC,mBAAmB;IACnBC,mBAAmB;IACnBC,mBAAmB;IACnBC,mBAAmB;IACnBC,mBAAmB;IACnBC,mBAAmB;IAEnBC,mBAAmB;IACnBC,mBAAmB;IACnBC,mBAAmB;IACnBC,oBAAoB;AACtB,EAAE;AAEF,OAAO,MAAMC,cAAgC;IAC3CC,mBAAmB;IACnBC,kBAAkB;IAClBC,oBAAoB;IACpBC,gBAAgB;AAClB,EAAE;AAEF,OAAO,MAAMC,eAAiC;IAC5CC,gBACE;IACFC,qBAAqB;IACrBC,mBACE;AACJ,EAAE"}

8
node_modules/@fluentui/tokens/lib/global/index.js generated vendored Normal file
View File

@@ -0,0 +1,8 @@
export { borderRadius } from "./borderRadius.js";
export { anchor, beige, berry, black, blackAlpha, blue, brass, bronze, brown, burgundy, charcoal, cornflower, cranberry, cyan, darkBlue, darkBrown, darkGreen, darkOrange, darkPurple, darkRed, darkTeal, forest, gold, grape, green, grey, grey10Alpha, grey12Alpha, grey14Alpha, hcButtonFace, hcButtonText, hcCanvas, hcCanvasText, hcDisabled, hcHighlight, hcHighlightText, hcHyperlink, hotPink, lavender, lightBlue, lightGreen, lightTeal, lilac, lime, magenta, marigold, mink, navy, orange, orchid, peach, pink, platinum, plum, pumpkin, purple, red, royalBlue, seafoam, silver, steel, teal, white, whiteAlpha, yellow } from "./colors.js";
export { curves } from "./curves.js";
export { durations } from "./durations.js";
export { fontFamilies, fontSizes, fontWeights, lineHeights } from "./fonts.js";
export { horizontalSpacings, verticalSpacings } from "./spacings.js";
export { strokeWidths } from "./strokeWidths.js";
export { typographyStyles } from "./typographyStyles.js";

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/index.ts"],"sourcesContent":["export { borderRadius } from './borderRadius';\nexport {\n anchor,\n beige,\n berry,\n black,\n blackAlpha,\n blue,\n brass,\n bronze,\n brown,\n burgundy,\n charcoal,\n cornflower,\n cranberry,\n cyan,\n darkBlue,\n darkBrown,\n darkGreen,\n darkOrange,\n darkPurple,\n darkRed,\n darkTeal,\n forest,\n gold,\n grape,\n green,\n grey,\n grey10Alpha,\n grey12Alpha,\n grey14Alpha,\n hcButtonFace,\n hcButtonText,\n hcCanvas,\n hcCanvasText,\n hcDisabled,\n hcHighlight,\n hcHighlightText,\n hcHyperlink,\n hotPink,\n lavender,\n lightBlue,\n lightGreen,\n lightTeal,\n lilac,\n lime,\n magenta,\n marigold,\n mink,\n navy,\n orange,\n orchid,\n peach,\n pink,\n platinum,\n plum,\n pumpkin,\n purple,\n red,\n royalBlue,\n seafoam,\n silver,\n steel,\n teal,\n white,\n whiteAlpha,\n yellow,\n} from './colors';\nexport { curves } from './curves';\nexport { durations } from './durations';\nexport { fontFamilies, fontSizes, fontWeights, lineHeights } from './fonts';\nexport { horizontalSpacings, verticalSpacings } from './spacings';\nexport { strokeWidths } from './strokeWidths';\nexport { typographyStyles } from './typographyStyles';\n"],"names":["borderRadius","anchor","beige","berry","black","blackAlpha","blue","brass","bronze","brown","burgundy","charcoal","cornflower","cranberry","cyan","darkBlue","darkBrown","darkGreen","darkOrange","darkPurple","darkRed","darkTeal","forest","gold","grape","green","grey","grey10Alpha","grey12Alpha","grey14Alpha","hcButtonFace","hcButtonText","hcCanvas","hcCanvasText","hcDisabled","hcHighlight","hcHighlightText","hcHyperlink","hotPink","lavender","lightBlue","lightGreen","lightTeal","lilac","lime","magenta","marigold","mink","navy","orange","orchid","peach","pink","platinum","plum","pumpkin","purple","red","royalBlue","seafoam","silver","steel","teal","white","whiteAlpha","yellow","curves","durations","fontFamilies","fontSizes","fontWeights","lineHeights","horizontalSpacings","verticalSpacings","strokeWidths","typographyStyles"],"mappings":"AAAA,SAASA,YAAY,QAAQ,oBAAiB;AAC9C,SACEC,MAAM,EACNC,KAAK,EACLC,KAAK,EACLC,KAAK,EACLC,UAAU,EACVC,IAAI,EACJC,KAAK,EACLC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACVC,SAAS,EACTC,IAAI,EACJC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,IAAI,EACJC,KAAK,EACLC,KAAK,EACLC,IAAI,EACJC,WAAW,EACXC,WAAW,EACXC,WAAW,EACXC,YAAY,EACZC,YAAY,EACZC,QAAQ,EACRC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,eAAe,EACfC,WAAW,EACXC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,KAAK,EACLC,IAAI,EACJC,OAAO,EACPC,QAAQ,EACRC,IAAI,EACJC,IAAI,EACJC,MAAM,EACNC,MAAM,EACNC,KAAK,EACLC,IAAI,EACJC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACPC,MAAM,EACNC,GAAG,EACHC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,KAAK,EACLC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,MAAM,QACD,cAAW;AAClB,SAASC,MAAM,QAAQ,cAAW;AAClC,SAASC,SAAS,QAAQ,iBAAc;AACxC,SAASC,YAAY,EAAEC,SAAS,EAAEC,WAAW,EAAEC,WAAW,QAAQ,aAAU;AAC5E,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,gBAAa;AAClE,SAASC,YAAY,QAAQ,oBAAiB;AAC9C,SAASC,gBAAgB,QAAQ,wBAAqB"}

40
node_modules/@fluentui/tokens/lib/global/spacings.js generated vendored Normal file
View File

@@ -0,0 +1,40 @@
// Intentionally not exported! Use horizontalSpacings and verticalSpacings instead.
const spacings = {
none: '0',
xxs: '2px',
xs: '4px',
sNudge: '6px',
s: '8px',
mNudge: '10px',
m: '12px',
l: '16px',
xl: '20px',
xxl: '24px',
xxxl: '32px'
};
export const horizontalSpacings = {
spacingHorizontalNone: spacings.none,
spacingHorizontalXXS: spacings.xxs,
spacingHorizontalXS: spacings.xs,
spacingHorizontalSNudge: spacings.sNudge,
spacingHorizontalS: spacings.s,
spacingHorizontalMNudge: spacings.mNudge,
spacingHorizontalM: spacings.m,
spacingHorizontalL: spacings.l,
spacingHorizontalXL: spacings.xl,
spacingHorizontalXXL: spacings.xxl,
spacingHorizontalXXXL: spacings.xxxl
};
export const verticalSpacings = {
spacingVerticalNone: spacings.none,
spacingVerticalXXS: spacings.xxs,
spacingVerticalXS: spacings.xs,
spacingVerticalSNudge: spacings.sNudge,
spacingVerticalS: spacings.s,
spacingVerticalMNudge: spacings.mNudge,
spacingVerticalM: spacings.m,
spacingVerticalL: spacings.l,
spacingVerticalXL: spacings.xl,
spacingVerticalXXL: spacings.xxl,
spacingVerticalXXXL: spacings.xxxl
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/spacings.ts"],"sourcesContent":["import type { HorizontalSpacingTokens, SpacingTokens, VerticalSpacingTokens } from '../types';\n\n// Intentionally not exported! Use horizontalSpacings and verticalSpacings instead.\nconst spacings: SpacingTokens = {\n none: '0',\n xxs: '2px',\n xs: '4px',\n sNudge: '6px',\n s: '8px',\n mNudge: '10px',\n m: '12px',\n l: '16px',\n xl: '20px',\n xxl: '24px',\n xxxl: '32px',\n};\n\nexport const horizontalSpacings: HorizontalSpacingTokens = {\n spacingHorizontalNone: spacings.none,\n spacingHorizontalXXS: spacings.xxs,\n spacingHorizontalXS: spacings.xs,\n spacingHorizontalSNudge: spacings.sNudge,\n spacingHorizontalS: spacings.s,\n spacingHorizontalMNudge: spacings.mNudge,\n spacingHorizontalM: spacings.m,\n spacingHorizontalL: spacings.l,\n spacingHorizontalXL: spacings.xl,\n spacingHorizontalXXL: spacings.xxl,\n spacingHorizontalXXXL: spacings.xxxl,\n};\n\nexport const verticalSpacings: VerticalSpacingTokens = {\n spacingVerticalNone: spacings.none,\n spacingVerticalXXS: spacings.xxs,\n spacingVerticalXS: spacings.xs,\n spacingVerticalSNudge: spacings.sNudge,\n spacingVerticalS: spacings.s,\n spacingVerticalMNudge: spacings.mNudge,\n spacingVerticalM: spacings.m,\n spacingVerticalL: spacings.l,\n spacingVerticalXL: spacings.xl,\n spacingVerticalXXL: spacings.xxl,\n spacingVerticalXXXL: spacings.xxxl,\n};\n"],"names":["spacings","none","xxs","xs","sNudge","s","mNudge","m","l","xl","xxl","xxxl","horizontalSpacings","spacingHorizontalNone","spacingHorizontalXXS","spacingHorizontalXS","spacingHorizontalSNudge","spacingHorizontalS","spacingHorizontalMNudge","spacingHorizontalM","spacingHorizontalL","spacingHorizontalXL","spacingHorizontalXXL","spacingHorizontalXXXL","verticalSpacings","spacingVerticalNone","spacingVerticalXXS","spacingVerticalXS","spacingVerticalSNudge","spacingVerticalS","spacingVerticalMNudge","spacingVerticalM","spacingVerticalL","spacingVerticalXL","spacingVerticalXXL","spacingVerticalXXXL"],"mappings":"AAEA,mFAAmF;AACnF,MAAMA,WAA0B;IAC9BC,MAAM;IACNC,KAAK;IACLC,IAAI;IACJC,QAAQ;IACRC,GAAG;IACHC,QAAQ;IACRC,GAAG;IACHC,GAAG;IACHC,IAAI;IACJC,KAAK;IACLC,MAAM;AACR;AAEA,OAAO,MAAMC,qBAA8C;IACzDC,uBAAuBb,SAASC,IAAI;IACpCa,sBAAsBd,SAASE,GAAG;IAClCa,qBAAqBf,SAASG,EAAE;IAChCa,yBAAyBhB,SAASI,MAAM;IACxCa,oBAAoBjB,SAASK,CAAC;IAC9Ba,yBAAyBlB,SAASM,MAAM;IACxCa,oBAAoBnB,SAASO,CAAC;IAC9Ba,oBAAoBpB,SAASQ,CAAC;IAC9Ba,qBAAqBrB,SAASS,EAAE;IAChCa,sBAAsBtB,SAASU,GAAG;IAClCa,uBAAuBvB,SAASW,IAAI;AACtC,EAAE;AAEF,OAAO,MAAMa,mBAA0C;IACrDC,qBAAqBzB,SAASC,IAAI;IAClCyB,oBAAoB1B,SAASE,GAAG;IAChCyB,mBAAmB3B,SAASG,EAAE;IAC9ByB,uBAAuB5B,SAASI,MAAM;IACtCyB,kBAAkB7B,SAASK,CAAC;IAC5ByB,uBAAuB9B,SAASM,MAAM;IACtCyB,kBAAkB/B,SAASO,CAAC;IAC5ByB,kBAAkBhC,SAASQ,CAAC;IAC5ByB,mBAAmBjC,SAASS,EAAE;IAC9ByB,oBAAoBlC,SAASU,GAAG;IAChCyB,qBAAqBnC,SAASW,IAAI;AACpC,EAAE"}

View File

@@ -0,0 +1,6 @@
export const strokeWidths = {
strokeWidthThin: '1px',
strokeWidthThick: '2px',
strokeWidthThicker: '3px',
strokeWidthThickest: '4px'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/global/strokeWidths.ts"],"sourcesContent":["import type { StrokeWidthTokens } from '../types';\n\nexport const strokeWidths: StrokeWidthTokens = {\n strokeWidthThin: '1px',\n strokeWidthThick: '2px',\n strokeWidthThicker: '3px',\n strokeWidthThickest: '4px',\n};\n"],"names":["strokeWidths","strokeWidthThin","strokeWidthThick","strokeWidthThicker","strokeWidthThickest"],"mappings":"AAEA,OAAO,MAAMA,eAAkC;IAC7CC,iBAAiB;IACjBC,kBAAkB;IAClBC,oBAAoB;IACpBC,qBAAqB;AACvB,EAAE"}

View File

@@ -0,0 +1,107 @@
import { tokens } from "../tokens.js";
/**
* Global typography styles (fontSize, fontWeight, and lineHeight)
*/ export const typographyStyles = {
body1: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase300,
fontWeight: tokens.fontWeightRegular,
lineHeight: tokens.lineHeightBase300
},
body1Strong: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase300,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase300
},
body1Stronger: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase300,
fontWeight: tokens.fontWeightBold,
lineHeight: tokens.lineHeightBase300
},
body2: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase400,
fontWeight: tokens.fontWeightRegular,
lineHeight: tokens.lineHeightBase400
},
caption1: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase200,
fontWeight: tokens.fontWeightRegular,
lineHeight: tokens.lineHeightBase200
},
caption1Strong: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase200,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase200
},
caption1Stronger: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase200,
fontWeight: tokens.fontWeightBold,
lineHeight: tokens.lineHeightBase200
},
caption2: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase100,
fontWeight: tokens.fontWeightRegular,
lineHeight: tokens.lineHeightBase100
},
caption2Strong: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase100,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase100
},
subtitle1: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase500,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase500
},
subtitle2: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase400,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase400
},
subtitle2Stronger: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase400,
fontWeight: tokens.fontWeightBold,
lineHeight: tokens.lineHeightBase400
},
title1: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeHero800,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightHero800
},
title2: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeHero700,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightHero700
},
title3: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeBase600,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightBase600
},
largeTitle: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeHero900,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightHero900
},
display: {
fontFamily: tokens.fontFamilyBase,
fontSize: tokens.fontSizeHero1000,
fontWeight: tokens.fontWeightSemibold,
lineHeight: tokens.lineHeightHero1000
}
};

File diff suppressed because one or more lines are too long

5
node_modules/@fluentui/tokens/lib/index.js generated vendored Normal file
View File

@@ -0,0 +1,5 @@
export { teamsDarkTheme, teamsDarkV21Theme, teamsHighContrastTheme, teamsLightTheme, teamsLightV21Theme, webDarkTheme, webLightTheme } from "./themes/index.js";
export { createDarkTheme, createHighContrastTheme, createLightTheme, createTeamsDarkTheme } from "./utils/index.js";
export { themeToTokensObject } from "./themeToTokensObject.js";
export { tokens } from "./tokens.js";
export { typographyStyles } from "./global/index.js";

1
node_modules/@fluentui/tokens/lib/index.js.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n teamsDarkTheme,\n teamsDarkV21Theme,\n teamsHighContrastTheme,\n teamsLightTheme,\n teamsLightV21Theme,\n webDarkTheme,\n webLightTheme,\n} from './themes';\nexport { createDarkTheme, createHighContrastTheme, createLightTheme, createTeamsDarkTheme } from './utils';\n\nexport { themeToTokensObject } from './themeToTokensObject';\nexport { tokens } from './tokens';\nexport { typographyStyles } from './global';\n\nexport type {\n Brands,\n BrandVariants,\n FontSizeTokens,\n FontWeightTokens,\n LineHeightTokens,\n BorderRadiusTokens,\n StrokeWidthTokens,\n SpacingTokens,\n HorizontalSpacingTokens,\n VerticalSpacingTokens,\n DurationTokens,\n CurveTokens,\n ShadowTokens,\n ShadowBrandTokens,\n FontFamilyTokens,\n ColorPaletteTokens,\n ColorPaletteDarkRed,\n ColorPaletteCranberry,\n ColorPaletteRed,\n ColorPaletteDarkOrange,\n ColorPalettePumpkin,\n ColorPalettePeach,\n ColorPaletteMarigold,\n ColorPaletteYellow,\n ColorPaletteGold,\n ColorPaletteBrass,\n ColorPaletteBrown,\n ColorPaletteForest,\n ColorPaletteSeafoam,\n ColorPaletteGreen,\n ColorPaletteLightGreen,\n ColorPaletteDarkGreen,\n ColorPaletteLightTeal,\n ColorPaletteTeal,\n ColorPaletteSteel,\n ColorPaletteBlue,\n ColorPaletteRoyalBlue,\n ColorPaletteCornflower,\n ColorPaletteNavy,\n ColorPaletteLavender,\n ColorPalettePurple,\n ColorPaletteGrape,\n ColorPaletteBerry,\n ColorPaletteLilac,\n ColorPalettePink,\n ColorPaletteMagenta,\n ColorPalettePlum,\n ColorPaletteBeige,\n ColorPaletteMink,\n ColorPalettePlatinum,\n ColorPaletteAnchor,\n ColorTokens,\n PartialTheme,\n Theme,\n TypographyStyle,\n TypographyStyles,\n ZIndexTokens,\n} from './types';\n"],"names":["teamsDarkTheme","teamsDarkV21Theme","teamsHighContrastTheme","teamsLightTheme","teamsLightV21Theme","webDarkTheme","webLightTheme","createDarkTheme","createHighContrastTheme","createLightTheme","createTeamsDarkTheme","themeToTokensObject","tokens","typographyStyles"],"mappings":"AAAA,SACEA,cAAc,EACdC,iBAAiB,EACjBC,sBAAsB,EACtBC,eAAe,EACfC,kBAAkB,EAClBC,YAAY,EACZC,aAAa,QACR,oBAAW;AAClB,SAASC,eAAe,EAAEC,uBAAuB,EAAEC,gBAAgB,EAAEC,oBAAoB,QAAQ,mBAAU;AAE3G,SAASC,mBAAmB,QAAQ,2BAAwB;AAC5D,SAASC,MAAM,QAAQ,cAAW;AAClC,SAASC,gBAAgB,QAAQ,oBAAW"}

60
node_modules/@fluentui/tokens/lib/sharedColorNames.js generated vendored Normal file
View File

@@ -0,0 +1,60 @@
/* Names of colors used in shared color palette alias tokens for status. */ export const statusSharedColorNames = [
'red',
'green',
'darkOrange',
'yellow',
'berry',
'lightGreen',
'marigold'
];
/* Names of colors used in shared color palette alias tokens for persona. */ export const personaSharedColorNames = [
'darkRed',
'cranberry',
'pumpkin',
'peach',
'gold',
'brass',
'brown',
'forest',
'seafoam',
'darkGreen',
'lightTeal',
'teal',
'steel',
'blue',
'royalBlue',
'cornflower',
'navy',
'lavender',
'purple',
'grape',
'lilac',
'pink',
'magenta',
'plum',
'beige',
'mink',
'platinum',
'anchor'
];
/* List of global colors which semantic alias status tokens map to */ export const mappedStatusColorNames = [
'cranberry',
'green',
'orange'
];
/* Names of colors not used in alias tokens but produced by token pipeline as global color tokens. */ export const unusedSharedColorNames = [
'burgundy',
'bronze',
'orange',
'darkBrown',
'lime',
'darkTeal',
'cyan',
'lightBlue',
'darkBlue',
'darkPurple',
'orchid',
'hotPink',
'silver',
'charcoal'
];

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/sharedColorNames.ts"],"sourcesContent":["/* Names of colors used in shared color palette alias tokens for status. */\nexport const statusSharedColorNames = [\n 'red',\n 'green',\n 'darkOrange',\n 'yellow',\n 'berry',\n 'lightGreen',\n 'marigold',\n] as const;\n\n/* Names of colors used in shared color palette alias tokens for persona. */\nexport const personaSharedColorNames = [\n 'darkRed',\n 'cranberry',\n 'pumpkin',\n 'peach',\n 'gold',\n 'brass',\n 'brown',\n 'forest',\n 'seafoam',\n 'darkGreen',\n 'lightTeal',\n 'teal',\n 'steel',\n 'blue',\n 'royalBlue',\n 'cornflower',\n 'navy',\n 'lavender',\n 'purple',\n 'grape',\n 'lilac',\n 'pink',\n 'magenta',\n 'plum',\n 'beige',\n 'mink',\n 'platinum',\n 'anchor',\n] as const;\n\n/* List of global colors which semantic alias status tokens map to */\nexport const mappedStatusColorNames = ['cranberry', 'green', 'orange'] as const;\n\n/* Names of colors not used in alias tokens but produced by token pipeline as global color tokens. */\nexport const unusedSharedColorNames = [\n 'burgundy',\n 'bronze',\n 'orange',\n 'darkBrown',\n 'lime',\n 'darkTeal',\n 'cyan',\n 'lightBlue',\n 'darkBlue',\n 'darkPurple',\n 'orchid',\n 'hotPink',\n 'silver',\n 'charcoal',\n] as const;\n"],"names":["statusSharedColorNames","personaSharedColorNames","mappedStatusColorNames","unusedSharedColorNames"],"mappings":"AAAA,yEAAyE,GACzE,OAAO,MAAMA,yBAAyB;IACpC;IACA;IACA;IACA;IACA;IACA;IACA;CACD,CAAU;AAEX,0EAA0E,GAC1E,OAAO,MAAMC,0BAA0B;IACrC;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD,CAAU;AAEX,mEAAmE,GACnE,OAAO,MAAMC,yBAAyB;IAAC;IAAa;IAAS;CAAS,CAAU;AAEhF,mGAAmG,GACnG,OAAO,MAAMC,yBAAyB;IACpC;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD,CAAU"}

View File

@@ -0,0 +1,5 @@
export const statusColorMapping = {
success: 'green',
warning: 'orange',
danger: 'cranberry'
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/statusColorMapping.ts"],"sourcesContent":["import { MappedStatusColorNames } from './types';\n\nexport const statusColorMapping: Record<string, MappedStatusColorNames> = {\n success: 'green',\n warning: 'orange',\n danger: 'cranberry',\n};\n"],"names":["statusColorMapping","success","warning","danger"],"mappings":"AAEA,OAAO,MAAMA,qBAA6D;IACxEC,SAAS;IACTC,SAAS;IACTC,QAAQ;AACV,EAAE"}

View File

@@ -0,0 +1,15 @@
/**
* Programmatically generates a tokens to css variables mapping object from the keys in a theme.
* This helps with ease of use as a user of a custom theme does not have to manually construct this object, but it could
* affect tree-shaking since bundlers do not know the shape of the output.
*
* @param theme - Theme from which to get the keys to generate the tokens to css variables mapping object
* @returns Tokens to css variables mapping object corresponding to the passed theme
*/ export function themeToTokensObject(theme) {
const tokens = {};
const keys = Object.keys(theme);
for (const key of keys){
tokens[key] = `var(--${String(key)})`;
}
return tokens;
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themeToTokensObject.ts"],"sourcesContent":["import { Theme } from './types';\n\n/**\n * Programmatically generates a tokens to css variables mapping object from the keys in a theme.\n * This helps with ease of use as a user of a custom theme does not have to manually construct this object, but it could\n * affect tree-shaking since bundlers do not know the shape of the output.\n *\n * @param theme - Theme from which to get the keys to generate the tokens to css variables mapping object\n * @returns Tokens to css variables mapping object corresponding to the passed theme\n */\nexport function themeToTokensObject<TTheme extends Theme>(theme: TTheme): Record<keyof TTheme, string> {\n const tokens = {} as Record<keyof TTheme, string>;\n const keys = Object.keys(theme) as (keyof TTheme)[];\n for (const key of keys) {\n tokens[key] = `var(--${String(key)})`;\n }\n return tokens;\n}\n"],"names":["themeToTokensObject","theme","tokens","keys","Object","key","String"],"mappings":"AAEA;;;;;;;CAOC,GACD,OAAO,SAASA,oBAA0CC,KAAa;IACrE,MAAMC,SAAS,CAAC;IAChB,MAAMC,OAAOC,OAAOD,IAAI,CAACF;IACzB,KAAK,MAAMI,OAAOF,KAAM;QACtBD,MAAM,CAACG,IAAI,GAAG,CAAC,MAAM,EAAEC,OAAOD,KAAK,CAAC,CAAC;IACvC;IACA,OAAOH;AACT"}

2
node_modules/@fluentui/tokens/lib/themes/index.js generated vendored Normal file
View File

@@ -0,0 +1,2 @@
export { teamsDarkTheme, teamsDarkV21Theme, teamsHighContrastTheme, teamsLightTheme, teamsLightV21Theme } from "./teams/index.js";
export { webDarkTheme, webLightTheme } from "./web/index.js";

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/index.ts"],"sourcesContent":["export {\n teamsDarkTheme,\n teamsDarkV21Theme,\n teamsHighContrastTheme,\n teamsLightTheme,\n teamsLightV21Theme,\n} from './teams/index';\nexport { webDarkTheme, webLightTheme } from './web/index';\n"],"names":["teamsDarkTheme","teamsDarkV21Theme","teamsHighContrastTheme","teamsLightTheme","teamsLightV21Theme","webDarkTheme","webLightTheme"],"mappings":"AAAA,SACEA,cAAc,EACdC,iBAAiB,EACjBC,sBAAsB,EACtBC,eAAe,EACfC,kBAAkB,QACb,mBAAgB;AACvB,SAASC,YAAY,EAAEC,aAAa,QAAQ,iBAAc"}

View File

@@ -0,0 +1,11 @@
import { createTeamsDarkTheme } from "../../utils/createTeamsDarkTheme.js";
import { brandTeams, brandTeamsV21 } from "../../global/brandColors.js";
import { fontFamilies } from "../../alias/teamsFontFamilies.js";
export const teamsDarkTheme = {
...createTeamsDarkTheme(brandTeams),
...fontFamilies
};
export const teamsDarkV21Theme = {
...createTeamsDarkTheme(brandTeamsV21),
...fontFamilies
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/teams/darkTheme.ts"],"sourcesContent":["import { createTeamsDarkTheme } from '../../utils/createTeamsDarkTheme';\nimport { brandTeams, brandTeamsV21 } from '../../global/brandColors';\nimport type { Theme } from '../../types';\nimport { fontFamilies } from '../../alias/teamsFontFamilies';\n\nexport const teamsDarkTheme: Theme = {\n ...createTeamsDarkTheme(brandTeams),\n ...fontFamilies,\n};\n\nexport const teamsDarkV21Theme: Theme = {\n ...createTeamsDarkTheme(brandTeamsV21),\n ...fontFamilies,\n};\n"],"names":["createTeamsDarkTheme","brandTeams","brandTeamsV21","fontFamilies","teamsDarkTheme","teamsDarkV21Theme"],"mappings":"AAAA,SAASA,oBAAoB,QAAQ,sCAAmC;AACxE,SAASC,UAAU,EAAEC,aAAa,QAAQ,8BAA2B;AAErE,SAASC,YAAY,QAAQ,mCAAgC;AAE7D,OAAO,MAAMC,iBAAwB;IACnC,GAAGJ,qBAAqBC,WAAW;IACnC,GAAGE,YAAY;AACjB,EAAE;AAEF,OAAO,MAAME,oBAA2B;IACtC,GAAGL,qBAAqBE,cAAc;IACtC,GAAGC,YAAY;AACjB,EAAE"}

View File

@@ -0,0 +1,6 @@
import { createHighContrastTheme } from "../../utils/createHighContrastTheme.js";
import { fontFamilies } from "../../alias/teamsFontFamilies.js";
export const teamsHighContrastTheme = {
...createHighContrastTheme(),
...fontFamilies
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/teams/highContrastTheme.ts"],"sourcesContent":["import { createHighContrastTheme } from '../../utils/createHighContrastTheme';\nimport type { Theme } from '../../types';\nimport { fontFamilies } from '../../alias/teamsFontFamilies';\n\nexport const teamsHighContrastTheme: Theme = {\n ...createHighContrastTheme(),\n ...fontFamilies,\n};\n"],"names":["createHighContrastTheme","fontFamilies","teamsHighContrastTheme"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,yCAAsC;AAE9E,SAASC,YAAY,QAAQ,mCAAgC;AAE7D,OAAO,MAAMC,yBAAgC;IAC3C,GAAGF,yBAAyB;IAC5B,GAAGC,YAAY;AACjB,EAAE"}

View File

@@ -0,0 +1,3 @@
export { teamsLightTheme, teamsLightV21Theme } from "./lightTheme.js";
export { teamsDarkTheme, teamsDarkV21Theme } from "./darkTheme.js";
export { teamsHighContrastTheme } from "./highContrastTheme.js";

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/teams/index.ts"],"sourcesContent":["export { teamsLightTheme, teamsLightV21Theme } from './lightTheme';\nexport { teamsDarkTheme, teamsDarkV21Theme } from './darkTheme';\nexport { teamsHighContrastTheme } from './highContrastTheme';\n"],"names":["teamsLightTheme","teamsLightV21Theme","teamsDarkTheme","teamsDarkV21Theme","teamsHighContrastTheme"],"mappings":"AAAA,SAASA,eAAe,EAAEC,kBAAkB,QAAQ,kBAAe;AACnE,SAASC,cAAc,EAAEC,iBAAiB,QAAQ,iBAAc;AAChE,SAASC,sBAAsB,QAAQ,yBAAsB"}

View File

@@ -0,0 +1,11 @@
import { createLightTheme } from "../../utils/createLightTheme.js";
import { brandTeams, brandTeamsV21 } from "../../global/brandColors.js";
import { fontFamilies } from "../../alias/teamsFontFamilies.js";
export const teamsLightTheme = {
...createLightTheme(brandTeams),
...fontFamilies
};
export const teamsLightV21Theme = {
...createLightTheme(brandTeamsV21),
...fontFamilies
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/teams/lightTheme.ts"],"sourcesContent":["import { createLightTheme } from '../../utils/createLightTheme';\nimport { brandTeams, brandTeamsV21 } from '../../global/brandColors';\nimport type { Theme } from '../../types';\nimport { fontFamilies } from '../../alias/teamsFontFamilies';\n\nexport const teamsLightTheme: Theme = {\n ...createLightTheme(brandTeams),\n ...fontFamilies,\n};\n\nexport const teamsLightV21Theme: Theme = {\n ...createLightTheme(brandTeamsV21),\n ...fontFamilies,\n};\n"],"names":["createLightTheme","brandTeams","brandTeamsV21","fontFamilies","teamsLightTheme","teamsLightV21Theme"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,kCAA+B;AAChE,SAASC,UAAU,EAAEC,aAAa,QAAQ,8BAA2B;AAErE,SAASC,YAAY,QAAQ,mCAAgC;AAE7D,OAAO,MAAMC,kBAAyB;IACpC,GAAGJ,iBAAiBC,WAAW;IAC/B,GAAGE,YAAY;AACjB,EAAE;AAEF,OAAO,MAAME,qBAA4B;IACvC,GAAGL,iBAAiBE,cAAc;IAClC,GAAGC,YAAY;AACjB,EAAE"}

View File

@@ -0,0 +1,3 @@
import { createDarkTheme } from "../../utils/createDarkTheme.js";
import { brandWeb } from "../../global/brandColors.js";
export const webDarkTheme = createDarkTheme(brandWeb);

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/web/darkTheme.ts"],"sourcesContent":["import { createDarkTheme } from '../../utils/createDarkTheme';\nimport { brandWeb } from '../../global/brandColors';\nimport type { Theme } from '../../types';\n\nexport const webDarkTheme: Theme = createDarkTheme(brandWeb);\n"],"names":["createDarkTheme","brandWeb","webDarkTheme"],"mappings":"AAAA,SAASA,eAAe,QAAQ,iCAA8B;AAC9D,SAASC,QAAQ,QAAQ,8BAA2B;AAGpD,OAAO,MAAMC,eAAsBF,gBAAgBC,UAAU"}

View File

@@ -0,0 +1,2 @@
export { webLightTheme } from "./lightTheme.js";
export { webDarkTheme } from "./darkTheme.js";

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/web/index.ts"],"sourcesContent":["export { webLightTheme } from './lightTheme';\nexport { webDarkTheme } from './darkTheme';\n"],"names":["webLightTheme","webDarkTheme"],"mappings":"AAAA,SAASA,aAAa,QAAQ,kBAAe;AAC7C,SAASC,YAAY,QAAQ,iBAAc"}

View File

@@ -0,0 +1,3 @@
import { createLightTheme } from "../../utils/createLightTheme.js";
import { brandWeb } from "../../global/brandColors.js";
export const webLightTheme = createLightTheme(brandWeb);

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/themes/web/lightTheme.ts"],"sourcesContent":["import { createLightTheme } from '../../utils/createLightTheme';\nimport { brandWeb } from '../../global/brandColors';\nimport type { Theme } from '../../types';\n\nexport const webLightTheme: Theme = createLightTheme(brandWeb);\n"],"names":["createLightTheme","brandWeb","webLightTheme"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,kCAA+B;AAChE,SAASC,QAAQ,QAAQ,8BAA2B;AAGpD,OAAO,MAAMC,gBAAuBF,iBAAiBC,UAAU"}

548
node_modules/@fluentui/tokens/lib/tokens.js generated vendored Normal file
View File

@@ -0,0 +1,548 @@
export const tokens = {
// Color tokens
colorNeutralForeground1: 'var(--colorNeutralForeground1)',
colorNeutralForeground1Hover: 'var(--colorNeutralForeground1Hover)',
colorNeutralForeground1Pressed: 'var(--colorNeutralForeground1Pressed)',
colorNeutralForeground1Selected: 'var(--colorNeutralForeground1Selected)',
colorNeutralForeground2: 'var(--colorNeutralForeground2)',
colorNeutralForeground2Hover: 'var(--colorNeutralForeground2Hover)',
colorNeutralForeground2Pressed: 'var(--colorNeutralForeground2Pressed)',
colorNeutralForeground2Selected: 'var(--colorNeutralForeground2Selected)',
colorNeutralForeground2BrandHover: 'var(--colorNeutralForeground2BrandHover)',
colorNeutralForeground2BrandPressed: 'var(--colorNeutralForeground2BrandPressed)',
colorNeutralForeground2BrandSelected: 'var(--colorNeutralForeground2BrandSelected)',
colorNeutralForeground3: 'var(--colorNeutralForeground3)',
colorNeutralForeground3Hover: 'var(--colorNeutralForeground3Hover)',
colorNeutralForeground3Pressed: 'var(--colorNeutralForeground3Pressed)',
colorNeutralForeground3Selected: 'var(--colorNeutralForeground3Selected)',
colorNeutralForeground3BrandHover: 'var(--colorNeutralForeground3BrandHover)',
colorNeutralForeground3BrandPressed: 'var(--colorNeutralForeground3BrandPressed)',
colorNeutralForeground3BrandSelected: 'var(--colorNeutralForeground3BrandSelected)',
colorNeutralForeground4: 'var(--colorNeutralForeground4)',
colorNeutralForeground5: 'var(--colorNeutralForeground5)',
colorNeutralForeground5Hover: 'var(--colorNeutralForeground5Hover)',
colorNeutralForeground5Pressed: 'var(--colorNeutralForeground5Pressed)',
colorNeutralForeground5Selected: 'var(--colorNeutralForeground5Selected)',
colorNeutralForegroundDisabled: 'var(--colorNeutralForegroundDisabled)',
colorBrandForegroundLink: 'var(--colorBrandForegroundLink)',
colorBrandForegroundLinkHover: 'var(--colorBrandForegroundLinkHover)',
colorBrandForegroundLinkPressed: 'var(--colorBrandForegroundLinkPressed)',
colorBrandForegroundLinkSelected: 'var(--colorBrandForegroundLinkSelected)',
colorNeutralForeground2Link: 'var(--colorNeutralForeground2Link)',
colorNeutralForeground2LinkHover: 'var(--colorNeutralForeground2LinkHover)',
colorNeutralForeground2LinkPressed: 'var(--colorNeutralForeground2LinkPressed)',
colorNeutralForeground2LinkSelected: 'var(--colorNeutralForeground2LinkSelected)',
colorCompoundBrandForeground1: 'var(--colorCompoundBrandForeground1)',
colorCompoundBrandForeground1Hover: 'var(--colorCompoundBrandForeground1Hover)',
colorCompoundBrandForeground1Pressed: 'var(--colorCompoundBrandForeground1Pressed)',
colorNeutralForegroundOnBrand: 'var(--colorNeutralForegroundOnBrand)',
colorNeutralForegroundInverted: 'var(--colorNeutralForegroundInverted)',
colorNeutralForegroundInvertedHover: 'var(--colorNeutralForegroundInvertedHover)',
colorNeutralForegroundInvertedPressed: 'var(--colorNeutralForegroundInvertedPressed)',
colorNeutralForegroundInvertedSelected: 'var(--colorNeutralForegroundInvertedSelected)',
colorNeutralForegroundInverted2: 'var(--colorNeutralForegroundInverted2)',
colorNeutralForegroundStaticInverted: 'var(--colorNeutralForegroundStaticInverted)',
colorNeutralForegroundInvertedLink: 'var(--colorNeutralForegroundInvertedLink)',
colorNeutralForegroundInvertedLinkHover: 'var(--colorNeutralForegroundInvertedLinkHover)',
colorNeutralForegroundInvertedLinkPressed: 'var(--colorNeutralForegroundInvertedLinkPressed)',
colorNeutralForegroundInvertedLinkSelected: 'var(--colorNeutralForegroundInvertedLinkSelected)',
colorNeutralForegroundInvertedDisabled: 'var(--colorNeutralForegroundInvertedDisabled)',
colorBrandForeground1: 'var(--colorBrandForeground1)',
colorBrandForeground2: 'var(--colorBrandForeground2)',
colorBrandForeground2Hover: 'var(--colorBrandForeground2Hover)',
colorBrandForeground2Pressed: 'var(--colorBrandForeground2Pressed)',
colorNeutralForeground1Static: 'var(--colorNeutralForeground1Static)',
colorBrandForegroundInverted: 'var(--colorBrandForegroundInverted)',
colorBrandForegroundInvertedHover: 'var(--colorBrandForegroundInvertedHover)',
colorBrandForegroundInvertedPressed: 'var(--colorBrandForegroundInvertedPressed)',
colorBrandForegroundOnLight: 'var(--colorBrandForegroundOnLight)',
colorBrandForegroundOnLightHover: 'var(--colorBrandForegroundOnLightHover)',
colorBrandForegroundOnLightPressed: 'var(--colorBrandForegroundOnLightPressed)',
colorBrandForegroundOnLightSelected: 'var(--colorBrandForegroundOnLightSelected)',
colorNeutralBackground1: 'var(--colorNeutralBackground1)',
colorNeutralBackground1Hover: 'var(--colorNeutralBackground1Hover)',
colorNeutralBackground1Pressed: 'var(--colorNeutralBackground1Pressed)',
colorNeutralBackground1Selected: 'var(--colorNeutralBackground1Selected)',
colorNeutralBackground2: 'var(--colorNeutralBackground2)',
colorNeutralBackground2Hover: 'var(--colorNeutralBackground2Hover)',
colorNeutralBackground2Pressed: 'var(--colorNeutralBackground2Pressed)',
colorNeutralBackground2Selected: 'var(--colorNeutralBackground2Selected)',
colorNeutralBackground3: 'var(--colorNeutralBackground3)',
colorNeutralBackground3Hover: 'var(--colorNeutralBackground3Hover)',
colorNeutralBackground3Pressed: 'var(--colorNeutralBackground3Pressed)',
colorNeutralBackground3Selected: 'var(--colorNeutralBackground3Selected)',
colorNeutralBackground4: 'var(--colorNeutralBackground4)',
colorNeutralBackground4Hover: 'var(--colorNeutralBackground4Hover)',
colorNeutralBackground4Pressed: 'var(--colorNeutralBackground4Pressed)',
colorNeutralBackground4Selected: 'var(--colorNeutralBackground4Selected)',
colorNeutralBackground5: 'var(--colorNeutralBackground5)',
colorNeutralBackground5Hover: 'var(--colorNeutralBackground5Hover)',
colorNeutralBackground5Pressed: 'var(--colorNeutralBackground5Pressed)',
colorNeutralBackground5Selected: 'var(--colorNeutralBackground5Selected)',
colorNeutralBackground6: 'var(--colorNeutralBackground6)',
colorNeutralBackground7: 'var(--colorNeutralBackground7)',
colorNeutralBackground7Hover: 'var(--colorNeutralBackground7Hover)',
colorNeutralBackground7Pressed: 'var(--colorNeutralBackground7Pressed)',
colorNeutralBackground7Selected: 'var(--colorNeutralBackground7Selected)',
colorNeutralBackground8: 'var(--colorNeutralBackground8)',
colorNeutralBackgroundInverted: 'var(--colorNeutralBackgroundInverted)',
colorNeutralBackgroundInvertedHover: 'var(--colorNeutralBackgroundInvertedHover)',
colorNeutralBackgroundInvertedPressed: 'var(--colorNeutralBackgroundInvertedPressed)',
colorNeutralBackgroundInvertedSelected: 'var(--colorNeutralBackgroundInvertedSelected)',
colorNeutralBackgroundStatic: 'var(--colorNeutralBackgroundStatic)',
colorNeutralBackgroundAlpha: 'var(--colorNeutralBackgroundAlpha)',
colorNeutralBackgroundAlpha2: 'var(--colorNeutralBackgroundAlpha2)',
colorSubtleBackground: 'var(--colorSubtleBackground)',
colorSubtleBackgroundHover: 'var(--colorSubtleBackgroundHover)',
colorSubtleBackgroundPressed: 'var(--colorSubtleBackgroundPressed)',
colorSubtleBackgroundSelected: 'var(--colorSubtleBackgroundSelected)',
colorSubtleBackgroundLightAlphaHover: 'var(--colorSubtleBackgroundLightAlphaHover)',
colorSubtleBackgroundLightAlphaPressed: 'var(--colorSubtleBackgroundLightAlphaPressed)',
colorSubtleBackgroundLightAlphaSelected: 'var(--colorSubtleBackgroundLightAlphaSelected)',
colorSubtleBackgroundInverted: 'var(--colorSubtleBackgroundInverted)',
colorSubtleBackgroundInvertedHover: 'var(--colorSubtleBackgroundInvertedHover)',
colorSubtleBackgroundInvertedPressed: 'var(--colorSubtleBackgroundInvertedPressed)',
colorSubtleBackgroundInvertedSelected: 'var(--colorSubtleBackgroundInvertedSelected)',
colorTransparentBackground: 'var(--colorTransparentBackground)',
colorTransparentBackgroundHover: 'var(--colorTransparentBackgroundHover)',
colorTransparentBackgroundPressed: 'var(--colorTransparentBackgroundPressed)',
colorTransparentBackgroundSelected: 'var(--colorTransparentBackgroundSelected)',
colorNeutralBackgroundDisabled: 'var(--colorNeutralBackgroundDisabled)',
colorNeutralBackgroundDisabled2: 'var(--colorNeutralBackgroundDisabled2)',
colorNeutralBackgroundInvertedDisabled: 'var(--colorNeutralBackgroundInvertedDisabled)',
colorNeutralStencil1: 'var(--colorNeutralStencil1)',
colorNeutralStencil2: 'var(--colorNeutralStencil2)',
colorNeutralStencil1Alpha: 'var(--colorNeutralStencil1Alpha)',
colorNeutralStencil2Alpha: 'var(--colorNeutralStencil2Alpha)',
colorBackgroundOverlay: 'var(--colorBackgroundOverlay)',
colorScrollbarOverlay: 'var(--colorScrollbarOverlay)',
colorBrandBackground: 'var(--colorBrandBackground)',
colorBrandBackgroundHover: 'var(--colorBrandBackgroundHover)',
colorBrandBackgroundPressed: 'var(--colorBrandBackgroundPressed)',
colorBrandBackgroundSelected: 'var(--colorBrandBackgroundSelected)',
colorCompoundBrandBackground: 'var(--colorCompoundBrandBackground)',
colorCompoundBrandBackgroundHover: 'var(--colorCompoundBrandBackgroundHover)',
colorCompoundBrandBackgroundPressed: 'var(--colorCompoundBrandBackgroundPressed)',
colorBrandBackgroundStatic: 'var(--colorBrandBackgroundStatic)',
colorBrandBackground2: 'var(--colorBrandBackground2)',
colorBrandBackground2Hover: 'var(--colorBrandBackground2Hover)',
colorBrandBackground2Pressed: 'var(--colorBrandBackground2Pressed)',
colorBrandBackground3Static: 'var(--colorBrandBackground3Static)',
colorBrandBackground4Static: 'var(--colorBrandBackground4Static)',
colorBrandBackgroundInverted: 'var(--colorBrandBackgroundInverted)',
colorBrandBackgroundInvertedHover: 'var(--colorBrandBackgroundInvertedHover)',
colorBrandBackgroundInvertedPressed: 'var(--colorBrandBackgroundInvertedPressed)',
colorBrandBackgroundInvertedSelected: 'var(--colorBrandBackgroundInvertedSelected)',
colorNeutralCardBackground: 'var(--colorNeutralCardBackground)',
colorNeutralCardBackgroundHover: 'var(--colorNeutralCardBackgroundHover)',
colorNeutralCardBackgroundPressed: 'var(--colorNeutralCardBackgroundPressed)',
colorNeutralCardBackgroundSelected: 'var(--colorNeutralCardBackgroundSelected)',
colorNeutralCardBackgroundDisabled: 'var(--colorNeutralCardBackgroundDisabled)',
colorNeutralStrokeAccessible: 'var(--colorNeutralStrokeAccessible)',
colorNeutralStrokeAccessibleHover: 'var(--colorNeutralStrokeAccessibleHover)',
colorNeutralStrokeAccessiblePressed: 'var(--colorNeutralStrokeAccessiblePressed)',
colorNeutralStrokeAccessibleSelected: 'var(--colorNeutralStrokeAccessibleSelected)',
colorNeutralStroke1: 'var(--colorNeutralStroke1)',
colorNeutralStroke1Hover: 'var(--colorNeutralStroke1Hover)',
colorNeutralStroke1Pressed: 'var(--colorNeutralStroke1Pressed)',
colorNeutralStroke1Selected: 'var(--colorNeutralStroke1Selected)',
colorNeutralStroke2: 'var(--colorNeutralStroke2)',
colorNeutralStroke3: 'var(--colorNeutralStroke3)',
colorNeutralStroke4: 'var(--colorNeutralStroke4)',
colorNeutralStroke4Hover: 'var(--colorNeutralStroke4Hover)',
colorNeutralStroke4Pressed: 'var(--colorNeutralStroke4Pressed)',
colorNeutralStroke4Selected: 'var(--colorNeutralStroke4Selected)',
colorNeutralStrokeSubtle: 'var(--colorNeutralStrokeSubtle)',
colorNeutralStrokeOnBrand: 'var(--colorNeutralStrokeOnBrand)',
colorNeutralStrokeOnBrand2: 'var(--colorNeutralStrokeOnBrand2)',
colorNeutralStrokeOnBrand2Hover: 'var(--colorNeutralStrokeOnBrand2Hover)',
colorNeutralStrokeOnBrand2Pressed: 'var(--colorNeutralStrokeOnBrand2Pressed)',
colorNeutralStrokeOnBrand2Selected: 'var(--colorNeutralStrokeOnBrand2Selected)',
colorBrandStroke1: 'var(--colorBrandStroke1)',
colorBrandStroke2: 'var(--colorBrandStroke2)',
colorBrandStroke2Hover: 'var(--colorBrandStroke2Hover)',
colorBrandStroke2Pressed: 'var(--colorBrandStroke2Pressed)',
colorBrandStroke2Contrast: 'var(--colorBrandStroke2Contrast)',
colorCompoundBrandStroke: 'var(--colorCompoundBrandStroke)',
colorCompoundBrandStrokeHover: 'var(--colorCompoundBrandStrokeHover)',
colorCompoundBrandStrokePressed: 'var(--colorCompoundBrandStrokePressed)',
colorNeutralStrokeDisabled: 'var(--colorNeutralStrokeDisabled)',
colorNeutralStrokeDisabled2: 'var(--colorNeutralStrokeDisabled2)',
colorNeutralStrokeInvertedDisabled: 'var(--colorNeutralStrokeInvertedDisabled)',
colorTransparentStroke: 'var(--colorTransparentStroke)',
colorTransparentStrokeInteractive: 'var(--colorTransparentStrokeInteractive)',
colorTransparentStrokeDisabled: 'var(--colorTransparentStrokeDisabled)',
colorNeutralStrokeAlpha: 'var(--colorNeutralStrokeAlpha)',
colorNeutralStrokeAlpha2: 'var(--colorNeutralStrokeAlpha2)',
colorStrokeFocus1: 'var(--colorStrokeFocus1)',
colorStrokeFocus2: 'var(--colorStrokeFocus2)',
colorNeutralShadowAmbient: 'var(--colorNeutralShadowAmbient)',
colorNeutralShadowKey: 'var(--colorNeutralShadowKey)',
colorNeutralShadowAmbientLighter: 'var(--colorNeutralShadowAmbientLighter)',
colorNeutralShadowKeyLighter: 'var(--colorNeutralShadowKeyLighter)',
colorNeutralShadowAmbientDarker: 'var(--colorNeutralShadowAmbientDarker)',
colorNeutralShadowKeyDarker: 'var(--colorNeutralShadowKeyDarker)',
colorBrandShadowAmbient: 'var(--colorBrandShadowAmbient)',
colorBrandShadowKey: 'var(--colorBrandShadowKey)',
// Color palette tokens
// Color palette red tokens
colorPaletteRedBackground1: 'var(--colorPaletteRedBackground1)',
colorPaletteRedBackground2: 'var(--colorPaletteRedBackground2)',
colorPaletteRedBackground3: 'var(--colorPaletteRedBackground3)',
colorPaletteRedBorderActive: 'var(--colorPaletteRedBorderActive)',
colorPaletteRedBorder1: 'var(--colorPaletteRedBorder1)',
colorPaletteRedBorder2: 'var(--colorPaletteRedBorder2)',
colorPaletteRedForeground1: 'var(--colorPaletteRedForeground1)',
colorPaletteRedForeground2: 'var(--colorPaletteRedForeground2)',
colorPaletteRedForeground3: 'var(--colorPaletteRedForeground3)',
colorPaletteRedForegroundInverted: 'var(--colorPaletteRedForegroundInverted)',
// Color palette green tokens
colorPaletteGreenBackground1: 'var(--colorPaletteGreenBackground1)',
colorPaletteGreenBackground2: 'var(--colorPaletteGreenBackground2)',
colorPaletteGreenBackground3: 'var(--colorPaletteGreenBackground3)',
colorPaletteGreenBorderActive: 'var(--colorPaletteGreenBorderActive)',
colorPaletteGreenBorder1: 'var(--colorPaletteGreenBorder1)',
colorPaletteGreenBorder2: 'var(--colorPaletteGreenBorder2)',
colorPaletteGreenForeground1: 'var(--colorPaletteGreenForeground1)',
colorPaletteGreenForeground2: 'var(--colorPaletteGreenForeground2)',
colorPaletteGreenForeground3: 'var(--colorPaletteGreenForeground3)',
colorPaletteGreenForegroundInverted: 'var(--colorPaletteGreenForegroundInverted)',
// Color palette dark orange tokens
colorPaletteDarkOrangeBackground1: 'var(--colorPaletteDarkOrangeBackground1)',
colorPaletteDarkOrangeBackground2: 'var(--colorPaletteDarkOrangeBackground2)',
colorPaletteDarkOrangeBackground3: 'var(--colorPaletteDarkOrangeBackground3)',
colorPaletteDarkOrangeBorderActive: 'var(--colorPaletteDarkOrangeBorderActive)',
colorPaletteDarkOrangeBorder1: 'var(--colorPaletteDarkOrangeBorder1)',
colorPaletteDarkOrangeBorder2: 'var(--colorPaletteDarkOrangeBorder2)',
colorPaletteDarkOrangeForeground1: 'var(--colorPaletteDarkOrangeForeground1)',
colorPaletteDarkOrangeForeground2: 'var(--colorPaletteDarkOrangeForeground2)',
colorPaletteDarkOrangeForeground3: 'var(--colorPaletteDarkOrangeForeground3)',
// Color palette yellow tokens
colorPaletteYellowBackground1: 'var(--colorPaletteYellowBackground1)',
colorPaletteYellowBackground2: 'var(--colorPaletteYellowBackground2)',
colorPaletteYellowBackground3: 'var(--colorPaletteYellowBackground3)',
colorPaletteYellowBorderActive: 'var(--colorPaletteYellowBorderActive)',
colorPaletteYellowBorder1: 'var(--colorPaletteYellowBorder1)',
colorPaletteYellowBorder2: 'var(--colorPaletteYellowBorder2)',
colorPaletteYellowForeground1: 'var(--colorPaletteYellowForeground1)',
colorPaletteYellowForeground2: 'var(--colorPaletteYellowForeground2)',
colorPaletteYellowForeground3: 'var(--colorPaletteYellowForeground3)',
colorPaletteYellowForegroundInverted: 'var(--colorPaletteYellowForegroundInverted)',
// Color palette berry tokens
colorPaletteBerryBackground1: 'var(--colorPaletteBerryBackground1)',
colorPaletteBerryBackground2: 'var(--colorPaletteBerryBackground2)',
colorPaletteBerryBackground3: 'var(--colorPaletteBerryBackground3)',
colorPaletteBerryBorderActive: 'var(--colorPaletteBerryBorderActive)',
colorPaletteBerryBorder1: 'var(--colorPaletteBerryBorder1)',
colorPaletteBerryBorder2: 'var(--colorPaletteBerryBorder2)',
colorPaletteBerryForeground1: 'var(--colorPaletteBerryForeground1)',
colorPaletteBerryForeground2: 'var(--colorPaletteBerryForeground2)',
colorPaletteBerryForeground3: 'var(--colorPaletteBerryForeground3)',
// Color palette marigold tokens
colorPaletteMarigoldBackground1: 'var(--colorPaletteMarigoldBackground1)',
colorPaletteMarigoldBackground2: 'var(--colorPaletteMarigoldBackground2)',
colorPaletteMarigoldBackground3: 'var(--colorPaletteMarigoldBackground3)',
colorPaletteMarigoldBorderActive: 'var(--colorPaletteMarigoldBorderActive)',
colorPaletteMarigoldBorder1: 'var(--colorPaletteMarigoldBorder1)',
colorPaletteMarigoldBorder2: 'var(--colorPaletteMarigoldBorder2)',
colorPaletteMarigoldForeground1: 'var(--colorPaletteMarigoldForeground1)',
colorPaletteMarigoldForeground2: 'var(--colorPaletteMarigoldForeground2)',
colorPaletteMarigoldForeground3: 'var(--colorPaletteMarigoldForeground3)',
// Color palette light green tokens
colorPaletteLightGreenBackground1: 'var(--colorPaletteLightGreenBackground1)',
colorPaletteLightGreenBackground2: 'var(--colorPaletteLightGreenBackground2)',
colorPaletteLightGreenBackground3: 'var(--colorPaletteLightGreenBackground3)',
colorPaletteLightGreenBorderActive: 'var(--colorPaletteLightGreenBorderActive)',
colorPaletteLightGreenBorder1: 'var(--colorPaletteLightGreenBorder1)',
colorPaletteLightGreenBorder2: 'var(--colorPaletteLightGreenBorder2)',
colorPaletteLightGreenForeground1: 'var(--colorPaletteLightGreenForeground1)',
colorPaletteLightGreenForeground2: 'var(--colorPaletteLightGreenForeground2)',
colorPaletteLightGreenForeground3: 'var(--colorPaletteLightGreenForeground3)',
// Color palette anchor tokens
colorPaletteAnchorBackground2: 'var(--colorPaletteAnchorBackground2)',
colorPaletteAnchorBorderActive: 'var(--colorPaletteAnchorBorderActive)',
colorPaletteAnchorForeground2: 'var(--colorPaletteAnchorForeground2)',
// Color palette beige tokens
colorPaletteBeigeBackground2: 'var(--colorPaletteBeigeBackground2)',
colorPaletteBeigeBorderActive: 'var(--colorPaletteBeigeBorderActive)',
colorPaletteBeigeForeground2: 'var(--colorPaletteBeigeForeground2)',
// Color palette blue tokens
colorPaletteBlueBackground2: 'var(--colorPaletteBlueBackground2)',
colorPaletteBlueBorderActive: 'var(--colorPaletteBlueBorderActive)',
colorPaletteBlueForeground2: 'var(--colorPaletteBlueForeground2)',
// Color palette brass tokens
colorPaletteBrassBackground2: 'var(--colorPaletteBrassBackground2)',
colorPaletteBrassBorderActive: 'var(--colorPaletteBrassBorderActive)',
colorPaletteBrassForeground2: 'var(--colorPaletteBrassForeground2)',
// Color palette brown tokens
colorPaletteBrownBackground2: 'var(--colorPaletteBrownBackground2)',
colorPaletteBrownBorderActive: 'var(--colorPaletteBrownBorderActive)',
colorPaletteBrownForeground2: 'var(--colorPaletteBrownForeground2)',
// Color palette cornflower tokens
colorPaletteCornflowerBackground2: 'var(--colorPaletteCornflowerBackground2)',
colorPaletteCornflowerBorderActive: 'var(--colorPaletteCornflowerBorderActive)',
colorPaletteCornflowerForeground2: 'var(--colorPaletteCornflowerForeground2)',
// Color palette cranberry tokens
colorPaletteCranberryBackground2: 'var(--colorPaletteCranberryBackground2)',
colorPaletteCranberryBorderActive: 'var(--colorPaletteCranberryBorderActive)',
colorPaletteCranberryForeground2: 'var(--colorPaletteCranberryForeground2)',
// Color palette dark green tokens
colorPaletteDarkGreenBackground2: 'var(--colorPaletteDarkGreenBackground2)',
colorPaletteDarkGreenBorderActive: 'var(--colorPaletteDarkGreenBorderActive)',
colorPaletteDarkGreenForeground2: 'var(--colorPaletteDarkGreenForeground2)',
// Color palette dark red tokens
colorPaletteDarkRedBackground2: 'var(--colorPaletteDarkRedBackground2)',
colorPaletteDarkRedBorderActive: 'var(--colorPaletteDarkRedBorderActive)',
colorPaletteDarkRedForeground2: 'var(--colorPaletteDarkRedForeground2)',
// Color palette forest tokens
colorPaletteForestBackground2: 'var(--colorPaletteForestBackground2)',
colorPaletteForestBorderActive: 'var(--colorPaletteForestBorderActive)',
colorPaletteForestForeground2: 'var(--colorPaletteForestForeground2)',
// Color palette gold tokens
colorPaletteGoldBackground2: 'var(--colorPaletteGoldBackground2)',
colorPaletteGoldBorderActive: 'var(--colorPaletteGoldBorderActive)',
colorPaletteGoldForeground2: 'var(--colorPaletteGoldForeground2)',
// Color palette grape tokens
colorPaletteGrapeBackground2: 'var(--colorPaletteGrapeBackground2)',
colorPaletteGrapeBorderActive: 'var(--colorPaletteGrapeBorderActive)',
colorPaletteGrapeForeground2: 'var(--colorPaletteGrapeForeground2)',
// Color palette lavender tokens
colorPaletteLavenderBackground2: 'var(--colorPaletteLavenderBackground2)',
colorPaletteLavenderBorderActive: 'var(--colorPaletteLavenderBorderActive)',
colorPaletteLavenderForeground2: 'var(--colorPaletteLavenderForeground2)',
// Color palette light teal tokens
colorPaletteLightTealBackground2: 'var(--colorPaletteLightTealBackground2)',
colorPaletteLightTealBorderActive: 'var(--colorPaletteLightTealBorderActive)',
colorPaletteLightTealForeground2: 'var(--colorPaletteLightTealForeground2)',
// Color palette lilac tokens
colorPaletteLilacBackground2: 'var(--colorPaletteLilacBackground2)',
colorPaletteLilacBorderActive: 'var(--colorPaletteLilacBorderActive)',
colorPaletteLilacForeground2: 'var(--colorPaletteLilacForeground2)',
// Color palette magenta tokens
colorPaletteMagentaBackground2: 'var(--colorPaletteMagentaBackground2)',
colorPaletteMagentaBorderActive: 'var(--colorPaletteMagentaBorderActive)',
colorPaletteMagentaForeground2: 'var(--colorPaletteMagentaForeground2)',
// Color palette mink tokens
colorPaletteMinkBackground2: 'var(--colorPaletteMinkBackground2)',
colorPaletteMinkBorderActive: 'var(--colorPaletteMinkBorderActive)',
colorPaletteMinkForeground2: 'var(--colorPaletteMinkForeground2)',
// Color palette navy tokens
colorPaletteNavyBackground2: 'var(--colorPaletteNavyBackground2)',
colorPaletteNavyBorderActive: 'var(--colorPaletteNavyBorderActive)',
colorPaletteNavyForeground2: 'var(--colorPaletteNavyForeground2)',
// Color palette peach tokens
colorPalettePeachBackground2: 'var(--colorPalettePeachBackground2)',
colorPalettePeachBorderActive: 'var(--colorPalettePeachBorderActive)',
colorPalettePeachForeground2: 'var(--colorPalettePeachForeground2)',
// Color palette pink tokens
colorPalettePinkBackground2: 'var(--colorPalettePinkBackground2)',
colorPalettePinkBorderActive: 'var(--colorPalettePinkBorderActive)',
colorPalettePinkForeground2: 'var(--colorPalettePinkForeground2)',
// Color palette platinum tokens
colorPalettePlatinumBackground2: 'var(--colorPalettePlatinumBackground2)',
colorPalettePlatinumBorderActive: 'var(--colorPalettePlatinumBorderActive)',
colorPalettePlatinumForeground2: 'var(--colorPalettePlatinumForeground2)',
// Color palette plum tokens
colorPalettePlumBackground2: 'var(--colorPalettePlumBackground2)',
colorPalettePlumBorderActive: 'var(--colorPalettePlumBorderActive)',
colorPalettePlumForeground2: 'var(--colorPalettePlumForeground2)',
// Color palette pumpkin tokens
colorPalettePumpkinBackground2: 'var(--colorPalettePumpkinBackground2)',
colorPalettePumpkinBorderActive: 'var(--colorPalettePumpkinBorderActive)',
colorPalettePumpkinForeground2: 'var(--colorPalettePumpkinForeground2)',
// Color palette purple tokens
colorPalettePurpleBackground2: 'var(--colorPalettePurpleBackground2)',
colorPalettePurpleBorderActive: 'var(--colorPalettePurpleBorderActive)',
colorPalettePurpleForeground2: 'var(--colorPalettePurpleForeground2)',
// Color palette royal blue tokens
colorPaletteRoyalBlueBackground2: 'var(--colorPaletteRoyalBlueBackground2)',
colorPaletteRoyalBlueBorderActive: 'var(--colorPaletteRoyalBlueBorderActive)',
colorPaletteRoyalBlueForeground2: 'var(--colorPaletteRoyalBlueForeground2)',
// Color palette seafoam tokens
colorPaletteSeafoamBackground2: 'var(--colorPaletteSeafoamBackground2)',
colorPaletteSeafoamBorderActive: 'var(--colorPaletteSeafoamBorderActive)',
colorPaletteSeafoamForeground2: 'var(--colorPaletteSeafoamForeground2)',
// Color palette steel tokens
colorPaletteSteelBackground2: 'var(--colorPaletteSteelBackground2)',
colorPaletteSteelBorderActive: 'var(--colorPaletteSteelBorderActive)',
colorPaletteSteelForeground2: 'var(--colorPaletteSteelForeground2)',
// Color palette teal tokens
colorPaletteTealBackground2: 'var(--colorPaletteTealBackground2)',
colorPaletteTealBorderActive: 'var(--colorPaletteTealBorderActive)',
colorPaletteTealForeground2: 'var(--colorPaletteTealForeground2)',
// Color status success tokens
colorStatusSuccessBackground1: 'var(--colorStatusSuccessBackground1)',
colorStatusSuccessBackground2: 'var(--colorStatusSuccessBackground2)',
colorStatusSuccessBackground3: 'var(--colorStatusSuccessBackground3)',
colorStatusSuccessForeground1: 'var(--colorStatusSuccessForeground1)',
colorStatusSuccessForeground2: 'var(--colorStatusSuccessForeground2)',
colorStatusSuccessForeground3: 'var(--colorStatusSuccessForeground3)',
colorStatusSuccessForegroundInverted: 'var(--colorStatusSuccessForegroundInverted)',
colorStatusSuccessBorderActive: 'var(--colorStatusSuccessBorderActive)',
colorStatusSuccessBorder1: 'var(--colorStatusSuccessBorder1)',
colorStatusSuccessBorder2: 'var(--colorStatusSuccessBorder2)',
// Color status warning tokens
colorStatusWarningBackground1: 'var(--colorStatusWarningBackground1)',
colorStatusWarningBackground2: 'var(--colorStatusWarningBackground2)',
colorStatusWarningBackground3: 'var(--colorStatusWarningBackground3)',
colorStatusWarningForeground1: 'var(--colorStatusWarningForeground1)',
colorStatusWarningForeground2: 'var(--colorStatusWarningForeground2)',
colorStatusWarningForeground3: 'var(--colorStatusWarningForeground3)',
colorStatusWarningForegroundInverted: 'var(--colorStatusWarningForegroundInverted)',
colorStatusWarningBorderActive: 'var(--colorStatusWarningBorderActive)',
colorStatusWarningBorder1: 'var(--colorStatusWarningBorder1)',
colorStatusWarningBorder2: 'var(--colorStatusWarningBorder2)',
// Color status danger tokens
colorStatusDangerBackground1: 'var(--colorStatusDangerBackground1)',
colorStatusDangerBackground2: 'var(--colorStatusDangerBackground2)',
colorStatusDangerBackground3: 'var(--colorStatusDangerBackground3)',
colorStatusDangerBackground3Hover: 'var(--colorStatusDangerBackground3Hover)',
colorStatusDangerBackground3Pressed: 'var(--colorStatusDangerBackground3Pressed)',
colorStatusDangerForeground1: 'var(--colorStatusDangerForeground1)',
colorStatusDangerForeground2: 'var(--colorStatusDangerForeground2)',
colorStatusDangerForeground3: 'var(--colorStatusDangerForeground3)',
colorStatusDangerForegroundInverted: 'var(--colorStatusDangerForegroundInverted)',
colorStatusDangerBorderActive: 'var(--colorStatusDangerBorderActive)',
colorStatusDangerBorder1: 'var(--colorStatusDangerBorder1)',
colorStatusDangerBorder2: 'var(--colorStatusDangerBorder2)',
// Border radius tokens
borderRadiusNone: 'var(--borderRadiusNone)',
borderRadiusSmall: 'var(--borderRadiusSmall)',
borderRadiusMedium: 'var(--borderRadiusMedium)',
borderRadiusLarge: 'var(--borderRadiusLarge)',
borderRadiusXLarge: 'var(--borderRadiusXLarge)',
borderRadius2XLarge: 'var(--borderRadius2XLarge)',
borderRadius3XLarge: 'var(--borderRadius3XLarge)',
borderRadius4XLarge: 'var(--borderRadius4XLarge)',
borderRadius5XLarge: 'var(--borderRadius5XLarge)',
borderRadius6XLarge: 'var(--borderRadius6XLarge)',
borderRadiusCircular: 'var(--borderRadiusCircular)',
// Font family tokens
fontFamilyBase: 'var(--fontFamilyBase)',
fontFamilyMonospace: 'var(--fontFamilyMonospace)',
fontFamilyNumeric: 'var(--fontFamilyNumeric)',
// Font size tokens
fontSizeBase100: 'var(--fontSizeBase100)',
fontSizeBase200: 'var(--fontSizeBase200)',
fontSizeBase300: 'var(--fontSizeBase300)',
fontSizeBase400: 'var(--fontSizeBase400)',
fontSizeBase500: 'var(--fontSizeBase500)',
fontSizeBase600: 'var(--fontSizeBase600)',
fontSizeHero700: 'var(--fontSizeHero700)',
fontSizeHero800: 'var(--fontSizeHero800)',
fontSizeHero900: 'var(--fontSizeHero900)',
fontSizeHero1000: 'var(--fontSizeHero1000)',
// Font weight tokens
fontWeightRegular: 'var(--fontWeightRegular)',
fontWeightMedium: 'var(--fontWeightMedium)',
fontWeightSemibold: 'var(--fontWeightSemibold)',
fontWeightBold: 'var(--fontWeightBold)',
// Line height tokens
lineHeightBase100: 'var(--lineHeightBase100)',
lineHeightBase200: 'var(--lineHeightBase200)',
lineHeightBase300: 'var(--lineHeightBase300)',
lineHeightBase400: 'var(--lineHeightBase400)',
lineHeightBase500: 'var(--lineHeightBase500)',
lineHeightBase600: 'var(--lineHeightBase600)',
lineHeightHero700: 'var(--lineHeightHero700)',
lineHeightHero800: 'var(--lineHeightHero800)',
lineHeightHero900: 'var(--lineHeightHero900)',
lineHeightHero1000: 'var(--lineHeightHero1000)',
// Shadow tokens
shadow2: 'var(--shadow2)',
shadow4: 'var(--shadow4)',
shadow8: 'var(--shadow8)',
shadow16: 'var(--shadow16)',
shadow28: 'var(--shadow28)',
shadow64: 'var(--shadow64)',
// Shadow brand tokens
shadow2Brand: 'var(--shadow2Brand)',
shadow4Brand: 'var(--shadow4Brand)',
shadow8Brand: 'var(--shadow8Brand)',
shadow16Brand: 'var(--shadow16Brand)',
shadow28Brand: 'var(--shadow28Brand)',
shadow64Brand: 'var(--shadow64Brand)',
// Stroke width tokens
strokeWidthThin: 'var(--strokeWidthThin)',
strokeWidthThick: 'var(--strokeWidthThick)',
strokeWidthThicker: 'var(--strokeWidthThicker)',
strokeWidthThickest: 'var(--strokeWidthThickest)',
// Spacings
spacingHorizontalNone: 'var(--spacingHorizontalNone)',
spacingHorizontalXXS: 'var(--spacingHorizontalXXS)',
spacingHorizontalXS: 'var(--spacingHorizontalXS)',
spacingHorizontalSNudge: 'var(--spacingHorizontalSNudge)',
spacingHorizontalS: 'var(--spacingHorizontalS)',
spacingHorizontalMNudge: 'var(--spacingHorizontalMNudge)',
spacingHorizontalM: 'var(--spacingHorizontalM)',
spacingHorizontalL: 'var(--spacingHorizontalL)',
spacingHorizontalXL: 'var(--spacingHorizontalXL)',
spacingHorizontalXXL: 'var(--spacingHorizontalXXL)',
spacingHorizontalXXXL: 'var(--spacingHorizontalXXXL)',
spacingVerticalNone: 'var(--spacingVerticalNone)',
spacingVerticalXXS: 'var(--spacingVerticalXXS)',
spacingVerticalXS: 'var(--spacingVerticalXS)',
spacingVerticalSNudge: 'var(--spacingVerticalSNudge)',
spacingVerticalS: 'var(--spacingVerticalS)',
spacingVerticalMNudge: 'var(--spacingVerticalMNudge)',
spacingVerticalM: 'var(--spacingVerticalM)',
spacingVerticalL: 'var(--spacingVerticalL)',
spacingVerticalXL: 'var(--spacingVerticalXL)',
spacingVerticalXXL: 'var(--spacingVerticalXXL)',
spacingVerticalXXXL: 'var(--spacingVerticalXXXL)',
// Durations
durationUltraFast: 'var(--durationUltraFast)',
durationFaster: 'var(--durationFaster)',
durationFast: 'var(--durationFast)',
durationNormal: 'var(--durationNormal)',
durationGentle: 'var(--durationGentle)',
durationSlow: 'var(--durationSlow)',
durationSlower: 'var(--durationSlower)',
durationUltraSlow: 'var(--durationUltraSlow)',
// Curves
curveAccelerateMax: 'var(--curveAccelerateMax)',
curveAccelerateMid: 'var(--curveAccelerateMid)',
curveAccelerateMin: 'var(--curveAccelerateMin)',
curveDecelerateMax: 'var(--curveDecelerateMax)',
curveDecelerateMid: 'var(--curveDecelerateMid)',
curveDecelerateMin: 'var(--curveDecelerateMin)',
curveEasyEaseMax: 'var(--curveEasyEaseMax)',
curveEasyEase: 'var(--curveEasyEase)',
curveLinear: 'var(--curveLinear)',
/**
* ZIndexes
* Special case where the tokens contain default values
* ZIndexes are not mandatory, so they are not included in the theme, but can be used as tokens with default values
*/ /**
* Elevation 0
* Can be used for background elements, like surfaces
*/ zIndexBackground: 'var(--zIndexBackground, 0)',
/**
* Elevation 2
* Can be used content that is on top of the background, like cards
*/ zIndexContent: 'var(--zIndexContent, 1)',
/**
* Elevation 4
* Can be used for overlays, like the backdrop of a modal
*/ zIndexOverlay: 'var(--zIndexOverlay, 1000)',
/**
* Elevation 8
* Can be used for popups, like modals and drawers
*/ zIndexPopup: 'var(--zIndexPopup, 2000)',
/**
* Elevation 16
* Can be used for messages, like snackbars and toasts
*/ zIndexMessages: 'var(--zIndexMessages, 3000)',
/**
* Elevation 28
* Can be used for floating elements, like dropdowns
*/ zIndexFloating: 'var(--zIndexFloating, 4000)',
/**
* Elevation 64
* Can be used for high priority floating elements, like tooltips
*/ zIndexPriority: 'var(--zIndexPriority, 5000)',
/**
* Special elevation
* Can be used for elements that need to be above everything else, like debug overlays
*/ zIndexDebug: 'var(--zIndexDebug, 6000)'
};

1
node_modules/@fluentui/tokens/lib/tokens.js.map generated vendored Normal file

File diff suppressed because one or more lines are too long

1
node_modules/@fluentui/tokens/lib/types.js generated vendored Normal file
View File

@@ -0,0 +1 @@
export { };

1
node_modules/@fluentui/tokens/lib/types.js.map generated vendored Normal file

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,27 @@
import { colorPaletteTokens, colorStatusTokens } from "../alias/darkColorPalette.js";
import { generateColorTokens } from "../alias/darkColor.js";
import { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from "../global/index.js";
import { createShadowTokens } from "./shadows.js";
import { durations } from "../global/durations.js";
import { curves } from "../global/curves.js";
import { horizontalSpacings, verticalSpacings } from "../global/spacings.js";
export const createDarkTheme = (brand)=>{
const colorTokens = generateColorTokens(brand);
return {
...borderRadius,
...fontSizes,
...lineHeights,
...fontFamilies,
...fontWeights,
...strokeWidths,
...horizontalSpacings,
...verticalSpacings,
...durations,
...curves,
...colorTokens,
...colorPaletteTokens,
...colorStatusTokens,
...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),
...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand')
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/createDarkTheme.ts"],"sourcesContent":["import { colorPaletteTokens, colorStatusTokens } from '../alias/darkColorPalette';\nimport { generateColorTokens } from '../alias/darkColor';\n\nimport { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from '../global/index';\nimport { createShadowTokens } from './shadows';\nimport type { BrandVariants, Theme } from '../types';\nimport { durations } from '../global/durations';\nimport { curves } from '../global/curves';\nimport { horizontalSpacings, verticalSpacings } from '../global/spacings';\n\nexport const createDarkTheme: (brand: BrandVariants) => Theme = brand => {\n const colorTokens = generateColorTokens(brand);\n\n return {\n ...borderRadius,\n ...fontSizes,\n ...lineHeights,\n ...fontFamilies,\n ...fontWeights,\n ...strokeWidths,\n ...horizontalSpacings,\n ...verticalSpacings,\n ...durations,\n ...curves,\n\n ...colorTokens,\n ...colorPaletteTokens,\n ...colorStatusTokens,\n\n ...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),\n ...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand'),\n };\n};\n"],"names":["colorPaletteTokens","colorStatusTokens","generateColorTokens","borderRadius","fontSizes","lineHeights","fontFamilies","strokeWidths","fontWeights","createShadowTokens","durations","curves","horizontalSpacings","verticalSpacings","createDarkTheme","brand","colorTokens","colorNeutralShadowAmbient","colorNeutralShadowKey","colorBrandShadowAmbient","colorBrandShadowKey"],"mappings":"AAAA,SAASA,kBAAkB,EAAEC,iBAAiB,QAAQ,+BAA4B;AAClF,SAASC,mBAAmB,QAAQ,wBAAqB;AAEzD,SAASC,YAAY,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ,qBAAkB;AAChH,SAASC,kBAAkB,QAAQ,eAAY;AAE/C,SAASC,SAAS,QAAQ,yBAAsB;AAChD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,wBAAqB;AAE1E,OAAO,MAAMC,kBAAmDC,CAAAA;IAC9D,MAAMC,cAAcd,oBAAoBa;IAExC,OAAO;QACL,GAAGZ,YAAY;QACf,GAAGC,SAAS;QACZ,GAAGC,WAAW;QACd,GAAGC,YAAY;QACf,GAAGE,WAAW;QACd,GAAGD,YAAY;QACf,GAAGK,kBAAkB;QACrB,GAAGC,gBAAgB;QACnB,GAAGH,SAAS;QACZ,GAAGC,MAAM;QAET,GAAGK,WAAW;QACd,GAAGhB,kBAAkB;QACrB,GAAGC,iBAAiB;QAEpB,GAAGQ,mBAAmBO,YAAYC,yBAAyB,EAAED,YAAYE,qBAAqB,CAAC;QAC/F,GAAGT,mBAAmBO,YAAYG,uBAAuB,EAAEH,YAAYI,mBAAmB,EAAE,QAAQ;IACtG;AACF,EAAE"}

View File

@@ -0,0 +1,27 @@
import { colorPaletteTokens, colorStatusTokens } from "../alias/highContrastColorPalette.js";
import { generateColorTokens } from "../alias/highContrastColor.js";
import { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from "../global/index.js";
import { createShadowTokens } from "./shadows.js";
import { durations } from "../global/durations.js";
import { curves } from "../global/curves.js";
import { horizontalSpacings, verticalSpacings } from "../global/spacings.js";
export const createHighContrastTheme = ()=>{
const colorTokens = generateColorTokens();
return {
...borderRadius,
...fontSizes,
...lineHeights,
...fontFamilies,
...fontWeights,
...strokeWidths,
...horizontalSpacings,
...verticalSpacings,
...durations,
...curves,
...colorTokens,
...colorPaletteTokens,
...colorStatusTokens,
...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),
...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand')
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/createHighContrastTheme.ts"],"sourcesContent":["import { colorPaletteTokens, colorStatusTokens } from '../alias/highContrastColorPalette';\nimport { generateColorTokens } from '../alias/highContrastColor';\n\nimport { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from '../global/index';\nimport { createShadowTokens } from './shadows';\nimport type { Theme } from '../types';\nimport { durations } from '../global/durations';\nimport { curves } from '../global/curves';\nimport { horizontalSpacings, verticalSpacings } from '../global/spacings';\n\nexport const createHighContrastTheme = (): Theme => {\n const colorTokens = generateColorTokens();\n\n return {\n ...borderRadius,\n ...fontSizes,\n ...lineHeights,\n ...fontFamilies,\n ...fontWeights,\n ...strokeWidths,\n ...horizontalSpacings,\n ...verticalSpacings,\n ...durations,\n ...curves,\n\n ...colorTokens,\n ...colorPaletteTokens,\n ...colorStatusTokens,\n\n ...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),\n ...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand'),\n };\n};\n"],"names":["colorPaletteTokens","colorStatusTokens","generateColorTokens","borderRadius","fontSizes","lineHeights","fontFamilies","strokeWidths","fontWeights","createShadowTokens","durations","curves","horizontalSpacings","verticalSpacings","createHighContrastTheme","colorTokens","colorNeutralShadowAmbient","colorNeutralShadowKey","colorBrandShadowAmbient","colorBrandShadowKey"],"mappings":"AAAA,SAASA,kBAAkB,EAAEC,iBAAiB,QAAQ,uCAAoC;AAC1F,SAASC,mBAAmB,QAAQ,gCAA6B;AAEjE,SAASC,YAAY,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ,qBAAkB;AAChH,SAASC,kBAAkB,QAAQ,eAAY;AAE/C,SAASC,SAAS,QAAQ,yBAAsB;AAChD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,wBAAqB;AAE1E,OAAO,MAAMC,0BAA0B;IACrC,MAAMC,cAAcb;IAEpB,OAAO;QACL,GAAGC,YAAY;QACf,GAAGC,SAAS;QACZ,GAAGC,WAAW;QACd,GAAGC,YAAY;QACf,GAAGE,WAAW;QACd,GAAGD,YAAY;QACf,GAAGK,kBAAkB;QACrB,GAAGC,gBAAgB;QACnB,GAAGH,SAAS;QACZ,GAAGC,MAAM;QAET,GAAGI,WAAW;QACd,GAAGf,kBAAkB;QACrB,GAAGC,iBAAiB;QAEpB,GAAGQ,mBAAmBM,YAAYC,yBAAyB,EAAED,YAAYE,qBAAqB,CAAC;QAC/F,GAAGR,mBAAmBM,YAAYG,uBAAuB,EAAEH,YAAYI,mBAAmB,EAAE,QAAQ;IACtG;AACF,EAAE"}

View File

@@ -0,0 +1,27 @@
import { colorPaletteTokens, colorStatusTokens } from "../alias/lightColorPalette.js";
import { generateColorTokens } from "../alias/lightColor.js";
import { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from "../global/index.js";
import { createShadowTokens } from "./shadows.js";
import { durations } from "../global/durations.js";
import { curves } from "../global/curves.js";
import { horizontalSpacings, verticalSpacings } from "../global/spacings.js";
export const createLightTheme = (brand)=>{
const colorTokens = generateColorTokens(brand);
return {
...borderRadius,
...fontSizes,
...lineHeights,
...fontFamilies,
...fontWeights,
...strokeWidths,
...horizontalSpacings,
...verticalSpacings,
...durations,
...curves,
...colorTokens,
...colorPaletteTokens,
...colorStatusTokens,
...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),
...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand')
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/createLightTheme.ts"],"sourcesContent":["import { colorPaletteTokens, colorStatusTokens } from '../alias/lightColorPalette';\nimport { generateColorTokens } from '../alias/lightColor';\n\nimport { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from '../global/index';\nimport { createShadowTokens } from './shadows';\nimport type { BrandVariants, Theme } from '../types';\nimport { durations } from '../global/durations';\nimport { curves } from '../global/curves';\nimport { horizontalSpacings, verticalSpacings } from '../global/spacings';\n\nexport const createLightTheme: (brand: BrandVariants) => Theme = brand => {\n const colorTokens = generateColorTokens(brand);\n\n return {\n ...borderRadius,\n ...fontSizes,\n ...lineHeights,\n ...fontFamilies,\n ...fontWeights,\n ...strokeWidths,\n ...horizontalSpacings,\n ...verticalSpacings,\n ...durations,\n ...curves,\n\n ...colorTokens,\n ...colorPaletteTokens,\n ...colorStatusTokens,\n\n ...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),\n ...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand'),\n };\n};\n"],"names":["colorPaletteTokens","colorStatusTokens","generateColorTokens","borderRadius","fontSizes","lineHeights","fontFamilies","strokeWidths","fontWeights","createShadowTokens","durations","curves","horizontalSpacings","verticalSpacings","createLightTheme","brand","colorTokens","colorNeutralShadowAmbient","colorNeutralShadowKey","colorBrandShadowAmbient","colorBrandShadowKey"],"mappings":"AAAA,SAASA,kBAAkB,EAAEC,iBAAiB,QAAQ,gCAA6B;AACnF,SAASC,mBAAmB,QAAQ,yBAAsB;AAE1D,SAASC,YAAY,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ,qBAAkB;AAChH,SAASC,kBAAkB,QAAQ,eAAY;AAE/C,SAASC,SAAS,QAAQ,yBAAsB;AAChD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,wBAAqB;AAE1E,OAAO,MAAMC,mBAAoDC,CAAAA;IAC/D,MAAMC,cAAcd,oBAAoBa;IAExC,OAAO;QACL,GAAGZ,YAAY;QACf,GAAGC,SAAS;QACZ,GAAGC,WAAW;QACd,GAAGC,YAAY;QACf,GAAGE,WAAW;QACd,GAAGD,YAAY;QACf,GAAGK,kBAAkB;QACrB,GAAGC,gBAAgB;QACnB,GAAGH,SAAS;QACZ,GAAGC,MAAM;QAET,GAAGK,WAAW;QACd,GAAGhB,kBAAkB;QACrB,GAAGC,iBAAiB;QAEpB,GAAGQ,mBAAmBO,YAAYC,yBAAyB,EAAED,YAAYE,qBAAqB,CAAC;QAC/F,GAAGT,mBAAmBO,YAAYG,uBAAuB,EAAEH,YAAYI,mBAAmB,EAAE,QAAQ;IACtG;AACF,EAAE"}

View File

@@ -0,0 +1,27 @@
import { colorPaletteTokens, colorStatusTokens } from "../alias/darkColorPalette.js";
import { generateColorTokens } from "../alias/teamsDarkColor.js";
import { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from "../global/index.js";
import { createShadowTokens } from "./shadows.js";
import { durations } from "../global/durations.js";
import { curves } from "../global/curves.js";
import { horizontalSpacings, verticalSpacings } from "../global/spacings.js";
export const createTeamsDarkTheme = (brand)=>{
const colorTokens = generateColorTokens(brand);
return {
...borderRadius,
...fontSizes,
...lineHeights,
...fontFamilies,
...fontWeights,
...strokeWidths,
...horizontalSpacings,
...verticalSpacings,
...durations,
...curves,
...colorTokens,
...colorPaletteTokens,
...colorStatusTokens,
...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),
...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand')
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/createTeamsDarkTheme.ts"],"sourcesContent":["import { colorPaletteTokens, colorStatusTokens } from '../alias/darkColorPalette';\nimport { generateColorTokens } from '../alias/teamsDarkColor';\n\nimport { borderRadius, fontSizes, lineHeights, fontFamilies, strokeWidths, fontWeights } from '../global/index';\nimport { createShadowTokens } from './shadows';\nimport type { BrandVariants, Theme } from '../types';\nimport { durations } from '../global/durations';\nimport { curves } from '../global/curves';\nimport { horizontalSpacings, verticalSpacings } from '../global/spacings';\n\nexport const createTeamsDarkTheme: (brand: BrandVariants) => Theme = brand => {\n const colorTokens = generateColorTokens(brand);\n\n return {\n ...borderRadius,\n ...fontSizes,\n ...lineHeights,\n ...fontFamilies,\n ...fontWeights,\n ...strokeWidths,\n ...horizontalSpacings,\n ...verticalSpacings,\n ...durations,\n ...curves,\n\n ...colorTokens,\n ...colorPaletteTokens,\n ...colorStatusTokens,\n\n ...createShadowTokens(colorTokens.colorNeutralShadowAmbient, colorTokens.colorNeutralShadowKey),\n ...createShadowTokens(colorTokens.colorBrandShadowAmbient, colorTokens.colorBrandShadowKey, 'Brand'),\n };\n};\n"],"names":["colorPaletteTokens","colorStatusTokens","generateColorTokens","borderRadius","fontSizes","lineHeights","fontFamilies","strokeWidths","fontWeights","createShadowTokens","durations","curves","horizontalSpacings","verticalSpacings","createTeamsDarkTheme","brand","colorTokens","colorNeutralShadowAmbient","colorNeutralShadowKey","colorBrandShadowAmbient","colorBrandShadowKey"],"mappings":"AAAA,SAASA,kBAAkB,EAAEC,iBAAiB,QAAQ,+BAA4B;AAClF,SAASC,mBAAmB,QAAQ,6BAA0B;AAE9D,SAASC,YAAY,EAAEC,SAAS,EAAEC,WAAW,EAAEC,YAAY,EAAEC,YAAY,EAAEC,WAAW,QAAQ,qBAAkB;AAChH,SAASC,kBAAkB,QAAQ,eAAY;AAE/C,SAASC,SAAS,QAAQ,yBAAsB;AAChD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,kBAAkB,EAAEC,gBAAgB,QAAQ,wBAAqB;AAE1E,OAAO,MAAMC,uBAAwDC,CAAAA;IACnE,MAAMC,cAAcd,oBAAoBa;IAExC,OAAO;QACL,GAAGZ,YAAY;QACf,GAAGC,SAAS;QACZ,GAAGC,WAAW;QACd,GAAGC,YAAY;QACf,GAAGE,WAAW;QACd,GAAGD,YAAY;QACf,GAAGK,kBAAkB;QACrB,GAAGC,gBAAgB;QACnB,GAAGH,SAAS;QACZ,GAAGC,MAAM;QAET,GAAGK,WAAW;QACd,GAAGhB,kBAAkB;QACrB,GAAGC,iBAAiB;QAEpB,GAAGQ,mBAAmBO,YAAYC,yBAAyB,EAAED,YAAYE,qBAAqB,CAAC;QAC/F,GAAGT,mBAAmBO,YAAYG,uBAAuB,EAAEH,YAAYI,mBAAmB,EAAE,QAAQ;IACtG;AACF,EAAE"}

4
node_modules/@fluentui/tokens/lib/utils/index.js generated vendored Normal file
View File

@@ -0,0 +1,4 @@
export { createLightTheme } from "./createLightTheme.js";
export { createDarkTheme } from "./createDarkTheme.js";
export { createTeamsDarkTheme } from "./createTeamsDarkTheme.js";
export { createHighContrastTheme } from "./createHighContrastTheme.js";

1
node_modules/@fluentui/tokens/lib/utils/index.js.map generated vendored Normal file
View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { createLightTheme } from './createLightTheme';\nexport { createDarkTheme } from './createDarkTheme';\nexport { createTeamsDarkTheme } from './createTeamsDarkTheme';\nexport { createHighContrastTheme } from './createHighContrastTheme';\n"],"names":["createLightTheme","createDarkTheme","createTeamsDarkTheme","createHighContrastTheme"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,wBAAqB;AACtD,SAASC,eAAe,QAAQ,uBAAoB;AACpD,SAASC,oBAAoB,QAAQ,4BAAyB;AAC9D,SAASC,uBAAuB,QAAQ,+BAA4B"}

10
node_modules/@fluentui/tokens/lib/utils/shadows.js generated vendored Normal file
View File

@@ -0,0 +1,10 @@
export function createShadowTokens(ambientColor, keyColor, tokenSuffix = '') {
return {
[`shadow2${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 1px 2px ${keyColor}`,
[`shadow4${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 2px 4px ${keyColor}`,
[`shadow8${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 4px 8px ${keyColor}`,
[`shadow16${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 8px 16px ${keyColor}`,
[`shadow28${tokenSuffix}`]: `0 0 8px ${ambientColor}, 0 14px 28px ${keyColor}`,
[`shadow64${tokenSuffix}`]: `0 0 8px ${ambientColor}, 0 32px 64px ${keyColor}`
};
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/utils/shadows.ts"],"sourcesContent":["import type { ShadowBrandTokens, ShadowTokens } from '../types';\n\nexport function createShadowTokens(ambientColor: string, keyColor: string, tokenSuffix: 'Brand'): ShadowBrandTokens;\nexport function createShadowTokens(ambientColor: string, keyColor: string): ShadowTokens;\n\nexport function createShadowTokens(ambientColor: string, keyColor: string, tokenSuffix: 'Brand' | '' = '') {\n return {\n [`shadow2${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 1px 2px ${keyColor}`,\n [`shadow4${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 2px 4px ${keyColor}`,\n [`shadow8${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 4px 8px ${keyColor}`,\n [`shadow16${tokenSuffix}`]: `0 0 2px ${ambientColor}, 0 8px 16px ${keyColor}`,\n [`shadow28${tokenSuffix}`]: `0 0 8px ${ambientColor}, 0 14px 28px ${keyColor}`,\n [`shadow64${tokenSuffix}`]: `0 0 8px ${ambientColor}, 0 32px 64px ${keyColor}`,\n };\n}\n"],"names":["createShadowTokens","ambientColor","keyColor","tokenSuffix"],"mappings":"AAKA,OAAO,SAASA,mBAAmBC,YAAoB,EAAEC,QAAgB,EAAEC,cAA4B,EAAE;IACvG,OAAO;QACL,CAAC,CAAC,OAAO,EAAEA,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,YAAY,EAAEC,UAAU;QAC3E,CAAC,CAAC,OAAO,EAAEC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,YAAY,EAAEC,UAAU;QAC3E,CAAC,CAAC,OAAO,EAAEC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,YAAY,EAAEC,UAAU;QAC3E,CAAC,CAAC,QAAQ,EAAEC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,aAAa,EAAEC,UAAU;QAC7E,CAAC,CAAC,QAAQ,EAAEC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,cAAc,EAAEC,UAAU;QAC9E,CAAC,CAAC,QAAQ,EAAEC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAEF,aAAa,cAAc,EAAEC,UAAU;IAChF;AACF"}