Re: [community-group] Typography type feedback (#102)

Are all properties of a composite `typography` token required?

I'd like to define _partial_ token definitions so that I can compose more complex styles after translation?

```
               { fontFamily, fontWeight }
+ { fontSize, lineHeight, letterSpacing }
-----------------------------------------
{ fontFamily, fontWeight, fontSize, lineHeight, letterSpacing }
```

-----

### Context
I've got a slew of various font + style combinations for my typography styles (3 different fonts, 10 different styles/font), and I'd like to minimize the amount of duplicate definitions.

I'm thinking that I could define a "base" token, that defines common styles among typography tokens for a particular font, so that I can compose a final value out of `base` + `style`, as follows...

```json5
{
  "type": {
    "base": {
      "$type": "typography",
      "$value": {
        "fontFamily": [ "Arial", "sans-serif" ],
        "fontWeight": 400,
      }
    },
    "heading1": {
      "$value": {
        "fontSize": "48px",
        "lineHeight": "1.25",
        "letterSpacing": "0px",
      }
    }
  }
}
```

When I apply this to Sass, I should then be able to compose a final definition as follows...

```scss
@use "sass:map";

// generated from tokens.json
$type-base: (
  "fontFamily": (Arial, sans-serif),
  "fontWeight": 400
);
$type-heading1: (
  "fontSize": 48px,
  "lineHeight": 1.25,
  "letterSpacing": 0px
);

// manually composed style Map
$heading1: map.merge($type-base, $type-heading1);
// ^^ should be equivalent to...
$heading1: (
  "fontFamily": (Arial, sans-serif),
  "fontWeight": 400,
  "fontSize": 48px,
  "lineHeight": 1.25,
  "letterSpacing": 0px
);
```

-- 
GitHub Notification of comment by CITguy
Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/102#issuecomment-1306087455 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 7 November 2022 19:29:27 UTC