diff --git a/design-tokens/tokens/component/component.default.json b/design-tokens/tokens/component/component.default.json index 4858b5903..02d54baff 100644 --- a/design-tokens/tokens/component/component.default.json +++ b/design-tokens/tokens/component/component.default.json @@ -282,769 +282,427 @@ } } } - } - }, - "secondary": { - "enabled": { - "background": { - "$type": "color", - "$value": "{button.default.enabled.background}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } - }, - "borderColor": { - "$type": "color", - "$value": "{color.background.primary.default}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{button.default.enabled.textColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{button.default.enabled.iconColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "fontWeight": { - "$type": "number", - "$value": "{button.default.enabled.fontWeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } }, - "hover": { - "background": { - "$type": "color", - "$value": "{button.default.enabled.background}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } - }, - "borderColor": { - "$type": "color", - "$value": "{color.border.selected}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{button.default.enabled.textColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{button.default.enabled.iconColor}", + "xsmall": { + "paddingX": { + "$type": "number", + "$value": "{button.default.xsmall.paddingX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "fontWeight": { + "paddingY": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.default.xsmall.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - }, - "disabled": { - "background": { - "$type": "color", - "$value": "{color.background.disabled}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{color.border.disabled}", + "borderRadius": { + "$type": "number", + "$value": "{button.default.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } }, - "textColor": { - "$type": "color", - "$value": "{color.text.disabled}", + "borderWidth": { + "$type": "number", + "$value": "{button.default.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{color.icon.disabled}", + "minHeight": { + "$type": "number", + "$value": "{button.default.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "fontWeight": { + "fontSize": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.default.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], + "scopes": ["FONT_SIZE"], "codeSyntax": {} } } - } - }, - "selected": { - "enabled": { - "background": { - "$type": "color", - "$value": "{button.default.selected.enabled.background}", + }, + "iconOnly": { + "paddingX": { + "$type": "number", + "$value": "{button.default.xsmall.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.borderColor}", + "paddingY": { + "$type": "number", + "$value": "{button.default.xsmall.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "textColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.textColor}", + "borderRadius": { + "$type": "number", + "$value": "{button.primary.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.iconColor}", + "borderWidth": { + "$type": "number", + "$value": "{button.primary.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "fontWeight": { + "minHeight": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.primary.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - } - } - }, - "default": { - "enabled": { - "background": { - "$type": "color", - "$value": "{color.transparent}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } - }, - "borderColor": { - "$type": "color", - "$value": "{color.transparent}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{color.text.strong}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{color.icon.strong}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "fontWeight": { - "$type": "number", - "$value": "{fontWeight.semibold}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - }, - "disabled": { - "background": { - "$type": "color", - "$value": "{button.default.enabled.background}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } - }, - "borderColor": { - "$type": "color", - "$value": "{button.default.enabled.borderColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{color.text.disabled}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{color.icon.disabled}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "fontWeight": { - "$type": "number", - "$value": "{button.default.enabled.fontWeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - }, - "hover": { - "background": { - "$type": "color", - "$value": "{color.background.hover}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } - }, - "borderColor": { - "$type": "color", - "$value": "{button.default.enabled.borderColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{button.default.enabled.textColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{button.default.enabled.iconColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "fontWeight": { - "$type": "number", - "$value": "{button.default.enabled.fontWeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - }, - "selected": { - "enabled": { - "background": { - "$type": "color", - "$value": "{color.background.active}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{color.transparent}", + "minWidth": { + "$type": "number", + "$value": "{button.default.xsmall.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "textColor": { - "$type": "color", - "$value": "{button.default.enabled.textColor}", + "fontSize": { + "$type": "number", + "$value": "{button.primary.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["FONT_SIZE"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{button.default.enabled.iconColor}", + "lineHeight": { + "$type": "number", + "$value": "{button.primary.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["LINE_HEIGHT"], "codeSyntax": {} } } }, - "fontWeight": { + "gapX": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.primary.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], + "scopes": ["GAP"], "codeSyntax": {} } } } - } - } - }, - "toolbar": { - "enabled": { - "background": { - "$type": "color", - "$value": "{color.transparent}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], - "codeSyntax": {} - } - } }, - "borderColor": { - "$type": "color", - "$value": "{color.border.default}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "textColor": { - "$type": "color", - "$value": "{button.default.enabled.textColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], - "codeSyntax": {} - } - } - }, - "iconColor": { - "$type": "color", - "$value": "{button.default.enabled.iconColor}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], - "codeSyntax": {} - } - } - }, - "fontWeight": { + "lineHeight": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], - "codeSyntax": {} - } - } - } - }, - "disabled": { - "background": { - "$type": "color", - "$value": "{color.background.disabled}", + "$value": "{button.default.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["LINE_HEIGHT"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{color.border.disabled}", + "gapX": { + "$type": "number", + "$value": "{button.default.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["GAP"], "codeSyntax": {} } } - }, - "textColor": { - "$type": "color", - "$value": "{color.text.disabled}", + } + }, + "small": { + "paddingX": { + "$type": "number", + "$value": "{button.default.small.paddingX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{color.icon.disabled}", + "paddingY": { + "$type": "number", + "$value": "{button.default.small.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "fontWeight": { + "borderRadius": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.default.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } - } - }, - "hover": { - "background": { - "$type": "color", - "$value": "{color.background.hover}", + }, + "borderWidth": { + "$type": "number", + "$value": "{button.default.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{button.toolbar.enabled.borderColor}", + "minHeight": { + "$type": "number", + "$value": "{button.default.small.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "textColor": { - "$type": "color", - "$value": "{button.toolbar.enabled.textColor}", + "fontSize": { + "$type": "number", + "$value": "{button.default.small.fontSize}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["FONT_SIZE"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{button.toolbar.enabled.iconColor}", + "lineHeight": { + "$type": "number", + "$value": "{button.default.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["LINE_HEIGHT"], "codeSyntax": {} } } }, - "fontWeight": { + "gapX": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.default.small.gapX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], + "scopes": ["GAP"], "codeSyntax": {} } } - } - }, - "selected": { - "enabled": { - "background": { - "$type": "color", - "$value": "{button.default.selected.enabled.background}", + }, + "iconOnly": { + "paddingX": { + "$type": "number", + "$value": "{button.default.small.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "borderColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.borderColor}", + "paddingY": { + "$type": "number", + "$value": "{button.default.small.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "textColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.textColor}", + "borderRadius": { + "$type": "number", + "$value": "{button.primary.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } }, - "iconColor": { - "$type": "color", - "$value": "{button.default.selected.enabled.iconColor}", + "borderWidth": { + "$type": "number", + "$value": "{button.primary.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "fontWeight": { + "minHeight": { "$type": "number", - "$value": "{button.default.enabled.fontWeight}", + "$value": "{button.primary.small.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_STYLE"], + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "minWidth": { + "$type": "number", + "$value": "{button.default.small.iconOnly.minWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + }, + "fontSize": { + "$type": "number", + "$value": "{button.primary.small.fontSize}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_SIZE"], + "codeSyntax": {} + } + } + }, + "lineHeight": { + "$type": "number", + "$value": "{button.primary.small.lineHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["LINE_HEIGHT"], + "codeSyntax": {} + } + } + }, + "gapX": { + "$type": "number", + "$value": "{button.primary.small.gapX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], "codeSyntax": {} } } } } - } - }, - "xsmall": { - "primary": { + }, + "medium": { "paddingX": { "$type": "number", - "$value": "{button.xsmall.default.paddingX}", + "$value": "{button.default.medium.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1056,7 +714,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xsmall.default.paddingY}", + "$value": "{button.default.medium.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1068,7 +726,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.xsmall.default.borderRadius}", + "$value": "{button.default.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1080,7 +738,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xsmall.default.borderWidth}", + "$value": "{button.default.medium.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1092,7 +750,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xsmall.default.minHeight}", + "$value": "{button.default.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1104,7 +762,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xsmall.default.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1116,7 +774,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xsmall.default.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1128,7 +786,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xsmall.default.gapX}", + "$value": "{button.default.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1141,7 +799,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.xsmall.default.iconOnly.paddingX}", + "$value": "{button.default.medium.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1153,7 +811,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xsmall.default.iconOnly.paddingY}", + "$value": "{button.default.medium.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1165,7 +823,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.xsmall.primary.borderRadius}", + "$value": "{button.primary.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1177,7 +835,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xsmall.primary.borderWidth}", + "$value": "{button.primary.medium.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1189,7 +847,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xsmall.primary.minHeight}", + "$value": "{button.primary.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1199,9 +857,21 @@ } } }, + "minWidth": { + "$type": "number", + "$value": "{button.default.medium.iconOnly.minWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + }, "fontSize": { "$type": "number", - "$value": "{button.xsmall.primary.fontSize}", + "$value": "{button.primary.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1213,7 +883,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xsmall.primary.lineHeight}", + "$value": "{button.primary.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1225,7 +895,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xsmall.primary.gapX}", + "$value": "{button.primary.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1237,10 +907,10 @@ } } }, - "secondary": { + "large": { "paddingX": { "$type": "number", - "$value": "{button.xsmall.default.paddingX}", + "$value": "{button.default.large.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1252,7 +922,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xsmall.default.paddingY}", + "$value": "{button.default.large.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1264,7 +934,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.xsmall.default.borderRadius}", + "$value": "{button.default.large.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1276,7 +946,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xsmall.default.borderWidth}", + "$value": "{button.default.large.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1288,7 +958,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xsmall.default.minHeight}", + "$value": "{button.default.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1300,7 +970,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xsmall.default.fontSize}", + "$value": "{button.default.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1312,7 +982,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xsmall.default.lineHeight}", + "$value": "{button.default.large.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1324,7 +994,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xsmall.default.gapX}", + "$value": "{button.default.large.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1335,9 +1005,93 @@ } }, "iconOnly": { + "borderRadius": { + "$type": "number", + "$value": "{button.primary.large.borderRadius}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["CORNER_RADIUS"], + "codeSyntax": {} + } + } + }, + "borderWidth": { + "$type": "number", + "$value": "{button.primary.large.borderWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "codeSyntax": {} + } + } + }, + "minHeight": { + "$type": "number", + "$value": "{button.primary.large.minHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "minWidth": { + "$type": "number", + "$value": "{button.default.large.iconOnly.minWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "fontSize": { + "$type": "number", + "$value": "{button.primary.large.fontSize}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_SIZE"], + "codeSyntax": {} + } + } + }, + "lineHeight": { + "$type": "number", + "$value": "{button.primary.large.lineHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["LINE_HEIGHT"], + "codeSyntax": {} + } + } + }, + "gapX": { + "$type": "number", + "$value": "{button.primary.large.gapX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} + } + } + }, "paddingX": { "$type": "number", - "$value": "{button.xsmall.default.iconOnly.paddingX}", + "$value": "{button.default.large.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1349,7 +1103,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xsmall.default.iconOnly.paddingY}", + "$value": "{button.default.large.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1358,10 +1112,14 @@ "codeSyntax": {} } } - }, + } + } + }, + "xlarge": { + "iconOnly": { "borderRadius": { "$type": "number", - "$value": "{button.xsmall.secondary.borderRadius}", + "$value": "{button.primary.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1373,19 +1131,31 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xsmall.secondary.borderWidth}", + "$value": "{button.primary.xlarge.borderWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "codeSyntax": {} + } + } + }, + "minHeight": { + "$type": "number", + "$value": "{button.primary.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "minHeight": { + "minWidth": { "$type": "number", - "$value": "{button.xsmall.secondary.minHeight}", + "$value": "{button.default.xlarge.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1397,7 +1167,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xsmall.secondary.fontSize}", + "$value": "{button.primary.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1409,7 +1179,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xsmall.secondary.lineHeight}", + "$value": "{button.primary.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1421,7 +1191,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xsmall.secondary.gapX}", + "$value": "{button.primary.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1430,36 +1200,35 @@ "codeSyntax": {} } } - } - }, - "hover": { - "boxShadow": { - "$type": "shadow", - "$value": [ - { - "offsetX": "{base.static.spacing.none}", - "offsetY": "{base.static.spacing.none}", - "blur": "{base.static.spacing.none}", - "spread": "{base.dimension.25}", - "color": "{button.secondary.hover.borderColor}", - "inset": true + }, + "paddingX": { + "$type": "number", + "$value": "{button.default.xlarge.iconOnly.paddingX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} } - ], + } + }, + "paddingY": { + "$type": "number", + "$value": "{button.default.xlarge.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["GAP"], "codeSyntax": {} } } } - } - }, - "default": { + }, "paddingX": { "$type": "number", - "$value": 12, + "$value": "{button.default.xlarge.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1471,7 +1240,7 @@ }, "paddingY": { "$type": "number", - "$value": 3, + "$value": "{button.default.xlarge.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1483,7 +1252,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.radius.full}", + "$value": "{button.default.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1495,7 +1264,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{element.xsmall.borderWidth}", + "$value": "{button.default.xlarge.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1507,7 +1276,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.xsmall.minHeight}", + "$value": "{button.default.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1519,7 +1288,7 @@ }, "fontSize": { "$type": "number", - "$value": "{element.xsmall.fontSize}", + "$value": "{button.default.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1531,7 +1300,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.xsmall.lineHeight}", + "$value": "{button.default.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1543,7 +1312,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.xsmall.textToIconX}", + "$value": "{button.default.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1552,110 +1321,264 @@ "codeSyntax": {} } } + } + } + }, + "secondary": { + "enabled": { + "background": { + "$type": "color", + "$value": "{button.default.enabled.background}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } }, - "iconOnly": { - "paddingX": { - "$type": "number", - "$value": "{button.xsmall.default.iconOnly.paddingY}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } + "borderColor": { + "$type": "color", + "$value": "{color.background.primary.default}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} } - }, - "paddingY": { - "$type": "number", - "$value": 3, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } + } + }, + "textColor": { + "$type": "color", + "$value": "{button.default.enabled.textColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} } - }, - "borderRadius": { - "$type": "number", - "$value": "{button.xsmall.default.borderRadius}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } + } + }, + "iconColor": { + "$type": "color", + "$value": "{button.default.enabled.iconColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "hover": { + "background": { + "$type": "color", + "$value": "{button.default.enabled.background}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{color.border.selected}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{button.default.enabled.textColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{button.default.enabled.iconColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "disabled": { + "background": { + "$type": "color", + "$value": "{color.background.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{color.border.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{color.text.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{color.icon.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} } - }, - "borderWidth": { - "$type": "number", - "$value": "{button.xsmall.default.borderWidth}", + } + } + }, + "selected": { + "enabled": { + "background": { + "$type": "color", + "$value": "{button.default.selected.enabled.background}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "scopes": ["FRAME_FILL", "SHAPE_FILL"], "codeSyntax": {} } } }, - "minHeight": { - "$type": "number", - "$value": "{button.xsmall.default.minHeight}", + "borderColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.borderColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], "codeSyntax": {} } } }, - "fontSize": { - "$type": "number", - "$value": "{button.xsmall.default.fontSize}", + "textColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.textColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], + "scopes": ["TEXT_FILL"], "codeSyntax": {} } } }, - "lineHeight": { - "$type": "number", - "$value": "{button.xsmall.default.lineHeight}", + "iconColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.iconColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], "codeSyntax": {} } } }, - "gapX": { + "fontWeight": { "$type": "number", - "$value": "{button.xsmall.default.gapX}", + "$value": "{button.default.enabled.fontWeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FONT_STYLE"], "codeSyntax": {} } } } } }, - "toolbar": { + "xsmall": { "paddingX": { "$type": "number", - "$value": "{element.xsmall.paddingX.default}", + "$value": "{button.default.xsmall.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1667,7 +1590,7 @@ }, "paddingY": { "$type": "number", - "$value": 3, + "$value": "{button.default.xsmall.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1679,7 +1602,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.radius.xsmall}", + "$value": "{button.default.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1691,7 +1614,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.default}", + "$value": "{button.default.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1703,7 +1626,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.xsmall.minHeight}", + "$value": "{button.default.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1715,7 +1638,7 @@ }, "fontSize": { "$type": "number", - "$value": "{element.xsmall.fontSize}", + "$value": "{button.default.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1727,7 +1650,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.xsmall.lineHeight}", + "$value": "{button.default.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1739,7 +1662,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.xsmall.textToIconX}", + "$value": "{button.default.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1752,7 +1675,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": 5, + "$value": "{button.default.xsmall.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1764,7 +1687,7 @@ }, "paddingY": { "$type": "number", - "$value": 3, + "$value": "{button.default.xsmall.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1776,7 +1699,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.xsmall.toolbar.borderRadius}", + "$value": "{button.secondary.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1788,7 +1711,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xsmall.toolbar.borderWidth}", + "$value": "{button.secondary.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1800,7 +1723,19 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xsmall.toolbar.minHeight}", + "$value": "{button.secondary.xsmall.minHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "minWidth": { + "$type": "number", + "$value": "{button.default.xsmall.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1812,7 +1747,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xsmall.toolbar.fontSize}", + "$value": "{button.secondary.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1824,7 +1759,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xsmall.toolbar.lineHeight}", + "$value": "{button.secondary.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1836,7 +1771,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xsmall.toolbar.gapX}", + "$value": "{button.secondary.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1846,14 +1781,35 @@ } } } + }, + "hover": { + "boxShadow": { + "$type": "shadow", + "$value": [ + { + "offsetX": "{base.static.spacing.none}", + "offsetY": "{base.static.spacing.none}", + "blur": "{base.static.spacing.none}", + "spread": "{base.dimension.25}", + "color": "{button.secondary.hover.borderColor}", + "inset": true + } + ], + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + } } - } - }, - "small": { - "default": { + }, + "small": { "paddingX": { "$type": "number", - "$value": "{element.small.paddingX.wide}", + "$value": "{button.default.small.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1865,7 +1821,7 @@ }, "paddingY": { "$type": "number", - "$value": "{element.small.paddingY}", + "$value": "{button.default.small.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1877,7 +1833,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.radius.full}", + "$value": "{button.default.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1889,7 +1845,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.default}", + "$value": "{button.default.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1901,7 +1857,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.small.minHeight}", + "$value": "{button.default.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1913,7 +1869,7 @@ }, "fontSize": { "$type": "number", - "$value": "{element.small.fontSize}", + "$value": "{button.default.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -1925,7 +1881,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.small.lineHeight}", + "$value": "{button.default.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -1937,7 +1893,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.small.textToIconX}", + "$value": "{button.default.small.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -1950,7 +1906,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.small.default.iconOnly.paddingY}", + "$value": "{button.default.small.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -1962,7 +1918,7 @@ }, "paddingY": { "$type": "number", - "$value": 5, + "$value": "{button.default.small.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -1974,7 +1930,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.small.default.borderRadius}", + "$value": "{button.secondary.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -1986,7 +1942,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.small.default.borderWidth}", + "$value": "{button.secondary.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -1998,7 +1954,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.small.default.minHeight}", + "$value": "{button.secondary.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2010,7 +1966,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.small.default.iconOnly.minHeight}", + "$value": "{button.secondary.small.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2022,7 +1978,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.small.default.fontSize}", + "$value": "{button.secondary.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2034,7 +1990,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.small.default.lineHeight}", + "$value": "{button.secondary.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2046,7 +2002,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.small.default.gapX}", + "$value": "{button.secondary.small.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2056,12 +2012,35 @@ } } } + }, + "hover": { + "boxShadow": { + "$type": "shadow", + "$value": [ + { + "offsetX": "{base.static.spacing.none}", + "offsetY": "{base.static.spacing.none}", + "blur": "{base.static.spacing.none}", + "spread": "{base.dimension.25}", + "color": "{button.secondary.hover.borderColor}", + "inset": true + } + ], + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + } } }, - "primary": { + "medium": { "paddingX": { "$type": "number", - "$value": "{button.small.default.paddingX}", + "$value": "{element.medium.paddingX.wide}", "$description": "", "$extensions": { "com.figma": { @@ -2073,7 +2052,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.small.default.paddingY}", + "$value": 4, "$description": "", "$extensions": { "com.figma": { @@ -2085,7 +2064,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.small.default.borderRadius}", + "$value": "{button.default.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2097,7 +2076,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.small.default.borderWidth}", + "$value": "{base.static.borderWidth.small}", "$description": "", "$extensions": { "com.figma": { @@ -2109,7 +2088,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.small.default.minHeight}", + "$value": "{button.default.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2121,7 +2100,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.small.default.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2133,7 +2112,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.small.default.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2145,7 +2124,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.small.default.gapX}", + "$value": "{button.default.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2158,7 +2137,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.small.default.iconOnly.paddingX}", + "$value": "{button.secondary.medium.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -2170,7 +2149,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.small.default.iconOnly.paddingY}", + "$value": 7, "$description": "", "$extensions": { "com.figma": { @@ -2182,7 +2161,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.small.primary.borderRadius}", + "$value": "{button.secondary.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2194,7 +2173,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.small.primary.borderWidth}", + "$value": "{button.secondary.medium.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -2206,7 +2185,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.small.primary.minHeight}", + "$value": "{button.secondary.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2218,7 +2197,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.small.default.iconOnly.minWidth}", + "$value": "{button.secondary.medium.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2230,7 +2209,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.small.primary.fontSize}", + "$value": "{button.secondary.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2242,7 +2221,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.small.primary.lineHeight}", + "$value": "{button.secondary.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2254,7 +2233,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.small.primary.gapX}", + "$value": "{button.secondary.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2264,12 +2243,35 @@ } } } + }, + "hover": { + "boxShadow": { + "$type": "shadow", + "$value": [ + { + "offsetX": "{base.static.spacing.none}", + "offsetY": "{base.static.spacing.none}", + "blur": "{base.static.spacing.none}", + "spread": "{base.dimension.25}", + "color": "{button.secondary.hover.borderColor}", + "inset": true + } + ], + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + } } }, - "secondary": { + "large": { "paddingX": { "$type": "number", - "$value": "{button.small.default.paddingX}", + "$value": "{button.default.large.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -2281,7 +2283,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.small.default.paddingY}", + "$value": 8, "$description": "", "$extensions": { "com.figma": { @@ -2293,7 +2295,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.small.default.borderRadius}", + "$value": "{button.default.large.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2305,7 +2307,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.small.default.borderWidth}", + "$value": "{base.static.borderWidth.small}", "$description": "", "$extensions": { "com.figma": { @@ -2317,7 +2319,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.small.default.minHeight}", + "$value": "{button.default.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2329,7 +2331,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.small.default.fontSize}", + "$value": "{button.default.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2341,7 +2343,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.small.default.lineHeight}", + "$value": "{button.default.large.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2353,7 +2355,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.small.default.gapX}", + "$value": "{button.default.large.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2364,9 +2366,93 @@ } }, "iconOnly": { + "borderRadius": { + "$type": "number", + "$value": "{button.secondary.large.borderRadius}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["CORNER_RADIUS"], + "codeSyntax": {} + } + } + }, + "borderWidth": { + "$type": "number", + "$value": "{button.secondary.large.borderWidth}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "codeSyntax": {} + } + } + }, + "minHeight": { + "$type": "number", + "$value": "{button.secondary.large.minHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "minWidth": { + "$type": "number", + "$value": "{button.secondary.large.iconOnly.minHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["WIDTH_HEIGHT"], + "codeSyntax": {} + } + } + }, + "fontSize": { + "$type": "number", + "$value": "{button.secondary.large.fontSize}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_SIZE"], + "codeSyntax": {} + } + } + }, + "lineHeight": { + "$type": "number", + "$value": "{button.secondary.large.lineHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["LINE_HEIGHT"], + "codeSyntax": {} + } + } + }, + "gapX": { + "$type": "number", + "$value": "{button.secondary.large.gapX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} + } + } + }, "paddingX": { "$type": "number", - "$value": "{button.small.default.iconOnly.paddingX}", + "$value": "{button.default.large.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -2378,7 +2464,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.small.default.iconOnly.paddingY}", + "$value": "{button.default.large.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -2387,10 +2473,37 @@ "codeSyntax": {} } } - }, + } + }, + "hover": { + "boxShadow": { + "$type": "shadow", + "$value": [ + { + "offsetX": "{base.static.spacing.none}", + "offsetY": "{base.static.spacing.none}", + "blur": "{base.static.spacing.none}", + "spread": "{base.dimension.25}", + "color": "{button.secondary.hover.borderColor}", + "inset": true + } + ], + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + } + } + }, + "xlarge": { + "iconOnly": { "borderRadius": { "$type": "number", - "$value": "{button.small.secondary.borderRadius}", + "$value": "{button.secondary.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2402,7 +2515,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.small.secondary.borderWidth}", + "$value": "{button.secondary.xlarge.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -2414,7 +2527,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.small.secondary.minHeight}", + "$value": "{button.secondary.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2426,19 +2539,19 @@ }, "minWidth": { "$type": "number", - "$value": "{button.small.default.iconOnly.minWidth}", + "$value": "{button.secondary.xlarge.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, "fontSize": { "$type": "number", - "$value": "{button.small.secondary.fontSize}", + "$value": "{button.secondary.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2450,7 +2563,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.small.secondary.lineHeight}", + "$value": "{button.secondary.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2462,7 +2575,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.small.secondary.gapX}", + "$value": "{button.secondary.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2471,36 +2584,35 @@ "codeSyntax": {} } } - } - }, - "hover": { - "boxShadow": { - "$type": "shadow", - "$value": [ - { - "offsetX": "{base.static.spacing.none}", - "offsetY": "{base.static.spacing.none}", - "blur": "{base.static.spacing.none}", - "spread": "{base.dimension.25}", - "color": "{button.secondary.hover.borderColor}", - "inset": true + }, + "paddingX": { + "$type": "number", + "$value": "{button.default.xlarge.iconOnly.paddingX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} } - ], + } + }, + "paddingY": { + "$type": "number", + "$value": "{button.default.xlarge.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["GAP"], "codeSyntax": {} } } } - } - }, - "toolbar": { + }, "paddingX": { "$type": "number", - "$value": "{element.small.paddingX.default}", + "$value": "{button.default.xlarge.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -2512,7 +2624,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.small.default.paddingY}", + "$value": 19, "$description": "", "$extensions": { "com.figma": { @@ -2524,7 +2636,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.radius.xsmall}", + "$value": "{button.default.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2536,7 +2648,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.default}", + "$value": "{base.static.borderWidth.small}", "$description": "", "$extensions": { "com.figma": { @@ -2548,7 +2660,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.small.minHeight}", + "$value": "{button.default.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2560,7 +2672,7 @@ }, "fontSize": { "$type": "number", - "$value": "{element.small.fontSize}", + "$value": "{button.default.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2572,7 +2684,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.small.lineHeight}", + "$value": "{button.default.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2584,7 +2696,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.xsmall.textToIconX}", + "$value": "{button.default.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2594,123 +2706,286 @@ } } }, - "iconOnly": { - "paddingX": { - "$type": "number", - "$value": 5, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} + "hover": { + "boxShadow": { + "$type": "shadow", + "$value": [ + { + "offsetX": "{base.static.spacing.none}", + "offsetY": "{base.static.spacing.none}", + "blur": "{base.static.spacing.none}", + "spread": "{base.dimension.25}", + "color": "{button.secondary.hover.borderColor}", + "inset": true } - } - }, - "paddingY": { - "$type": "number", - "$value": 5, + ], "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["ALL_SCOPES"], "codeSyntax": {} } } - }, - "borderRadius": { - "$type": "number", - "$value": "{button.small.toolbar.borderRadius}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } + } + } + } + }, + "default": { + "enabled": { + "background": { + "$type": "color", + "$value": "{color.transparent}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{color.transparent}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{color.text.strong}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{color.icon.strong}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{fontWeight.semibold}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "disabled": { + "background": { + "$type": "color", + "$value": "{button.default.enabled.background}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{button.default.enabled.borderColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{color.text.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{color.icon.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "hover": { + "background": { + "$type": "color", + "$value": "{color.background.hover}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{button.default.enabled.borderColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{button.default.enabled.textColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{button.default.enabled.iconColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} } - }, - "borderWidth": { - "$type": "number", - "$value": "{button.small.toolbar.borderWidth}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} } - }, - "minHeight": { - "$type": "number", - "$value": "{button.small.toolbar.minHeight}", + } + } + }, + "selected": { + "enabled": { + "background": { + "$type": "color", + "$value": "{color.background.active}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["FRAME_FILL", "SHAPE_FILL"], "codeSyntax": {} } } }, - "minWidth": { - "$type": "number", - "$value": "{button.small.default.iconOnly.minHeight}", + "borderColor": { + "$type": "color", + "$value": "{color.transparent}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], "codeSyntax": {} } } }, - "fontSize": { - "$type": "number", - "$value": "{button.small.toolbar.fontSize}", + "textColor": { + "$type": "color", + "$value": "{button.default.enabled.textColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], + "scopes": ["TEXT_FILL"], "codeSyntax": {} } } }, - "lineHeight": { - "$type": "number", - "$value": "{button.small.toolbar.lineHeight}", + "iconColor": { + "$type": "color", + "$value": "{button.default.enabled.iconColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], "codeSyntax": {} } } }, - "gapX": { + "fontWeight": { "$type": "number", - "$value": "{button.small.toolbar.gapX}", + "$value": "{button.default.enabled.fontWeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FONT_STYLE"], "codeSyntax": {} } } } } - } - }, - "medium": { - "default": { + }, + "xsmall": { "paddingX": { "$type": "number", - "$value": "{element.medium.paddingX.wide}", + "$value": 12, "$description": "", "$extensions": { "com.figma": { @@ -2722,7 +2997,7 @@ }, "paddingY": { "$type": "number", - "$value": "{element.medium.paddingY}", + "$value": 3, "$description": "", "$extensions": { "com.figma": { @@ -2746,7 +3021,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.default}", + "$value": "{element.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -2758,7 +3033,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.medium.minHeight}", + "$value": "{element.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2770,7 +3045,7 @@ }, "fontSize": { "$type": "number", - "$value": "{base.dimension.475}", + "$value": "{element.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2782,7 +3057,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.medium.lineHeight}", + "$value": "{element.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2794,7 +3069,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.medium.textToIconX}", + "$value": "{element.xsmall.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -2807,7 +3082,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.medium.default.iconOnly.paddingY}", + "$value": "{button.default.xsmall.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -2819,7 +3094,7 @@ }, "paddingY": { "$type": "number", - "$value": 8, + "$value": 3, "$description": "", "$extensions": { "com.figma": { @@ -2831,7 +3106,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.medium.default.borderRadius}", + "$value": "{button.default.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -2843,7 +3118,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.medium.default.borderWidth}", + "$value": "{button.default.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -2855,7 +3130,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.default.minHeight}", + "$value": "{button.default.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2867,19 +3142,19 @@ }, "minWidth": { "$type": "number", - "$value": "{button.medium.default.iconOnly.minHeight}", + "$value": "{button.default.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{button.default.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2891,7 +3166,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{button.default.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2903,7 +3178,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.default.gapX}", + "$value": "{button.default.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -2915,10 +3190,10 @@ } } }, - "primary": { + "small": { "paddingX": { "$type": "number", - "$value": "{button.medium.default.paddingX}", + "$value": "{element.small.paddingX.wide}", "$description": "", "$extensions": { "com.figma": { @@ -2930,7 +3205,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.medium.default.paddingY}", + "$value": "{element.small.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -2942,7 +3217,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.medium.default.borderRadius}", + "$value": "{base.static.radius.full}", "$description": "", "$extensions": { "com.figma": { @@ -2954,7 +3229,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.medium.default.borderWidth}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -2966,7 +3241,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.default.minHeight}", + "$value": "{element.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -2978,7 +3253,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{element.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -2990,7 +3265,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{element.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3002,7 +3277,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.default.gapX}", + "$value": "{element.small.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -3015,7 +3290,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.medium.default.iconOnly.paddingX}", + "$value": "{button.default.small.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3027,7 +3302,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.medium.default.iconOnly.paddingY}", + "$value": 5, "$description": "", "$extensions": { "com.figma": { @@ -3039,7 +3314,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.medium.primary.borderRadius}", + "$value": "{button.default.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -3051,7 +3326,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.medium.primary.borderWidth}", + "$value": "{button.default.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -3063,7 +3338,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.primary.minHeight}", + "$value": "{button.default.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3075,7 +3350,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.medium.default.iconOnly.minWidth}", + "$value": "{button.default.small.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3087,7 +3362,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.primary.fontSize}", + "$value": "{button.default.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3099,7 +3374,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.primary.lineHeight}", + "$value": "{button.default.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3111,7 +3386,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.primary.gapX}", + "$value": "{button.default.small.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -3123,7 +3398,7 @@ } } }, - "secondary": { + "medium": { "paddingX": { "$type": "number", "$value": "{element.medium.paddingX.wide}", @@ -3138,7 +3413,7 @@ }, "paddingY": { "$type": "number", - "$value": 4, + "$value": "{element.medium.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3150,7 +3425,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.medium.default.borderRadius}", + "$value": "{base.static.radius.full}", "$description": "", "$extensions": { "com.figma": { @@ -3162,7 +3437,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.small}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -3174,7 +3449,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.default.minHeight}", + "$value": "{element.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3186,7 +3461,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{base.dimension.475}", "$description": "", "$extensions": { "com.figma": { @@ -3198,7 +3473,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{element.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3210,7 +3485,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.default.gapX}", + "$value": "{element.medium.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -3223,7 +3498,7 @@ "iconOnly": { "paddingX": { "$type": "number", - "$value": "{button.medium.secondary.iconOnly.paddingY}", + "$value": "{button.default.medium.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3235,7 +3510,7 @@ }, "paddingY": { "$type": "number", - "$value": 7, + "$value": 8, "$description": "", "$extensions": { "com.figma": { @@ -3247,7 +3522,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.medium.secondary.borderRadius}", + "$value": "{button.default.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -3259,7 +3534,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.medium.secondary.borderWidth}", + "$value": "{button.default.medium.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -3271,7 +3546,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.secondary.minHeight}", + "$value": "{button.default.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3283,7 +3558,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.medium.default.iconOnly.minWidth}", + "$value": "{button.default.medium.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3295,7 +3570,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.secondary.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3307,7 +3582,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.secondary.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3319,7 +3594,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.secondary.gapX}", + "$value": "{button.default.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -3329,35 +3604,12 @@ } } } - }, - "hover": { - "boxShadow": { - "$type": "shadow", - "$value": [ - { - "offsetX": "{base.static.spacing.none}", - "offsetY": "{base.static.spacing.none}", - "blur": "{base.static.spacing.none}", - "spread": "{base.dimension.25}", - "color": "{button.secondary.hover.borderColor}", - "inset": true - } - ], - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], - "codeSyntax": {} - } - } - } } }, - "toolbar": { + "large": { "paddingX": { "$type": "number", - "$value": "{element.medium.paddingX.default}", + "$value": "{element.large.paddingX.wide}", "$description": "", "$extensions": { "com.figma": { @@ -3369,7 +3621,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.medium.default.paddingY}", + "$value": "{element.large.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3381,7 +3633,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.spacing.xsmall}", + "$value": "{base.static.radius.full}", "$description": "", "$extensions": { "com.figma": { @@ -3393,7 +3645,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{borderWidth.default}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -3405,7 +3657,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.default.minHeight}", + "$value": "{element.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3417,7 +3669,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{element.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3429,7 +3681,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{element.large.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3441,7 +3693,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.medium.default.gapX}", + "$value": "{element.large.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -3452,33 +3704,9 @@ } }, "iconOnly": { - "paddingX": { - "$type": "number", - "$value": "{button.medium.default.iconOnly.paddingX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "paddingY": { - "$type": "number", - "$value": "{button.medium.default.iconOnly.paddingY}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, "borderRadius": { "$type": "number", - "$value": "{button.medium.toolbar.borderRadius}", + "$value": "{button.default.large.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -3490,7 +3718,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.medium.toolbar.borderWidth}", + "$value": "{button.default.large.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -3502,7 +3730,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.toolbar.minHeight}", + "$value": "{button.default.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3514,19 +3742,19 @@ }, "minWidth": { "$type": "number", - "$value": "{button.medium.default.iconOnly.minWidth}", + "$value": "{button.default.large.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, "fontSize": { "$type": "number", - "$value": "{button.medium.toolbar.fontSize}", + "$value": "{button.default.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3538,133 +3766,59 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.toolbar.lineHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], - "codeSyntax": {} - } - } - }, - "gapX": { - "$type": "number", - "$value": "{button.medium.toolbar.gapX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - } - } - } - }, - "large": { - "default": { - "paddingX": { - "$type": "number", - "$value": "{element.large.paddingX.wide}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "paddingY": { - "$type": "number", - "$value": "{element.large.paddingY}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "borderRadius": { - "$type": "number", - "$value": "{base.static.radius.xlarge}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } - } - }, - "borderWidth": { - "$type": "number", - "$value": "{base.static.borderWidth.default}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } - } - }, - "minHeight": { - "$type": "number", - "$value": "{element.large.minHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "fontSize": { - "$type": "number", - "$value": "{element.large.fontSize}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], - "codeSyntax": {} + "$value": "{button.default.large.lineHeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["LINE_HEIGHT"], + "codeSyntax": {} + } } - } - }, - "lineHeight": { - "$type": "number", - "$value": "{element.large.lineHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], - "codeSyntax": {} + }, + "gapX": { + "$type": "number", + "$value": "{button.default.large.gapX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} + } } - } - }, - "gapX": { - "$type": "number", - "$value": "{element.large.textToIconX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} + }, + "paddingX": { + "$type": "number", + "$value": "{button.default.large.iconOnly.paddingY}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} + } + } + }, + "paddingY": { + "$type": "number", + "$value": 12, + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} + } } } - }, + } + }, + "xlarge": { "iconOnly": { "borderRadius": { "$type": "number", - "$value": "{button.large.default.borderRadius}", + "$value": "{button.default.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -3676,7 +3830,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.large.default.borderWidth}", + "$value": "{button.default.xlarge.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -3688,7 +3842,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.large.default.minHeight}", + "$value": "{button.default.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3700,7 +3854,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.large.default.iconOnly.minHeight}", + "$value": "{button.default.xlarge.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3712,7 +3866,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.large.default.fontSize}", + "$value": "{button.default.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3724,7 +3878,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.large.default.lineHeight}", + "$value": "{button.default.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3736,7 +3890,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.large.default.gapX}", + "$value": "{button.default.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -3748,7 +3902,7 @@ }, "paddingX": { "$type": "number", - "$value": "{button.large.default.iconOnly.paddingY}", + "$value": "{button.default.xlarge.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3760,7 +3914,7 @@ }, "paddingY": { "$type": "number", - "$value": 12, + "$value": 23, "$description": "", "$extensions": { "com.figma": { @@ -3770,12 +3924,10 @@ } } } - } - }, - "primary": { + }, "paddingX": { "$type": "number", - "$value": "{button.large.default.paddingX}", + "$value": "{element.xlarge.paddingX.wide}", "$description": "", "$extensions": { "com.figma": { @@ -3787,7 +3939,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.large.default.paddingY}", + "$value": "{element.xlarge.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -3799,7 +3951,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.large.default.borderRadius}", + "$value": "{base.static.radius.full}", "$description": "", "$extensions": { "com.figma": { @@ -3811,7 +3963,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.large.default.borderWidth}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -3823,7 +3975,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.large.default.minHeight}", + "$value": "{element.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3835,7 +3987,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.large.default.fontSize}", + "$value": "{element.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -3847,7 +3999,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.large.default.lineHeight}", + "$value": "{element.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -3859,7 +4011,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.large.default.gapX}", + "$value": "{element.xlarge.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -3868,122 +4020,264 @@ "codeSyntax": {} } } + } + } + }, + "toolbar": { + "enabled": { + "background": { + "$type": "color", + "$value": "{color.transparent}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } }, - "iconOnly": { - "borderRadius": { - "$type": "number", - "$value": "{button.large.primary.borderRadius}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } + "borderColor": { + "$type": "color", + "$value": "{color.border.default}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} } - }, - "borderWidth": { - "$type": "number", - "$value": "{button.large.primary.borderWidth}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } + } + }, + "textColor": { + "$type": "color", + "$value": "{button.default.enabled.textColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{button.default.enabled.iconColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "disabled": { + "background": { + "$type": "color", + "$value": "{color.background.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{color.border.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{color.text.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} + } + } + }, + "iconColor": { + "$type": "color", + "$value": "{color.icon.disabled}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} + } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} + } + } + } + }, + "hover": { + "background": { + "$type": "color", + "$value": "{color.background.hover}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "codeSyntax": {} + } + } + }, + "borderColor": { + "$type": "color", + "$value": "{button.toolbar.enabled.borderColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], + "codeSyntax": {} + } + } + }, + "textColor": { + "$type": "color", + "$value": "{button.toolbar.enabled.textColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["TEXT_FILL"], + "codeSyntax": {} } - }, - "minHeight": { - "$type": "number", - "$value": "{button.large.primary.minHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } + } + }, + "iconColor": { + "$type": "color", + "$value": "{button.toolbar.enabled.iconColor}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], + "codeSyntax": {} } - }, - "minWidth": { - "$type": "number", - "$value": "{button.large.default.iconOnly.minWidth}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } + } + }, + "fontWeight": { + "$type": "number", + "$value": "{button.default.enabled.fontWeight}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["FONT_STYLE"], + "codeSyntax": {} } - }, - "fontSize": { - "$type": "number", - "$value": "{button.large.primary.fontSize}", + } + } + }, + "selected": { + "enabled": { + "background": { + "$type": "color", + "$value": "{button.default.selected.enabled.background}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], + "scopes": ["FRAME_FILL", "SHAPE_FILL"], "codeSyntax": {} } } }, - "lineHeight": { - "$type": "number", - "$value": "{button.large.primary.lineHeight}", + "borderColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.borderColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], "codeSyntax": {} } } }, - "gapX": { - "$type": "number", - "$value": "{button.large.primary.gapX}", + "textColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.textColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["TEXT_FILL"], "codeSyntax": {} } } }, - "paddingX": { - "$type": "number", - "$value": "{button.large.default.iconOnly.paddingX}", + "iconColor": { + "$type": "color", + "$value": "{button.default.selected.enabled.iconColor}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FRAME_FILL", "SHAPE_FILL", "STROKE_COLOR"], "codeSyntax": {} } } }, - "paddingY": { + "fontWeight": { "$type": "number", - "$value": "{button.large.default.iconOnly.paddingY}", + "$value": "{button.default.enabled.fontWeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FONT_STYLE"], "codeSyntax": {} } } } } }, - "secondary": { + "xsmall": { "paddingX": { "$type": "number", - "$value": "{button.large.default.paddingX}", + "$value": "{element.xsmall.paddingX.default}", "$description": "", "$extensions": { "com.figma": { @@ -3995,7 +4289,7 @@ }, "paddingY": { "$type": "number", - "$value": 8, + "$value": 3, "$description": "", "$extensions": { "com.figma": { @@ -4007,7 +4301,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.large.default.borderRadius}", + "$value": "{base.static.radius.xsmall}", "$description": "", "$extensions": { "com.figma": { @@ -4019,7 +4313,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.small}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -4031,7 +4325,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.large.default.minHeight}", + "$value": "{element.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4043,7 +4337,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.large.default.fontSize}", + "$value": "{element.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4055,7 +4349,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.large.default.lineHeight}", + "$value": "{element.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4065,118 +4359,106 @@ } } }, - "gapX": { - "$type": "number", - "$value": "{button.large.default.gapX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, "iconOnly": { - "borderRadius": { + "paddingX": { "$type": "number", - "$value": "{button.large.secondary.borderRadius}", + "$value": 5, "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "borderWidth": { + "paddingY": { "$type": "number", - "$value": "{button.large.secondary.borderWidth}", + "$value": 3, "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "minHeight": { + "borderRadius": { "$type": "number", - "$value": "{button.large.secondary.minHeight}", + "$value": "{button.toolbar.xsmall.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } }, - "minWidth": { + "borderWidth": { "$type": "number", - "$value": "{button.large.default.iconOnly.minWidth}", + "$value": "{button.toolbar.xsmall.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "fontSize": { + "minHeight": { "$type": "number", - "$value": "{button.large.secondary.fontSize}", + "$value": "{button.toolbar.xsmall.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "lineHeight": { + "minWidth": { "$type": "number", - "$value": "{button.large.secondary.lineHeight}", + "$value": "{button.default.xsmall.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "gapX": { + "fontSize": { "$type": "number", - "$value": "{button.large.secondary.gapX}", + "$value": "{button.toolbar.xsmall.fontSize}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FONT_SIZE"], "codeSyntax": {} } } }, - "paddingX": { + "lineHeight": { "$type": "number", - "$value": "{button.large.default.iconOnly.paddingX}", + "$value": "{button.toolbar.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["LINE_HEIGHT"], "codeSyntax": {} } } }, - "paddingY": { + "gapX": { "$type": "number", - "$value": "{button.large.default.iconOnly.paddingY}", + "$value": "{button.toolbar.xsmall.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4187,34 +4469,23 @@ } } }, - "hover": { - "boxShadow": { - "$type": "shadow", - "$value": [ - { - "offsetX": "{base.static.spacing.none}", - "offsetY": "{base.static.spacing.none}", - "blur": "{base.static.spacing.none}", - "spread": "{base.dimension.25}", - "color": "{button.secondary.hover.borderColor}", - "inset": true - } - ], - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], - "codeSyntax": {} - } + "gapX": { + "$type": "number", + "$value": "{element.xsmall.textToIconX}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["GAP"], + "codeSyntax": {} } } } }, - "toolbar": { + "small": { "paddingX": { "$type": "number", - "$value": "{base.dimension.250}", + "$value": "{element.small.paddingX.default}", "$description": "", "$extensions": { "com.figma": { @@ -4226,7 +4497,7 @@ }, "paddingY": { "$type": "number", - "$value": 9, + "$value": "{button.default.small.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -4250,7 +4521,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{borderWidth.default}", + "$value": "{base.static.borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -4262,7 +4533,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.large.default.minHeight}", + "$value": "{element.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4274,7 +4545,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.large.default.fontSize}", + "$value": "{element.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4286,7 +4557,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.large.default.lineHeight}", + "$value": "{element.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4298,7 +4569,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.large.default.gapX}", + "$value": "{element.xsmall.textToIconX}", "$description": "", "$extensions": { "com.figma": { @@ -4306,96 +4577,12 @@ "scopes": ["GAP"], "codeSyntax": {} } - } - }, - "iconOnly": { - "borderRadius": { - "$type": "number", - "$value": "{button.large.toolbar.borderRadius}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } - } - }, - "borderWidth": { - "$type": "number", - "$value": "{button.large.toolbar.borderWidth}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } - } - }, - "minHeight": { - "$type": "number", - "$value": "{button.large.toolbar.minHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "minWidth": { - "$type": "number", - "$value": "{button.large.default.iconOnly.minWidth}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "fontSize": { - "$type": "number", - "$value": "{button.large.toolbar.fontSize}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], - "codeSyntax": {} - } - } - }, - "lineHeight": { - "$type": "number", - "$value": "{button.large.toolbar.lineHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], - "codeSyntax": {} - } - } - }, - "gapX": { - "$type": "number", - "$value": "{button.large.toolbar.gapX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, + } + }, + "iconOnly": { "paddingX": { "$type": "number", - "$value": 14, + "$value": 5, "$description": "", "$extensions": { "com.figma": { @@ -4407,7 +4594,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.large.default.iconOnly.paddingY}", + "$value": 5, "$description": "", "$extensions": { "com.figma": { @@ -4416,16 +4603,10 @@ "codeSyntax": {} } } - } - } - } - }, - "xlarge": { - "default": { - "iconOnly": { + }, "borderRadius": { "$type": "number", - "$value": "{button.xlarge.default.borderRadius}", + "$value": "{button.toolbar.small.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -4437,7 +4618,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xlarge.default.borderWidth}", + "$value": "{button.toolbar.small.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -4449,7 +4630,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xlarge.default.minHeight}", + "$value": "{button.toolbar.small.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4461,19 +4642,19 @@ }, "minWidth": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.minHeight}", + "$value": "{button.default.small.iconOnly.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["ALL_SCOPES"], "codeSyntax": {} } } }, "fontSize": { "$type": "number", - "$value": "{button.xlarge.default.fontSize}", + "$value": "{button.toolbar.small.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4485,7 +4666,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xlarge.default.lineHeight}", + "$value": "{button.toolbar.small.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4497,31 +4678,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xlarge.default.gapX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "paddingX": { - "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingY}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "paddingY": { - "$type": "number", - "$value": 23, + "$value": "{button.toolbar.small.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4531,10 +4688,12 @@ } } } - }, + } + }, + "medium": { "paddingX": { "$type": "number", - "$value": "{element.xlarge.paddingX.wide}", + "$value": "{element.medium.paddingX.default}", "$description": "", "$extensions": { "com.figma": { @@ -4546,7 +4705,7 @@ }, "paddingY": { "$type": "number", - "$value": "{element.xlarge.paddingY}", + "$value": "{button.default.medium.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -4558,7 +4717,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{base.static.radius.full}", + "$value": "{base.static.spacing.xsmall}", "$description": "", "$extensions": { "com.figma": { @@ -4570,7 +4729,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{base.static.borderWidth.default}", + "$value": "{borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -4582,7 +4741,7 @@ }, "minHeight": { "$type": "number", - "$value": "{element.xlarge.minHeight}", + "$value": "{button.default.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4594,7 +4753,7 @@ }, "fontSize": { "$type": "number", - "$value": "{element.xlarge.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4606,7 +4765,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{element.xlarge.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4618,7 +4777,7 @@ }, "gapX": { "$type": "number", - "$value": "{element.xlarge.textToIconX}", + "$value": "{button.default.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4627,109 +4786,107 @@ "codeSyntax": {} } } - } - }, - "primary": { + }, "iconOnly": { - "borderRadius": { + "paddingX": { "$type": "number", - "$value": "{button.xlarge.primary.borderRadius}", + "$value": "{button.default.medium.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "borderWidth": { + "paddingY": { "$type": "number", - "$value": "{button.xlarge.primary.borderWidth}", + "$value": "{button.default.medium.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], + "scopes": ["GAP"], "codeSyntax": {} } } }, - "minHeight": { + "borderRadius": { "$type": "number", - "$value": "{button.xlarge.primary.minHeight}", + "$value": "{button.toolbar.medium.borderRadius}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["CORNER_RADIUS"], "codeSyntax": {} } } }, - "minWidth": { + "borderWidth": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.minWidth}", + "$value": "{button.toolbar.medium.borderWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], + "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], "codeSyntax": {} } } }, - "fontSize": { + "minHeight": { "$type": "number", - "$value": "{button.xlarge.primary.fontSize}", + "$value": "{button.toolbar.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], + "scopes": ["WIDTH_HEIGHT"], "codeSyntax": {} } } }, - "lineHeight": { + "minWidth": { "$type": "number", - "$value": "{button.xlarge.primary.lineHeight}", + "$value": "{button.default.medium.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], + "scopes": ["ALL_SCOPES"], "codeSyntax": {} } } }, - "gapX": { + "fontSize": { "$type": "number", - "$value": "{button.xlarge.primary.gapX}", + "$value": "{button.toolbar.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["FONT_SIZE"], "codeSyntax": {} } } }, - "paddingX": { + "lineHeight": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingX}", + "$value": "{button.toolbar.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["GAP"], + "scopes": ["LINE_HEIGHT"], "codeSyntax": {} } } }, - "paddingY": { + "gapX": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingY}", + "$value": "{button.toolbar.medium.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4739,10 +4896,12 @@ } } } - }, + } + }, + "large": { "paddingX": { "$type": "number", - "$value": "{button.xlarge.default.paddingX}", + "$value": "{base.dimension.250}", "$description": "", "$extensions": { "com.figma": { @@ -4754,7 +4913,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xlarge.default.paddingY}", + "$value": 9, "$description": "", "$extensions": { "com.figma": { @@ -4766,7 +4925,7 @@ }, "borderRadius": { "$type": "number", - "$value": "{button.xlarge.default.borderRadius}", + "$value": "{base.static.radius.xsmall}", "$description": "", "$extensions": { "com.figma": { @@ -4778,7 +4937,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xlarge.default.borderWidth}", + "$value": "{borderWidth.default}", "$description": "", "$extensions": { "com.figma": { @@ -4790,7 +4949,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xlarge.default.minHeight}", + "$value": "{button.default.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4802,7 +4961,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xlarge.default.fontSize}", + "$value": "{button.default.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4814,7 +4973,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xlarge.default.lineHeight}", + "$value": "{button.default.large.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4826,7 +4985,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xlarge.default.gapX}", + "$value": "{button.default.large.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4835,13 +4994,11 @@ "codeSyntax": {} } } - } - }, - "secondary": { + }, "iconOnly": { "borderRadius": { "$type": "number", - "$value": "{button.xlarge.secondary.borderRadius}", + "$value": "{button.toolbar.large.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -4853,7 +5010,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xlarge.secondary.borderWidth}", + "$value": "{button.toolbar.large.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -4865,7 +5022,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xlarge.secondary.minHeight}", + "$value": "{button.toolbar.large.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4877,7 +5034,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.minWidth}", + "$value": "{button.default.large.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { @@ -4889,7 +5046,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xlarge.secondary.fontSize}", + "$value": "{button.toolbar.large.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -4901,7 +5058,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xlarge.secondary.lineHeight}", + "$value": "{button.toolbar.large.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -4913,7 +5070,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xlarge.secondary.gapX}", + "$value": "{button.toolbar.large.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -4925,7 +5082,7 @@ }, "paddingX": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingX}", + "$value": 14, "$description": "", "$extensions": { "com.figma": { @@ -4937,7 +5094,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingY}", + "$value": "{button.default.large.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -4947,132 +5104,13 @@ } } } - }, - "paddingX": { - "$type": "number", - "$value": "{button.xlarge.default.paddingX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "paddingY": { - "$type": "number", - "$value": 19, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "borderRadius": { - "$type": "number", - "$value": "{button.xlarge.default.borderRadius}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } - } - }, - "borderWidth": { - "$type": "number", - "$value": "{base.static.borderWidth.small}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } - } - }, - "minHeight": { - "$type": "number", - "$value": "{button.xlarge.default.minHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "fontSize": { - "$type": "number", - "$value": "{button.xlarge.default.fontSize}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["FONT_SIZE"], - "codeSyntax": {} - } - } - }, - "lineHeight": { - "$type": "number", - "$value": "{button.xlarge.default.lineHeight}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["LINE_HEIGHT"], - "codeSyntax": {} - } - } - }, - "gapX": { - "$type": "number", - "$value": "{button.xlarge.default.gapX}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["GAP"], - "codeSyntax": {} - } - } - }, - "hover": { - "boxShadow": { - "$type": "shadow", - "$value": [ - { - "offsetX": "{base.static.spacing.none}", - "offsetY": "{base.static.spacing.none}", - "blur": "{base.static.spacing.none}", - "spread": "{base.dimension.25}", - "color": "{button.secondary.hover.borderColor}", - "inset": true - } - ], - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], - "codeSyntax": {} - } - } - } } }, - "toolbar": { + "xlarge": { "iconOnly": { "borderRadius": { "$type": "number", - "$value": "{button.xlarge.toolbar.borderRadius}", + "$value": "{button.toolbar.xlarge.borderRadius}", "$description": "", "$extensions": { "com.figma": { @@ -5084,7 +5122,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xlarge.toolbar.borderWidth}", + "$value": "{button.toolbar.xlarge.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -5096,7 +5134,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xlarge.toolbar.minHeight}", + "$value": "{button.toolbar.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5108,7 +5146,7 @@ }, "minWidth": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.minWidth}", + "$value": "{button.default.xlarge.iconOnly.minWidth}", "$description": "", "$extensions": { "com.figma": { @@ -5120,7 +5158,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xlarge.toolbar.fontSize}", + "$value": "{button.toolbar.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -5132,7 +5170,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xlarge.toolbar.lineHeight}", + "$value": "{button.toolbar.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5144,7 +5182,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xlarge.toolbar.gapX}", + "$value": "{button.toolbar.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -5156,7 +5194,7 @@ }, "paddingX": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingX}", + "$value": "{button.default.xlarge.iconOnly.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -5168,7 +5206,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xlarge.default.iconOnly.paddingY}", + "$value": "{button.default.xlarge.iconOnly.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -5181,7 +5219,7 @@ }, "paddingX": { "$type": "number", - "$value": "{button.xlarge.default.paddingX}", + "$value": "{button.default.xlarge.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -5193,7 +5231,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.xlarge.default.paddingY}", + "$value": "{button.default.xlarge.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -5217,7 +5255,7 @@ }, "borderWidth": { "$type": "number", - "$value": "{button.xlarge.default.borderWidth}", + "$value": "{button.default.xlarge.borderWidth}", "$description": "", "$extensions": { "com.figma": { @@ -5229,7 +5267,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.xlarge.default.minHeight}", + "$value": "{button.default.xlarge.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5241,7 +5279,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.xlarge.default.fontSize}", + "$value": "{button.default.xlarge.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -5253,7 +5291,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.xlarge.default.lineHeight}", + "$value": "{button.default.xlarge.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5265,7 +5303,7 @@ }, "gapX": { "$type": "number", - "$value": "{button.xlarge.default.gapX}", + "$value": "{button.default.xlarge.gapX}", "$description": "", "$extensions": { "com.figma": { @@ -5537,7 +5575,7 @@ "item": { "paddingX": { "$type": "number", - "$value": "{button.medium.default.paddingX}", + "$value": "{button.default.medium.paddingX}", "$description": "", "$extensions": { "com.figma": { @@ -5549,7 +5587,7 @@ }, "paddingY": { "$type": "number", - "$value": "{button.medium.default.paddingY}", + "$value": "{button.default.medium.paddingY}", "$description": "", "$extensions": { "com.figma": { @@ -5585,7 +5623,7 @@ }, "minHeight": { "$type": "number", - "$value": "{button.medium.default.minHeight}", + "$value": "{button.default.medium.minHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5597,7 +5635,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -5609,7 +5647,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -5729,7 +5767,7 @@ }, "fontSize": { "$type": "number", - "$value": "{button.medium.default.fontSize}", + "$value": "{button.default.medium.fontSize}", "$description": "", "$extensions": { "com.figma": { @@ -5741,7 +5779,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{button.medium.default.lineHeight}", + "$value": "{button.default.medium.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -6798,54 +6836,6 @@ } } }, - "width": { - "$type": "number", - "$value": 48, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "height": { - "$type": "number", - "$value": 24, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["WIDTH_HEIGHT"], - "codeSyntax": {} - } - } - }, - "borderRadius": { - "$type": "number", - "$value": 9999, - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["CORNER_RADIUS"], - "codeSyntax": {} - } - } - }, - "borderWidth": { - "$type": "number", - "$value": "{borderWidth.default}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["STROKE_FLOAT", "EFFECT_FLOAT"], - "codeSyntax": {} - } - } - }, "label": { "fontSize": { "$type": "number", @@ -8193,7 +8183,7 @@ }, "lineHeight": { "$type": "number", - "$value": "{heading.xsmall.lineHeight}", + "$value": "{text.xsmall.lineHeight}", "$description": "", "$extensions": { "com.figma": { @@ -9558,7 +9548,7 @@ "pinned": { "textColor": { "$type": "color", - "$value": "{dataCell.enabled.iconColor}", + "$value": "{dataCell.enabled.textColor}", "$description": "", "$extensions": { "com.figma": { @@ -9809,7 +9799,7 @@ "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["FRAME_FILL", "SHAPE_FILL"], + "scopes": ["STROKE_COLOR", "EFFECT_COLOR"], "codeSyntax": {} } } diff --git a/design-tokens/tokens/semantic/color.dark.json b/design-tokens/tokens/semantic/color.dark.json index cd7158cc2..56759adb7 100644 --- a/design-tokens/tokens/semantic/color.dark.json +++ b/design-tokens/tokens/semantic/color.dark.json @@ -483,29 +483,29 @@ } } }, - "onStrong": { + "heading": { "default": { "$type": "color", - "$value": "{base.color.grey.1200}", + "$value": "{color.text.strong}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["ALL_SCOPES"], "codeSyntax": {} } } } }, - "heading": { + "onStrong": { "default": { "$type": "color", - "$value": "{color.text.strong}", + "$value": "{base.color.grey.1200}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["TEXT_FILL"], "codeSyntax": {} } } @@ -909,6 +909,18 @@ } }, "decorative": { + "brand": { + "$type": "color", + "$value": "#ffffff", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + }, "green": { "$type": "color", "$value": "{base.color.green.700}", @@ -1251,44 +1263,6 @@ } } } - }, - "shadow": { - "weak": { - "$type": "color", - "$value": "{base.color.black.opacity12}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "default": { - "$type": "color", - "$value": "{base.color.black.opacity36}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "strong": { - "$type": "color", - "$value": "{base.color.black.opacity50}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - } } }, "shadow": { @@ -1300,7 +1274,7 @@ "offsetY": "{base.dimension.100}", "blur": "{base.dimension.100}", "spread": 0, - "color": "{color.shadow.weak}" + "color": "{base.color.black.opacity12}" } ], "$description": "", @@ -1320,7 +1294,7 @@ "offsetY": "{base.static.spacing.xsmall}", "blur": "{base.static.spacing.small}", "spread": "{base.static.spacing.none}", - "color": "{color.shadow.default}" + "color": "{base.color.black.opacity36}" } ], "$description": "", @@ -1340,7 +1314,7 @@ "offsetY": "{base.static.spacing.small}", "blur": "{base.static.spacing.medium}", "spread": "{base.static.spacing.none}", - "color": "{color.shadow.default}" + "color": "{base.color.black.opacity36}" } ], "$description": "", diff --git a/design-tokens/tokens/semantic/color.light.json b/design-tokens/tokens/semantic/color.light.json index 6572fd26b..e55ad30c1 100644 --- a/design-tokens/tokens/semantic/color.light.json +++ b/design-tokens/tokens/semantic/color.light.json @@ -483,29 +483,29 @@ } } }, - "onStrong": { + "heading": { "default": { "$type": "color", - "$value": "{base.color.white.100}", + "$value": "{color.text.strong}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["TEXT_FILL"], + "scopes": ["ALL_SCOPES"], "codeSyntax": {} } } } }, - "heading": { + "onStrong": { "default": { "$type": "color", - "$value": "{color.text.strong}", + "$value": "{base.color.white.100}", "$description": "", "$extensions": { "com.figma": { "hiddenFromPublishing": false, - "scopes": ["ALL_SCOPES"], + "scopes": ["TEXT_FILL"], "codeSyntax": {} } } @@ -909,6 +909,18 @@ } }, "decorative": { + "brand": { + "$type": "color", + "$value": "{base.color.brand}", + "$description": "", + "$extensions": { + "com.figma": { + "hiddenFromPublishing": false, + "scopes": ["ALL_SCOPES"], + "codeSyntax": {} + } + } + }, "green": { "$type": "color", "$value": "{base.color.green.400}", @@ -1251,44 +1263,6 @@ } } } - }, - "shadow": { - "weak": { - "$type": "color", - "$value": "{base.color.black.opacity12}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "default": { - "$type": "color", - "$value": "{base.color.black.opacity12}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - }, - "strong": { - "$type": "color", - "$value": "{base.color.black.opacity24}", - "$description": "", - "$extensions": { - "com.figma": { - "hiddenFromPublishing": false, - "scopes": ["EFFECT_COLOR"], - "codeSyntax": {} - } - } - } } }, "shadow": { @@ -1300,7 +1274,7 @@ "offsetY": "{base.dimension.100}", "blur": "{base.dimension.100}", "spread": 0, - "color": "{color.shadow.weak}" + "color": "{base.color.black.opacity12}" } ], "$description": "", @@ -1320,7 +1294,7 @@ "offsetY": "{base.static.spacing.xsmall}", "blur": "{base.static.spacing.small}", "spread": "{base.static.spacing.none}", - "color": "{color.shadow.default}" + "color": "{base.color.black.opacity36}" } ], "$description": "", @@ -1340,7 +1314,7 @@ "offsetY": "{base.static.spacing.small}", "blur": "{base.static.spacing.medium}", "spread": "{base.static.spacing.none}", - "color": "{color.shadow.default}" + "color": "{base.color.black.opacity36}" } ], "$description": "", diff --git a/sandbox/grommet-app/src/theme.jsx b/sandbox/grommet-app/src/theme.jsx index 19e71c169..51a3ad110 100644 --- a/sandbox/grommet-app/src/theme.jsx +++ b/sandbox/grommet-app/src/theme.jsx @@ -201,7 +201,7 @@ const buildTheme = tokens => { const flatColors = flattenObject(light, '-'); const tokenColors = {}; Object.keys(flatColors).forEach(color => { - if (!color.includes('elevation')) { + if (!color.includes('shadow')) { const adjustedColor = color.split('-').join('.'); tokenColors[color] = { light: access(`hpe.color.${adjustedColor}`, light), @@ -508,10 +508,20 @@ const buildTheme = tokens => { }, }; + // This means the theme is structure pre switch of button.size.kind --> button.kind.size + const oldTheme = + components.hpe.button.medium && 'default' in components.hpe.button.medium + ? true + : false; + // abstracted so button and pinned list icon can reference const mediumIconOnlyPad = { - vertical: components.hpe.button.medium.default.iconOnly.paddingY, - horizontal: components.hpe.button.medium.default.iconOnly.paddingX, + vertical: oldTheme + ? components.hpe.button.medium.default.iconOnly.paddingY + : components.hpe.button.default.medium.iconOnly.paddingY, + horizontal: oldTheme + ? components.hpe.button.medium.default.iconOnly.paddingX + : components.hpe.button.default.medium.iconOnly.paddingY, }; const anchorSizeTheme = {}; @@ -539,18 +549,18 @@ const buildTheme = tokens => { const buttonKindTheme = {}; buttonKinds.forEach(kind => { + const borderWidth = oldTheme + ? components.hpe.button.medium?.[kind].borderWidth + : components.hpe.button[kind]?.medium.borderWidth; + const borderRadius = oldTheme + ? components.hpe.button.medium?.[kind].borderRadius + : components.hpe.button[kind]?.medium.borderRadius; buttonKindTheme[kind] = { background: components.hpe.button?.[kind].enabled.background, border: { - width: - dimensions.borderSize[ - components.hpe.button.medium?.[kind].borderWidth - ] || components.hpe.button.medium?.[kind].borderWidth, + width: dimensions.borderSize[borderWidth] || borderWidth, color: components.hpe.button?.[kind].enabled.borderColor, - radius: - dimensions.borderSize[ - components.hpe.button.medium?.[kind].borderRadius - ] || components.hpe.button.medium?.[kind].borderRadius, + radius: dimensions.borderSize[borderRadius] || borderRadius, }, color: components.hpe.button?.[kind].enabled.textColor, font: { @@ -620,26 +630,42 @@ const buildTheme = tokens => { buttonKinds.forEach(kind => { kindStyles[kind] = { border: { - radius: components.hpe.button?.[size]?.[kind].borderRadius, + radius: oldTheme + ? components.hpe.button?.[size]?.[kind]?.borderRadius + : components.hpe.button?.[kind]?.[size]?.borderRadius, }, pad: { - vertical: components.hpe.button?.[size]?.[kind].paddingY, - horizontal: components.hpe.button?.[size]?.[kind].paddingX, + vertical: oldTheme + ? components.hpe.button?.[size]?.[kind]?.paddingY + : components.hpe.button?.[kind]?.[size]?.paddingY, + horizontal: oldTheme + ? components.hpe.button?.[size]?.[kind]?.paddingX + : components.hpe.button?.[kind]?.[size]?.paddingX, }, }; }); buttonSizesTheme[size] = { border: { - radius: components.hpe.button?.[size]?.default.borderRadius, + radius: oldTheme + ? components.hpe.button?.[size]?.default.borderRadius + : components.hpe.button?.default?.[size]?.borderRadius, }, pad: { - vertical: components.hpe.button?.[size]?.default.paddingY, - horizontal: components.hpe.button?.[size]?.default.paddingX, + vertical: oldTheme + ? components.hpe.button?.[size]?.default.paddingY + : components.hpe.button?.default?.[size]?.paddingY, + horizontal: oldTheme + ? components.hpe.button?.[size]?.default.paddingX + : components.hpe.button?.default?.[size]?.paddingX, }, iconOnly: { pad: { - vertical: components.hpe.button?.[size]?.default.iconOnly.paddingY, - horizontal: components.hpe.button?.[size]?.default.iconOnly.paddingX, + vertical: oldTheme + ? components.hpe.button?.[size]?.default.iconOnly.paddingY + : components.hpe.button?.default?.[size]?.iconOnly.paddingY, + horizontal: oldTheme + ? components.hpe.button?.[size]?.default.iconOnly.paddingX + : components.hpe.button?.default?.[size]?.iconOnly.paddingX, }, }, ...kindStyles, @@ -866,7 +892,9 @@ const buildTheme = tokens => { button: { intelligentPad: false, color: components.hpe.button.default.enabled.textColor, - gap: components.hpe.button.medium.default.gapX, + gap: oldTheme + ? components.hpe.button.medium.default.gapX + : components.hpe.button.default.medium.gapX, badge: { align: 'container', // TO DO this is a grommet-ism? container: { @@ -1342,11 +1370,17 @@ const buildTheme = tokens => { border: { // Q: is this the correct value? // A: yes - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, }, pad: { - vertical: components.hpe.button.medium.default.paddingY, - horizontal: components.hpe.button.medium.default.paddingX, + vertical: oldTheme + ? components.hpe.button.medium.default.paddingY + : components.hpe.button.default.medium.paddingY, + horizontal: oldTheme + ? components.hpe.button.medium.default.paddingX + : components.hpe.button.default.medium.paddingX, }, color: components.hpe.button.default.enabled.textColor, font: { @@ -2008,7 +2042,9 @@ const buildTheme = tokens => { button: { color: components.hpe.button.default.enabled.textColor, border: { - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, }, font: { weight: components.hpe.button.default.enabled.fontWeight, @@ -2016,7 +2052,9 @@ const buildTheme = tokens => { active: { background: components.hpe.button.default.selected.enabled.background, border: { - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, }, color: components.hpe.button.default.selected.enabled.textColor, font: { @@ -2026,7 +2064,9 @@ const buildTheme = tokens => { hover: { background: components.hpe.button.default.hover.background, border: { - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, }, color: components.hpe.button.default.hover.textColor, font: { @@ -2036,7 +2076,9 @@ const buildTheme = tokens => { disabled: { background: components.hpe.button.default.disabled.background, border: { - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, }, color: components.hpe.button.default.disabled.textColor, font: { @@ -2046,11 +2088,17 @@ const buildTheme = tokens => { size: { small: { border: { - radius: components.hpe.button.small.default.borderRadius, + radius: oldTheme + ? components.hpe.button.small.default.borderRadius + : components.hpe.button.default.small.borderRadius, width: dimensions.borderSize[ - components.hpe.button.small.default.borderWidth - ] || components.hpe.button.small.default.borderWidth, + oldTheme + ? components.hpe.button.small.default.borderWidth + : components.hpe.button.default.small.borderWidth + ] || oldTheme + ? components.hpe.button.small.default.borderWidth + : components.hpe.button.default.small.borderWidth, }, pad: { vertical: '4px', @@ -2065,11 +2113,17 @@ const buildTheme = tokens => { }, medium: { border: { - radius: components.hpe.button.medium.default.borderRadius, + radius: oldTheme + ? components.hpe.button.medium.default.borderRadius + : components.hpe.button.default.medium.borderRadius, width: dimensions.borderSize[ - components.hpe.button.medium.default.borderWidth - ] || components.hpe.button.medium.default.borderWidth, + oldTheme + ? components.hpe.button.medium.default.borderWidth + : components.hpe.button.default.medium.borderWidth + ] || oldTheme + ? components.hpe.button.medium.default.borderWidth + : components.hpe.button.default.medium.borderWidth, }, pad: { vertical: '4px', @@ -2084,11 +2138,17 @@ const buildTheme = tokens => { }, large: { border: { - radius: components.hpe.button.large.default.borderRadius, + radius: oldTheme + ? components.hpe.button.large.default.borderRadius + : components.hpe.button.default.large.borderRadius, width: dimensions.borderSize[ - components.hpe.button.large.default.borderWidth - ] || components.hpe.button.large.default.borderWidth, + oldTheme + ? components.hpe.button.large.default.borderWidth + : components.hpe.button.default.large.borderWidth + ] || oldTheme + ? components.hpe.button.large.default.borderWidth + : components.hpe.button.default.large.borderWidth, }, pad: { vertical: '4px', @@ -2491,7 +2551,9 @@ const buildTheme = tokens => { container: { border: { color: components.hpe.button.toolbar.enabled.borderColor, - size: components.hpe.button.medium.toolbar.borderWidth, + size: oldTheme + ? components.hpe.button.medium.toolbar.borderWidth + : components.hpe.button.toolbar.medium.borderWidth, }, }, }, diff --git a/yarn.lock b/yarn.lock index 407e2b002..97dc9cbaf 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2868,17 +2868,17 @@ "@sinonjs/commons" "^1.7.0" "@storybook/addon-a11y@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-8.4.4.tgz#4506067cbe4d0366d3c3f8e96ddf641a651c9816" - integrity sha512-xXNOG4Bw/v8rg2Zq/ZJnZSLWfpfkfnZjn0sQVLOe5JcDxavkh5o+WvQ6Tc2w/kK/ophCd7nbTotywrtdQYGNKw== + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-8.4.5.tgz#963f6ded06a5aff79862d9f2c6dce74027b23c29" + integrity sha512-lqIOpWJZNR0Ur+2zUcnFAMvdOe7kYEDeXPv1TM7fwEGyzKPYoM/k5xPA2cJCrYwtydxOqqrmn1jUIw0Qdkhuhg== dependencies: - "@storybook/addon-highlight" "8.4.4" + "@storybook/addon-highlight" "8.4.5" axe-core "^4.2.0" -"@storybook/addon-actions@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-8.4.4.tgz#905f14e37eaf53196cf70245994d7bb083378b10" - integrity sha512-+Dd6alcieS6UN7IKhXLuhyQYQMu9HG/Tdr790a4EOQKpJM1NxIMuPuUH3fAoKfa9VhtI1BxTBr7zNtzg9Akqhg== +"@storybook/addon-actions@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-8.4.5.tgz#9224f635c78240f611eb340ba9b4248986b4763c" + integrity sha512-rbB19uiGJ61XHbKIbS1a9bUS6re5L8rT5NMNeEJhCxXRpFUPrlTXMSoD/Pgcn3ENeEMVZsm8/eCzxAVgAP3Mgg== dependencies: "@storybook/global" "^5.0.0" "@types/uuid" "^9.0.1" @@ -2886,112 +2886,112 @@ polished "^4.2.2" uuid "^9.0.0" -"@storybook/addon-backgrounds@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-8.4.4.tgz#997a3f29eb6dda134f42a9d332ea54f6fb065f6c" - integrity sha512-asaGD4ruIPFthyhpByQSJagvtNN7EGKdHj5yMnsMvkSXnN0r1uVkI2/Z37hmLt02Qbzf6OQiBPW5TDL+X+EEBg== +"@storybook/addon-backgrounds@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-8.4.5.tgz#3d93d24d0b8e77d6d5bad78bae4c8621ee27c5d1" + integrity sha512-FeMt4qHCMYDQiLGGDKiRuSPXFup2WXOaZSdL137v1W36wEL/vGkK1A5iQt1qJ8MZzL5WZQuedox8rSybFy7eow== dependencies: "@storybook/global" "^5.0.0" memoizerific "^1.11.3" ts-dedent "^2.0.0" -"@storybook/addon-controls@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-8.4.4.tgz#26454b8daa9bbec6a034d510e1a2b8c772638e3a" - integrity sha512-FbZRbwJQggLz6M3zB6scCp1SDGwQ5zdiD6sjBilZzgGO5rBFqG0A8PoOyr4iPrLU2y/NZBdRrJBD+6MkaJ+yzw== +"@storybook/addon-controls@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-8.4.5.tgz#1f6ce4044ab093aabb79fcd6537a996f2d12597f" + integrity sha512-RVTtDDuESLYc1+SJQv2kI7wzBddzAS9uoEe8P75quN6S4pC0GxAB6xirWZ2+WOcba4eHosY+PxMwuBXQfH78Ew== dependencies: "@storybook/global" "^5.0.0" dequal "^2.0.2" ts-dedent "^2.0.0" -"@storybook/addon-docs@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-8.4.4.tgz#f614b7eba5756263588707609c2b34df7cb4a6b2" - integrity sha512-wuHaStfpd2rkAN5Lf0qmvE3JKTHTEDbnAMTvfs9inzGBL0iAwBLjW48/ll7lLkJ2E3k/FQtaevNpuc7C52u1Bw== +"@storybook/addon-docs@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-8.4.5.tgz#fa38b6c6c0ef1c8fc588b6913ddb55b67be55666" + integrity sha512-zPELIl7wXormOylVaaSpkUIuuCCxrO+OFPMKZnlENt6zSReyy0dJu4V0tzfV8FCw+V4D6Y4wrLRk/TIG951Ojw== dependencies: "@mdx-js/react" "^3.0.0" - "@storybook/blocks" "8.4.4" - "@storybook/csf-plugin" "8.4.4" - "@storybook/react-dom-shim" "8.4.4" + "@storybook/blocks" "8.4.5" + "@storybook/csf-plugin" "8.4.5" + "@storybook/react-dom-shim" "8.4.5" react "^16.8.0 || ^17.0.0 || ^18.0.0" react-dom "^16.8.0 || ^17.0.0 || ^18.0.0" ts-dedent "^2.0.0" "@storybook/addon-essentials@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-8.4.4.tgz#12a98cedebcf270a6fd6be2691c275f5ef56ee9a" - integrity sha512-0ObUQ98zZkeWqP2k3Un5jny3WxT3THgUKZUGD+mR8eq6CuTmJ3bUXWzDHreuDxQwgr8s5f04XD8IcRvjZ9IRgA== - dependencies: - "@storybook/addon-actions" "8.4.4" - "@storybook/addon-backgrounds" "8.4.4" - "@storybook/addon-controls" "8.4.4" - "@storybook/addon-docs" "8.4.4" - "@storybook/addon-highlight" "8.4.4" - "@storybook/addon-measure" "8.4.4" - "@storybook/addon-outline" "8.4.4" - "@storybook/addon-toolbars" "8.4.4" - "@storybook/addon-viewport" "8.4.4" + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-8.4.5.tgz#7ff4f71b4435f734936272a691a830a34eaaef49" + integrity sha512-AxetQo/zSPIu3RZqWG2opwAz22Bb+jpf1nWbHp0kEpCrBemcWd8X2gonVmXNOC1PDKNl3jcWyc3lmg/+3mxjYg== + dependencies: + "@storybook/addon-actions" "8.4.5" + "@storybook/addon-backgrounds" "8.4.5" + "@storybook/addon-controls" "8.4.5" + "@storybook/addon-docs" "8.4.5" + "@storybook/addon-highlight" "8.4.5" + "@storybook/addon-measure" "8.4.5" + "@storybook/addon-outline" "8.4.5" + "@storybook/addon-toolbars" "8.4.5" + "@storybook/addon-viewport" "8.4.5" ts-dedent "^2.0.0" -"@storybook/addon-highlight@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-8.4.4.tgz#7ef88b1908e156ad95af2255493aad32dd13df36" - integrity sha512-k7EUxiMe8RCasmgfa6ZKx7UG6kU9RooTYGwqY5TG5xAQOzDwKn4qom+OYkT/9/6lORhJrUe2GgQLCrq/WGpS1A== +"@storybook/addon-highlight@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-8.4.5.tgz#44c194f88395a6e221744867a11f39ea8910d290" + integrity sha512-sMA7v+4unaKY+5RDhow6lLncJqNX9ZLUnBIt3vzY1ntUsOYVwykAY1Hq4Ysj0luCBXjJJdJ6223ylrycnb7Ilw== dependencies: "@storybook/global" "^5.0.0" "@storybook/addon-interactions@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-interactions/-/addon-interactions-8.4.4.tgz#6c005ba711effc281273fd6336525052122ea42c" - integrity sha512-izqcc6tY0BiKW7DYrEnoXUEH9FYDPWNfQnqqE0nVBv3BS2DoNmm8M9SB8fZx7pPfw53cMJBGt3vrlY0Wtxy1+Q== + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-interactions/-/addon-interactions-8.4.5.tgz#0053207da50a4cefc9dce46b7980cd54a828c2ff" + integrity sha512-s6R8XVD8LTp+LQTDbhtDjDLE6S44I7FtMLxPdMNwN9VEJjBk01NONLDuGDpNq5o/0bnybA3rMHk9+3afsgzidQ== dependencies: "@storybook/global" "^5.0.0" - "@storybook/instrumenter" "8.4.4" - "@storybook/test" "8.4.4" + "@storybook/instrumenter" "8.4.5" + "@storybook/test" "8.4.5" polished "^4.2.2" ts-dedent "^2.2.0" "@storybook/addon-links@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-8.4.4.tgz#3d4b55f3d9513780d6558abb55c7123a2f24e538" - integrity sha512-hqTv06fPq9k5GUZD8JR49ANw5sBg8EYAsuCNoSd9OwVSBO/3y53HrMA0NCILUK8hnupPvtBuKXXoHmHes9R+1g== + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-8.4.5.tgz#9b062f61248e2b2d3289ff700153537b475281d8" + integrity sha512-ac3OtplFdrPw/2jtLnteuVllwu2yCe3sgKJS9AbdYMT/65OW47M7oDnzcpRPsDGufrKlDMBJXXEv4SfTtlT+rg== dependencies: "@storybook/csf" "^0.1.11" "@storybook/global" "^5.0.0" ts-dedent "^2.0.0" -"@storybook/addon-measure@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-8.4.4.tgz#1ccc187c3071f4972ef4607a255e263f2d1f1b94" - integrity sha512-KsjrwrXwrI+z7hKKfjyY1w1b0gLSLZmp15vIRJMELybWV0+4bZFLJGwMBOQFx+aWBED8yZrRV9OjTmoczawsZg== +"@storybook/addon-measure@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-8.4.5.tgz#9b22ea0f28740f0c9c1edee2642de2b75415abdd" + integrity sha512-+sNjew991YaoXQyWWloFybjEGrDO40Jk6w8BgZs2X7oc3D5t/6oFzvyC862U++LGqKFA3quXDeBjEb92CI9cRA== dependencies: "@storybook/global" "^5.0.0" tiny-invariant "^1.3.1" "@storybook/addon-onboarding@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-onboarding/-/addon-onboarding-8.4.4.tgz#95f1cd14ffeb03f0d6dfdc0ff579b28097374dfd" - integrity sha512-LCCQez5xzFQ6wunXnpNjgiuqh8SYPd2AgrRPDKo5Yf1QyXnT4xSFjZr/4QFyzPsOBnpsq8MlNPS4l063Y+Qkgg== + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-onboarding/-/addon-onboarding-8.4.5.tgz#731ac4a27711dff565dec9b4090fb49ab752d7b9" + integrity sha512-+FW50yVw2NMxYvk3uMpIberfkG4Sn0qRpiMse7MGHgTimtaJ0Mo1AUIrSfyIJCVTuxiWZud1a5DAnH0ybbWjjA== dependencies: react-confetti "^6.1.0" -"@storybook/addon-outline@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-8.4.4.tgz#af719f0dd69a938af16dc7a319bcc884ef136153" - integrity sha512-CVS1dm6BNUWKGrJj9E1ThBp5Khe6Yw+Hhz6OFxrPZfoTr6RstwoTmvSpKjDUCn8zj6ujoORdiQUh1FsHOxAPBg== +"@storybook/addon-outline@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-8.4.5.tgz#32d0a798b7c5abacbe2576125f589c8d4bcd5bcc" + integrity sha512-XlpN98AUDnWQWNFSFVm+HkRUzm3xIUMjBGTkv6HsL6zt6XoJ+LsQMca+PPtYqlBJA+5CU41xMDaG8HC/p+sd3A== dependencies: "@storybook/global" "^5.0.0" ts-dedent "^2.0.0" -"@storybook/addon-toolbars@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-8.4.4.tgz#9b04f18c22ce6539614456905e3fae0dd7d6bbd9" - integrity sha512-ENPshJMDpfzOJ4Tgm1hSzQoaEmgDxCtP6C8LKk4MOd3X92MJ7p6kfb3y3R1BLg4E/g90qp6lKPFdcohS2tKCgQ== +"@storybook/addon-toolbars@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-8.4.5.tgz#ebe20f0577a3e399858ba591066dbc8ac9636a5c" + integrity sha512-hOq5560ONOU/qrslrwosWzxnC4nrF8HZWD43ciKwtethm8HuptU2M+Jrui1CRsMScEZLopWWVE9o0vJMdKpIFQ== -"@storybook/addon-viewport@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-8.4.4.tgz#fdbcc478cf70a194c9531dd22b5a4ea51be970ea" - integrity sha512-SRHJlLhf3tu7+sYNfVIYTeMegn6aiv4HGX97ZLvL76NWWBU8BntQ1LKMki7475mWiZNUFMoYYPsHlG+HU9FAtg== +"@storybook/addon-viewport@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-8.4.5.tgz#21a8b6d49f31cdca72018e9cd3adffbc435fa61a" + integrity sha512-l7Y41gIbJAsIN/QCg1QJ9sr61FLz1C/imUotcDej41tOHxUTSQOlXpNtVnfhUM1vGQc0yNpP3pVxj8BpXi0cAw== dependencies: memoizerific "^1.11.3" @@ -3003,21 +3003,21 @@ "@swc/core" "^1.7.3" swc-loader "^0.2.3" -"@storybook/blocks@8.4.4", "@storybook/blocks@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-8.4.4.tgz#5cfffd04bf4e417e19e2948a94133e36bf5e4d0e" - integrity sha512-LwM3guL7uWpYR1a/SY0KZjCUskTKEaS22eF7GK8iXAV5BY4KpKr6ArW4O9orK29KtFwKhDZQLcMcECsOJBVk/A== +"@storybook/blocks@8.4.5", "@storybook/blocks@^8.3.6": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-8.4.5.tgz#9494d9ccddc04bacd6a7a6c67cf870b72bf4ce9d" + integrity sha512-Z+LHauSqm3A4HBR9pUEf9KQhD3/3xYMt0FXgA+GHCAyDa6lFeD1C6r9Y2nlT+9dt8gv9B9oygTZvV6GqFVyRSQ== dependencies: "@storybook/csf" "^0.1.11" "@storybook/icons" "^1.2.12" ts-dedent "^2.0.0" -"@storybook/builder-webpack5@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/builder-webpack5/-/builder-webpack5-8.4.4.tgz#4d0af0af68f637ac30e3c0abefe959aaf70dc41d" - integrity sha512-I7SmGngtGc/WA44UkG3sCyYtGXVjTpPe42umf70n5EVaHRvtmXCxfL41C1y3CIfEMAfF36gOFm7rEJROIO5NyA== +"@storybook/builder-webpack5@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/builder-webpack5/-/builder-webpack5-8.4.5.tgz#f2c15eb2219dc21bc6b0f4a5f83afd8c80561bff" + integrity sha512-5TSpirK2LIL4Wultpowlkrv3iAje57HTw92Hy6c4Zn64tAs30123mkdE6MoJcXMBfD4JwX9I2K2Q+ofZXblJPg== dependencies: - "@storybook/core-webpack" "8.4.4" + "@storybook/core-webpack" "8.4.5" "@types/node" "^22.0.0" "@types/semver" "^7.3.4" browser-assert "^1.2.1" @@ -3043,23 +3043,23 @@ webpack-hot-middleware "^2.25.1" webpack-virtual-modules "^0.6.0" -"@storybook/components@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/components/-/components-8.4.4.tgz#487c5d89061519bd3f8f3dcb7cbf052d032ea744" - integrity sha512-0BSZVmsk23C0BSRKx3liZSVQFXtoF86XQFdNQxjrXIwdHIEN7TcL3DwcxeVUU5ilGp7HeDgAydGNIPGgTeEe6g== +"@storybook/components@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/components/-/components-8.4.5.tgz#039e4cb5090c56c47fc10f0c5ecda77f4b015c7f" + integrity sha512-2PdnKfqNNv3sO7qILgWXiNvmLOi503oN9OMemNCQjTIvdvySc5JpS9/eClwcl/JfmE4qHdSHZr8dLLkBM9S7+Q== -"@storybook/core-webpack@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/core-webpack/-/core-webpack-8.4.4.tgz#0e769da04918066de69edac2baebd388f60cce50" - integrity sha512-JeODT64uRJDH0o/ZOAAZHJswBkTYd2u9AdGyAzjp16KRK2NcHM2iUMNT94lOlCYzshvRVqPFVxbNmaL16/K0Ag== +"@storybook/core-webpack@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/core-webpack/-/core-webpack-8.4.5.tgz#b17422cff80c638e3478406193acedb9be2d50cb" + integrity sha512-IpK/3fM+l2WjRNplTtP+MtnRf/394GcBwyemZknUCzFFDJWNYAN1+meEZmOaZKzJ3tQyRYiErrJLHzd1+UH6Dw== dependencies: "@types/node" "^22.0.0" ts-dedent "^2.0.0" -"@storybook/core@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/core/-/core-8.4.4.tgz#9da9d630869d3b888145d5dfd22127a93f207417" - integrity sha512-WjTmJpsHsFCd7tQ/8jFpDWjhntauXcWYYTcEZk56Pq4miyNrrXhV0S80Gxv3Uvzk0jocgtT2AKf8rQuH2UkQEg== +"@storybook/core@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/core/-/core-8.4.5.tgz#4133927a43834664777f0918caf32542630cbdd5" + integrity sha512-aB1sQNX5nRoUAqg5u1py0MuR/VPd6c6PhECa4rW6pmr7kZcfyP4PP6UFpXuN71ypTQlkRE3Vc5PQZ3gLhE9o3g== dependencies: "@storybook/csf" "^0.1.11" better-opn "^3.0.2" @@ -3073,10 +3073,10 @@ util "^0.12.5" ws "^8.2.3" -"@storybook/csf-plugin@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-8.4.4.tgz#cb197181859abbc075f840192f06e8547fe79a2e" - integrity sha512-4+6SUhp5sEJN9BY5RuxcFKvJbOqCzIUp9oHSSz36hkP07a4QH+SwxfEd0U7JRfmPpB63L+izywTzWhdADiAMOQ== +"@storybook/csf-plugin@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-8.4.5.tgz#7f9ae0176e36cb74b1f638aac04dfec4aa04222f" + integrity sha512-qd2rQTglOTS+phQmTbNTXNjNyxdGvolaqHqDNMw3Vf6h9o3U+mLkwnDWNVnQ9oqvOoUEAqpBthgwzU9FhkIk+A== dependencies: unplugin "^1.3.1" @@ -3097,26 +3097,26 @@ resolved "https://registry.yarnpkg.com/@storybook/icons/-/icons-1.2.12.tgz#3e4c939113b67df7ab17b78f805dbb57f4acf0db" integrity sha512-UxgyK5W3/UV4VrI3dl6ajGfHM4aOqMAkFLWe2KibeQudLf6NJpDrDMSHwZj+3iKC4jFU7dkKbbtH2h/al4sW3Q== -"@storybook/instrumenter@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/instrumenter/-/instrumenter-8.4.4.tgz#90256f7807de6b8092ee2f55055051bd6bd2cddd" - integrity sha512-mq/YVEZrB8jyyio2Of01rQixsQ72z8ssAhJS9ldIlK+cvERQi0VBCpH3pejPmjOB40yiKBJHNqH4HIANVhibgw== +"@storybook/instrumenter@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/instrumenter/-/instrumenter-8.4.5.tgz#14983198b27dfbeedfef28992eef0d304b9f562b" + integrity sha512-8qM35FkueuRpJr0zA6ENvhQICbo+iKL1ln450DwV1kKJtc41KdbA3CuCvtZ/FnoPsFnwdtPjhhICFtRt8LRTSg== dependencies: "@storybook/global" "^5.0.0" "@vitest/utils" "^2.1.1" -"@storybook/manager-api@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-8.4.4.tgz#ea3e134d7cc5a91ef82d95601206eb839e34c631" - integrity sha512-rmNPcbEyzakEHoaecUbhkW7WWOkyZ0z7ywH4d5/s0ZuQS57Px2N+ZLVgRJwYK+YNHiJYqDf1BTln9YJ/Mt1L6Q== +"@storybook/manager-api@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-8.4.5.tgz#ce586cc5961297272f7228446161015464c65067" + integrity sha512-t39JaMy3UX4StbUH/tIDcaflBDxTcyIq853wQtBMhVL3e1+Dw3MIiiG/5bw79HU4R7kSmPVLXIIbV3FmXkq7KQ== -"@storybook/preset-react-webpack@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/preset-react-webpack/-/preset-react-webpack-8.4.4.tgz#e543f834136013778727fe170735ad125daf4f16" - integrity sha512-sCuTZ/zbEWfTYy2cyDUHVDLIEKYFmFPhGDbQLk1D4MEXZsVQqBx7H0yaG9GqB7swvED+XIgQeZTeUA/lTq41fg== +"@storybook/preset-react-webpack@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/preset-react-webpack/-/preset-react-webpack-8.4.5.tgz#da27afe7eaacaa17816608b1ccf225eb986965d8" + integrity sha512-BKPAN7G0yFXfojQdF8tvgwVJ0ldcl6+p1JtAPAieH69BMGni3TEPnvPhkefRWcM8oM8pl+Hch/J2PLHiZ6QKNQ== dependencies: - "@storybook/core-webpack" "8.4.4" - "@storybook/react" "8.4.4" + "@storybook/core-webpack" "8.4.5" + "@storybook/react" "8.4.5" "@storybook/react-docgen-typescript-plugin" "1.0.6--canary.9.0c3f3b7.0" "@types/node" "^22.0.0" "@types/semver" "^7.3.4" @@ -3128,10 +3128,10 @@ tsconfig-paths "^4.2.0" webpack "5" -"@storybook/preview-api@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-8.4.4.tgz#bcfde521927406f9c37744f5cc959c54bf268a92" - integrity sha512-iZrWQcjRBqBHFdDXVxGpw6mHBZMCMYqhWXdyJ0d1S2y3PwcfOjkcXlQ1UiAenFHlA6dKrcYw8luKUQTL9bKReA== +"@storybook/preview-api@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-8.4.5.tgz#f8c046575c68062eda1de9494e7118571d20c72a" + integrity sha512-MKIZ2jQO/3cUdsT57eq8jRgB6inALo9BxrQ88f7mqzltOkMvADvTAY6y8JZqTUoDzWTH/ny/8SGGdtpqlxRuiQ== "@storybook/react-docgen-typescript-plugin@1.0.6--canary.9.0c3f3b7.0": version "1.0.6--canary.9.0c3f3b7.0" @@ -3146,51 +3146,51 @@ react-docgen-typescript "^2.2.2" tslib "^2.0.0" -"@storybook/react-dom-shim@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-8.4.4.tgz#7ea45d7760a49648829e3be70866c7a52bf6ab16" - integrity sha512-kufv2FDK3kjADBo+/aKHsUn9T5E4p9IBAmCoIvXBGRDumPRds7Pt3MB4ODKlg+IumR7LMEq0jTJkn27ZRTuUmw== +"@storybook/react-dom-shim@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-8.4.5.tgz#cc874d008a1def4410c32a95bcf9aac8defdb6f5" + integrity sha512-YTWTfPagptEYXJsnxAl3zP97Ev0zebtaEV0WgjGaEeumr+zsfgKKwzzHxgrtumBmDzwkuKlzFwlQB5A8keOIGA== "@storybook/react-webpack5@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/react-webpack5/-/react-webpack5-8.4.4.tgz#e4fad3a586795736b1567b129686b383751fd2fb" - integrity sha512-58dxE92h/JZO3xKl88BbEJ165UVCazX9oWd5si+V2GoeqKilVsVM9EMLv5sZY+9blv+lxrZdkykHDeIrcXVxOg== + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/react-webpack5/-/react-webpack5-8.4.5.tgz#1221099959527dabc06b4f26b87244f126ba0771" + integrity sha512-tmYO68I4c0mn2XwM4/WkzEVdP27umfa+Sce+NHkk6fGlp25BiKw70uE8sOkM1leB0wn4ktn9eBw46xXdJv2oew== dependencies: - "@storybook/builder-webpack5" "8.4.4" - "@storybook/preset-react-webpack" "8.4.4" - "@storybook/react" "8.4.4" + "@storybook/builder-webpack5" "8.4.5" + "@storybook/preset-react-webpack" "8.4.5" + "@storybook/react" "8.4.5" "@types/node" "^22.0.0" -"@storybook/react@8.4.4", "@storybook/react@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/react/-/react-8.4.4.tgz#f456a904e1afea780b08cdfc6827618e8badf250" - integrity sha512-92lGnRcAI2qW6zH8GMBScyXmOS1ANI8ZuSP4ExQj+lGsCrAr7PBr0wuHy3wIn1YyAvQGPUn/mpYrmMz08c2HfA== +"@storybook/react@8.4.5", "@storybook/react@^8.3.6": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/react/-/react-8.4.5.tgz#9395ce8ffd4e27765459703c0634b306af882137" + integrity sha512-2+p4aGEdGOnu2XNhnMi1B8GPeszm34P905HgqGD1cuz9gMt7x/bgZQaVxs6kpHZ3Hb6V9qp62La2dbAYatHdSw== dependencies: - "@storybook/components" "8.4.4" + "@storybook/components" "8.4.5" "@storybook/global" "^5.0.0" - "@storybook/manager-api" "8.4.4" - "@storybook/preview-api" "8.4.4" - "@storybook/react-dom-shim" "8.4.4" - "@storybook/theming" "8.4.4" + "@storybook/manager-api" "8.4.5" + "@storybook/preview-api" "8.4.5" + "@storybook/react-dom-shim" "8.4.5" + "@storybook/theming" "8.4.5" -"@storybook/test@8.4.4", "@storybook/test@^8.3.6": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/test/-/test-8.4.4.tgz#c2116e455ea439990c235475b9b1bbca331257d9" - integrity sha512-tmJd+lxl3MC0Xdu1KW/69V8tibv98OvdopxGqfVR0x5dkRHM3sFK/tv1ZJAUeronlvRyhGySOu1tHUrMjcNqyA== +"@storybook/test@8.4.5", "@storybook/test@^8.3.6": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/test/-/test-8.4.5.tgz#a22e8a4671c379f8ffc83a3997feb524bf5d9421" + integrity sha512-mHsRc6m60nfcEBsjvUkKz+Jnz0or4WH5jmJ1VL2pGKO4VzESCPqAwDnwDqP2YyeSQ0b/MAKUT5kdoLE2RE2eVw== dependencies: "@storybook/csf" "^0.1.11" "@storybook/global" "^5.0.0" - "@storybook/instrumenter" "8.4.4" + "@storybook/instrumenter" "8.4.5" "@testing-library/dom" "10.4.0" "@testing-library/jest-dom" "6.5.0" "@testing-library/user-event" "14.5.2" "@vitest/expect" "2.0.5" "@vitest/spy" "2.0.5" -"@storybook/theming@8.4.4": - version "8.4.4" - resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-8.4.4.tgz#3d209a235bf2b6f5543f1eebe78244f0104811b5" - integrity sha512-iq4yt3Fx35ZV5owNC//E6G+QPV19xHHVN2Ugi3p7KOSFK3chuXX9mxZ1rfir+t+U30a5EPOEnlsY3/1LXn7aTw== +"@storybook/theming@8.4.5": + version "8.4.5" + resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-8.4.5.tgz#d7c77215f09906c9bb124d530d4307fd1841fbb8" + integrity sha512-45e/jeG4iuqdZcHg3PbB6dwXQTwlnnEB7r/QcVExyC7ibrkTnjUfvxzyUw4mmU3CXETFGD5EcUobFkgK+/aPxQ== "@swc/core-darwin-arm64@1.9.2": version "1.9.2" @@ -3274,9 +3274,9 @@ tslib "^2.4.0" "@swc/types@^0.1.15": - version "0.1.15" - resolved "https://registry.yarnpkg.com/@swc/types/-/types-0.1.15.tgz#9a3b3873d93382750b823aaeabca787bd3fa7c96" - integrity sha512-XKaZ+dzDIQ9Ot9o89oJQ/aluI17+VvUnIpYJTcZtvv1iYX6MzHh3Ik2CSR7MdPKpPwfZXHBeCingb2b4PoDVdw== + version "0.1.17" + resolved "https://registry.yarnpkg.com/@swc/types/-/types-0.1.17.tgz#bd1d94e73497f27341bf141abdf4c85230d41e7c" + integrity sha512-V5gRru+aD8YVyCOMAjMpWR1Ui577DD5KSJsHP8RAxopAH22jFz6GZd/qxqjO6MJHQhcsjvjOFXyDhyLQUnMveQ== dependencies: "@swc/counter" "^0.1.3" @@ -4980,9 +4980,9 @@ camelize@^1.0.0: integrity sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ== caniuse-lite@^1.0.30001579, caniuse-lite@^1.0.30001646, caniuse-lite@^1.0.30001669: - version "1.0.30001680" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001680.tgz#5380ede637a33b9f9f1fc6045ea99bd142f3da5e" - integrity sha512-rPQy70G6AGUMnbwS1z6Xg+RkHYPAi18ihs47GH0jcxIG7wArmPgY3XbS2sRdBbxJljp3thdT8BIqv9ccCypiPA== + version "1.0.30001683" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001683.tgz#7f026a2d5d319a9cf8915a1451173052caaadc81" + integrity sha512-iqmNnThZ0n70mNwvxpEC2nBJ037ZHZUoBI5Gorh1Mw6IlEAZujEoU1tXA628iZfzm7R9FvFzxbfdgml82a3k8Q== case-sensitive-paths-webpack-plugin@^2.4.0: version "2.4.0" @@ -7535,7 +7535,7 @@ grommet-theme-hpe@5.7.0: "grommet@https://github.com/grommet/grommet/tarball/stable": version "2.42.0" - resolved "https://github.com/grommet/grommet/tarball/stable#7bedb3e3864e0e4a435f1271c274550124d2a3c6" + resolved "https://github.com/grommet/grommet/tarball/stable#763c5b4920e5a86f23f3ab55d010f44839e767d0" dependencies: "@emotion/is-prop-valid" "^1.3.1" grommet-icons "^4.12.1" @@ -11574,9 +11574,9 @@ ps-tree@1.2.0: event-stream "=3.3.4" psl@^1.1.33: - version "1.10.0" - resolved "https://registry.yarnpkg.com/psl/-/psl-1.10.0.tgz#1450f7e16f922c3beeb7bd9db3f312635018fa15" - integrity sha512-KSKHEbjAnpUuAUserOq0FxGXCUrzC3WniuSJhvdbs102rL55266ZcHBqLWOsG30spQMlPdpy7icATiAQehg/iA== + version "1.12.0" + resolved "https://registry.yarnpkg.com/psl/-/psl-1.12.0.tgz#8b09cba186ebee68c0d824c1b22944cf5b2ad42c" + integrity sha512-OVcqwt4qWJF9G0fnSEMNz7aSa1PiGX/IvSXDO+PpbDK3r/IJ3QX2iu8ywanYG07e9IaYDigMu+EapE8TdMZOJQ== dependencies: punycode "^2.3.1" @@ -12690,11 +12690,11 @@ stop-iteration-iterator@^1.0.0: internal-slot "^1.0.4" storybook@^8.3.6: - version "8.4.4" - resolved "https://registry.yarnpkg.com/storybook/-/storybook-8.4.4.tgz#33fff732a79219866871e4f722ebcd82109b254a" - integrity sha512-xBOq3q/MuUUg3zM0imMMaK5ziKq3TO388jsnaiemJ4Uf0ZGwcHjM8HDBCDt0s5/CfsOQ49zo1ouZ3aNlu0qsUg== + version "8.4.5" + resolved "https://registry.yarnpkg.com/storybook/-/storybook-8.4.5.tgz#ba9589e2887958d1353dbc1a2cb6142e80e36a2c" + integrity sha512-9tfgabXnMibYp3SvoaJXXMD63Pw0SA9Hnf5v6TxysCYZs4DZ/04fAkK+9RW+K4C5JkV83qXMMlrsPj766R47fg== dependencies: - "@storybook/core" "8.4.4" + "@storybook/core" "8.4.5" stream-combiner@~0.0.4: version "0.0.4"