diff --git a/build/js/variables.js b/build/js/variables.js new file mode 100644 index 0000000..9ae1017 --- /dev/null +++ b/build/js/variables.js @@ -0,0 +1,633 @@ +/** + * Do not edit directly + * Generated on Mon, 09 Oct 2023 02:07:26 GMT + */ + +export const globalSpacingXs = "2px"; +export const globalSpacingSm = "4px"; +export const globalSpacingMd = "8px"; +export const globalSpacingLg = "16px"; +export const globalSpacingXl = "32px"; +export const globalSpacing2xl = "64px"; +export const globalSizeXs = "2px"; +export const globalSizeSm = "4px"; +export const globalSizeMd = "8px"; +export const globalSizeLg = "16px"; +export const globalSizeXl = "32px"; +export const globalSize2xl = "64px"; +export const globalBreakpointSm = 576; +export const globalBreakpointMd = 768; +export const globalBreakpointLg = 992; +export const globalBreakpointXl = 1200; +export const globalBreakpointXxl = 1400; +export const globalRadiusSm = "4px"; +export const globalRadiusMd = "10px"; +export const globalRadiusLg = "20px"; +export const globalOpacity0 = 0; +export const globalOpacity10 = 0.1; +export const globalOpacity20 = 0.2; +export const globalOpacity30 = 0.3; +export const globalOpacity40 = 0.4; +export const globalOpacity50 = 0.5; +export const globalOpacity60 = 0.6; +export const globalOpacity70 = 0.7; +export const globalOpacity80 = 0.8; +export const globalOpacity90 = 0.9; +export const globalOpacity100 = 1; +export const globalBorderSm = "1px"; +export const globalBorderMd = "2px"; +export const globalBorderLg = "5px"; +export const globalColorBlack = "#000000"; +export const globalColorWhite = "#ffffff"; +export const globalColorEmulsifyBlue100 = "#e6f5fc"; +export const globalColorEmulsifyBlue200 = "#ccecfa"; +export const globalColorEmulsifyBlue300 = "#99d9f4"; +export const globalColorEmulsifyBlue400 = "#66c5ef"; +export const globalColorEmulsifyBlue500 = "#33b2e9"; +export const globalColorEmulsifyBlue600 = "#009fe4"; +export const globalColorEmulsifyBlue700 = "#007fb6"; +export const globalColorEmulsifyBlue800 = "#005f89"; +export const globalColorEmulsifyBlue900 = "#00405b"; +export const globalColorEmulsifyBlue1000 = "#00202e"; +export const globalColorGrays100 = "#eaebec"; +export const globalColorGrays200 = "#d4d7d8"; +export const globalColorGrays300 = "#a9afb1"; +export const globalColorGrays400 = "#7f878b"; +export const globalColorGrays500 = "#545f64"; +export const globalColorGrays600 = "#29373d"; +export const globalColorGrays700 = "#212c31"; +export const globalColorGrays800 = "#192125"; +export const globalColorGrays900 = "#101618"; +export const globalColorGrays1000 = "#080b0c"; +export const globalFontFamilyPrimary = "Inter"; +export const globalFontFamilySecondary = "Sentinel"; +export const globalLineHeightNone = 1; +export const globalLineHeightTight = 1.25; +export const globalLineHeightSnug = 1.37; +export const globalLineHeightNormal = 1.5; +export const globalLineHeightRelaxed = 1.75; +export const globalLineHeightLoose = 2; +export const globalFontWeightPrimaryRegular = 400; +export const globalFontWeightPrimaryBold = 700; +export const globalFontWeightSecondaryRegular = 500; +export const globalFontWeightSecondaryBold = 700; +export const globalFontSizeTiny = "10px"; +export const globalFontSizeXSmall = "12px"; +export const globalFontSizeCaption = "14px"; +export const globalFontSizeSmall = "16px"; +export const globalFontSizeBody = "18px"; +export const globalFontSizeLead = "24px"; +export const globalFontSizeH5 = "21px"; +export const globalFontSizeH4 = "26px"; +export const globalFontSizeH3 = "31px"; +export const globalFontSizeH2 = "37px"; +export const globalFontSizeH1 = "48px"; +export const globalFontSizeDisplay = "64px"; +export const globalFontSizeHero = "80px"; +export const globalFontSizeUber = "112px"; +export const globalFontSizeColossus = "140px"; +export const globalLetterSpacing0 = "0"; +export const globalLetterSpacingTight = "-3"; +export const globalParagraphSpacing0 = 0; +export const globalFontPrimaryColossusDefault = "400 140px/1.5 Inter"; +export const globalFontPrimaryColossusBold = "700 140px/1.5 Inter"; +export const globalFontPrimaryUberDefault = "400 112px/1.5 Inter"; +export const globalFontPrimaryUberBold = "700 112px/1.5 Inter"; +export const globalFontPrimaryHeroDefault = "400 80px/1.25 Inter"; +export const globalFontPrimaryHeroBold = "700 80px/1.25 Inter"; +export const globalFontPrimaryDisplayDefault = "400 64px/1.5 Inter"; +export const globalFontPrimaryDisplayBold = "700 64px/1.5 Inter"; +export const globalFontPrimaryH1Default = "400 48px/1.5 Inter"; +export const globalFontPrimaryH1Bold = "700 48px/1.5 Inter"; +export const globalFontPrimaryH2Default = "400 37px/1.5 Inter"; +export const globalFontPrimaryH2Bold = "700 37px/1.5 Inter"; +export const globalFontPrimaryH3Default = "400 31px/1.5 Inter"; +export const globalFontPrimaryH3Bold = "700 31px/1.5 Inter"; +export const globalFontPrimaryH4Default = "400 26px/1.5 Inter"; +export const globalFontPrimaryH4Bold = "700 26px/1.5 Inter"; +export const globalFontPrimaryH5Default = "400 21px/1.5 Inter"; +export const globalFontPrimaryH5Bold = "700 21px/1.5 Inter"; +export const globalFontPrimaryLeadDefault = "400 24px/1.5 Inter"; +export const globalFontPrimaryLeadBold = "700 24px/1.5 Inter"; +export const globalFontPrimaryBodyDefault = "400 18px/1.5 Inter"; +export const globalFontPrimaryBodyBold = "700 18px/1.5 Inter"; +export const globalFontPrimaryBodyMobileDefault = "400 14px/1.5 Inter"; +export const globalFontPrimarySmallDefault = "400 16px/1.5 Inter"; +export const globalFontPrimarySmallBold = "700 16px/1.5 Inter"; +export const globalFontPrimaryCaptionDefault = "400 14px/1.5 Inter"; +export const globalFontPrimaryCaptionBold = "700 14px/1.5 Inter"; +export const globalFontPrimaryXSmallDefault = "400 12px/1.5 Inter"; +export const globalFontPrimaryXSmallBold = "700 12px/1.5 Inter"; +export const globalFontPrimaryTinyDefault = "400 10px/1.5 Inter"; +export const globalFontPrimaryTinyBold = "700 10px/1.5 Inter"; +export const globalFontSecondaryColossusDefault = "500 140px/1.5 Sentinel"; +export const globalFontSecondaryColossusBold = "700 140px/1.5 Sentinel"; +export const globalFontSecondaryUberDefault = "500 112px/1.5 Sentinel"; +export const globalFontSecondaryUberBold = "700 112px/1.5 Sentinel"; +export const globalFontSecondaryHeroDefault = "500 80px/1.25 Sentinel"; +export const globalFontSecondaryHeroBold = "700 80px/1.25 Sentinel"; +export const globalFontSecondaryDisplayDefault = "500 64px/1.5 Sentinel"; +export const globalFontSecondaryDisplayBold = "700 64px/1.5 Sentinel"; +export const globalFontSecondaryH1Default = "500 48px/1.5 Sentinel"; +export const globalFontSecondaryH1Bold = "700 48px/1.5 Sentinel"; +export const globalFontSecondaryH2Default = "500 37px/1.5 Sentinel"; +export const globalFontSecondaryH2Bold = "700 37px/1.5 Sentinel"; +export const globalFontSecondaryH3Default = "500 31px/1.5 Sentinel"; +export const globalFontSecondaryH3Bold = "700 31px/1.5 Sentinel"; +export const globalFontSecondaryH4Default = "500 26px/1.5 Sentinel"; +export const globalFontSecondaryH4Bold = "700 26px/1.5 Sentinel"; +export const globalFontSecondaryH5Default = "500 21px/1.5 Sentinel"; +export const globalFontSecondaryH5Bold = "700 21px/1.5 Sentinel"; +export const globalFontSecondaryLeadDefault = "500 24px/1.5 Sentinel"; +export const globalFontSecondaryLeadBold = "700 24px/1.5 Sentinel"; +export const globalFontSecondaryBodyDefault = "500 18px/1.5 Sentinel"; +export const globalFontSecondaryBodyBold = "700 18px/1.5 Sentinel"; +export const globalFontSecondaryBodyMobileDefault = "500 14px/1.5 Sentinel"; +export const globalFontSecondarySmallDefault = "500 16px/1.5 Sentinel"; +export const globalFontSecondarySmallBold = "700 16px/1.5 Sentinel"; +export const globalFontSecondaryCaptionDefault = "500 14px/1.5 Sentinel"; +export const globalFontSecondaryCaptionBold = "700 14px/1.5 Sentinel"; +export const globalFontSecondaryXSmallDefault = "500 12px/1.5 Sentinel"; +export const globalFontSecondaryXSmallBold = "700 12px/1.5 Sentinel"; +export const globalFontSecondaryTinyDefault = "500 10px/1.5 Sentinel"; +export const globalFontSecondaryTinyBold = "700 10px/1.5 Sentinel"; +export const globalTextCaseNone = "none"; +export const globalTextCaseUpper = "uppercase"; +export const globalTextCaseCapitalize = "capitalize"; +export const globalTextCaseLower = "lowercase"; +export const globalTextDecorationNone = "none"; +export const semanticColorPrimaryDefault = "#009fe4"; // 600 +export const semanticColorPrimaryLight = "hsl(198 100% 55.8%)"; +export const semanticColorPrimaryLighter = "hsl(198 100% 80.6%)"; +export const semanticColorPrimaryDark = "hsl(198 100% 35.8%)"; +export const semanticColorPrimaryDarker = "hsl(198 100% 26.8%)"; +export const semanticColorTextBody = "#00202e"; +export const semanticColorTextHeading = "#0080b7"; +export const semanticColorWarningDefault = "#D80F0F"; +export const semanticColorLink = "#33b2e9"; +export const semanticColorLinkHover = "#009fe4"; +export const semanticFontFamilyBody = "Inter"; +export const semanticFontFamilyHeading = "Inter"; +export const componentsAccordionAccordionHeader = "400 26px/1.5 Inter"; +export const componentsAccordionAccordionP = "400 18px/1.5 Inter"; +export const componentsAccordionAccordionColorBody = "#00202e"; +export const componentsAccordionAccordionColorHeader = "#0080b7"; +export const componentsAccordionAccordionColorHeaderHover = "#33b2e9"; +export const componentsAccordionAccordionDividerColor = "#545f64"; +export const componentsBlockQuoteBlockQuotePaddingX = "32px"; +export const componentsBlockQuoteBlockQuotePaddingY = "8px"; +export const componentsBreadcrumbsBreadcrumbDefault = "500 12px/1 Sentinel"; +export const componentsBreadcrumbsBreadcrumbTextDefault = "#7f878b"; +export const componentsBreadcrumbsBreadcrumbTextHover = "#192125"; +export const componentsButtonButtonColorBkg = "#009fe4"; +export const componentsButtonButtonColorLabel = "#ffffff"; +export const componentsButtonButtonColorBkgHover = "#0080b7"; +export const componentsButtonButtonColorLabelHover = "#ffffff"; +export const componentsButtonButtonColorLabelFocus = "#ffffff"; +export const componentsButtonButtonColorBkgFocus = "#0080b7"; +export const componentsButtonButtonPaddingX = "16px"; +export const componentsButtonButtonPaddingXHover = "16px"; +export const componentsButtonButtonPaddingXFocus = "16px"; +export const componentsButtonButtonPaddingY = "8px"; +export const componentsButtonButtonPaddingYHover = "8px"; +export const componentsButtonButtonPaddingYFocus = "8px"; +export const componentsButtonButtonRadius = "4px"; +export const componentsButtonButtonRadiusHover = "4px"; +export const componentsButtonButtonRadiusFocus = "4px"; +export const componentsButtonButtonBorderWidthOutlineFocus = "1px"; +export const componentsButtonButtonBorderWidthBorder = "1px"; +export const componentsButtonButtonBorderWidthBorderHover = "1px"; +export const componentsButtonButtonBorderWidthBorderFocus = "1px"; +export const componentsButtonButtonTextCase = "uppercase"; +export const componentsButtonButtonBorderColor = "#009fe4"; +export const componentsButtonButtonBorderColorHover = "#0080b7"; +export const componentsButtonButtonBorderColorFocus = "#0080b7"; +export const componentsButtonButtonFontWeightLabel = 700; +export const componentsCardCardSpacing = "16px"; +export const componentsCheckboxCheckboxColorLabel = "#00202e"; +export const componentsCheckboxCheckboxColorLabelDisabled = "#a9afb1"; +export const componentsCheckboxCheckboxButtonFill = "#009fe4"; +export const componentsCheckboxCheckboxButtonFillHover = "#0080b7"; +export const componentsCheckboxCheckboxButtonFillDisabled = "#a9afb1"; +export const componentsCheckboxCheckboxButtonStroke = "#00202e"; +export const componentsCheckboxCheckboxButtonStrokeHover = "#00202e"; +export const componentsCheckboxCheckboxButtonStrokeDisabled = "#a9afb1"; +export const componentsCheckboxCheckboxSpacingGap = "4px"; +export const componentsCtaCtaHeader = "700 37px/1.5 Inter"; +export const componentsCtaCtaBody = "400 24px/1.5 Inter"; +export const componentsCtaCtaFill = "#00202e"; +export const componentsFieldsetFieldsetColorBg = "white"; +export const componentsFieldsetFieldsetColorBorder = "#a9afb1"; +export const componentsFieldsetFieldsetColorLabel = "#00202e"; +export const componentsFieldsetRadiusFieldset = "4px"; +export const componentsInputInputGap = "8px"; +export const componentsInputInputPaddingX = "16px"; +export const componentsInputInputPaddingY = "8px"; +export const componentsInputInputColorLabel = "#00202e"; +export const componentsInputInputColorHelpText = "#0080b7"; +export const componentsInputInputColorPlaceholder = "#a9afb1"; +export const componentsInputInputBorderColor = "#7f878b"; +export const componentsInputInputRadius = "4px"; +export const componentsInputInputLabelLineheight = 1.25; +export const componentsInputInputBkg = "#ffffff"; +export const componentsLinkLinkColorDefault = "#009fe4"; +export const componentsLinkLinkColorHover = "#005f89"; +export const componentsLinkLinkBody = "400 18px/1.5 Inter"; +export const componentsMainMenuMainMenuColorBg = "#ffffff"; +export const componentsMainMenuMainMenuColorLinkBg = "#ffffff"; +export const componentsMainMenuMainMenuColorLinkBgHover = "#9ce1ff"; +export const componentsMainMenuMainMenuColorLinkLabel = "#0080b7"; +export const componentsMainMenuMainMenuColorLinkLabelHover = "#006089"; +export const componentsMainMenuMainMenuColorDropdownBg = "#9ce1ff"; +export const componentsMainMenuMainMenuColorDropdownBgHover = "#9ce1ff"; +export const componentsMainMenuMainMenuColorDropdownLabel = "#0080b7"; +export const componentsMainMenuMainMenuColorDropdownLabelHover = "#006089"; +export const componentsPagerPagerColorTextDefault = "#29373d"; +export const componentsPagerPagerColorTextHover = "#ffffff"; +export const componentsPagerPagerColorTextFocus = "#009fe4"; +export const componentsPagerPagerColorFillHover = "#009fe4"; +export const componentsPagerPagerDefault = "500 12px/1 Inter"; +export const componentsPagerPagerPaddingX = "16px"; +export const componentsPagerPagerPaddingXHover = "16px"; +export const componentsPagerPagerPaddingXFocus = "16px"; +export const componentsPagerPagerPaddingY = "8px"; +export const componentsPagerPagerPaddingYHover = "8px"; +export const componentsPagerPagerPaddingYFocus = "8px"; +export const componentsRadioButtonRadioColorLabel = "#00202e"; +export const componentsRadioButtonRadioColorLabelDisabled = "#a9afb1"; +export const componentsRadioButtonRadioColorButtonFill = "#009fe4"; +export const componentsRadioButtonRadioColorButtonFillHover = "#0080b7"; +export const componentsRadioButtonRadioColorButtonFillDisabled = "#a9afb1"; +export const componentsRadioButtonRadioColorButtonStroke = "#00202e"; +export const componentsRadioButtonRadioColorButtonStrokeHover = "#00202e"; +export const componentsRadioButtonRadioColorButtonStrokeDisabled = "#a9afb1"; +export const componentsRadioButtonRadioGap = "4px"; +export const componentsSelectdropdownSelectdropdownColorLabel = "#00202e"; +export const componentsSelectdropdownSelectdropdownColorLabelDisabled = "#a9afb1"; +export const componentsSelectdropdownSelectdropdownColorButtonFill = "#ffffff"; +export const componentsSelectdropdownSelectdropdownColorButtonFillHover = "#e6f5fc"; +export const componentsSelectdropdownSelectdropdownColorButtonFillDisabled = "#ffffff"; +export const componentsSelectdropdownSelectdropdownColorButtonStroke = "#7f878b"; +export const componentsSelectdropdownSelectdropdownColorButtonStrokeHover = "#545f64"; +export const componentsSelectdropdownSelectdropdownColorButtonStrokeDisabled = "#a9afb1"; +export const componentsSelectdropdownSelectdropdownGap = "4px"; +export const componentsSelectdropdownSelectdropdownRadius = "4px"; +export const componentsStatusStatusColorInfoBg = "#16bdde"; +export const componentsStatusStatusColorInfoLabel = "#272727"; +export const componentsStatusStatusColorDangerBg = "#BD1919"; +export const componentsStatusStatusColorDangerLabel = "#ffffff"; +export const componentsStatusStatusColorSuccessBg = "#337B32"; +export const componentsStatusStatusColorSuccessLabel = "#ffffff"; +export const componentsStatusStatusColorWarningBg = "#F6C40F"; +export const componentsStatusStatusColorWarningLabel = "#333333"; +export const componentsStatusStatusFontSizeHeader = "21px"; +export const componentsTableTableColorCellBg = "#ffffff"; +export const componentsTableTableColorCellBgStripe = "#9ce1ff"; +export const componentsTableTableColorCellText = "#00202e"; +export const componentsTableTableColorCellIcon = "#007fb6"; +export const componentsTableTableColorHeaderBg = "#009fe4"; +export const componentsTableTableColorHeaderText = "#ffffff"; +export const componentsTableTableColorHeaderIcon = "#9ce1ff"; +export const componentsTableTableColorBorder = "#d4d7d8"; +export const componentsTabsTabsColorBgDefault = "#ffffff"; +export const componentsTabsTabsColorBgActive = "#ffffff"; +export const componentsTabsTabsColorBgHover = "#ffffff"; +export const componentsTabsTabsColorTextDefault = "#00202e"; +export const componentsTabsTabsColorTextActive = "#0080b7"; +export const componentsTabsTabsColorTextHover = "#33b2e9"; +export const componentsTabsTabsColorBorderBottom = "#a9afb1"; +export const componentsTabsTabLabel = "700 21px/1.5 Inter"; +export const componentsTextFieldTextFieldBorderWidth = "1px"; +export const componentsTextFieldTextFieldRadius = "10px"; +export const componentsTextFieldTextFieldBorder = "colors.grays.800"; +export const storybookColorsSbBackground = "#ffffff"; +export const storybookColorsSbTextBody = "#00202e"; +export const storybookColorsSbTextHeading = "#0080b7"; +export const storybookColorsSbVisualization = "#009fe4"; +export const colorsSbBackground = "#ffffff"; +export const colorsSbTextBody = "#00202e"; +export const colorsSbTextHeading = "#0080b7"; +export const colorsSbVisualization = "#009fe4"; +export const textFieldBorderWidth = "1px"; +export const textFieldRadius = "10px"; +export const textFieldBorder = "colors.grays.800"; +export const tabsColorBgDefault = "#ffffff"; +export const tabsColorBgActive = "#ffffff"; +export const tabsColorBgHover = "#ffffff"; +export const tabsColorTextDefault = "#00202e"; +export const tabsColorTextActive = "#0080b7"; +export const tabsColorTextHover = "#33b2e9"; +export const tabsColorBorderBottom = "#a9afb1"; +export const tabLabel = "700 21px/150% Inter"; +export const tableColorCellBg = "#ffffff"; +export const tableColorCellBgStripe = "#9ce1ff"; +export const tableColorCellText = "#00202e"; +export const tableColorCellIcon = "#007fb6"; +export const tableColorHeaderBg = "#009fe4"; +export const tableColorHeaderText = "#ffffff"; +export const tableColorHeaderIcon = "#9ce1ff"; +export const tableColorBorder = "#d4d7d8"; +export const statusColorInfoBg = "#16bdde"; +export const statusColorInfoLabel = "#272727"; +export const statusColorDangerBg = "#BD1919"; +export const statusColorDangerLabel = "#ffffff"; +export const statusColorSuccessBg = "#337B32"; +export const statusColorSuccessLabel = "#ffffff"; +export const statusColorWarningBg = "#F6C40F"; +export const statusColorWarningLabel = "#333333"; +export const statusFontSizeHeader = "21px"; +export const selectdropdownColorLabel = "#00202e"; +export const selectdropdownColorLabelDisabled = "#a9afb1"; +export const selectdropdownColorButtonFill = "#ffffff"; +export const selectdropdownColorButtonFillHover = "#e6f5fc"; +export const selectdropdownColorButtonFillDisabled = "#ffffff"; +export const selectdropdownColorButtonStroke = "#7f878b"; +export const selectdropdownColorButtonStrokeHover = "#545f64"; +export const selectdropdownColorButtonStrokeDisabled = "#a9afb1"; +export const selectdropdownGap = "4px"; +export const selectdropdownRadius = "4px"; +export const radioColorLabel = "#00202e"; +export const radioColorLabelDisabled = "#a9afb1"; +export const radioColorButtonFill = "#009fe4"; +export const radioColorButtonFillHover = "#0080b7"; +export const radioColorButtonFillDisabled = "#a9afb1"; +export const radioColorButtonStroke = "#00202e"; +export const radioColorButtonStrokeHover = "#00202e"; +export const radioColorButtonStrokeDisabled = "#a9afb1"; +export const radioGap = "4px"; +export const pagerColorTextDefault = "#29373d"; +export const pagerColorTextHover = "#ffffff"; +export const pagerColorTextFocus = "#009fe4"; +export const pagerColorFillHover = "#009fe4"; +export const pagerDefault = "500 12px/100% Inter"; +export const pagerPaddingX = "16px"; +export const pagerPaddingXHover = "16px"; +export const pagerPaddingXFocus = "16px"; +export const pagerPaddingY = "8px"; +export const pagerPaddingYHover = "8px"; +export const pagerPaddingYFocus = "8px"; +export const mainMenuColorBg = "#ffffff"; +export const mainMenuColorLinkBg = "#ffffff"; +export const mainMenuColorLinkBgHover = "#9ce1ff"; +export const mainMenuColorLinkLabel = "#0080b7"; +export const mainMenuColorLinkLabelHover = "#006089"; +export const mainMenuColorDropdownBg = "#9ce1ff"; +export const mainMenuColorDropdownBgHover = "#9ce1ff"; +export const mainMenuColorDropdownLabel = "#0080b7"; +export const mainMenuColorDropdownLabelHover = "#006089"; +export const linkColorDefault = "#009fe4"; +export const linkColorHover = "#005f89"; +export const linkBody = "400 18px/150% Inter"; +export const inputGap = "8px"; +export const inputPaddingX = "16px"; +export const inputPaddingY = "8px"; +export const inputColorLabel = "#00202e"; +export const inputColorHelpText = "#0080b7"; +export const inputColorPlaceholder = "#a9afb1"; +export const inputBorderColor = "#7f878b"; +export const inputRadius = "4px"; +export const inputLabelLineheight = 1.25; +export const inputBkg = "#ffffff"; +export const fieldsetColorBg = "white"; +export const fieldsetColorBorder = "#a9afb1"; +export const fieldsetColorLabel = "#00202e"; +export const radiusFieldset = "4px"; +export const radiusSm = "4px"; +export const radiusMd = "10px"; +export const radiusLg = "20px"; +export const ctaHeader = "700 37px/150% Inter"; +export const ctaBody = "400 24px/150% Inter"; +export const ctaFill = "#00202e"; +export const checkboxColorLabel = "#00202e"; +export const checkboxColorLabelDisabled = "#a9afb1"; +export const checkboxButtonFill = "#009fe4"; +export const checkboxButtonFillHover = "#0080b7"; +export const checkboxButtonFillDisabled = "#a9afb1"; +export const checkboxButtonStroke = "#00202e"; +export const checkboxButtonStrokeHover = "#00202e"; +export const checkboxButtonStrokeDisabled = "#a9afb1"; +export const checkboxSpacingGap = "4px"; +export const cardSpacing = "16px"; +export const buttonColorBkg = "#009fe4"; +export const buttonColorLabel = "#ffffff"; +export const buttonColorBkgHover = "#0080b7"; +export const buttonColorLabelHover = "#ffffff"; +export const buttonColorLabelFocus = "#ffffff"; +export const buttonColorBkgFocus = "#0080b7"; +export const buttonPaddingX = "16px"; +export const buttonPaddingXHover = "16px"; +export const buttonPaddingXFocus = "16px"; +export const buttonPaddingY = "8px"; +export const buttonPaddingYHover = "8px"; +export const buttonPaddingYFocus = "8px"; +export const buttonRadius = "4px"; +export const buttonRadiusHover = "4px"; +export const buttonRadiusFocus = "4px"; +export const buttonBorderWidthOutlineFocus = "1px"; +export const buttonBorderWidthBorder = "1px"; +export const buttonBorderWidthBorderHover = "1px"; +export const buttonBorderWidthBorderFocus = "1px"; +export const buttonTextCase = "uppercase"; +export const buttonBorderColor = "#009fe4"; +export const buttonBorderColorHover = "#0080b7"; +export const buttonBorderColorFocus = "#0080b7"; +export const buttonFontWeightLabel = 700; +export const breadcrumbDefault = "500 12px/100% Sentinel"; +export const breadcrumbTextDefault = "#7f878b"; +export const breadcrumbTextHover = "#192125"; +export const blockQuotePaddingX = "32px"; +export const blockQuotePaddingY = "8px"; +export const accordionHeader = "400 26px/150% Inter"; +export const accordionP = "400 18px/150% Inter"; +export const accordionColorBody = "#00202e"; +export const accordionColorHeader = "#0080b7"; +export const accordionColorHeaderHover = "#33b2e9"; +export const accordionDividerColor = "#545f64"; +export const colorPrimaryDefault = "#009fe4"; // 600 +export const colorPrimaryLight = "#1ebbff"; +export const colorPrimaryLighter = "#9ce1ff"; +export const colorPrimaryDark = "#0080b7"; +export const colorPrimaryDarker = "#006089"; +export const colorTextBody = "#00202e"; +export const colorTextHeading = "#0080b7"; +export const colorWarningDefault = "#D80F0F"; +export const colorLink = "#33b2e9"; +export const colorLinkHover = "#009fe4"; +export const colorBlack = "#000000"; +export const colorWhite = "#ffffff"; +export const colorEmulsifyBlue100 = "#e6f5fc"; +export const colorEmulsifyBlue200 = "#ccecfa"; +export const colorEmulsifyBlue300 = "#99d9f4"; +export const colorEmulsifyBlue400 = "#66c5ef"; +export const colorEmulsifyBlue500 = "#33b2e9"; +export const colorEmulsifyBlue600 = "#009fe4"; +export const colorEmulsifyBlue700 = "#007fb6"; +export const colorEmulsifyBlue800 = "#005f89"; +export const colorEmulsifyBlue900 = "#00405b"; +export const colorEmulsifyBlue1000 = "#00202e"; +export const colorGrays100 = "#eaebec"; +export const colorGrays200 = "#d4d7d8"; +export const colorGrays300 = "#a9afb1"; +export const colorGrays400 = "#7f878b"; +export const colorGrays500 = "#545f64"; +export const colorGrays600 = "#29373d"; +export const colorGrays700 = "#212c31"; +export const colorGrays800 = "#192125"; +export const colorGrays900 = "#101618"; +export const colorGrays1000 = "#080b0c"; +export const fontFamilyBody = "Inter"; +export const fontFamilyHeading = "Inter"; +export const spacingXs = "2px"; +export const spacingSm = "4px"; +export const spacingMd = "8px"; +export const spacingLg = "16px"; +export const spacingXl = "32px"; +export const spacing2xl = "64px"; +export const sizeXs = "2px"; +export const sizeSm = "4px"; +export const sizeMd = "8px"; +export const sizeLg = "16px"; +export const sizeXl = "32px"; +export const size2xl = "64px"; +export const breakpointSm = 576; +export const breakpointMd = 768; +export const breakpointLg = 992; +export const breakpointXl = 1200; +export const breakpointXxl = 1400; +export const opacity0 = 0; +export const opacity10 = 0.1; +export const opacity20 = 0.2; +export const opacity30 = 0.3; +export const opacity40 = 0.4; +export const opacity50 = 0.5; +export const opacity60 = 0.6; +export const opacity70 = 0.7; +export const opacity80 = 0.8; +export const opacity90 = 0.9; +export const opacity100 = 1; +export const borderSm = "1px"; +export const borderMd = "2px"; +export const borderLg = "5px"; +export const fontFamilyPrimary = "Inter"; +export const fontFamilySecondary = "Sentinel"; +export const lineHeightNone = 1; +export const lineHeightTight = 1.25; +export const lineHeightSnug = 1.37; +export const lineHeightNormal = 1.5; +export const lineHeightRelaxed = 1.75; +export const lineHeightLoose = 2; +export const fontWeightPrimaryRegular = 400; +export const fontWeightPrimaryBold = 700; +export const fontWeightSecondaryRegular = 500; +export const fontWeightSecondaryBold = 700; +export const fontSizeTiny = "10px"; +export const fontSizeXSmall = "12px"; +export const fontSizeCaption = "14px"; +export const fontSizeSmall = "16px"; +export const fontSizeBody = "18px"; +export const fontSizeLead = "24px"; +export const fontSizeH5 = "21px"; +export const fontSizeH4 = "26px"; +export const fontSizeH3 = "31px"; +export const fontSizeH2 = "37px"; +export const fontSizeH1 = "48px"; +export const fontSizeDisplay = "64px"; +export const fontSizeHero = "80px"; +export const fontSizeUber = "112px"; +export const fontSizeColossus = "140px"; +export const letterSpacing0 = "0"; +export const letterSpacingTight = "-3"; +export const paragraphSpacing0 = 0; +export const fontPrimaryColossusDefault = "400 140px/150% Inter"; +export const fontPrimaryColossusBold = "700 140px/150% Inter"; +export const fontPrimaryUberDefault = "400 112px/150% Inter"; +export const fontPrimaryUberBold = "700 112px/150% Inter"; +export const fontPrimaryHeroDefault = "400 80px/125% Inter"; +export const fontPrimaryHeroBold = "700 80px/125% Inter"; +export const fontPrimaryDisplayDefault = "400 64px/150% Inter"; +export const fontPrimaryDisplayBold = "700 64px/150% Inter"; +export const fontPrimaryH1Default = "400 48px/150% Inter"; +export const fontPrimaryH1Bold = "700 48px/150% Inter"; +export const fontPrimaryH2Default = "400 37px/150% Inter"; +export const fontPrimaryH2Bold = "700 37px/150% Inter"; +export const fontPrimaryH3Default = "400 31px/150% Inter"; +export const fontPrimaryH3Bold = "700 31px/150% Inter"; +export const fontPrimaryH4Default = "400 26px/150% Inter"; +export const fontPrimaryH4Bold = "700 26px/150% Inter"; +export const fontPrimaryH5Default = "400 21px/150% Inter"; +export const fontPrimaryH5Bold = "700 21px/150% Inter"; +export const fontPrimaryLeadDefault = "400 24px/150% Inter"; +export const fontPrimaryLeadBold = "700 24px/150% Inter"; +export const fontPrimaryBodyDefault = "400 18px/150% Inter"; +export const fontPrimaryBodyBold = "700 18px/150% Inter"; +export const fontPrimaryBodyMobileDefault = "400 14px/150% Inter"; +export const fontPrimarySmallDefault = "400 16px/150% Inter"; +export const fontPrimarySmallBold = "700 16px/150% Inter"; +export const fontPrimaryCaptionDefault = "400 14px/150% Inter"; +export const fontPrimaryCaptionBold = "700 14px/150% Inter"; +export const fontPrimaryXSmallDefault = "400 12px/150% Inter"; +export const fontPrimaryXSmallBold = "700 12px/150% Inter"; +export const fontPrimaryTinyDefault = "400 10px/150% Inter"; +export const fontPrimaryTinyBold = "700 10px/150% Inter"; +export const fontSecondaryColossusDefault = "500 140px/150% Sentinel"; +export const fontSecondaryColossusBold = "700 140px/150% Sentinel"; +export const fontSecondaryUberDefault = "500 112px/150% Sentinel"; +export const fontSecondaryUberBold = "700 112px/150% Sentinel"; +export const fontSecondaryHeroDefault = "500 80px/125% Sentinel"; +export const fontSecondaryHeroBold = "700 80px/125% Sentinel"; +export const fontSecondaryDisplayDefault = "500 64px/150% Sentinel"; +export const fontSecondaryDisplayBold = "700 64px/150% Sentinel"; +export const fontSecondaryH1Default = "500 48px/150% Sentinel"; +export const fontSecondaryH1Bold = "700 48px/150% Sentinel"; +export const fontSecondaryH2Default = "500 37px/150% Sentinel"; +export const fontSecondaryH2Bold = "700 37px/150% Sentinel"; +export const fontSecondaryH3Default = "500 31px/150% Sentinel"; +export const fontSecondaryH3Bold = "700 31px/150% Sentinel"; +export const fontSecondaryH4Default = "500 26px/150% Sentinel"; +export const fontSecondaryH4Bold = "700 26px/150% Sentinel"; +export const fontSecondaryH5Default = "500 21px/150% Sentinel"; +export const fontSecondaryH5Bold = "700 21px/150% Sentinel"; +export const fontSecondaryLeadDefault = "500 24px/150% Sentinel"; +export const fontSecondaryLeadBold = "700 24px/150% Sentinel"; +export const fontSecondaryBodyDefault = "500 18px/150% Sentinel"; +export const fontSecondaryBodyBold = "700 18px/150% Sentinel"; +export const fontSecondaryBodyMobileDefault = "500 14px/150% Sentinel"; +export const fontSecondarySmallDefault = "500 16px/150% Sentinel"; +export const fontSecondarySmallBold = "700 16px/150% Sentinel"; +export const fontSecondaryCaptionDefault = "500 14px/150% Sentinel"; +export const fontSecondaryCaptionBold = "700 14px/150% Sentinel"; +export const fontSecondaryXSmallDefault = "500 12px/150% Sentinel"; +export const fontSecondaryXSmallBold = "700 12px/150% Sentinel"; +export const fontSecondaryTinyDefault = "500 10px/150% Sentinel"; +export const fontSecondaryTinyBold = "700 10px/150% Sentinel"; +export const textCaseNone = "none"; +export const textCaseUpper = "uppercase"; +export const textCaseCapitalize = "capitalize"; +export const textCaseLower = "lowercase"; +export const textDecorationNone = "none"; +export const tokenSetOrder0 = "global"; +export const tokenSetOrder1 = "semantic"; +export const tokenSetOrder2 = "components/accordion"; +export const tokenSetOrder3 = "components/blockQuote"; +export const tokenSetOrder4 = "components/breadcrumbs"; +export const tokenSetOrder5 = "components/button"; +export const tokenSetOrder6 = "components/card"; +export const tokenSetOrder7 = "components/checkbox"; +export const tokenSetOrder8 = "components/cta"; +export const tokenSetOrder9 = "components/fieldset"; +export const tokenSetOrder10 = "components/input"; +export const tokenSetOrder11 = "components/link"; +export const tokenSetOrder12 = "components/mainMenu"; +export const tokenSetOrder13 = "components/pager"; +export const tokenSetOrder14 = "components/radioButton"; +export const tokenSetOrder15 = "components/selectdropdown"; +export const tokenSetOrder16 = "components/status"; +export const tokenSetOrder17 = "components/table"; +export const tokenSetOrder18 = "components/tabs"; +export const tokenSetOrder19 = "components/textField"; +export const tokenSetOrder20 = "storybook"; +export const emulsifyUiKitFull = "[object Object]"; +export const emulsifyGlobal = "[object Object]"; +export const emulsifySemantic = "[object Object]"; +export const emulsifyStorybookOnly = "[object Object]"; +export const emulsifyComponents = "[object Object]"; diff --git a/package-lock.json b/package-lock.json index fdfcb18..6646fbe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "dependencies": { "@babel/eslint-parser": "^7.12.17", "@storybook/storybook-deployer": "^2.8.10", + "@tokens-studio/sd-transforms": "^0.11.4", "add-attributes-twig-extension": "^0.1.0", "bem-twig-extension": "^0.1.1", "breakpoint-sass": "^3.0.0", @@ -6350,6 +6351,30 @@ "postcss-syntax": ">=0.36.2" } }, + "node_modules/@tokens-studio/sd-transforms": { + "version": "0.11.4", + "resolved": "https://registry.npmjs.org/@tokens-studio/sd-transforms/-/sd-transforms-0.11.4.tgz", + "integrity": "sha512-a6E2RJKIuc9xGwif/rOT6EpHd4QGI5bKrFkyd1i9I7esJO1djN0P4StatX68RZzRgGXsFuajvvnWfqyXK89qgg==", + "dependencies": { + "@tokens-studio/types": "^0.2.4", + "browser-style-dictionary": "^3.1.1-browser.1", + "color2k": "^2.0.1", + "colorjs.io": "^0.4.3", + "deepmerge": "^4.3.1", + "expr-eval": "^2.0.2", + "is-mergeable-object": "^1.1.1", + "postcss-calc-ast-parser": "^0.1.4", + "style-dictionary": "^3.7.2" + }, + "engines": { + "node": ">=15.14.0" + } + }, + "node_modules/@tokens-studio/types": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@tokens-studio/types/-/types-0.2.5.tgz", + "integrity": "sha512-pJ0zWxGnEjca4dznFIHC9/oXuovu3DKHUhLDNJVzTRZEVXhWkIRIUbjDwIRihxBr39c776W+3thYvWMgChT0Rw==" + }, "node_modules/@tootallnate/once": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz", @@ -9079,6 +9104,208 @@ "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz", "integrity": "sha512-cKV8tMCEpQs4hK/ik71d6LrPOnpkpGBR0wzxqr68g2m/LB2GxVYQroAjMJZRVM1Y4BCjCKc3vAamxSzOY2RP+w==" }, + "node_modules/browser-style-dictionary": { + "version": "3.1.1-browser.2", + "resolved": "https://registry.npmjs.org/browser-style-dictionary/-/browser-style-dictionary-3.1.1-browser.2.tgz", + "integrity": "sha512-1jUbF3iTqp/JdzUm1Ts4VwmHYXNxM2CddcvDlC5Z84ZVgDWF1KOAgFzupSZaZcZURHvTZB0BeVwCsSqJ/zV7ag==", + "dependencies": { + "chalk": "^4.0.0", + "change-case": "^4.1.2", + "commander": "^8.3.0", + "fs-extra": "^10.0.0", + "glob": "^7.2.0", + "json5": "^2.2.0", + "jsonc-parser": "^3.0.0", + "lodash": "^4.17.15", + "tinycolor2": "^1.4.1" + }, + "bin": { + "style-dictionary": "bin/style-dictionary" + }, + "engines": { + "node": ">=12.0.0" + } + }, + "node_modules/browser-style-dictionary/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/browser-style-dictionary/node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/browser-style-dictionary/node_modules/change-case": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", + "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", + "dependencies": { + "camel-case": "^4.1.2", + "capital-case": "^1.0.4", + "constant-case": "^3.0.4", + "dot-case": "^3.0.4", + "header-case": "^2.0.4", + "no-case": "^3.0.4", + "param-case": "^3.0.4", + "pascal-case": "^3.1.2", + "path-case": "^3.0.4", + "sentence-case": "^3.0.4", + "snake-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/browser-style-dictionary/node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "node_modules/browser-style-dictionary/node_modules/commander": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", + "engines": { + "node": ">= 12" + } + }, + "node_modules/browser-style-dictionary/node_modules/constant-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", + "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", + "dependencies": { + "no-case": "^3.0.4", + "tslib": "^2.0.3", + "upper-case": "^2.0.2" + } + }, + "node_modules/browser-style-dictionary/node_modules/dot-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", + "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", + "dependencies": { + "no-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "engines": { + "node": ">=8" + } + }, + "node_modules/browser-style-dictionary/node_modules/header-case": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", + "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", + "dependencies": { + "capital-case": "^1.0.4", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/lower-case": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", + "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", + "dependencies": { + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/no-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", + "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", + "dependencies": { + "lower-case": "^2.0.2", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/path-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", + "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", + "dependencies": { + "dot-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/sentence-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", + "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", + "dependencies": { + "no-case": "^3.0.4", + "tslib": "^2.0.3", + "upper-case-first": "^2.0.2" + } + }, + "node_modules/browser-style-dictionary/node_modules/snake-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", + "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", + "dependencies": { + "dot-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/browser-style-dictionary/node_modules/upper-case": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", + "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", + "dependencies": { + "tslib": "^2.0.3" + } + }, + "node_modules/browser-style-dictionary/node_modules/upper-case-first": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", + "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", + "dependencies": { + "tslib": "^2.0.3" + } + }, "node_modules/browserify-aes": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz", @@ -9498,7 +9725,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz", "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==", - "dev": true, "dependencies": { "pascal-case": "^3.1.2", "tslib": "^2.0.3" @@ -9561,7 +9787,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -9572,7 +9797,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -9581,7 +9805,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "dependencies": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -9591,7 +9814,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -10146,12 +10368,22 @@ "color-support": "bin.js" } }, + "node_modules/color2k": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/color2k/-/color2k-2.0.2.tgz", + "integrity": "sha512-kJhwH5nAwb34tmyuqq/lgjEKzlFXn1U99NlnB6Ws4qVaERcRUYeYP1cBw6BJ4vxaWStAUEef4WMr7WjOCnBt8w==" + }, "node_modules/colorette": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.4.0.tgz", "integrity": "sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==", "dev": true }, + "node_modules/colorjs.io": { + "version": "0.4.5", + "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.4.5.tgz", + "integrity": "sha512-yCtUNCmge7llyfd/Wou19PMAcf5yC3XXhgFoAh6zsO2pGswhUPBaaUh8jzgHnXtXuZyFKzXZNAnyF5i+apICow==" + }, "node_modules/combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -11810,7 +12042,6 @@ "version": "4.3.1", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -14157,6 +14388,11 @@ "node": ">=0.10.0" } }, + "node_modules/expr-eval": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/expr-eval/-/expr-eval-2.0.2.tgz", + "integrity": "sha512-4EMSHGOPSwAfBiibw3ndnP0AvjDWLsMvGOvWEZ2F96IGk0bIVdjQisOHxReSkE13mHcfbuCiXw+G4y0zv6N8Eg==" + }, "node_modules/express": { "version": "4.18.2", "resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz", @@ -15337,7 +15573,6 @@ "version": "10.1.0", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz", "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==", - "dev": true, "dependencies": { "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", @@ -18276,6 +18511,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-mergeable-object": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/is-mergeable-object/-/is-mergeable-object-1.1.1.tgz", + "integrity": "sha512-CPduJfuGg8h8vW74WOxHtHmtQutyQBzR+3MjQ6iDHIYdbOnm1YC7jv43SqCoU8OPGTJD4nibmiryA4kmogbGrA==" + }, "node_modules/is-natural-number": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/is-natural-number/-/is-natural-number-4.0.1.tgz", @@ -19142,14 +19382,12 @@ "node_modules/jsonc-parser": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz", - "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==", - "dev": true + "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==" }, "node_modules/jsonfile": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", - "dev": true, "dependencies": { "universalify": "^2.0.0" }, @@ -19528,8 +19766,7 @@ "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "devOptional": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "node_modules/lodash.capitalize": { "version": "4.2.1", @@ -25620,7 +25857,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -25630,7 +25866,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -25640,7 +25875,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -25649,7 +25883,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "dependencies": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -25765,7 +25998,6 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz", "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -25775,7 +26007,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -25784,7 +26015,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "dependencies": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -26232,6 +26462,22 @@ "node": "^10 || ^12 || >=14" } }, + "node_modules/postcss-calc-ast-parser": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/postcss-calc-ast-parser/-/postcss-calc-ast-parser-0.1.4.tgz", + "integrity": "sha512-CebpbHc96zgFjGgdQ6BqBy6XIUgRx1xXWCAAk6oke02RZ5nxwo9KQejTg8y7uYEeI9kv8jKQPYjoe6REsY23vw==", + "dependencies": { + "postcss-value-parser": "^3.3.1" + }, + "engines": { + "node": ">=6.5" + } + }, + "node_modules/postcss-calc-ast-parser/node_modules/postcss-value-parser": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz", + "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==" + }, "node_modules/postcss-flexbugs-fixes": { "version": "4.2.1", "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-4.2.1.tgz", @@ -30596,7 +30842,6 @@ "version": "3.8.0", "resolved": "https://registry.npmjs.org/style-dictionary/-/style-dictionary-3.8.0.tgz", "integrity": "sha512-wHlB/f5eO3mDcYv6WtOz6gvQC477jBKrwuIXe+PtHskTCBsJdAOvL8hCquczJxDui2TnwpeNE+2msK91JJomZg==", - "dev": true, "dependencies": { "chalk": "^4.0.0", "change-case": "^4.1.2", @@ -30619,7 +30864,6 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, "dependencies": { "color-convert": "^2.0.1" }, @@ -30634,7 +30878,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", - "dev": true, "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -30650,7 +30893,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", - "dev": true, "dependencies": { "camel-case": "^4.1.2", "capital-case": "^1.0.4", @@ -30670,7 +30912,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, "dependencies": { "color-name": "~1.1.4" }, @@ -30681,14 +30922,12 @@ "node_modules/style-dictionary/node_modules/color-name": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" }, "node_modules/style-dictionary/node_modules/commander": { "version": "8.3.0", "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", - "dev": true, "engines": { "node": ">= 12" } @@ -30697,7 +30936,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -30708,7 +30946,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -30718,7 +30955,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "dev": true, "engines": { "node": ">=8" } @@ -30727,7 +30963,6 @@ "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", - "dev": true, "dependencies": { "capital-case": "^1.0.4", "tslib": "^2.0.3" @@ -30737,7 +30972,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -30746,7 +30980,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "dependencies": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -30756,7 +30989,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -30766,7 +30998,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -30777,7 +31008,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -30787,7 +31017,6 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dev": true, "dependencies": { "has-flag": "^4.0.0" }, @@ -30799,7 +31028,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -30808,7 +31036,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -32573,8 +32800,7 @@ "node_modules/tinycolor2": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz", - "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==", - "dev": true + "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==" }, "node_modules/title-case": { "version": "2.1.1", @@ -32845,8 +33071,7 @@ "node_modules/tslib": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", - "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", - "dev": true + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==" }, "node_modules/tsutils": { "version": "3.21.0", @@ -33403,7 +33628,6 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==", - "dev": true, "engines": { "node": ">= 10.0.0" } @@ -39617,6 +39841,27 @@ "unist-util-find-all-after": "^3.0.2" } }, + "@tokens-studio/sd-transforms": { + "version": "0.11.4", + "resolved": "https://registry.npmjs.org/@tokens-studio/sd-transforms/-/sd-transforms-0.11.4.tgz", + "integrity": "sha512-a6E2RJKIuc9xGwif/rOT6EpHd4QGI5bKrFkyd1i9I7esJO1djN0P4StatX68RZzRgGXsFuajvvnWfqyXK89qgg==", + "requires": { + "@tokens-studio/types": "^0.2.4", + "browser-style-dictionary": "^3.1.1-browser.1", + "color2k": "^2.0.1", + "colorjs.io": "^0.4.3", + "deepmerge": "^4.3.1", + "expr-eval": "^2.0.2", + "is-mergeable-object": "^1.1.1", + "postcss-calc-ast-parser": "^0.1.4", + "style-dictionary": "^3.7.2" + } + }, + "@tokens-studio/types": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@tokens-studio/types/-/types-0.2.5.tgz", + "integrity": "sha512-pJ0zWxGnEjca4dznFIHC9/oXuovu3DKHUhLDNJVzTRZEVXhWkIRIUbjDwIRihxBr39c776W+3thYvWMgChT0Rw==" + }, "@tootallnate/once": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz", @@ -41815,6 +42060,180 @@ "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz", "integrity": "sha512-cKV8tMCEpQs4hK/ik71d6LrPOnpkpGBR0wzxqr68g2m/LB2GxVYQroAjMJZRVM1Y4BCjCKc3vAamxSzOY2RP+w==" }, + "browser-style-dictionary": { + "version": "3.1.1-browser.2", + "resolved": "https://registry.npmjs.org/browser-style-dictionary/-/browser-style-dictionary-3.1.1-browser.2.tgz", + "integrity": "sha512-1jUbF3iTqp/JdzUm1Ts4VwmHYXNxM2CddcvDlC5Z84ZVgDWF1KOAgFzupSZaZcZURHvTZB0BeVwCsSqJ/zV7ag==", + "requires": { + "chalk": "^4.0.0", + "change-case": "^4.1.2", + "commander": "^8.3.0", + "fs-extra": "^10.0.0", + "glob": "^7.2.0", + "json5": "^2.2.0", + "jsonc-parser": "^3.0.0", + "lodash": "^4.17.15", + "tinycolor2": "^1.4.1" + }, + "dependencies": { + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "requires": { + "color-convert": "^2.0.1" + } + }, + "chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "requires": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + } + }, + "change-case": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", + "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", + "requires": { + "camel-case": "^4.1.2", + "capital-case": "^1.0.4", + "constant-case": "^3.0.4", + "dot-case": "^3.0.4", + "header-case": "^2.0.4", + "no-case": "^3.0.4", + "param-case": "^3.0.4", + "pascal-case": "^3.1.2", + "path-case": "^3.0.4", + "sentence-case": "^3.0.4", + "snake-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "requires": { + "color-name": "~1.1.4" + } + }, + "color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + }, + "commander": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==" + }, + "constant-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", + "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", + "requires": { + "no-case": "^3.0.4", + "tslib": "^2.0.3", + "upper-case": "^2.0.2" + } + }, + "dot-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", + "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", + "requires": { + "no-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==" + }, + "header-case": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", + "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", + "requires": { + "capital-case": "^1.0.4", + "tslib": "^2.0.3" + } + }, + "lower-case": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", + "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", + "requires": { + "tslib": "^2.0.3" + } + }, + "no-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", + "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", + "requires": { + "lower-case": "^2.0.2", + "tslib": "^2.0.3" + } + }, + "path-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", + "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", + "requires": { + "dot-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "sentence-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", + "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", + "requires": { + "no-case": "^3.0.4", + "tslib": "^2.0.3", + "upper-case-first": "^2.0.2" + } + }, + "snake-case": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", + "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", + "requires": { + "dot-case": "^3.0.4", + "tslib": "^2.0.3" + } + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "requires": { + "has-flag": "^4.0.0" + } + }, + "upper-case": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", + "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", + "requires": { + "tslib": "^2.0.3" + } + }, + "upper-case-first": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", + "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", + "requires": { + "tslib": "^2.0.3" + } + } + } + }, "browserify-aes": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz", @@ -42140,7 +42559,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz", "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==", - "dev": true, "requires": { "pascal-case": "^3.1.2", "tslib": "^2.0.3" @@ -42177,7 +42595,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -42188,7 +42605,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -42197,7 +42613,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "requires": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -42207,7 +42622,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -42635,12 +43049,22 @@ "integrity": "sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==", "devOptional": true }, + "color2k": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/color2k/-/color2k-2.0.2.tgz", + "integrity": "sha512-kJhwH5nAwb34tmyuqq/lgjEKzlFXn1U99NlnB6Ws4qVaERcRUYeYP1cBw6BJ4vxaWStAUEef4WMr7WjOCnBt8w==" + }, "colorette": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.4.0.tgz", "integrity": "sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g==", "dev": true }, + "colorjs.io": { + "version": "0.4.5", + "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.4.5.tgz", + "integrity": "sha512-yCtUNCmge7llyfd/Wou19PMAcf5yC3XXhgFoAh6zsO2pGswhUPBaaUh8jzgHnXtXuZyFKzXZNAnyF5i+apICow==" + }, "combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -43971,8 +44395,7 @@ "deepmerge": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", - "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", - "dev": true + "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==" }, "default-browser-id": { "version": "1.0.4", @@ -45818,6 +46241,11 @@ "homedir-polyfill": "^1.0.1" } }, + "expr-eval": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/expr-eval/-/expr-eval-2.0.2.tgz", + "integrity": "sha512-4EMSHGOPSwAfBiibw3ndnP0AvjDWLsMvGOvWEZ2F96IGk0bIVdjQisOHxReSkE13mHcfbuCiXw+G4y0zv6N8Eg==" + }, "express": { "version": "4.18.2", "resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz", @@ -46741,7 +47169,6 @@ "version": "10.1.0", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-10.1.0.tgz", "integrity": "sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==", - "dev": true, "requires": { "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", @@ -48985,6 +49412,11 @@ "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==", "dev": true }, + "is-mergeable-object": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/is-mergeable-object/-/is-mergeable-object-1.1.1.tgz", + "integrity": "sha512-CPduJfuGg8h8vW74WOxHtHmtQutyQBzR+3MjQ6iDHIYdbOnm1YC7jv43SqCoU8OPGTJD4nibmiryA4kmogbGrA==" + }, "is-natural-number": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/is-natural-number/-/is-natural-number-4.0.1.tgz", @@ -49628,14 +50060,12 @@ "jsonc-parser": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.0.tgz", - "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==", - "dev": true + "integrity": "sha512-gfFQZrcTc8CnKXp6Y4/CBT3fTc0OVuDofpre4aEeEpSBPV5X5v4+Vmx+8snU7RLPrNHPKSgLxGo9YuQzz20o+w==" }, "jsonfile": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", - "dev": true, "requires": { "graceful-fs": "^4.1.6", "universalify": "^2.0.0" @@ -49927,8 +50357,7 @@ "lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "devOptional": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "lodash.capitalize": { "version": "4.2.1", @@ -54504,7 +54933,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -54514,7 +54942,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -54524,7 +54951,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -54533,7 +54959,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "requires": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -54632,7 +55057,6 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz", "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -54642,7 +55066,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -54651,7 +55074,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "requires": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -54993,6 +55415,21 @@ } } }, + "postcss-calc-ast-parser": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/postcss-calc-ast-parser/-/postcss-calc-ast-parser-0.1.4.tgz", + "integrity": "sha512-CebpbHc96zgFjGgdQ6BqBy6XIUgRx1xXWCAAk6oke02RZ5nxwo9KQejTg8y7uYEeI9kv8jKQPYjoe6REsY23vw==", + "requires": { + "postcss-value-parser": "^3.3.1" + }, + "dependencies": { + "postcss-value-parser": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz", + "integrity": "sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==" + } + } + }, "postcss-flexbugs-fixes": { "version": "4.2.1", "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-4.2.1.tgz", @@ -58447,7 +58884,6 @@ "version": "3.8.0", "resolved": "https://registry.npmjs.org/style-dictionary/-/style-dictionary-3.8.0.tgz", "integrity": "sha512-wHlB/f5eO3mDcYv6WtOz6gvQC477jBKrwuIXe+PtHskTCBsJdAOvL8hCquczJxDui2TnwpeNE+2msK91JJomZg==", - "dev": true, "requires": { "chalk": "^4.0.0", "change-case": "^4.1.2", @@ -58464,7 +58900,6 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, "requires": { "color-convert": "^2.0.1" } @@ -58473,7 +58908,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", - "dev": true, "requires": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -58483,7 +58917,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", - "dev": true, "requires": { "camel-case": "^4.1.2", "capital-case": "^1.0.4", @@ -58503,7 +58936,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, "requires": { "color-name": "~1.1.4" } @@ -58511,20 +58943,17 @@ "color-name": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" }, "commander": { "version": "8.3.0", "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", - "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", - "dev": true + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==" }, "constant-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -58535,7 +58964,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -58544,14 +58972,12 @@ "has-flag": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", - "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "dev": true + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==" }, "header-case": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", - "dev": true, "requires": { "capital-case": "^1.0.4", "tslib": "^2.0.3" @@ -58561,7 +58987,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -58570,7 +58995,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "requires": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -58580,7 +59004,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -58590,7 +59013,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -58601,7 +59023,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -58611,7 +59032,6 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dev": true, "requires": { "has-flag": "^4.0.0" } @@ -58620,7 +59040,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -58629,7 +59048,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -59961,8 +60379,7 @@ "tinycolor2": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz", - "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==", - "dev": true + "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==" }, "title-case": { "version": "2.1.1", @@ -60171,8 +60588,7 @@ "tslib": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", - "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", - "dev": true + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==" }, "tsutils": { "version": "3.21.0", @@ -60595,8 +61011,7 @@ "universalify": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz", - "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==", - "dev": true + "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==" }, "unpipe": { "version": "1.0.0", diff --git a/package.json b/package.json index 562bb7b..7c4a78b 100644 --- a/package.json +++ b/package.json @@ -22,8 +22,9 @@ "storybook:build": "npm run build && build-storybook -s images,dist -o ./.out", "storybook:deploy": "storybook-to-ghpages -o .out", "style-dictionary:build": "node ./src/tokens/tokensTransform.js", + "sd": "style-dictionary build", "tokens:transform": "token-transformer ./src/tokens/figma.tokens.json ./src/tokens/transformed.tokens.json", - "tokens:build": "npm run tokens:transform && npm run style-dictionary:build", + "tokens:build": "npm run style-dictionary:build", "visreg": "percy storybook http://localhost:6006", "visreg-ci": "percy storybook .out", "webpack": "webpack --watch --config ./webpack/webpack.dev.js" @@ -53,6 +54,7 @@ "dependencies": { "@babel/eslint-parser": "^7.12.17", "@storybook/storybook-deployer": "^2.8.10", + "@tokens-studio/sd-transforms": "^0.11.4", "add-attributes-twig-extension": "^0.1.0", "bem-twig-extension": "^0.1.1", "breakpoint-sass": "^3.0.0", @@ -113,4 +115,4 @@ "webpack-cli": "^4.8.0", "webpack-merge": "^5.8.0" } -} +} \ No newline at end of file diff --git a/sd.config.json b/sd.config.json deleted file mode 100644 index a9ccbf5..0000000 --- a/sd.config.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "source": [ - "src/tokens/transformed.tokens.json" - ], - "platforms": { - "css": { - "transforms": [ - "attribute/cti", - "name/cti/kebab", - "time/seconds", - "content/icon", - "color/css", - "toRem/pxToRem", - "toPX/appendPX" - ], - "files": [ - { - "destination": "src/components/tokens/_tokens.scss", - "format": "css/variables" - } - ] - } - } -} \ No newline at end of file diff --git a/src/components/tokens/_tokens.scss b/src/components/tokens/_tokens.scss index ce1aba0..cff3e84 100644 --- a/src/components/tokens/_tokens.scss +++ b/src/components/tokens/_tokens.scss @@ -1,16 +1,317 @@ /** * Do not edit directly - * Generated on Fri, 29 Sep 2023 21:08:29 GMT + * Generated on Mon, 09 Oct 2023 20:13:07 GMT */ :root { + --global-spacing-xs: 2px; + --global-spacing-sm: 4px; + --global-spacing-md: 8px; + --global-spacing-lg: 16px; + --global-spacing-xl: 32px; + --global-spacing-2xl: 64px; + --global-size-xs: 2px; + --global-size-sm: 4px; + --global-size-md: 8px; + --global-size-lg: 16px; + --global-size-xl: 32px; + --global-size-2xl: 64px; + --global-breakpoint-sm: 576; + --global-breakpoint-md: 768; + --global-breakpoint-lg: 992; + --global-breakpoint-xl: 1200; + --global-breakpoint-xxl: 1400; + --global-radius-sm: 4px; + --global-radius-md: 10px; + --global-radius-lg: 20px; + --global-opacity-0: 0; + --global-opacity-10: 0.1; + --global-opacity-20: 0.2; + --global-opacity-30: 0.3; + --global-opacity-40: 0.4; + --global-opacity-50: 0.5; + --global-opacity-60: 0.6; + --global-opacity-70: 0.7; + --global-opacity-80: 0.8; + --global-opacity-90: 0.9; + --global-opacity-100: 1; + --global-border-sm: 1px; + --global-border-md: 2px; + --global-border-lg: 5px; + --global-color-black: #000000; + --global-color-white: #ffffff; + --global-color-emulsify-blue-100: #e6f5fc; + --global-color-emulsify-blue-200: #ccecfa; + --global-color-emulsify-blue-300: #99d9f4; + --global-color-emulsify-blue-400: #66c5ef; + --global-color-emulsify-blue-500: #33b2e9; + --global-color-emulsify-blue-600: #009fe4; + --global-color-emulsify-blue-700: #007fb6; + --global-color-emulsify-blue-800: #005f89; + --global-color-emulsify-blue-900: #00405b; + --global-color-emulsify-blue-1000: #00202e; + --global-color-grays-100: #eaebec; + --global-color-grays-200: #d4d7d8; + --global-color-grays-300: #a9afb1; + --global-color-grays-400: #7f878b; + --global-color-grays-500: #545f64; + --global-color-grays-600: #29373d; + --global-color-grays-700: #212c31; + --global-color-grays-800: #192125; + --global-color-grays-900: #101618; + --global-color-grays-1000: #080b0c; + --global-font-family-primary: Inter; + --global-font-family-secondary: Sentinel; + --global-line-height-none: 1; + --global-line-height-tight: 1.25; + --global-line-height-snug: 1.37; + --global-line-height-normal: 1.5; + --global-line-height-relaxed: 1.75; + --global-line-height-loose: 2; + --global-font-weight-primary-regular: 400; + --global-font-weight-primary-bold: 700; + --global-font-weight-secondary-regular: 500; + --global-font-weight-secondary-bold: 700; + --global-font-size-tiny: 10px; + --global-font-size-x-small: 12px; + --global-font-size-caption: 14px; + --global-font-size-small: 16px; + --global-font-size-body: 18px; + --global-font-size-lead: 24px; + --global-font-size-h5: 21px; + --global-font-size-h4: 26px; + --global-font-size-h3: 31px; + --global-font-size-h2: 37px; + --global-font-size-h1: 48px; + --global-font-size-display: 64px; + --global-font-size-hero: 80px; + --global-font-size-uber: 112px; + --global-font-size-colossus: 140px; + --global-letter-spacing-0: 0; + --global-letter-spacing-tight: -3; + --global-paragraph-spacing-0: 0; + --global-font-primary-colossus-default: 400 140px/1.5 Inter; + --global-font-primary-colossus-bold: 700 140px/1.5 Inter; + --global-font-primary-uber-default: 400 112px/1.5 Inter; + --global-font-primary-uber-bold: 700 112px/1.5 Inter; + --global-font-primary-hero-default: 400 80px/1.25 Inter; + --global-font-primary-hero-bold: 700 80px/1.25 Inter; + --global-font-primary-display-default: 400 64px/1.5 Inter; + --global-font-primary-display-bold: 700 64px/1.5 Inter; + --global-font-primary-h1-default: 400 48px/1.5 Inter; + --global-font-primary-h1-bold: 700 48px/1.5 Inter; + --global-font-primary-h2-default: 400 37px/1.5 Inter; + --global-font-primary-h2-bold: 700 37px/1.5 Inter; + --global-font-primary-h3-default: 400 31px/1.5 Inter; + --global-font-primary-h3-bold: 700 31px/1.5 Inter; + --global-font-primary-h4-default: 400 26px/1.5 Inter; + --global-font-primary-h4-bold: 700 26px/1.5 Inter; + --global-font-primary-h5-default: 400 21px/1.5 Inter; + --global-font-primary-h5-bold: 700 21px/1.5 Inter; + --global-font-primary-lead-default: 400 24px/1.5 Inter; + --global-font-primary-lead-bold: 700 24px/1.5 Inter; + --global-font-primary-body-default: 400 18px/1.5 Inter; + --global-font-primary-body-bold: 700 18px/1.5 Inter; + --global-font-primary-body-mobile-default: 400 14px/1.5 Inter; + --global-font-primary-small-default: 400 16px/1.5 Inter; + --global-font-primary-small-bold: 700 16px/1.5 Inter; + --global-font-primary-caption-default: 400 14px/1.5 Inter; + --global-font-primary-caption-bold: 700 14px/1.5 Inter; + --global-font-primary-x-small-default: 400 12px/1.5 Inter; + --global-font-primary-x-small-bold: 700 12px/1.5 Inter; + --global-font-primary-tiny-default: 400 10px/1.5 Inter; + --global-font-primary-tiny-bold: 700 10px/1.5 Inter; + --global-font-secondary-colossus-default: 500 140px/1.5 Sentinel; + --global-font-secondary-colossus-bold: 700 140px/1.5 Sentinel; + --global-font-secondary-uber-default: 500 112px/1.5 Sentinel; + --global-font-secondary-uber-bold: 700 112px/1.5 Sentinel; + --global-font-secondary-hero-default: 500 80px/1.25 Sentinel; + --global-font-secondary-hero-bold: 700 80px/1.25 Sentinel; + --global-font-secondary-display-default: 500 64px/1.5 Sentinel; + --global-font-secondary-display-bold: 700 64px/1.5 Sentinel; + --global-font-secondary-h1-default: 500 48px/1.5 Sentinel; + --global-font-secondary-h1-bold: 700 48px/1.5 Sentinel; + --global-font-secondary-h2-default: 500 37px/1.5 Sentinel; + --global-font-secondary-h2-bold: 700 37px/1.5 Sentinel; + --global-font-secondary-h3-default: 500 31px/1.5 Sentinel; + --global-font-secondary-h3-bold: 700 31px/1.5 Sentinel; + --global-font-secondary-h4-default: 500 26px/1.5 Sentinel; + --global-font-secondary-h4-bold: 700 26px/1.5 Sentinel; + --global-font-secondary-h5-default: 500 21px/1.5 Sentinel; + --global-font-secondary-h5-bold: 700 21px/1.5 Sentinel; + --global-font-secondary-lead-default: 500 24px/1.5 Sentinel; + --global-font-secondary-lead-bold: 700 24px/1.5 Sentinel; + --global-font-secondary-body-default: 500 18px/1.5 Sentinel; + --global-font-secondary-body-bold: 700 18px/1.5 Sentinel; + --global-font-secondary-body-mobile-default: 500 14px/1.5 Sentinel; + --global-font-secondary-small-default: 500 16px/1.5 Sentinel; + --global-font-secondary-small-bold: 700 16px/1.5 Sentinel; + --global-font-secondary-caption-default: 500 14px/1.5 Sentinel; + --global-font-secondary-caption-bold: 700 14px/1.5 Sentinel; + --global-font-secondary-x-small-default: 500 12px/1.5 Sentinel; + --global-font-secondary-x-small-bold: 700 12px/1.5 Sentinel; + --global-font-secondary-tiny-default: 500 10px/1.5 Sentinel; + --global-font-secondary-tiny-bold: 700 10px/1.5 Sentinel; + --global-text-case-none: none; + --global-text-case-upper: uppercase; + --global-text-case-capitalize: capitalize; + --global-text-case-lower: lowercase; + --global-text-decoration-none: none; + --semantic-color-primary-default: #009fe4; /* 600 */ + --semantic-color-primary-light: hsl(198 100% 55.8%); + --semantic-color-primary-lighter: hsl(198 100% 80.6%); + --semantic-color-primary-dark: hsl(198 100% 35.8%); + --semantic-color-primary-darker: hsl(198 100% 26.8%); + --semantic-color-text-body: #00202e; + --semantic-color-text-heading: #0080b7; + --semantic-color-warning-default: #D80F0F; + --semantic-color-link: #33b2e9; + --semantic-color-link-hover: #009fe4; + --semantic-font-family-body: Inter; + --semantic-font-family-heading: Inter; + --components-accordion-accordion-header: 400 26px/1.5 Inter; + --components-accordion-accordion-p: 400 18px/1.5 Inter; + --components-accordion-accordion-color-body: #00202e; + --components-accordion-accordion-color-header: #0080b7; + --components-accordion-accordion-color-header-hover: #33b2e9; + --components-accordion-accordion-divider-color: #545f64; + --components-block-quote-block-quote-padding-x: 32px; + --components-block-quote-block-quote-padding-y: 8px; + --components-breadcrumbs-breadcrumb-default: 500 12px/1 Sentinel; + --components-breadcrumbs-breadcrumb-text-default: #7f878b; + --components-breadcrumbs-breadcrumb-text-hover: #192125; + --components-button-button-color-bkg: #009fe4; + --components-button-button-color-label: #ffffff; + --components-button-button-color-bkg-hover: #0080b7; + --components-button-button-color-label-hover: #ffffff; + --components-button-button-color-label-focus: #ffffff; + --components-button-button-color-bkg-focus: #0080b7; + --components-button-button-padding-x: 16px; + --components-button-button-padding-x-hover: 16px; + --components-button-button-padding-x-focus: 16px; + --components-button-button-padding-y: 8px; + --components-button-button-padding-y-hover: 8px; + --components-button-button-padding-y-focus: 8px; + --components-button-button-radius: 4px; + --components-button-button-radius-hover: 4px; + --components-button-button-radius-focus: 4px; + --components-button-button-border-width-outline-focus: 1px; + --components-button-button-border-width-border: 1px; + --components-button-button-border-width-border-hover: 1px; + --components-button-button-border-width-border-focus: 1px; + --components-button-button-text-case: uppercase; + --components-button-button-border-color: #009fe4; + --components-button-button-border-color-hover: #0080b7; + --components-button-button-border-color-focus: #0080b7; + --components-button-button-font-weight-label: 700; + --components-card-card-spacing: 16px; + --components-checkbox-checkbox-color-label: #00202e; + --components-checkbox-checkbox-color-label-disabled: #a9afb1; + --components-checkbox-checkbox-button-fill: #009fe4; + --components-checkbox-checkbox-button-fill-hover: #0080b7; + --components-checkbox-checkbox-button-fill-disabled: #a9afb1; + --components-checkbox-checkbox-button-stroke: #00202e; + --components-checkbox-checkbox-button-stroke-hover: #00202e; + --components-checkbox-checkbox-button-stroke-disabled: #a9afb1; + --components-checkbox-checkbox-spacing-gap: 4px; + --components-cta-cta-header: 700 37px/1.5 Inter; + --components-cta-cta-body: 400 24px/1.5 Inter; + --components-cta-cta-fill: #00202e; + --components-fieldset-fieldset-color-bg: white; + --components-fieldset-fieldset-color-border: #a9afb1; + --components-fieldset-fieldset-color-label: #00202e; + --components-fieldset-radius-fieldset: 4px; + --components-input-input-gap: 8px; + --components-input-input-padding-x: 16px; + --components-input-input-padding-y: 8px; + --components-input-input-color-label: #00202e; + --components-input-input-color-help-text: #0080b7; + --components-input-input-color-placeholder: #a9afb1; + --components-input-input-border-color: #7f878b; + --components-input-input-radius: 4px; + --components-input-input-label-lineheight: 1.25; + --components-input-input-bkg: #ffffff; + --components-link-link-color-default: #009fe4; + --components-link-link-color-hover: #005f89; + --components-link-link-body: 400 18px/1.5 Inter; + --components-main-menu-main-menu-color-bg: #ffffff; + --components-main-menu-main-menu-color-link-bg: #ffffff; + --components-main-menu-main-menu-color-link-bg-hover: #9ce1ff; + --components-main-menu-main-menu-color-link-label: #0080b7; + --components-main-menu-main-menu-color-link-label-hover: #006089; + --components-main-menu-main-menu-color-dropdown-bg: #9ce1ff; + --components-main-menu-main-menu-color-dropdown-bg-hover: #9ce1ff; + --components-main-menu-main-menu-color-dropdown-label: #0080b7; + --components-main-menu-main-menu-color-dropdown-label-hover: #006089; + --components-pager-pager-color-text-default: #29373d; + --components-pager-pager-color-text-hover: #ffffff; + --components-pager-pager-color-text-focus: #009fe4; + --components-pager-pager-color-fill-hover: #009fe4; + --components-pager-pager-default: 500 12px/1 Inter; + --components-pager-pager-padding-x: 16px; + --components-pager-pager-padding-x-hover: 16px; + --components-pager-pager-padding-x-focus: 16px; + --components-pager-pager-padding-y: 8px; + --components-pager-pager-padding-y-hover: 8px; + --components-pager-pager-padding-y-focus: 8px; + --components-radio-button-radio-color-label: #00202e; + --components-radio-button-radio-color-label-disabled: #a9afb1; + --components-radio-button-radio-color-button-fill: #009fe4; + --components-radio-button-radio-color-button-fill-hover: #0080b7; + --components-radio-button-radio-color-button-fill-disabled: #a9afb1; + --components-radio-button-radio-color-button-stroke: #00202e; + --components-radio-button-radio-color-button-stroke-hover: #00202e; + --components-radio-button-radio-color-button-stroke-disabled: #a9afb1; + --components-radio-button-radio-gap: 4px; + --components-selectdropdown-selectdropdown-color-label: #00202e; + --components-selectdropdown-selectdropdown-color-label-disabled: #a9afb1; + --components-selectdropdown-selectdropdown-color-button-fill: #ffffff; + --components-selectdropdown-selectdropdown-color-button-fill-hover: #e6f5fc; + --components-selectdropdown-selectdropdown-color-button-fill-disabled: #ffffff; + --components-selectdropdown-selectdropdown-color-button-stroke: #7f878b; + --components-selectdropdown-selectdropdown-color-button-stroke-hover: #545f64; + --components-selectdropdown-selectdropdown-color-button-stroke-disabled: #a9afb1; + --components-selectdropdown-selectdropdown-gap: 4px; + --components-selectdropdown-selectdropdown-radius: 4px; + --components-status-status-color-info-bg: #16bdde; + --components-status-status-color-info-label: #272727; + --components-status-status-color-danger-bg: #BD1919; + --components-status-status-color-danger-label: #ffffff; + --components-status-status-color-success-bg: #337B32; + --components-status-status-color-success-label: #ffffff; + --components-status-status-color-warning-bg: #F6C40F; + --components-status-status-color-warning-label: #333333; + --components-status-status-font-size-header: 21px; + --components-table-table-color-cell-bg: #ffffff; + --components-table-table-color-cell-bg-stripe: #9ce1ff; + --components-table-table-color-cell-text: #00202e; + --components-table-table-color-cell-icon: #007fb6; + --components-table-table-color-header-bg: #009fe4; + --components-table-table-color-header-text: #ffffff; + --components-table-table-color-header-icon: #9ce1ff; + --components-table-table-color-border: #d4d7d8; + --components-tabs-tabs-color-bg-default: #ffffff; + --components-tabs-tabs-color-bg-active: #ffffff; + --components-tabs-tabs-color-bg-hover: #ffffff; + --components-tabs-tabs-color-text-default: #00202e; + --components-tabs-tabs-color-text-active: #0080b7; + --components-tabs-tabs-color-text-hover: #33b2e9; + --components-tabs-tabs-color-border-bottom: #a9afb1; + --components-tabs-tab-label: 700 21px/1.5 Inter; + --components-text-field-text-field-border-width: 1px; + --components-text-field-text-field-radius: 10px; + --components-text-field-text-field-border: colors.grays.800; + --storybook-colors-sb-background: #ffffff; + --storybook-colors-sb-text-body: #00202e; + --storybook-colors-sb-text-heading: #0080b7; + --storybook-colors-sb-visualization: #009fe4; --colors-sb-background: #ffffff; --colors-sb-text-body: #00202e; --colors-sb-text-heading: #0080b7; --colors-sb-visualization: #009fe4; --text-field-border-width: 1px; - --text-field-radius: 0.625rem; - --text-field-border: [object Object]; + --text-field-radius: 10px; + --text-field-border: colors.grays.800; --tabs-color-bg-default: #ffffff; --tabs-color-bg-active: #ffffff; --tabs-color-bg-hover: #ffffff; @@ -18,7 +319,7 @@ --tabs-color-text-active: #0080b7; --tabs-color-text-hover: #33b2e9; --tabs-color-border-bottom: #a9afb1; - --tab-label: [object Object]; + --tab-label: 700 21px/150% Inter; --table-color-cell-bg: #ffffff; --table-color-cell-bg-stripe: #9ce1ff; --table-color-cell-text: #00202e; @@ -35,7 +336,7 @@ --status-color-success-label: #ffffff; --status-color-warning-bg: #F6C40F; --status-color-warning-label: #333333; - --status-font-size-header: 21; + --status-font-size-header: 21px; --selectdropdown-color-label: #00202e; --selectdropdown-color-label-disabled: #a9afb1; --selectdropdown-color-button-fill: #ffffff; @@ -44,8 +345,8 @@ --selectdropdown-color-button-stroke: #7f878b; --selectdropdown-color-button-stroke-hover: #545f64; --selectdropdown-color-button-stroke-disabled: #a9afb1; - --selectdropdown-gap: 0.25rem; - --selectdropdown-radius: 0.25rem; + --selectdropdown-gap: 4px; + --selectdropdown-radius: 4px; --radio-color-label: #00202e; --radio-color-label-disabled: #a9afb1; --radio-color-button-fill: #009fe4; @@ -54,18 +355,18 @@ --radio-color-button-stroke: #00202e; --radio-color-button-stroke-hover: #00202e; --radio-color-button-stroke-disabled: #a9afb1; - --radio-gap: 0.25rem; + --radio-gap: 4px; --pager-color-text-default: #29373d; --pager-color-text-hover: #ffffff; --pager-color-text-focus: #009fe4; --pager-color-fill-hover: #009fe4; - --pager-default: [object Object]; - --pager-padding-x: 1rem; - --pager-padding-x-hover: 1rem; - --pager-padding-x-focus: 1rem; - --pager-padding-y: 0.5rem; - --pager-padding-y-hover: 0.5rem; - --pager-padding-y-focus: 0.5rem; + --pager-default: 500 12px/100% Inter; + --pager-padding-x: 16px; + --pager-padding-x-hover: 16px; + --pager-padding-x-focus: 16px; + --pager-padding-y: 8px; + --pager-padding-y-hover: 8px; + --pager-padding-y-focus: 8px; --main-menu-color-bg: #ffffff; --main-menu-color-link-bg: #ffffff; --main-menu-color-link-bg-hover: #9ce1ff; @@ -77,26 +378,26 @@ --main-menu-color-dropdown-label-hover: #006089; --link-color-default: #009fe4; --link-color-hover: #005f89; - --link-body: [object Object]; - --input-gap: 0.5rem; - --input-padding-x: 1rem; - --input-padding-y: 0.5rem; + --link-body: 400 18px/150% Inter; + --input-gap: 8px; + --input-padding-x: 16px; + --input-padding-y: 8px; --input-color-label: #00202e; --input-color-help-text: #0080b7; --input-color-placeholder: #a9afb1; --input-border-color: #7f878b; - --input-radius: 0.25rem; - --input-label-lineheight: 125%; + --input-radius: 4px; + --input-label-lineheight: 1.25; --input-bkg: #ffffff; --fieldset-color-bg: white; --fieldset-color-border: #a9afb1; --fieldset-color-label: #00202e; - --radius-fieldset: 0.25rem; - --radius-sm: 0.25rem; - --radius-md: 0.625rem; - --radius-lg: 1.25rem; - --cta-header: [object Object]; - --cta-body: [object Object]; + --radius-fieldset: 4px; + --radius-sm: 4px; + --radius-md: 10px; + --radius-lg: 20px; + --cta-header: 700 37px/150% Inter; + --cta-body: 400 24px/150% Inter; --cta-fill: #00202e; --checkbox-color-label: #00202e; --checkbox-color-label-disabled: #a9afb1; @@ -106,23 +407,23 @@ --checkbox-button-stroke: #00202e; --checkbox-button-stroke-hover: #00202e; --checkbox-button-stroke-disabled: #a9afb1; - --checkbox-spacing-gap: 0.25rem; - --card-spacing: 1rem; + --checkbox-spacing-gap: 4px; + --card-spacing: 16px; --button-color-bkg: #009fe4; --button-color-label: #ffffff; --button-color-bkg-hover: #0080b7; --button-color-label-hover: #ffffff; --button-color-label-focus: #ffffff; --button-color-bkg-focus: #0080b7; - --button-padding-x: 1rem; - --button-padding-x-hover: 1rem; - --button-padding-x-focus: 1rem; - --button-padding-y: 0.5rem; - --button-padding-y-hover: 0.5rem; - --button-padding-y-focus: 0.5rem; - --button-radius: 0.25rem; - --button-radius-hover: 0.25rem; - --button-radius-focus: 0.25rem; + --button-padding-x: 16px; + --button-padding-x-hover: 16px; + --button-padding-x-focus: 16px; + --button-padding-y: 8px; + --button-padding-y-hover: 8px; + --button-padding-y-focus: 8px; + --button-radius: 4px; + --button-radius-hover: 4px; + --button-radius-focus: 4px; --button-border-width-outline-focus: 1px; --button-border-width-border: 1px; --button-border-width-border-hover: 1px; @@ -131,26 +432,26 @@ --button-border-color: #009fe4; --button-border-color-hover: #0080b7; --button-border-color-focus: #0080b7; - --button-font-weight-label: Bold; - --breadcrumb-default: [object Object]; + --button-font-weight-label: 700; + --breadcrumb-default: 500 12px/100% Sentinel; --breadcrumb-text-default: #7f878b; --breadcrumb-text-hover: #192125; - --block-quote-padding-x: 2rem; - --block-quote-padding-y: 0.5rem; - --accordion-header: [object Object]; - --accordion-p: [object Object]; + --block-quote-padding-x: 32px; + --block-quote-padding-y: 8px; + --accordion-header: 400 26px/150% Inter; + --accordion-p: 400 18px/150% Inter; --accordion-color-body: #00202e; --accordion-color-header: #0080b7; --accordion-color-header-hover: #33b2e9; --accordion-divider-color: #545f64; - --color-primary-default: #009fe4; + --color-primary-default: #009fe4; /* 600 */ --color-primary-light: #1ebbff; --color-primary-lighter: #9ce1ff; --color-primary-dark: #0080b7; --color-primary-darker: #006089; --color-text-body: #00202e; --color-text-heading: #0080b7; - --color-warning-default: #d80f0f; + --color-warning-default: #D80F0F; --color-link: #33b2e9; --color-link-hover: #009fe4; --color-black: #000000; @@ -177,129 +478,129 @@ --color-grays-1000: #080b0c; --font-family-body: Inter; --font-family-heading: Inter; - --spacing-xs: 0.125rem; - --spacing-sm: 0.25rem; - --spacing-md: 0.5rem; - --spacing-lg: 1rem; - --spacing-xl: 2rem; - --spacing-2xl: 4rem; - --size-xs: 0.125rem; - --size-sm: 0.25rem; - --size-md: 0.5rem; - --size-lg: 1rem; - --size-xl: 2rem; - --size-2xl: 4rem; - --breakpoint-sm: 36rem; - --breakpoint-md: 48rem; - --breakpoint-lg: 62rem; - --breakpoint-xl: 75rem; - --breakpoint-xxl: 87.5rem; - --opacity-0: 0%; - --opacity-10: 10%; - --opacity-20: 20%; - --opacity-30: 30%; - --opacity-40: 40%; - --opacity-50: 50%; - --opacity-60: 60%; - --opacity-70: 70%; - --opacity-80: 80%; - --opacity-90: 90%; - --opacity-100: 100%; + --spacing-xs: 2px; + --spacing-sm: 4px; + --spacing-md: 8px; + --spacing-lg: 16px; + --spacing-xl: 32px; + --spacing-2xl: 64px; + --size-xs: 2px; + --size-sm: 4px; + --size-md: 8px; + --size-lg: 16px; + --size-xl: 32px; + --size-2xl: 64px; + --breakpoint-sm: 576; + --breakpoint-md: 768; + --breakpoint-lg: 992; + --breakpoint-xl: 1200; + --breakpoint-xxl: 1400; + --opacity-0: 0; + --opacity-10: 0.1; + --opacity-20: 0.2; + --opacity-30: 0.3; + --opacity-40: 0.4; + --opacity-50: 0.5; + --opacity-60: 0.6; + --opacity-70: 0.7; + --opacity-80: 0.8; + --opacity-90: 0.9; + --opacity-100: 1; --border-sm: 1px; --border-md: 2px; --border-lg: 5px; --font-family-primary: Inter; --font-family-secondary: Sentinel; - --line-height-none: 100%; - --line-height-tight: 125%; - --line-height-snug: 137%; - --line-height-normal: 150%; - --line-height-relaxed: 175%; - --line-height-loose: 200%; - --font-weight-primary-regular: Regular; - --font-weight-primary-bold: Bold; - --font-weight-secondary-regular: Medium; - --font-weight-secondary-bold: Bold; - --font-size-tiny: 10; - --font-size-x-small: 12; - --font-size-caption: 14; - --font-size-small: 16; - --font-size-body: 18; - --font-size-lead: 24; - --font-size-h5: 21; - --font-size-h4: 26; - --font-size-h3: 31; - --font-size-h2: 37; - --font-size-h1: 48; - --font-size-display: 64; - --font-size-hero: 80; - --font-size-uber: 112; - --font-size-colossus: 140; + --line-height-none: 1; + --line-height-tight: 1.25; + --line-height-snug: 1.37; + --line-height-normal: 1.5; + --line-height-relaxed: 1.75; + --line-height-loose: 2; + --font-weight-primary-regular: 400; + --font-weight-primary-bold: 700; + --font-weight-secondary-regular: 500; + --font-weight-secondary-bold: 700; + --font-size-tiny: 10px; + --font-size-x-small: 12px; + --font-size-caption: 14px; + --font-size-small: 16px; + --font-size-body: 18px; + --font-size-lead: 24px; + --font-size-h5: 21px; + --font-size-h4: 26px; + --font-size-h3: 31px; + --font-size-h2: 37px; + --font-size-h1: 48px; + --font-size-display: 64px; + --font-size-hero: 80px; + --font-size-uber: 112px; + --font-size-colossus: 140px; --letter-spacing-0: 0; --letter-spacing-tight: -3; --paragraph-spacing-0: 0; - --font-primary-colossus-default: [object Object]; - --font-primary-colossus-bold: [object Object]; - --font-primary-uber-default: [object Object]; - --font-primary-uber-bold: [object Object]; - --font-primary-hero-default: [object Object]; - --font-primary-hero-bold: [object Object]; - --font-primary-display-default: [object Object]; - --font-primary-display-bold: [object Object]; - --font-primary-h1-default: [object Object]; - --font-primary-h1-bold: [object Object]; - --font-primary-h2-default: [object Object]; - --font-primary-h2-bold: [object Object]; - --font-primary-h3-default: [object Object]; - --font-primary-h3-bold: [object Object]; - --font-primary-h4-default: [object Object]; - --font-primary-h4-bold: [object Object]; - --font-primary-h5-default: [object Object]; - --font-primary-h5-bold: [object Object]; - --font-primary-lead-default: [object Object]; - --font-primary-lead-bold: [object Object]; - --font-primary-body-default: [object Object]; - --font-primary-body-bold: [object Object]; - --font-primary-body-mobile-default: [object Object]; - --font-primary-small-default: [object Object]; - --font-primary-small-bold: [object Object]; - --font-primary-caption-default: [object Object]; - --font-primary-caption-bold: [object Object]; - --font-primary-x-small-default: [object Object]; - --font-primary-x-small-bold: [object Object]; - --font-primary-tiny-default: [object Object]; - --font-primary-tiny-bold: [object Object]; - --font-secondary-colossus-default: [object Object]; - --font-secondary-colossus-bold: [object Object]; - --font-secondary-uber-default: [object Object]; - --font-secondary-uber-bold: [object Object]; - --font-secondary-hero-default: [object Object]; - --font-secondary-hero-bold: [object Object]; - --font-secondary-display-default: [object Object]; - --font-secondary-display-bold: [object Object]; - --font-secondary-h1-default: [object Object]; - --font-secondary-h1-bold: [object Object]; - --font-secondary-h2-default: [object Object]; - --font-secondary-h2-bold: [object Object]; - --font-secondary-h3-default: [object Object]; - --font-secondary-h3-bold: [object Object]; - --font-secondary-h4-default: [object Object]; - --font-secondary-h4-bold: [object Object]; - --font-secondary-h5-default: [object Object]; - --font-secondary-h5-bold: [object Object]; - --font-secondary-lead-default: [object Object]; - --font-secondary-lead-bold: [object Object]; - --font-secondary-body-default: [object Object]; - --font-secondary-body-bold: [object Object]; - --font-secondary-body-mobile-default: [object Object]; - --font-secondary-small-default: [object Object]; - --font-secondary-small-bold: [object Object]; - --font-secondary-caption-default: [object Object]; - --font-secondary-caption-bold: [object Object]; - --font-secondary-x-small-default: [object Object]; - --font-secondary-x-small-bold: [object Object]; - --font-secondary-tiny-default: [object Object]; - --font-secondary-tiny-bold: [object Object]; + --font-primary-colossus-default: 400 140px/150% Inter; + --font-primary-colossus-bold: 700 140px/150% Inter; + --font-primary-uber-default: 400 112px/150% Inter; + --font-primary-uber-bold: 700 112px/150% Inter; + --font-primary-hero-default: 400 80px/125% Inter; + --font-primary-hero-bold: 700 80px/125% Inter; + --font-primary-display-default: 400 64px/150% Inter; + --font-primary-display-bold: 700 64px/150% Inter; + --font-primary-h1-default: 400 48px/150% Inter; + --font-primary-h1-bold: 700 48px/150% Inter; + --font-primary-h2-default: 400 37px/150% Inter; + --font-primary-h2-bold: 700 37px/150% Inter; + --font-primary-h3-default: 400 31px/150% Inter; + --font-primary-h3-bold: 700 31px/150% Inter; + --font-primary-h4-default: 400 26px/150% Inter; + --font-primary-h4-bold: 700 26px/150% Inter; + --font-primary-h5-default: 400 21px/150% Inter; + --font-primary-h5-bold: 700 21px/150% Inter; + --font-primary-lead-default: 400 24px/150% Inter; + --font-primary-lead-bold: 700 24px/150% Inter; + --font-primary-body-default: 400 18px/150% Inter; + --font-primary-body-bold: 700 18px/150% Inter; + --font-primary-body-mobile-default: 400 14px/150% Inter; + --font-primary-small-default: 400 16px/150% Inter; + --font-primary-small-bold: 700 16px/150% Inter; + --font-primary-caption-default: 400 14px/150% Inter; + --font-primary-caption-bold: 700 14px/150% Inter; + --font-primary-x-small-default: 400 12px/150% Inter; + --font-primary-x-small-bold: 700 12px/150% Inter; + --font-primary-tiny-default: 400 10px/150% Inter; + --font-primary-tiny-bold: 700 10px/150% Inter; + --font-secondary-colossus-default: 500 140px/150% Sentinel; + --font-secondary-colossus-bold: 700 140px/150% Sentinel; + --font-secondary-uber-default: 500 112px/150% Sentinel; + --font-secondary-uber-bold: 700 112px/150% Sentinel; + --font-secondary-hero-default: 500 80px/125% Sentinel; + --font-secondary-hero-bold: 700 80px/125% Sentinel; + --font-secondary-display-default: 500 64px/150% Sentinel; + --font-secondary-display-bold: 700 64px/150% Sentinel; + --font-secondary-h1-default: 500 48px/150% Sentinel; + --font-secondary-h1-bold: 700 48px/150% Sentinel; + --font-secondary-h2-default: 500 37px/150% Sentinel; + --font-secondary-h2-bold: 700 37px/150% Sentinel; + --font-secondary-h3-default: 500 31px/150% Sentinel; + --font-secondary-h3-bold: 700 31px/150% Sentinel; + --font-secondary-h4-default: 500 26px/150% Sentinel; + --font-secondary-h4-bold: 700 26px/150% Sentinel; + --font-secondary-h5-default: 500 21px/150% Sentinel; + --font-secondary-h5-bold: 700 21px/150% Sentinel; + --font-secondary-lead-default: 500 24px/150% Sentinel; + --font-secondary-lead-bold: 700 24px/150% Sentinel; + --font-secondary-body-default: 500 18px/150% Sentinel; + --font-secondary-body-bold: 700 18px/150% Sentinel; + --font-secondary-body-mobile-default: 500 14px/150% Sentinel; + --font-secondary-small-default: 500 16px/150% Sentinel; + --font-secondary-small-bold: 700 16px/150% Sentinel; + --font-secondary-caption-default: 500 14px/150% Sentinel; + --font-secondary-caption-bold: 700 14px/150% Sentinel; + --font-secondary-x-small-default: 500 12px/150% Sentinel; + --font-secondary-x-small-bold: 700 12px/150% Sentinel; + --font-secondary-tiny-default: 500 10px/150% Sentinel; + --font-secondary-tiny-bold: 700 10px/150% Sentinel; --text-case-none: none; --text-case-upper: uppercase; --text-case-capitalize: capitalize; diff --git a/src/tokens/tokensTransform.js b/src/tokens/tokensTransform.js index b8380db..3e3e55c 100755 --- a/src/tokens/tokensTransform.js +++ b/src/tokens/tokensTransform.js @@ -1,40 +1,23 @@ -const StyleDictionary = require('style-dictionary').extend('sd.config.json'); +const { registerTransforms } = require('@tokens-studio/sd-transforms'); +const StyleDictionary = require('style-dictionary'); -const pixelsToRem = (px) => { - const rem = 16; - return `${px / rem}rem`; -}; +registerTransforms(StyleDictionary, { casing: 'kebab' }); -const appendPX = (value) => { - return `${value}px`; -}; - -StyleDictionary.registerTransform({ - name: 'toRem/pxToRem', - type: 'value', - matcher(token) { - return ( - token.type === 'sizing' || - token.type === 'spacing' || - token.type === 'borderRadius' || - token.path[0] === 'breakpoint' || - token.path[0] === 'fontSize' - ); - }, - transformer(token) { - return pixelsToRem(token.value); - }, -}); - -StyleDictionary.registerTransform({ - name: 'toPX/appendPX', - type: 'value', - matcher(token) { - return token.type === 'borderWidth'; - }, - transformer(token) { - return appendPX(token.value); +const sd = StyleDictionary.extend({ + source: ['**/*.tokens.json'], + platforms: { + css: { + transformGroup: 'tokens-studio', + buildPath: 'src/components/tokens/', + files: [ + { + destination: '_tokens.scss', + format: 'css/variables', + }, + ], + }, }, }); -StyleDictionary.buildAllPlatforms(); +sd.cleanAllPlatforms(); +sd.buildAllPlatforms();