diff --git a/scripts/tokens/tokenVariableSyntaxAndDescriptionSnippet.js b/scripts/tokens/tokenVariableSyntaxAndDescriptionSnippet.js index 57684ec..8536bde 100644 --- a/scripts/tokens/tokenVariableSyntaxAndDescriptionSnippet.js +++ b/scripts/tokens/tokenVariableSyntaxAndDescriptionSnippet.js @@ -120,6 +120,7 @@ Promise.all([ ["VariableID:3919:36528", "var(--sds-color-border-danger-default)", ""], ["VariableID:3919:36529", "var(--sds-color-border-danger-secondary)", ""], ["VariableID:3919:36532", "var(--sds-color-border-disabled-default)", ""], + ["VariableID:3919:36533", "var(--sds-color-border-disabled-secondary)", ""], ["VariableID:4035:5558", "var(--sds-color-background-brand-secondary-hover)", "Bg/Brand/Secondary Hover"], ["VariableID:56:9309", "var(--sds-color-background-default-secondary-hover)", "Bg/Default/Secondary Hover"], ["VariableID:56:9310", "var(--sds-color-background-default-tertiary-hover)", "Bg/Default/Tertiary Hover"], @@ -160,9 +161,15 @@ Promise.all([ ["VariableID:9:11265", "var(--sds-size-space-negative-300)", ""], ["VariableID:9:11266", "var(--sds-size-space-negative-400)", ""], ["VariableID:9:11267", "var(--sds-size-space-negative-600)", ""], + ["VariableID:9:11268", "var(--sds-size-padding-xs)", ""], + ["VariableID:9:11269", "var(--sds-size-padding-sm)", ""], + ["VariableID:9:11271", "var(--sds-size-padding-lg)", ""], + ["VariableID:9:11272", "var(--sds-size-padding-xl)", ""], + ["VariableID:9:11273", "var(--sds-size-padding-xxl)", ""], ["VariableID:9:11274", "var(--sds-size-radius-100)", ""], ["VariableID:9:11275", "var(--sds-size-radius-200)", ""], ["VariableID:9:11277", "var(--sds-size-radius-400)", ""], + ["VariableID:9:11278", "var(--sds-size-radius-xl)", ""], ["VariableID:9:11280", "var(--sds-size-depth-0)", ""], ["VariableID:9:11281", "var(--sds-size-depth-025)", ""], ["VariableID:9:11282", "var(--sds-size-depth-100)", ""], diff --git a/scripts/tokens/tokens.json b/scripts/tokens/tokens.json index 3cba379..9108b20 100644 --- a/scripts/tokens/tokens.json +++ b/scripts/tokens/tokens.json @@ -468,6 +468,21 @@ } } }, + "border-width": { + "$type": "number", + "$value": 1, + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:9:11227", + "modes": { + "desktop": 1, + "mobile": 1, + "tablet": 1 + } + } + } + }, "scale": { "$type": "number", "$value": 1, @@ -484,1034 +499,1114 @@ } } }, - "@size": { + "@typography": { "$extensions": { "com.figma.sds": { - "figmaId": "VariableCollectionId:9:11257", + "figmaId": "VariableCollectionId:58:8567", "modes": [ - "default" + "mode_1" ] } }, - "space": { - "0": { - "$type": "number", - "$value": 0, + "title-hero": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:364:11151", + "figmaId": "VariableID:66:10188", "modes": { - "default": 0 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "100": { + "size": { "$type": "number", - "$value": 4, + "$value": "{@typography_primitives.Scale 10}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11258", + "figmaId": "VariableID:66:10189", "modes": { - "default": 4 + "mode_1": "{@typography_primitives.Scale 10}" } } } }, - "150": { - "$type": "number", - "$value": 6, + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Bold}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:364:11163", + "figmaId": "VariableID:66:10190", "modes": { - "default": 6 + "mode_1": "{@typography_primitives.Weight Bold}" } } } - }, - "200": { - "$type": "number", - "$value": 8, + } + }, + "title-page": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11259", + "figmaId": "VariableID:58:8569", "modes": { - "default": 8 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "300": { + "size-small": { "$type": "number", - "$value": 12, + "$value": "{@typography_primitives.Scale 07}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11260", + "figmaId": "VariableID:58:8574", "modes": { - "default": 12 + "mode_1": "{@typography_primitives.Scale 07}" } } } }, - "400": { + "size-base": { "$type": "number", - "$value": 16, + "$value": "{@typography_primitives.Scale 08}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11261", + "figmaId": "VariableID:66:10197", "modes": { - "default": 16 + "mode_1": "{@typography_primitives.Scale 08}" } } } }, - "600": { + "size-large": { "$type": "number", - "$value": 24, + "$value": "{@typography_primitives.Scale 09}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11262", + "figmaId": "VariableID:66:10198", "modes": { - "default": 24 + "mode_1": "{@typography_primitives.Scale 09}" } } } }, - "800": { - "$type": "number", - "$value": 32, + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Bold}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:346:10902", + "figmaId": "VariableID:58:8572", "modes": { - "default": 32 + "mode_1": "{@typography_primitives.Weight Bold}" } } } - }, - "1200": { - "$type": "number", - "$value": 48, + } + }, + "subtitle": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:346:10903", + "figmaId": "VariableID:66:10176", "modes": { - "default": 48 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "1600": { + "size-small": { "$type": "number", - "$value": 64, + "$value": "{@typography_primitives.Scale 05}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:107:11150", + "figmaId": "VariableID:66:10210", "modes": { - "default": 64 + "mode_1": "{@typography_primitives.Scale 05}" } } } }, - "2400": { + "size-base": { "$type": "number", - "$value": 96, + "$value": "{@typography_primitives.Scale 06}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:346:10904", + "figmaId": "VariableID:66:10177", "modes": { - "default": 96 + "mode_1": "{@typography_primitives.Scale 06}" } } } }, - "4000": { + "size-large": { "$type": "number", - "$value": 160, + "$value": "{@typography_primitives.Scale 07}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:346:10896", + "figmaId": "VariableID:66:10209", "modes": { - "default": 160 + "mode_1": "{@typography_primitives.Scale 07}" } } } }, - "050": { - "$type": "number", - "$value": 2, + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Regular}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:364:11161", + "figmaId": "VariableID:66:10178", "modes": { - "default": 2 + "mode_1": "{@typography_primitives.Weight Regular}" } } } - }, - "negative-100": { - "$type": "number", - "$value": -4, + } + }, + "heading": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11263", + "figmaId": "VariableID:66:10185", "modes": { - "default": -4 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "negative-200": { + "size-small": { "$type": "number", - "$value": -8, + "$value": "{@typography_primitives.Scale 04}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11264", + "figmaId": "VariableID:66:10212", "modes": { - "default": -8 + "mode_1": "{@typography_primitives.Scale 04}" } } } }, - "negative-300": { + "size-base": { "$type": "number", - "$value": -12, + "$value": "{@typography_primitives.Scale 05}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11265", + "figmaId": "VariableID:66:10186", "modes": { - "default": -12 + "mode_1": "{@typography_primitives.Scale 05}" } } } }, - "negative-400": { + "size-large": { "$type": "number", - "$value": -16, + "$value": "{@typography_primitives.Scale 06}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11266", + "figmaId": "VariableID:66:10211", "modes": { - "default": -16 + "mode_1": "{@typography_primitives.Scale 06}" } } } }, - "negative-600": { - "$type": "number", - "$value": -24, + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Semibold}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11267", + "figmaId": "VariableID:66:10187", "modes": { - "default": -24 + "mode_1": "{@typography_primitives.Weight Semibold}" } } } } }, - "radius": { - "100": { - "$type": "number", - "$value": 4, + "subheading": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11274", + "figmaId": "VariableID:2103:22306", "modes": { - "default": 4 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "200": { + "size-small": { "$type": "number", - "$value": 8, + "$value": "{@typography_primitives.Scale 03}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11275", + "figmaId": "VariableID:2103:22307", "modes": { - "default": 8 + "mode_1": "{@typography_primitives.Scale 03}" } } } }, - "400": { + "size-medium": { "$type": "number", - "$value": 16, + "$value": "{@typography_primitives.Scale 04}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11277", + "figmaId": "VariableID:2103:22308", "modes": { - "default": 16 + "mode_1": "{@typography_primitives.Scale 04}" } } } }, - "full": { + "size-large": { "$type": "number", - "$value": 9999, + "$value": "{@typography_primitives.Scale 05}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:56:9308", + "figmaId": "VariableID:2103:22309", "modes": { - "default": 9999 + "mode_1": "{@typography_primitives.Scale 05}" } } } - } - }, - "blur": { - "100": { - "$type": "number", - "$value": 4, + }, + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Regular}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:228:6769", + "figmaId": "VariableID:2103:22310", "modes": { - "default": 4 + "mode_1": "{@typography_primitives.Weight Regular}" } } } } }, - "depth": { - "0": { - "$type": "number", - "$value": 0, + "body": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Sans}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11280", + "figmaId": "VariableID:66:10179", "modes": { - "default": 0 + "mode_1": "{@typography_primitives.Family Sans}" } } } }, - "100": { + "size-small": { "$type": "number", - "$value": 4, + "$value": "{@typography_primitives.Scale 02}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11282", + "figmaId": "VariableID:66:10216", "modes": { - "default": 4 + "mode_1": "{@typography_primitives.Scale 02}" } } } }, - "200": { + "size-medium": { "$type": "number", - "$value": 8, + "$value": "{@typography_primitives.Scale 03}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11283", + "figmaId": "VariableID:66:10180", "modes": { - "default": 8 + "mode_1": "{@typography_primitives.Scale 03}" } } } }, - "400": { + "size-large": { "$type": "number", - "$value": 16, + "$value": "{@typography_primitives.Scale 04}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11284", + "figmaId": "VariableID:66:10215", "modes": { - "default": 16 + "mode_1": "{@typography_primitives.Scale 04}" } } } }, - "800": { - "$type": "number", - "$value": 32, + "font-weight-regular": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Regular}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11285", + "figmaId": "VariableID:66:10181", "modes": { - "default": 32 + "mode_1": "{@typography_primitives.Weight Regular}" } } } }, - "1200": { - "$type": "number", - "$value": 48, + "font-weight-strong": { + "$type": "fontWeight", + "$value": "{@typography_primitives.Weight Semibold}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11286", + "figmaId": "VariableID:66:14844", "modes": { - "default": 48 + "mode_1": "{@typography_primitives.Weight Semibold}" } } } }, - "025": { + "font-style-italic": { + "$type": "unknown", + "$value": "{@typography_primitives.Weight Regular Italic}", + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:66:14846", + "modes": { + "mode_1": "{@typography_primitives.Weight Regular Italic}" + } + } + } + } + }, + "code": { + "font-family": { + "$type": "fontFamily", + "$value": "{@typography_primitives.Family Mono}", + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:66:10182", + "modes": { + "mode_1": "{@typography_primitives.Family Mono}" + } + } + } + }, + "size-small": { "$type": "number", - "$value": 1, + "$value": "{@typography.Body.Size Small}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11281", + "figmaId": "VariableID:66:10218", "modes": { - "default": 1 + "mode_1": "{@typography.Body.Size Small}" } } } }, - "negative-025": { + "size-base": { "$type": "number", - "$value": -1, + "$value": "{@typography.Body.Size Medium}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11287", + "figmaId": "VariableID:66:10183", "modes": { - "default": -1 + "mode_1": "{@typography.Body.Size Medium}" } } } }, - "negative-100": { + "size-large": { "$type": "number", - "$value": -4, + "$value": "{@typography.Body.Size Large}", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11288", + "figmaId": "VariableID:66:10217", "modes": { - "default": -4 + "mode_1": "{@typography.Body.Size Large}" } } } }, - "negative-200": { + "font-weight": { + "$type": "fontWeight", + "$value": "{@typography.Body.Font Weight Regular}", + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:66:10184", + "modes": { + "mode_1": "{@typography.Body.Font Weight Regular}" + } + } + } + } + } + }, + "@size": { + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableCollectionId:9:11257", + "modes": [ + "default" + ] + } + }, + "space": { + "0": { "$type": "number", - "$value": -8, + "$value": 0, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11289", + "figmaId": "VariableID:364:11151", "modes": { - "default": -8 + "default": 0 } } } }, - "negative-400": { + "100": { "$type": "number", - "$value": -16, + "$value": 4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11290", + "figmaId": "VariableID:9:11258", "modes": { - "default": -16 + "default": 4 } } } }, - "negative-800": { + "150": { "$type": "number", - "$value": -32, + "$value": 6, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11291", + "figmaId": "VariableID:364:11163", "modes": { - "default": -32 + "default": 6 } } } }, - "negative-1200": { + "200": { "$type": "number", - "$value": -48, + "$value": 8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:9:11292", + "figmaId": "VariableID:9:11259", "modes": { - "default": -48 + "default": 8 } } } - } - }, - "stroke": { - "border": { + }, + "300": { "$type": "number", - "$value": 1, + "$value": 12, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:197:17450", + "figmaId": "VariableID:9:11260", "modes": { - "default": 1 + "default": 12 } } } }, - "focus-ring": { + "400": { "$type": "number", - "$value": 2, + "$value": 16, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:197:17451", + "figmaId": "VariableID:9:11261", "modes": { - "default": 2 + "default": 16 } } } - } - }, - "icon": { - "small": { + }, + "600": { "$type": "number", "$value": 24, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:409:8191", + "figmaId": "VariableID:9:11262", "modes": { "default": 24 } } } }, - "medium": { + "800": { "$type": "number", "$value": 32, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:409:8192", + "figmaId": "VariableID:346:10902", "modes": { "default": 32 } } } }, - "large": { + "1200": { "$type": "number", - "$value": 40, + "$value": 48, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:409:8193", + "figmaId": "VariableID:346:10903", "modes": { - "default": 40 + "default": 48 } } } - } - } - }, - "@typography": { - "$extensions": { - "com.figma.sds": { - "figmaId": "VariableCollectionId:58:8567", - "modes": [ - "mode_1" - ] - } - }, - "title-hero": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + }, + "1600": { + "$type": "number", + "$value": 64, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10188", + "figmaId": "VariableID:107:11150", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 64 } } } }, - "size": { + "2400": { "$type": "number", - "$value": "{@typography_primitives.Scale 10}", + "$value": 96, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10189", + "figmaId": "VariableID:346:10904", "modes": { - "mode_1": "{@typography_primitives.Scale 10}" + "default": 96 } } } }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Bold}", + "4000": { + "$type": "number", + "$value": 160, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10190", + "figmaId": "VariableID:346:10896", "modes": { - "mode_1": "{@typography_primitives.Weight Bold}" + "default": 160 } } } - } - }, - "title-page": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + }, + "050": { + "$type": "number", + "$value": 2, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:58:8569", + "figmaId": "VariableID:364:11161", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 2 } } } }, - "size-small": { + "negative-100": { "$type": "number", - "$value": "{@typography_primitives.Scale 07}", + "$value": -4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:58:8574", + "figmaId": "VariableID:9:11263", "modes": { - "mode_1": "{@typography_primitives.Scale 07}" + "default": -4 } } } }, - "size-base": { + "negative-200": { "$type": "number", - "$value": "{@typography_primitives.Scale 08}", + "$value": -8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10197", + "figmaId": "VariableID:9:11264", "modes": { - "mode_1": "{@typography_primitives.Scale 08}" + "default": -8 } } } }, - "size-large": { + "negative-300": { "$type": "number", - "$value": "{@typography_primitives.Scale 09}", + "$value": -12, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10198", + "figmaId": "VariableID:9:11265", "modes": { - "mode_1": "{@typography_primitives.Scale 09}" + "default": -12 } } } }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Bold}", + "negative-400": { + "$type": "number", + "$value": -16, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:58:8572", + "figmaId": "VariableID:9:11266", "modes": { - "mode_1": "{@typography_primitives.Weight Bold}" + "default": -16 + } + } + } + }, + "negative-600": { + "$type": "number", + "$value": -24, + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:9:11267", + "modes": { + "default": -24 } } } } }, - "subtitle": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + "padding": { + "xs": { + "$type": "number", + "$value": 4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10176", + "figmaId": "VariableID:9:11268", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 4 } } } }, - "size-small": { + "sm": { "$type": "number", - "$value": "{@typography_primitives.Scale 05}", + "$value": 8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10210", + "figmaId": "VariableID:9:11269", "modes": { - "mode_1": "{@typography_primitives.Scale 05}" + "default": 8 } } } }, - "size-base": { + "lg": { "$type": "number", - "$value": "{@typography_primitives.Scale 06}", + "$value": 16, + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:9:11271", + "modes": { + "default": 16 + } + } + } + }, + "xl": { + "$type": "number", + "$value": 24, + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:9:11272", + "modes": { + "default": 24 + } + } + } + }, + "xxl": { + "$type": "number", + "$value": 32, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10177", + "figmaId": "VariableID:9:11273", "modes": { - "mode_1": "{@typography_primitives.Scale 06}" + "default": 32 } } } - }, - "size-large": { + } + }, + "radius": { + "100": { "$type": "number", - "$value": "{@typography_primitives.Scale 07}", + "$value": 4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10209", + "figmaId": "VariableID:9:11274", "modes": { - "mode_1": "{@typography_primitives.Scale 07}" + "default": 4 } } } }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Regular}", + "200": { + "$type": "number", + "$value": 8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10178", + "figmaId": "VariableID:9:11275", "modes": { - "mode_1": "{@typography_primitives.Weight Regular}" + "default": 8 } } } - } - }, - "heading": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + }, + "400": { + "$type": "number", + "$value": 16, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10185", + "figmaId": "VariableID:9:11277", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 16 } } } }, - "size-small": { + "xl": { "$type": "number", - "$value": "{@typography_primitives.Scale 04}", + "$value": "UNKNOWN", "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10212", + "figmaId": "VariableID:9:11278", "modes": { - "mode_1": "{@typography_primitives.Scale 04}" + "default": "UNKNOWN" } } } }, - "size-base": { + "full": { "$type": "number", - "$value": "{@typography_primitives.Scale 05}", + "$value": 9999, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10186", + "figmaId": "VariableID:56:9308", "modes": { - "mode_1": "{@typography_primitives.Scale 05}" + "default": 9999 } } } - }, - "size-large": { + } + }, + "blur": { + "100": { "$type": "number", - "$value": "{@typography_primitives.Scale 06}", + "$value": 4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10211", + "figmaId": "VariableID:228:6769", "modes": { - "mode_1": "{@typography_primitives.Scale 06}" + "default": 4 } } } - }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Semibold}", + } + }, + "depth": { + "0": { + "$type": "number", + "$value": 0, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10187", + "figmaId": "VariableID:9:11280", "modes": { - "mode_1": "{@typography_primitives.Weight Semibold}" + "default": 0 } } } - } - }, - "subheading": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + }, + "100": { + "$type": "number", + "$value": 4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:2103:22306", + "figmaId": "VariableID:9:11282", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 4 } } } }, - "size-small": { + "200": { "$type": "number", - "$value": "{@typography_primitives.Scale 03}", + "$value": 8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:2103:22307", + "figmaId": "VariableID:9:11283", "modes": { - "mode_1": "{@typography_primitives.Scale 03}" + "default": 8 } } } }, - "size-medium": { + "400": { "$type": "number", - "$value": "{@typography_primitives.Scale 04}", + "$value": 16, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:2103:22308", + "figmaId": "VariableID:9:11284", "modes": { - "mode_1": "{@typography_primitives.Scale 04}" + "default": 16 } } } }, - "size-large": { + "800": { "$type": "number", - "$value": "{@typography_primitives.Scale 05}", + "$value": 32, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:2103:22309", + "figmaId": "VariableID:9:11285", "modes": { - "mode_1": "{@typography_primitives.Scale 05}" + "default": 32 } } } }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Regular}", + "1200": { + "$type": "number", + "$value": 48, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:2103:22310", + "figmaId": "VariableID:9:11286", "modes": { - "mode_1": "{@typography_primitives.Weight Regular}" + "default": 48 } } } - } - }, - "body": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Sans}", + }, + "025": { + "$type": "number", + "$value": 1, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10179", + "figmaId": "VariableID:9:11281", "modes": { - "mode_1": "{@typography_primitives.Family Sans}" + "default": 1 } } } }, - "size-small": { + "negative-025": { "$type": "number", - "$value": "{@typography_primitives.Scale 02}", + "$value": -1, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10216", + "figmaId": "VariableID:9:11287", "modes": { - "mode_1": "{@typography_primitives.Scale 02}" + "default": -1 } } } }, - "size-medium": { + "negative-100": { "$type": "number", - "$value": "{@typography_primitives.Scale 03}", + "$value": -4, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10180", + "figmaId": "VariableID:9:11288", "modes": { - "mode_1": "{@typography_primitives.Scale 03}" + "default": -4 } } } }, - "size-large": { + "negative-200": { "$type": "number", - "$value": "{@typography_primitives.Scale 04}", + "$value": -8, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10215", + "figmaId": "VariableID:9:11289", "modes": { - "mode_1": "{@typography_primitives.Scale 04}" + "default": -8 } } } }, - "font-weight-regular": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Regular}", + "negative-400": { + "$type": "number", + "$value": -16, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10181", + "figmaId": "VariableID:9:11290", "modes": { - "mode_1": "{@typography_primitives.Weight Regular}" + "default": -16 } } } }, - "font-weight-strong": { - "$type": "fontWeight", - "$value": "{@typography_primitives.Weight Semibold}", + "negative-800": { + "$type": "number", + "$value": -32, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:14844", + "figmaId": "VariableID:9:11291", "modes": { - "mode_1": "{@typography_primitives.Weight Semibold}" + "default": -32 } } } }, - "font-style-italic": { - "$type": "unknown", - "$value": "{@typography_primitives.Weight Regular Italic}", + "negative-1200": { + "$type": "number", + "$value": -48, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:14846", + "figmaId": "VariableID:9:11292", "modes": { - "mode_1": "{@typography_primitives.Weight Regular Italic}" + "default": -48 } } } } }, - "code": { - "font-family": { - "$type": "fontFamily", - "$value": "{@typography_primitives.Family Mono}", + "stroke": { + "border": { + "$type": "number", + "$value": 1, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10182", + "figmaId": "VariableID:197:17450", "modes": { - "mode_1": "{@typography_primitives.Family Mono}" + "default": 1 } } } }, - "size-small": { + "focus-ring": { "$type": "number", - "$value": "{@typography.Body.Size Small}", + "$value": 2, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10218", + "figmaId": "VariableID:197:17451", "modes": { - "mode_1": "{@typography.Body.Size Small}" + "default": 2 } } } - }, - "size-base": { + } + }, + "icon": { + "small": { "$type": "number", - "$value": "{@typography.Body.Size Medium}", + "$value": 24, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10183", + "figmaId": "VariableID:409:8191", "modes": { - "mode_1": "{@typography.Body.Size Medium}" + "default": 24 } } } }, - "size-large": { + "medium": { "$type": "number", - "$value": "{@typography.Body.Size Large}", + "$value": 32, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10217", + "figmaId": "VariableID:409:8192", "modes": { - "mode_1": "{@typography.Body.Size Large}" + "default": 32 } } } }, - "font-weight": { - "$type": "fontWeight", - "$value": "{@typography.Body.Font Weight Regular}", + "large": { + "$type": "number", + "$value": 40, "$description": "", "$extensions": { "com.figma.sds": { - "figmaId": "VariableID:66:10184", + "figmaId": "VariableID:409:8193", "modes": { - "mode_1": "{@typography.Body.Font Weight Regular}" + "default": 40 } } } @@ -4133,6 +4228,20 @@ } } } + }, + "secondary": { + "$type": "color", + "$value": "{@color_primitives.Slate.400}", + "$description": "", + "$extensions": { + "com.figma.sds": { + "figmaId": "VariableID:3919:36533", + "modes": { + "sds_light": "{@color_primitives.Slate.400}", + "sds_dark": "{@color_primitives.Brand.600}" + } + } + } } }, "utilities": { diff --git a/src/theme.css b/src/theme.css index e190a77..3b4c4fa 100644 --- a/src/theme.css +++ b/src/theme.css @@ -1,5 +1,5 @@ /* - * This file is automatically generated by script/tokens/app.mjs! + * This file is automatically generated by scripts/tokens/app.mjs! */ /* color_primitives: value (default) */ :root { @@ -147,6 +147,7 @@ --sds-color-border-default-secondary: var(--sds-color-gray-500); --sds-color-border-default-tertiary: var(--sds-color-gray-700); --sds-color-border-disabled-default: var(--sds-color-brand-400); + --sds-color-border-disabled-secondary: var(--sds-color-slate-400); --sds-color-border-neutral-default: var(--sds-color-slate-900); --sds-color-border-neutral-secondary: var(--sds-color-slate-600); --sds-color-border-neutral-tertiary: var(--sds-color-slate-400); @@ -287,6 +288,7 @@ --sds-color-border-default-secondary: var(--sds-color-gray-500); --sds-color-border-default-tertiary: var(--sds-color-gray-400); --sds-color-border-disabled-default: var(--sds-color-brand-600); + --sds-color-border-disabled-secondary: var(--sds-color-brand-600); --sds-color-border-neutral-default: var(--sds-color-slate-100); --sds-color-border-neutral-secondary: var(--sds-color-slate-500); --sds-color-border-neutral-tertiary: var(--sds-color-slate-600); @@ -393,10 +395,16 @@ --sds-size-icon-large: 2.5rem; --sds-size-icon-medium: 2rem; --sds-size-icon-small: 1.5rem; + --sds-size-padding-lg: 1rem; + --sds-size-padding-sm: 0.5rem; + --sds-size-padding-xl: 1.5rem; + --sds-size-padding-xs: 0.25rem; + --sds-size-padding-xxl: 2rem; --sds-size-radius-100: 0.25rem; --sds-size-radius-200: 0.5rem; --sds-size-radius-400: 1rem; --sds-size-radius-full: 624.9375rem; + --sds-size-radius-xl: unknown; --sds-size-space-0: 0rem; --sds-size-space-050: 0.125rem; --sds-size-space-100: 0.25rem; @@ -455,22 +463,14 @@ /* typography: mode_1 (default) */ :root { --sds-typography-body-font-family: var(--sds-typography-family-sans); - --sds-typography-body-font-style-italic: var( - --sds-typography-weight-regular-italic - ); - --sds-typography-body-font-weight-regular: var( - --sds-typography-weight-regular - ); - --sds-typography-body-font-weight-strong: var( - --sds-typography-weight-semibold - ); + --sds-typography-body-font-style-italic: var(--sds-typography-weight-regular-italic); + --sds-typography-body-font-weight-regular: var(--sds-typography-weight-regular); + --sds-typography-body-font-weight-strong: var(--sds-typography-weight-semibold); --sds-typography-body-size-large: var(--sds-typography-scale-04); --sds-typography-body-size-medium: var(--sds-typography-scale-03); --sds-typography-body-size-small: var(--sds-typography-scale-02); --sds-typography-code-font-family: var(--sds-typography-family-mono); - --sds-typography-code-font-weight: var( - --sds-typography-body-font-weight-regular - ); + --sds-typography-code-font-weight: var(--sds-typography-body-font-weight-regular); --sds-typography-code-size-base: var(--sds-typography-body-size-medium); --sds-typography-code-size-large: var(--sds-typography-body-size-large); --sds-typography-code-size-small: var(--sds-typography-body-size-small); @@ -500,97 +500,35 @@ } /* styles */ :root { - --sds-font-title-hero: normal var(--sds-typography-title-hero-font-weight) - var(--sds-typography-title-hero-size) - var(--sds-typography-title-hero-font-family); - --sds-font-title-page: normal var(--sds-typography-title-page-font-weight) - var(--sds-typography-title-page-size-base) - var(--sds-typography-title-page-font-family); - --sds-font-subtitle: normal var(--sds-typography-subtitle-font-weight) - var(--sds-typography-subtitle-size-base) - var(--sds-typography-subtitle-font-family); - --sds-font-heading: normal var(--sds-typography-heading-font-weight) - var(--sds-typography-heading-size-base) - var(--sds-typography-heading-font-family); - --sds-font-subheading: normal var(--sds-typography-subheading-font-weight) - var(--sds-typography-subheading-size-medium) - var(--sds-typography-subheading-font-family); - --sds-font-body-base: normal var(--sds-typography-body-font-weight-regular) - var(--sds-typography-body-size-medium) - var(--sds-typography-body-font-family); - --sds-font-body-strong: normal var(--sds-typography-body-font-weight-strong) - var(--sds-typography-body-size-medium) - var(--sds-typography-body-font-family); - --sds-font-body-emphasis: var(--sds-typography-body-font-style-italic) - var(--sds-typography-body-size-medium) - var(--sds-typography-body-font-family); - --sds-font-body-link: normal var(--sds-typography-body-font-weight-regular) - var(--sds-typography-body-size-medium) - var(--sds-typography-body-font-family); - --sds-font-body-small: normal var(--sds-typography-body-font-weight-regular) - var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); - --sds-font-body-small-strong: normal - var(--sds-typography-body-font-weight-strong) - var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); - --sds-font-single-line-body-base: normal - var(--sds-typography-body-font-weight-regular) - var(--sds-typography-body-size-medium) - var(--sds-typography-body-font-family); - --sds-font-body-code: normal var(--sds-typography-code-font-weight) - var(--sds-typography-code-size-base) var(--sds-typography-code-font-family); - --sds-font-single-line-body-small-strong: normal - var(--sds-typography-body-font-weight-strong) - var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); - --sds-font-utilities-component-notes-regular: normal - var(--sds-typography-weight-regular) var(--sds-typography-scale-03) - var(--sds-typography-family-mono); - --sds-font-utilities-component-notes-bold: normal - var(--sds-typography-weight-bold) var(--sds-typography-scale-03) - var(--sds-typography-family-mono); - --sds-effects-shadows-drop-shadow-300: var(--sds-size-depth-0) - var(--sds-size-depth-100) var(--sds-size-depth-100) - var(--sds-size-depth-negative-025) var(--sds-color-black-100), - var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) - var(--sds-size-depth-negative-025) var(--sds-color-black-200); - --sds-effects-shadows-drop-shadow-200: var(--sds-size-depth-0) - var(--sds-size-depth-025) var(--sds-size-depth-100) - var(--sds-size-depth-0) var(--sds-color-black-100), - var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) - var(--sds-size-depth-0) var(--sds-color-black-200); - --sds-effects-shadows-drop-shadow-100: var(--sds-size-depth-0) - var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) - var(--sds-color-black-100); - --sds-effects-shadows-drop-shadow-400: var(--sds-size-depth-0) - var(--sds-size-depth-100) var(--sds-size-depth-100) - var(--sds-size-depth-negative-100) var(--sds-color-black-100), - var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-800) - var(--sds-size-depth-negative-100) var(--sds-color-black-200); - --sds-effects-shadows-drop-shadow-500: var(--sds-size-depth-0) - var(--sds-size-depth-100) var(--sds-size-depth-100) - var(--sds-size-depth-negative-100) var(--sds-color-black-100), - var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-400) - var(--sds-size-depth-negative-200) var(--sds-color-black-200); - --sds-effects-shadows-drop-shadow-600: var(--sds-size-depth-0) - var(--sds-size-depth-400) var(--sds-size-depth-800) - var(--sds-size-depth-negative-200) var(--sds-color-black-400); - --sds-effects-shadows-inner-shadow-100: inset 0px var(--sds-size-depth-025) - var(--sds-size-blur-100) undefinedpx var(--sds-color-black-100); - --sds-effects-shadows-inner-shadow-200: inset var(--sds-size-depth-0) - var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) - var(--sds-color-black-100); - --sds-effects-shadows-inner-shadow-300: inset var(--sds-size-depth-0) - var(--sds-size-depth-100) var(--sds-size-depth-100) - var(--sds-size-depth-negative-025) var(--sds-color-black-100); - --sds-effects-shadows-inner-shadow-400: inset var(--sds-size-depth-0) - var(--sds-size-depth-400) var(--sds-size-depth-800) - var(--sds-size-depth-negative-100) var(--sds-color-black-200); - --sds-effects-shadows-inner-shadow-500: inset var(--sds-size-depth-0) - var(--sds-size-depth-400) var(--sds-size-depth-400) - var(--sds-size-depth-negative-200) var(--sds-color-black-200); - --sds-effects-shadows-inner-shadow-600: inset var(--sds-size-depth-0) - var(--sds-size-depth-400) var(--sds-size-depth-800) - var(--sds-size-depth-negative-200) var(--sds-color-black-400); + --sds-font-title-hero: normal var(--sds-typography-title-hero-font-weight) var(--sds-typography-title-hero-size) var(--sds-typography-title-hero-font-family); + --sds-font-title-page: normal var(--sds-typography-title-page-font-weight) var(--sds-typography-title-page-size-base) var(--sds-typography-title-page-font-family); + --sds-font-subtitle: normal var(--sds-typography-subtitle-font-weight) var(--sds-typography-subtitle-size-base) var(--sds-typography-subtitle-font-family); + --sds-font-heading: normal var(--sds-typography-heading-font-weight) var(--sds-typography-heading-size-base) var(--sds-typography-heading-font-family); + --sds-font-subheading: normal var(--sds-typography-subheading-font-weight) var(--sds-typography-subheading-size-medium) var(--sds-typography-subheading-font-family); + --sds-font-body-base: normal var(--sds-typography-body-font-weight-regular) var(--sds-typography-body-size-medium) var(--sds-typography-body-font-family); + --sds-font-body-strong: normal var(--sds-typography-body-font-weight-strong) var(--sds-typography-body-size-medium) var(--sds-typography-body-font-family); + --sds-font-body-emphasis: var(--sds-typography-body-font-style-italic) var(--sds-typography-body-size-medium) var(--sds-typography-body-font-family); + --sds-font-body-link: normal var(--sds-typography-body-font-weight-regular) var(--sds-typography-body-size-medium) var(--sds-typography-body-font-family); + --sds-font-body-small: normal var(--sds-typography-body-font-weight-regular) var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); + --sds-font-body-small-strong: normal var(--sds-typography-body-font-weight-strong) var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); + --sds-font-single-line-body-base: normal var(--sds-typography-body-font-weight-regular) var(--sds-typography-body-size-medium) var(--sds-typography-body-font-family); + --sds-font-body-code: normal var(--sds-typography-code-font-weight) var(--sds-typography-code-size-base) var(--sds-typography-code-font-family); + --sds-font-single-line-body-small-strong: normal var(--sds-typography-body-font-weight-strong) var(--sds-typography-body-size-small) var(--sds-typography-body-font-family); + --sds-font-utilities-component-notes-regular: normal var(--sds-typography-weight-regular) var(--sds-typography-scale-03) var(--sds-typography-family-mono); + --sds-font-utilities-component-notes-bold: normal var(--sds-typography-weight-bold) var(--sds-typography-scale-03) var(--sds-typography-family-mono); + --sds-effects-shadows-drop-shadow-300: var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) var(--sds-size-depth-negative-025) var(--sds-color-black-100), var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) var(--sds-size-depth-negative-025) var(--sds-color-black-200); + --sds-effects-shadows-drop-shadow-200: var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-100), var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-200); + --sds-effects-shadows-drop-shadow-100: var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-100); + --sds-effects-shadows-drop-shadow-400: var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) var(--sds-size-depth-negative-100) var(--sds-color-black-100), var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-800) var(--sds-size-depth-negative-100) var(--sds-color-black-200); + --sds-effects-shadows-drop-shadow-500: var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) var(--sds-size-depth-negative-100) var(--sds-color-black-100), var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-400) var(--sds-size-depth-negative-200) var(--sds-color-black-200); + --sds-effects-shadows-drop-shadow-600: var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-800) var(--sds-size-depth-negative-200) var(--sds-color-black-400); + --sds-effects-shadows-inner-shadow-100: inset 0px var(--sds-size-depth-025) var(--sds-size-blur-100) undefinedpx var(--sds-color-black-100); + --sds-effects-shadows-inner-shadow-200: inset var(--sds-size-depth-0) var(--sds-size-depth-025) var(--sds-size-depth-100) var(--sds-size-depth-0) var(--sds-color-black-100); + --sds-effects-shadows-inner-shadow-300: inset var(--sds-size-depth-0) var(--sds-size-depth-100) var(--sds-size-depth-100) var(--sds-size-depth-negative-025) var(--sds-color-black-100); + --sds-effects-shadows-inner-shadow-400: inset var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-800) var(--sds-size-depth-negative-100) var(--sds-color-black-200); + --sds-effects-shadows-inner-shadow-500: inset var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-400) var(--sds-size-depth-negative-200) var(--sds-color-black-200); + --sds-effects-shadows-inner-shadow-600: inset var(--sds-size-depth-0) var(--sds-size-depth-400) var(--sds-size-depth-800) var(--sds-size-depth-negative-200) var(--sds-color-black-400); --sds-effects-backdrop-filter-blur-overlay: blur(var(--sds-size-blur-100)); --sds-effects-filter-blur-layer: blur(var(--sds-size-blur-100)); --sds-effects-backdrop-filter-blur-glass: blur(var(--sds-size-blur-100)); -} +} \ No newline at end of file