diff --git a/src/tokens/figma.tokens.json b/src/tokens/figma.tokens.json index c2661fa..c5f45f2 100644 --- a/src/tokens/figma.tokens.json +++ b/src/tokens/figma.tokens.json @@ -2520,6 +2520,30 @@ } } }, + "components/tooltip": { + "tooltip": { + "background": { + "dark": { + "value": "{color.grays.900}", + "type": "color" + }, + "light": { + "value": "{color.grays.200}", + "type": "color" + } + }, + "icon": { + "color": { + "value": "{color.text.white}", + "type": "color" + }, + "background": { + "value": "{color.primary.dark}", + "type": "color" + } + } + } + }, "storybook": { "colors": { "sb": { @@ -2786,7 +2810,9 @@ "components/announcement": "enabled", "components/banner": "enabled", "components/footer": "enabled", - "components/header": "enabled" + "components/header": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "$figmaCollectionId": "VariableCollectionId:23237:16908", "$figmaModeId": "23237:10", @@ -3076,7 +3102,9 @@ "components/status": "enabled", "components/table": "enabled", "components/tabs": "enabled", - "components/textField": "enabled" + "components/textField": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "$figmaCollectionId": "VariableCollectionId:23237:17145", "$figmaModeId": "23237:14", @@ -3229,7 +3257,9 @@ "components/table": "enabled", "components/tabs": "enabled", "components/textField": "enabled", - "semantic": "enabled" + "semantic": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "group": "WUP" }, @@ -3256,7 +3286,9 @@ "components/status": "enabled", "components/table": "enabled", "components/tabs": "enabled", - "components/textField": "enabled" + "components/textField": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "group": "WUP" } @@ -3288,6 +3320,7 @@ "components/table", "components/tabs", "components/textField", + "components/tooltip", "storybook" ] } diff --git a/src/tokens/tokens.scss b/src/tokens/tokens.scss index 55042de..b3b6602 100644 --- a/src/tokens/tokens.scss +++ b/src/tokens/tokens.scss @@ -7,6 +7,10 @@ --colors-sb-text-body: #00202e; --colors-sb-text-heading: #0080b7; --colors-sb-visualization: #009fe4; + --tooltip-background-dark: #101618; + --tooltip-background-light: #d4d7d8; + --tooltip-icon-color: #ffffff; + --tooltip-icon-background: #0080b7; --text-field-border-width: 1px; --text-field-radius: 0.625rem; --text-field-border: [object Object]; @@ -411,7 +415,8 @@ --token-set-order-22: components/table; --token-set-order-23: components/tabs; --token-set-order-24: components/textField; - --token-set-order-25: storybook; + --token-set-order-25: components/tooltip; + --token-set-order-26: storybook; --emulsify-ui-kit-full: [object Object]; --emulsify-global: [object Object]; --emulsify-semantic: [object Object]; diff --git a/src/tokens/tokensTransform.js b/src/tokens/tokensTransform.mjs similarity index 100% rename from src/tokens/tokensTransform.js rename to src/tokens/tokensTransform.mjs diff --git a/src/tokens/transformed.tokens.json b/src/tokens/transformed.tokens.json index e2a2c8c..f8f0eb7 100644 --- a/src/tokens/transformed.tokens.json +++ b/src/tokens/transformed.tokens.json @@ -21,6 +21,28 @@ } } }, + "tooltip": { + "background": { + "dark": { + "value": "#101618", + "type": "color" + }, + "light": { + "value": "#d4d7d8", + "type": "color" + } + }, + "icon": { + "color": { + "value": "#ffffff", + "type": "color" + }, + "background": { + "value": "#0080b7", + "type": "color" + } + } + }, "textField": { "borderWidth": { "value": 1, @@ -2554,6 +2576,10 @@ "type": "other" }, "25": { + "value": "components/tooltip", + "type": "other" + }, + "26": { "value": "storybook", "type": "other" } @@ -2798,7 +2824,9 @@ "components/announcement": "enabled", "components/banner": "enabled", "components/footer": "enabled", - "components/header": "enabled" + "components/header": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "$figmaCollectionId": "VariableCollectionId:23237:16908", "$figmaModeId": "23237:10", @@ -3092,7 +3120,9 @@ "components/status": "enabled", "components/table": "enabled", "components/tabs": "enabled", - "components/textField": "enabled" + "components/textField": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "$figmaCollectionId": "VariableCollectionId:23237:17145", "$figmaModeId": "23237:14", @@ -3246,7 +3276,9 @@ "components/table": "enabled", "components/tabs": "enabled", "components/textField": "enabled", - "semantic": "enabled" + "semantic": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "group": "WUP", "type": "other", @@ -3274,7 +3306,9 @@ "components/status": "enabled", "components/table": "enabled", "components/tabs": "enabled", - "components/textField": "enabled" + "components/textField": "enabled", + "components/utilityMenu": "enabled", + "components/tooltip": "enabled" }, "group": "WUP", "type": "other",