Skip to content

Supports tokens imported from the Material 3 Design Kit - #8

Open
Kahoulam wants to merge 5 commits into
simpleclub:mainfrom
howflutter:develop
Open

Kahoulam wants to merge 5 commits into
simpleclub:mainfrom
howflutter:develop

Conversation

@Kahoulam

@Kahoulam Kahoulam commented Nov 26, 2023

Copy link
Copy Markdown

Description

This pull request adds support for the tokens imported from Material 3 Design Kit.

Related issues & PRs

Fixes #7, #9, #12

Code sample

tokens.json
{
  "global": {
    "M3": {
      "white": {
        "value": "#ffffff",
        "type": "color"
      },
      "black": {
        "value": "#000000",
        "type": "color"
      },
      "sys": {
        "light": {
          "primary": {
            "value": "#626200",
            "type": "color"
          },
          "on-primary": {
            "value": "#ffffff",
            "type": "color"
          },
          "primary-container": {
            "value": "#eaea00",
            "type": "color"
          },
          "on-primary-container": {
            "value": "#1d1d00",
            "type": "color"
          },
          "primary-fixed": {
            "value": "#eaea00",
            "type": "color"
          },
          "on-primary-fixed": {
            "value": "#1d1d00",
            "type": "color"
          },
          "primary-fixed-dim": {
            "value": "#cdcd00",
            "type": "color"
          },
          "on-primary-fixed-variant": {
            "value": "#494900",
            "type": "color"
          },
          "secondary": {
            "value": "#606043",
            "type": "color"
          },
          "on-secondary": {
            "value": "#ffffff",
            "type": "color"
          },
          "secondary-container": {
            "value": "#e7e4bf",
            "type": "color"
          },
          "on-secondary-container": {
            "value": "#1d1d06",
            "type": "color"
          },
          "secondary-fixed": {
            "value": "#e7e4bf",
            "type": "color"
          },
          "on-secondary-fixed": {
            "value": "#1d1d06",
            "type": "color"
          },
          "secondary-fixed-dim": {
            "value": "#cac8a5",
            "type": "color"
          },
          "on-secondary-fixed-variant": {
            "value": "#49482d",
            "type": "color"
          },
          "tertiary": {
            "value": "#3d6657",
            "type": "color"
          },
          "on-tertiary": {
            "value": "#ffffff",
            "type": "color"
          },
          "tertiary-container": {
            "value": "#bfecd8",
            "type": "color"
          },
          "on-tertiary-container": {
            "value": "#002117",
            "type": "color"
          },
          "tertiary-fixed": {
            "value": "#bfecd8",
            "type": "color"
          },
          "on-tertiary-fixed": {
            "value": "#002117",
            "type": "color"
          },
          "tertiary-fixed-dim": {
            "value": "#a4d0bd",
            "type": "color"
          },
          "on-tertiary-fixed-variant": {
            "value": "#254e40",
            "type": "color"
          },
          "error": {
            "value": "#ba1a1a",
            "type": "color"
          },
          "on-error": {
            "value": "#ffffff",
            "type": "color"
          },
          "error-container": {
            "value": "#ffdad6",
            "type": "color"
          },
          "on-error-container": {
            "value": "#410002",
            "type": "color"
          },
          "outline": {
            "value": "#797869",
            "type": "color"
          },
          "background": {
            "value": "#fffbff",
            "type": "color"
          },
          "on-background": {
            "value": "#1c1c17",
            "type": "color"
          },
          "surface": {
            "value": "#fdf9f0",
            "type": "color"
          },
          "on-surface": {
            "value": "#1c1c17",
            "type": "color"
          },
          "surface-variant": {
            "value": "#e6e3d1",
            "type": "color"
          },
          "on-surface-variant": {
            "value": "#48473a",
            "type": "color"
          },
          "inverse-surface": {
            "value": "#31312b",
            "type": "color"
          },
          "inverse-on-surface": {
            "value": "#f4f0e8",
            "type": "color"
          },
          "inverse-primary": {
            "value": "#cdcd00",
            "type": "color"
          },
          "shadow": {
            "value": "#000000",
            "type": "color"
          },
          "surface-tint": {
            "value": "#626200",
            "type": "color"
          },
          "outline-variant": {
            "value": "#cac7b6",
            "type": "color"
          },
          "scrim": {
            "value": "#000000",
            "type": "color"
          },
          "surface-container-highest": {
            "value": "#e6e2d9",
            "type": "color"
          },
          "surface-container-high": {
            "value": "#ebe8df",
            "type": "color"
          },
          "surface-container": {
            "value": "#f1eee5",
            "type": "color"
          },
          "surface-container-low": {
            "value": "#f7f3ea",
            "type": "color"
          },
          "surface-container-lowest": {
            "value": "#ffffff",
            "type": "color"
          },
          "surface-bright": {
            "value": "#fdf9f0",
            "type": "color"
          },
          "surface-dim": {
            "value": "#dddad1",
            "type": "color"
          }
        },
        "dark": {
          "primary": {
            "value": "{M3.key-colors.primary}",
            "type": "color"
          },
          "on-primary": {
            "value": "#323200",
            "type": "color"
          },
          "primary-container": {
            "value": "#494900",
            "type": "color"
          },
          "on-primary-container": {
            "value": "#eaea00",
            "type": "color"
          },
          "primary-fixed": {
            "value": "#eaea00",
            "type": "color"
          },
          "on-primary-fixed": {
            "value": "#1d1d00",
            "type": "color"
          },
          "primary-fixed-dim": {
            "value": "#cdcd00",
            "type": "color"
          },
          "on-primary-fixed-variant": {
            "value": "#494900",
            "type": "color"
          },
          "secondary": {
            "value": "#cac8a5",
            "type": "color"
          },
          "on-secondary": {
            "value": "#323218",
            "type": "color"
          },
          "secondary-container": {
            "value": "#49482d",
            "type": "color"
          },
          "on-secondary-container": {
            "value": "#e7e4bf",
            "type": "color"
          },
          "secondary-fixed": {
            "value": "#e7e4bf",
            "type": "color"
          },
          "on-secondary-fixed": {
            "value": "#1d1d06",
            "type": "color"
          },
          "secondary-fixed-dim": {
            "value": "#cac8a5",
            "type": "color"
          },
          "on-secondary-fixed-variant": {
            "value": "#49482d",
            "type": "color"
          },
          "tertiary": {
            "value": "#a4d0bd",
            "type": "color"
          },
          "on-tertiary": {
            "value": "#0b372a",
            "type": "color"
          },
          "tertiary-container": {
            "value": "#254e40",
            "type": "color"
          },
          "on-tertiary-container": {
            "value": "#bfecd8",
            "type": "color"
          },
          "tertiary-fixed": {
            "value": "#bfecd8",
            "type": "color"
          },
          "on-tertiary-fixed": {
            "value": "#002117",
            "type": "color"
          },
          "tertiary-fixed-dim": {
            "value": "#a4d0bd",
            "type": "color"
          },
          "on-tertiary-fixed-variant": {
            "value": "#254e40",
            "type": "color"
          },
          "error": {
            "value": "#ffb4ab",
            "type": "color"
          },
          "on-error": {
            "value": "#690005",
            "type": "color"
          },
          "error-container": {
            "value": "#93000a",
            "type": "color"
          },
          "on-error-container": {
            "value": "#ffdad6",
            "type": "color"
          },
          "outline": {
            "value": "#939182",
            "type": "color"
          },
          "background": {
            "value": "#1c1c17",
            "type": "color"
          },
          "on-background": {
            "value": "#e6e2d9",
            "type": "color"
          },
          "surface": {
            "value": "#14140f",
            "type": "color"
          },
          "on-surface": {
            "value": "#c9c6be",
            "type": "color"
          },
          "surface-variant": {
            "value": "#48473a",
            "type": "color"
          },
          "on-surface-variant": {
            "value": "#cac7b6",
            "type": "color"
          },
          "inverse-surface": {
            "value": "#e6e2d9",
            "type": "color"
          },
          "inverse-on-surface": {
            "value": "#1c1c17",
            "type": "color"
          },
          "inverse-primary": {
            "value": "#626200",
            "type": "color"
          },
          "shadow": {
            "value": "#000000",
            "type": "color"
          },
          "surface-tint": {
            "value": "#cdcd00",
            "type": "color"
          },
          "outline-variant": {
            "value": "#48473a",
            "type": "color"
          },
          "scrim": {
            "value": "#000000",
            "type": "color"
          },
          "surface-container-highest": {
            "value": "#36352f",
            "type": "color"
          },
          "surface-container-high": {
            "value": "#2b2a25",
            "type": "color"
          },
          "surface-container": {
            "value": "#20201a",
            "type": "color"
          },
          "surface-container-low": {
            "value": "#1c1c17",
            "type": "color"
          },
          "surface-container-lowest": {
            "value": "#0f0e0a",
            "type": "color"
          },
          "surface-bright": {
            "value": "#3a3933",
            "type": "color"
          },
          "surface-dim": {
            "value": "#14140f",
            "type": "color"
          }
        }
      },
      "ref": {
        "primary": {
          "primary0": {
            "value": "#000000",
            "type": "color"
          },
          "primary10": {
            "value": "#1d1d00",
            "type": "color"
          },
          "primary20": {
            "value": "#323200",
            "type": "color"
          },
          "primary30": {
            "value": "#494900",
            "type": "color"
          },
          "primary40": {
            "value": "#626200",
            "type": "color"
          },
          "primary50": {
            "value": "#7b7b00",
            "type": "color"
          },
          "primary60": {
            "value": "#969600",
            "type": "color"
          },
          "primary70": {
            "value": "#b1b100",
            "type": "color"
          },
          "primary80": {
            "value": "#cdcd00",
            "type": "color"
          },
          "primary90": {
            "value": "#eaea00",
            "type": "color"
          },
          "primary95": {
            "value": "#f9f900",
            "type": "color"
          },
          "primary99": {
            "value": "#fffbff",
            "type": "color"
          },
          "primary100": {
            "value": "#ffffff",
            "type": "color"
          },
          "primary4": {
            "value": "#0f0f00",
            "type": "color"
          },
          "primary5": {
            "value": "#121200",
            "type": "color"
          },
          "primary6": {
            "value": "#141400",
            "type": "color"
          },
          "primary12": {
            "value": "#212100",
            "type": "color"
          },
          "primary17": {
            "value": "#2c2c00",
            "type": "color"
          },
          "primary22": {
            "value": "#373700",
            "type": "color"
          },
          "primary24": {
            "value": "#3b3b00",
            "type": "color"
          },
          "primary25": {
            "value": "#3e3e00",
            "type": "color"
          },
          "primary35": {
            "value": "#555500",
            "type": "color"
          },
          "primary87": {
            "value": "#e1e100",
            "type": "color"
          },
          "primary92": {
            "value": "#f0f000",
            "type": "color"
          },
          "primary94": {
            "value": "#f6f600",
            "type": "color"
          },
          "primary96": {
            "value": "#fcfc00",
            "type": "color"
          },
          "primary98": {
            "value": "#fffeac",
            "type": "color"
          }
        },
        "secondary": {
          "secondary0": {
            "value": "#000000",
            "type": "color"
          },
          "secondary10": {
            "value": "#1d1d06",
            "type": "color"
          },
          "secondary20": {
            "value": "#323218",
            "type": "color"
          },
          "secondary30": {
            "value": "#49482d",
            "type": "color"
          },
          "secondary40": {
            "value": "#606043",
            "type": "color"
          },
          "secondary50": {
            "value": "#7a795a",
            "type": "color"
          },
          "secondary60": {
            "value": "#949272",
            "type": "color"
          },
          "secondary70": {
            "value": "#aead8b",
            "type": "color"
          },
          "secondary80": {
            "value": "#cac8a5",
            "type": "color"
          },
          "secondary90": {
            "value": "#e7e4bf",
            "type": "color"
          },
          "secondary95": {
            "value": "#f5f3cd",
            "type": "color"
          },
          "secondary99": {
            "value": "#fffbff",
            "type": "color"
          },
          "secondary100": {
            "value": "#ffffff",
            "type": "color"
          },
          "secondary4": {
            "value": "#0f0f00",
            "type": "color"
          },
          "secondary5": {
            "value": "#121201",
            "type": "color"
          },
          "secondary6": {
            "value": "#141402",
            "type": "color"
          },
          "secondary12": {
            "value": "#212109",
            "type": "color"
          },
          "secondary17": {
            "value": "#2b2b12",
            "type": "color"
          },
          "secondary22": {
            "value": "#36361c",
            "type": "color"
          },
          "secondary24": {
            "value": "#3b3a20",
            "type": "color"
          },
          "secondary25": {
            "value": "#3d3d22",
            "type": "color"
          },
          "secondary35": {
            "value": "#545438",
            "type": "color"
          },
          "secondary87": {
            "value": "#dedcb7",
            "type": "color"
          },
          "secondary92": {
            "value": "#eceac5",
            "type": "color"
          },
          "secondary94": {
            "value": "#f2f0ca",
            "type": "color"
          },
          "secondary96": {
            "value": "#f8f5cf",
            "type": "color"
          },
          "secondary98": {
            "value": "#fefbd5",
            "type": "color"
          }
        },
        "tertiary": {
          "tertiary0": {
            "value": "#000000",
            "type": "color"
          },
          "tertiary10": {
            "value": "#002117",
            "type": "color"
          },
          "tertiary20": {
            "value": "#0b372a",
            "type": "color"
          },
          "tertiary30": {
            "value": "#254e40",
            "type": "color"
          },
          "tertiary40": {
            "value": "#3d6657",
            "type": "color"
          },
          "tertiary50": {
            "value": "#567f6f",
            "type": "color"
          },
          "tertiary60": {
            "value": "#6f9a88",
            "type": "color"
          },
          "tertiary70": {
            "value": "#89b4a2",
            "type": "color"
          },
          "tertiary80": {
            "value": "#a4d0bd",
            "type": "color"
          },
          "tertiary90": {
            "value": "#bfecd8",
            "type": "color"
          },
          "tertiary95": {
            "value": "#cdfbe6",
            "type": "color"
          },
          "tertiary99": {
            "value": "#f4fff8",
            "type": "color"
          },
          "tertiary100": {
            "value": "#ffffff",
            "type": "color"
          },
          "tertiary4": {
            "value": "#00120b",
            "type": "color"
          },
          "tertiary5": {
            "value": "#00150d",
            "type": "color"
          },
          "tertiary6": {
            "value": "#00170f",
            "type": "color"
          },
          "tertiary12": {
            "value": "#00251a",
            "type": "color"
          },
          "tertiary17": {
            "value": "#033124",
            "type": "color"
          },
          "tertiary22": {
            "value": "#113c2e",
            "type": "color"
          },
          "tertiary24": {
            "value": "#164032",
            "type": "color"
          },
          "tertiary25": {
            "value": "#194334",
            "type": "color"
          },
          "tertiary35": {
            "value": "#315a4b",
            "type": "color"
          },
          "tertiary87": {
            "value": "#b7e4d0",
            "type": "color"
          },
          "tertiary92": {
            "value": "#c5f2de",
            "type": "color"
          },
          "tertiary94": {
            "value": "#cbf8e3",
            "type": "color"
          },
          "tertiary96": {
            "value": "#d0fee9",
            "type": "color"
          },
          "tertiary98": {
            "value": "#e7fff2",
            "type": "color"
          }
        },
        "error": {
          "error0": {
            "value": "#000000",
            "type": "color"
          },
          "error10": {
            "value": "#410002",
            "type": "color"
          },
          "error20": {
            "value": "#690005",
            "type": "color"
          },
          "error30": {
            "value": "#93000a",
            "type": "color"
          },
          "error40": {
            "value": "#ba1a1a",
            "type": "color"
          },
          "error50": {
            "value": "#de3730",
            "type": "color"
          },
          "error60": {
            "value": "#ff5449",
            "type": "color"
          },
          "error70": {
            "value": "#ff897d",
            "type": "color"
          },
          "error80": {
            "value": "#ffb4ab",
            "type": "color"
          },
          "error90": {
            "value": "#ffdad6",
            "type": "color"
          },
          "error95": {
            "value": "#ffedea",
            "type": "color"
          },
          "error99": {
            "value": "#fffbff",
            "type": "color"
          },
          "error100": {
            "value": "#ffffff",
            "type": "color"
          },
          "error4": {
            "value": "#280001",
            "type": "color"
          },
          "error5": {
            "value": "#2d0001",
            "type": "color"
          },
          "error6": {
            "value": "#310001",
            "type": "color"
          },
          "error12": {
            "value": "#490002",
            "type": "color"
          },
          "error17": {
            "value": "#5c0004",
            "type": "color"
          },
          "error22": {
            "value": "#710005",
            "type": "color"
          },
          "error24": {
            "value": "#790006",
            "type": "color"
          },
          "error25": {
            "value": "#7e0007",
            "type": "color"
          },
          "error35": {
            "value": "#a80710",
            "type": "color"
          },
          "error87": {
            "value": "#ffcfc9",
            "type": "color"
          },
          "error92": {
            "value": "#ffe2de",
            "type": "color"
          },
          "error94": {
            "value": "#ffe9e6",
            "type": "color"
          },
          "error96": {
            "value": "#fff0ee",
            "type": "color"
          },
          "error98": {
            "value": "#fff8f7",
            "type": "color"
          }
        },
        "neutral": {
          "neutral0": {
            "value": "#000000",
            "type": "color"
          },
          "neutral4": {
            "value": "#0f0e0a",
            "type": "color"
          },
          "neutral6": {
            "value": "#14140f",
            "type": "color"
          },
          "neutral10": {
            "value": "#1c1c17",
            "type": "color"
          },
          "neutral12": {
            "value": "#20201a",
            "type": "color"
          },
          "neutral17": {
            "value": "#2b2a25",
            "type": "color"
          },
          "neutral20": {
            "value": "#31312b",
            "type": "color"
          },
          "neutral22": {
            "value": "#36352f",
            "type": "color"
          },
          "neutral24": {
            "value": "#3a3933",
            "type": "color"
          },
          "neutral30": {
            "value": "#484741",
            "type": "color"
          },
          "neutral40": {
            "value": "#605e58",
            "type": "color"
          },
          "neutral50": {
            "value": "#797770",
            "type": "color"
          },
          "neutral60": {
            "value": "#939189",
            "type": "color"
          },
          "neutral70": {
            "value": "#aeaba3",
            "type": "color"
          },
          "neutral80": {
            "value": "#c9c6be",
            "type": "color"
          },
          "neutral87": {
            "value": "#dddad1",
            "type": "color"
          },
          "neutral90": {
            "value": "#e6e2d9",
            "type": "color"
          },
          "neutral92": {
            "value": "#ebe8df",
            "type": "color"
          },
          "neutral94": {
            "value": "#f1eee5",
            "type": "color"
          },
          "neutral95": {
            "value": "#f4f0e8",
            "type": "color"
          },
          "neutral96": {
            "value": "#f7f3ea",
            "type": "color"
          },
          "neutral99": {
            "value": "#fffbff",
            "type": "color"
          },
          "neutral100": {
            "value": "#ffffff",
            "type": "color"
          },
          "neutral5": {
            "value": "#11110c",
            "type": "color"
          },
          "neutral25": {
            "value": "#3c3c35",
            "type": "color"
          },
          "neutral35": {
            "value": "#54524c",
            "type": "color"
          },
          "neutral98": {
            "value": "#fdf9f0",
            "type": "color"
          }
        },
        "neutral-variant": {
          "neutral-variant0": {
            "value": "#000000",
            "type": "color"
          },
          "neutral-variant10": {
            "value": "#1c1c11",
            "type": "color"
          },
          "neutral-variant20": {
            "value": "#313125",
            "type": "color"
          },
          "neutral-variant30": {
            "value": "#48473a",
            "type": "color"
          },
          "neutral-variant40": {
            "value": "#605f51",
            "type": "color"
          },
          "neutral-variant50": {
            "value": "#797869",
            "type": "color"
          },
          "neutral-variant60": {
            "value": "#939182",
            "type": "color"
          },
          "neutral-variant70": {
            "value": "#aeac9b",
            "type": "color"
          },
          "neutral-variant80": {
            "value": "#cac7b6",
            "type": "color"
          },
          "neutral-variant90": {
            "value": "#e6e3d1",
            "type": "color"
          },
          "neutral-variant95": {
            "value": "#f4f1df",
            "type": "color"
          },
          "neutral-variant99": {
            "value": "#fffbff",
            "type": "color"
          },
          "neutral-variant100": {
            "value": "#ffffff",
            "type": "color"
          },
          "neutral-variant4": {
            "value": "#0f0f05",
            "type": "color"
          },
          "neutral-variant5": {
            "value": "#121107",
            "type": "color"
          },
          "neutral-variant6": {
            "value": "#14140a",
            "type": "color"
          },
          "neutral-variant12": {
            "value": "#202015",
            "type": "color"
          },
          "neutral-variant17": {
            "value": "#2b2b1f",
            "type": "color"
          },
          "neutral-variant22": {
            "value": "#363529",
            "type": "color"
          },
          "neutral-variant24": {
            "value": "#3a3a2d",
            "type": "color"
          },
          "neutral-variant25": {
            "value": "#3d3c2f",
            "type": "color"
          },
          "neutral-variant35": {
            "value": "#545345",
            "type": "color"
          },
          "neutral-variant87": {
            "value": "#dddac9",
            "type": "color"
          },
          "neutral-variant92": {
            "value": "#ece9d7",
            "type": "color"
          },
          "neutral-variant94": {
            "value": "#f2eedc",
            "type": "color"
          },
          "neutral-variant96": {
            "value": "#f7f4e2",
            "type": "color"
          },
          "neutral-variant98": {
            "value": "#fdfae7",
            "type": "color"
          }
        }
      },
      "key-colors": {
        "primary": {
          "value": "#ffff00",
          "type": "color"
        }
      },
      "source": {
        "seed": {
          "value": "#ffff00",
          "type": "color",
          "description": "TYPE: CUSTOM"
        }
      },
      "state-layers": {
        "light": {
          "primary": {
            "opacity-0": {
              "12": {
                "value": "#6750a41f",
                "type": "color"
              },
              "16": {
                "value": "#6750a429",
                "type": "color"
              },
              "08": {
                "value": "#6750a414",
                "type": "color"
              }
            }
          },
          "on-primary": {
            "opacity-0": {
              "12": {
                "value": "#ffffff1f",
                "type": "color"
              },
              "16": {
                "value": "#ffffff29",
                "type": "color"
              },
              "08": {
                "value": "#ffffff14",
                "type": "color"
              }
            }
          },
          "primary-container": {
            "opacity-0": {
              "12": {
                "value": "#eaddff1f",
                "type": "color"
              },
              "16": {
                "value": "#eaddff29",
                "type": "color"
              },
              "08": {
                "value": "#eaddff14",
                "type": "color"
              }
            }
          },
          "on-primary-container": {
            "opacity-0": {
              "12": {
                "value": "#21005d1f",
                "type": "color"
              },
              "16": {
                "value": "#21005d29",
                "type": "color"
              },
              "08": {
                "value": "#21005d14",
                "type": "color"
              }
            }
          },
          "primary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#eaddff1f",
                "type": "color"
              },
              "16": {
                "value": "#eaddff29",
                "type": "color"
              },
              "08": {
                "value": "#eaddff14",
                "type": "color"
              }
            }
          },
          "on-primary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#21005d1f",
                "type": "color"
              },
              "16": {
                "value": "#21005d29",
                "type": "color"
              },
              "08": {
                "value": "#21005d14",
                "type": "color"
              }
            }
          },
          "primary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#d0bcff1f",
                "type": "color"
              },
              "16": {
                "value": "#d0bcff29",
                "type": "color"
              },
              "08": {
                "value": "#d0bcff14",
                "type": "color"
              }
            }
          },
          "on-primary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#4f378b1f",
                "type": "color"
              },
              "16": {
                "value": "#4f378b29",
                "type": "color"
              },
              "08": {
                "value": "#4f378b14",
                "type": "color"
              }
            }
          },
          "secondary": {
            "opacity-0": {
              "12": {
                "value": "#625b711f",
                "type": "color"
              },
              "16": {
                "value": "#625b7129",
                "type": "color"
              },
              "08": {
                "value": "#625b7114",
                "type": "color"
              }
            }
          },
          "on-secondary": {
            "opacity-0": {
              "12": {
                "value": "#ffffff1f",
                "type": "color"
              },
              "16": {
                "value": "#ffffff29",
                "type": "color"
              },
              "08": {
                "value": "#ffffff14",
                "type": "color"
              }
            }
          },
          "secondary-container": {
            "opacity-0": {
              "12": {
                "value": "#e8def81f",
                "type": "color"
              },
              "16": {
                "value": "#e8def829",
                "type": "color"
              },
              "08": {
                "value": "#e8def814",
                "type": "color"
              }
            }
          },
          "on-secondary-container": {
            "opacity-0": {
              "12": {
                "value": "#1d192b1f",
                "type": "color"
              },
              "16": {
                "value": "#1d192b29",
                "type": "color"
              },
              "08": {
                "value": "#1d192b14",
                "type": "color"
              }
            }
          },
          "secondary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#e8def81f",
                "type": "color"
              },
              "16": {
                "value": "#e8def829",
                "type": "color"
              },
              "08": {
                "value": "#e8def814",
                "type": "color"
              }
            }
          },
          "on-secondary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#1d192b1f",
                "type": "color"
              },
              "16": {
                "value": "#1d192b29",
                "type": "color"
              },
              "08": {
                "value": "#1d192b14",
                "type": "color"
              }
            }
          },
          "secondary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#ccc2dc1f",
                "type": "color"
              },
              "16": {
                "value": "#ccc2dc29",
                "type": "color"
              },
              "08": {
                "value": "#ccc2dc14",
                "type": "color"
              }
            }
          },
          "on-secondary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#4a44581f",
                "type": "color"
              },
              "16": {
                "value": "#4a445829",
                "type": "color"
              },
              "08": {
                "value": "#4a445814",
                "type": "color"
              }
            }
          },
          "tertiary": {
            "opacity-0": {
              "12": {
                "value": "#7d52601f",
                "type": "color"
              },
              "16": {
                "value": "#7d526029",
                "type": "color"
              },
              "08": {
                "value": "#7d526014",
                "type": "color"
              }
            }
          },
          "on-tertiary": {
            "opacity-0": {
              "12": {
                "value": "#ffffff1f",
                "type": "color"
              },
              "16": {
                "value": "#ffffff29",
                "type": "color"
              },
              "08": {
                "value": "#ffffff14",
                "type": "color"
              }
            }
          },
          "tertiary-container": {
            "opacity-0": {
              "12": {
                "value": "#ffd8e41f",
                "type": "color"
              },
              "16": {
                "value": "#ffd8e429",
                "type": "color"
              },
              "08": {
                "value": "#ffd8e414",
                "type": "color"
              }
            }
          },
          "on-tertiary-container": {
            "opacity-0": {
              "12": {
                "value": "#31111d1f",
                "type": "color"
              },
              "16": {
                "value": "#31111d29",
                "type": "color"
              },
              "08": {
                "value": "#31111d14",
                "type": "color"
              }
            }
          },
          "tertiary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#ffd8e41f",
                "type": "color"
              },
              "16": {
                "value": "#ffd8e429",
                "type": "color"
              },
              "08": {
                "value": "#ffd8e414",
                "type": "color"
              }
            }
          },
          "on-tertiary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#31111d1f",
                "type": "color"
              },
              "16": {
                "value": "#31111d29",
                "type": "color"
              },
              "08": {
                "value": "#31111d14",
                "type": "color"
              }
            }
          },
          "tertiary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#efb8c81f",
                "type": "color"
              },
              "16": {
                "value": "#efb8c829",
                "type": "color"
              },
              "08": {
                "value": "#efb8c814",
                "type": "color"
              }
            }
          },
          "on-tertiary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#633b481f",
                "type": "color"
              },
              "16": {
                "value": "#633b4829",
                "type": "color"
              },
              "08": {
                "value": "#633b4814",
                "type": "color"
              }
            }
          },
          "error": {
            "opacity-0": {
              "12": {
                "value": "#b3261e1f",
                "type": "color"
              },
              "16": {
                "value": "#b3261e29",
                "type": "color"
              },
              "08": {
                "value": "#b3261e14",
                "type": "color"
              }
            }
          },
          "on-error": {
            "opacity-0": {
              "12": {
                "value": "#ffffff1f",
                "type": "color"
              },
              "16": {
                "value": "#ffffff29",
                "type": "color"
              },
              "08": {
                "value": "#ffffff14",
                "type": "color"
              }
            }
          },
          "error-container": {
            "opacity-0": {
              "12": {
                "value": "#f9dedc1f",
                "type": "color"
              },
              "16": {
                "value": "#f9dedc29",
                "type": "color"
              },
              "08": {
                "value": "#f9dedc14",
                "type": "color"
              }
            }
          },
          "on-error-container": {
            "opacity-0": {
              "12": {
                "value": "#410e0b1f",
                "type": "color"
              },
              "16": {
                "value": "#410e0b29",
                "type": "color"
              },
              "08": {
                "value": "#410e0b14",
                "type": "color"
              }
            }
          },
          "outline": {
            "opacity-0": {
              "12": {
                "value": "#79747e1f",
                "type": "color"
              },
              "16": {
                "value": "#79747e29",
                "type": "color"
              },
              "08": {
                "value": "#79747e14",
                "type": "color"
              }
            }
          },
          "background": {
            "opacity-0": {
              "12": {
                "value": "#fef7ff1f",
                "type": "color"
              },
              "16": {
                "value": "#fef7ff29",
                "type": "color"
              },
              "08": {
                "value": "#fef7ff14",
                "type": "color"
              }
            }
          },
          "on-background": {
            "opacity-0": {
              "12": {
                "value": "#1d1b201f",
                "type": "color"
              },
              "16": {
                "value": "#1d1b2029",
                "type": "color"
              },
              "08": {
                "value": "#1d1b2014",
                "type": "color"
              }
            }
          },
          "surface": {
            "opacity-0": {
              "12": {
                "value": "#fef7ff1f",
                "type": "color"
              },
              "16": {
                "value": "#fef7ff29",
                "type": "color"
              },
              "08": {
                "value": "#fef7ff14",
                "type": "color"
              }
            }
          },
          "on-surface": {
            "opacity-0": {
              "12": {
                "value": "#1d1b201f",
                "type": "color"
              },
              "16": {
                "value": "#1d1b2029",
                "type": "color"
              },
              "08": {
                "value": "#1d1b2014",
                "type": "color"
              }
            }
          },
          "surface-variant": {
            "opacity-0": {
              "12": {
                "value": "#e7e0ec1f",
                "type": "color"
              },
              "16": {
                "value": "#e7e0ec29",
                "type": "color"
              },
              "08": {
                "value": "#e7e0ec14",
                "type": "color"
              }
            }
          },
          "on-surface-variant": {
            "opacity-0": {
              "12": {
                "value": "#49454f1f",
                "type": "color"
              },
              "16": {
                "value": "#49454f29",
                "type": "color"
              },
              "08": {
                "value": "#49454f14",
                "type": "color"
              }
            }
          },
          "inverse-surface": {
            "opacity-0": {
              "12": {
                "value": "#322f351f",
                "type": "color"
              },
              "16": {
                "value": "#322f3529",
                "type": "color"
              },
              "08": {
                "value": "#322f3514",
                "type": "color"
              }
            }
          },
          "inverse-on-surface": {
            "opacity-0": {
              "12": {
                "value": "#f5eff71f",
                "type": "color"
              },
              "16": {
                "value": "#f5eff729",
                "type": "color"
              },
              "08": {
                "value": "#f5eff714",
                "type": "color"
              }
            }
          },
          "inverse-primary": {
            "opacity-0": {
              "12": {
                "value": "#d0bcff1f",
                "type": "color"
              },
              "16": {
                "value": "#d0bcff29",
                "type": "color"
              },
              "08": {
                "value": "#d0bcff14",
                "type": "color"
              }
            }
          },
          "shadow": {
            "opacity-0": {
              "12": {
                "value": "#0000001f",
                "type": "color"
              },
              "16": {
                "value": "#00000029",
                "type": "color"
              },
              "08": {
                "value": "#00000014",
                "type": "color"
              }
            }
          },
          "surface-tint": {
            "opacity-0": {
              "12": {
                "value": "#6750a41f",
                "type": "color"
              },
              "16": {
                "value": "#6750a429",
                "type": "color"
              },
              "08": {
                "value": "#6750a414",
                "type": "color"
              }
            }
          },
          "outline-variant": {
            "opacity-0": {
              "12": {
                "value": "#cac4d01f",
                "type": "color"
              },
              "16": {
                "value": "#cac4d029",
                "type": "color"
              },
              "08": {
                "value": "#cac4d014",
                "type": "color"
              }
            }
          },
          "scrim": {
            "opacity-0": {
              "12": {
                "value": "#0000001f",
                "type": "color"
              },
              "16": {
                "value": "#00000029",
                "type": "color"
              },
              "08": {
                "value": "#00000014",
                "type": "color"
              }
            }
          },
          "surface-container-highest": {
            "opacity-0": {
              "12": {
                "value": "#e6e0e91f",
                "type": "color"
              },
              "16": {
                "value": "#e6e0e929",
                "type": "color"
              },
              "08": {
                "value": "#e6e0e914",
                "type": "color"
              }
            }
          },
          "surface-container-high": {
            "opacity-0": {
              "12": {
                "value": "#ece6f01f",
                "type": "color"
              },
              "16": {
                "value": "#ece6f029",
                "type": "color"
              },
              "08": {
                "value": "#ece6f014",
                "type": "color"
              }
            }
          },
          "surface-container": {
            "opacity-0": {
              "12": {
                "value": "#f3edf71f",
                "type": "color"
              },
              "16": {
                "value": "#f3edf729",
                "type": "color"
              },
              "08": {
                "value": "#f3edf714",
                "type": "color"
              }
            }
          },
          "surface-container-low": {
            "opacity-0": {
              "12": {
                "value": "#f7f2fa1f",
                "type": "color"
              },
              "16": {
                "value": "#f7f2fa29",
                "type": "color"
              },
              "08": {
                "value": "#f7f2fa14",
                "type": "color"
              }
            }
          },
          "surface-container-lowest": {
            "opacity-0": {
              "12": {
                "value": "#ffffff1f",
                "type": "color"
              },
              "16": {
                "value": "#ffffff29",
                "type": "color"
              },
              "08": {
                "value": "#ffffff14",
                "type": "color"
              }
            }
          },
          "surface-bright": {
            "opacity-0": {
              "12": {
                "value": "#fef7ff1f",
                "type": "color"
              },
              "16": {
                "value": "#fef7ff29",
                "type": "color"
              },
              "08": {
                "value": "#fef7ff14",
                "type": "color"
              }
            }
          },
          "surface-dim": {
            "opacity-0": {
              "12": {
                "value": "#ded8e11f",
                "type": "color"
              },
              "16": {
                "value": "#ded8e129",
                "type": "color"
              },
              "08": {
                "value": "#ded8e114",
                "type": "color"
              }
            }
          }
        },
        "dark": {
          "primary": {
            "opacity-0": {
              "12": {
                "value": "#d0bcff1f",
                "type": "color"
              },
              "16": {
                "value": "#d0bcff29",
                "type": "color"
              },
              "08": {
                "value": "#d0bcff14",
                "type": "color"
              }
            }
          },
          "on-primary": {
            "opacity-0": {
              "12": {
                "value": "#381e721f",
                "type": "color"
              },
              "16": {
                "value": "#381e7229",
                "type": "color"
              },
              "08": {
                "value": "#381e7214",
                "type": "color"
              }
            }
          },
          "primary-container": {
            "opacity-0": {
              "12": {
                "value": "#4f378b1f",
                "type": "color"
              },
              "16": {
                "value": "#4f378b29",
                "type": "color"
              },
              "08": {
                "value": "#4f378b14",
                "type": "color"
              }
            }
          },
          "on-primary-container": {
            "opacity-0": {
              "12": {
                "value": "#eaddff1f",
                "type": "color"
              },
              "16": {
                "value": "#eaddff29",
                "type": "color"
              },
              "08": {
                "value": "#eaddff14",
                "type": "color"
              }
            }
          },
          "primary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#eaddff1f",
                "type": "color"
              },
              "16": {
                "value": "#eaddff29",
                "type": "color"
              },
              "08": {
                "value": "#eaddff14",
                "type": "color"
              }
            }
          },
          "on-primary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#21005d1f",
                "type": "color"
              },
              "16": {
                "value": "#21005d29",
                "type": "color"
              },
              "08": {
                "value": "#21005d14",
                "type": "color"
              }
            }
          },
          "primary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#d0bcff1f",
                "type": "color"
              },
              "16": {
                "value": "#d0bcff29",
                "type": "color"
              },
              "08": {
                "value": "#d0bcff14",
                "type": "color"
              }
            }
          },
          "on-primary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#4f378b1f",
                "type": "color"
              },
              "16": {
                "value": "#4f378b29",
                "type": "color"
              },
              "08": {
                "value": "#4f378b14",
                "type": "color"
              }
            }
          },
          "secondary": {
            "opacity-0": {
              "12": {
                "value": "#ccc2dc1f",
                "type": "color"
              },
              "16": {
                "value": "#ccc2dc29",
                "type": "color"
              },
              "08": {
                "value": "#ccc2dc14",
                "type": "color"
              }
            }
          },
          "on-secondary": {
            "opacity-0": {
              "12": {
                "value": "#332d411f",
                "type": "color"
              },
              "16": {
                "value": "#332d4129",
                "type": "color"
              },
              "08": {
                "value": "#332d4114",
                "type": "color"
              }
            }
          },
          "secondary-container": {
            "opacity-0": {
              "12": {
                "value": "#4a44581f",
                "type": "color"
              },
              "16": {
                "value": "#4a445829",
                "type": "color"
              },
              "08": {
                "value": "#4a445814",
                "type": "color"
              }
            }
          },
          "on-secondary-container": {
            "opacity-0": {
              "12": {
                "value": "#e8def81f",
                "type": "color"
              },
              "16": {
                "value": "#e8def829",
                "type": "color"
              },
              "08": {
                "value": "#e8def814",
                "type": "color"
              }
            }
          },
          "secondary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#e8def81f",
                "type": "color"
              },
              "16": {
                "value": "#e8def829",
                "type": "color"
              },
              "08": {
                "value": "#e8def814",
                "type": "color"
              }
            }
          },
          "on-secondary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#1d192b1f",
                "type": "color"
              },
              "16": {
                "value": "#1d192b29",
                "type": "color"
              },
              "08": {
                "value": "#1d192b14",
                "type": "color"
              }
            }
          },
          "secondary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#ccc2dc1f",
                "type": "color"
              },
              "16": {
                "value": "#ccc2dc29",
                "type": "color"
              },
              "08": {
                "value": "#ccc2dc14",
                "type": "color"
              }
            }
          },
          "on-secondary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#4a44581f",
                "type": "color"
              },
              "16": {
                "value": "#4a445829",
                "type": "color"
              },
              "08": {
                "value": "#4a445814",
                "type": "color"
              }
            }
          },
          "tertiary": {
            "opacity-0": {
              "12": {
                "value": "#efb8c81f",
                "type": "color"
              },
              "16": {
                "value": "#efb8c829",
                "type": "color"
              },
              "08": {
                "value": "#efb8c814",
                "type": "color"
              }
            }
          },
          "on-tertiary": {
            "opacity-0": {
              "12": {
                "value": "#4925321f",
                "type": "color"
              },
              "16": {
                "value": "#49253229",
                "type": "color"
              },
              "08": {
                "value": "#49253214",
                "type": "color"
              }
            }
          },
          "tertiary-container": {
            "opacity-0": {
              "12": {
                "value": "#633b481f",
                "type": "color"
              },
              "16": {
                "value": "#633b4829",
                "type": "color"
              },
              "08": {
                "value": "#633b4814",
                "type": "color"
              }
            }
          },
          "on-tertiary-container": {
            "opacity-0": {
              "12": {
                "value": "#ffd8e41f",
                "type": "color"
              },
              "16": {
                "value": "#ffd8e429",
                "type": "color"
              },
              "08": {
                "value": "#ffd8e414",
                "type": "color"
              }
            }
          },
          "tertiary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#ffd8e41f",
                "type": "color"
              },
              "16": {
                "value": "#ffd8e429",
                "type": "color"
              },
              "08": {
                "value": "#ffd8e414",
                "type": "color"
              }
            }
          },
          "on-tertiary-fixed": {
            "opacity-0": {
              "12": {
                "value": "#31111d1f",
                "type": "color"
              },
              "16": {
                "value": "#31111d29",
                "type": "color"
              },
              "08": {
                "value": "#31111d14",
                "type": "color"
              }
            }
          },
          "tertiary-fixed-dim": {
            "opacity-0": {
              "12": {
                "value": "#efb8c81f",
                "type": "color"
              },
              "16": {
                "value": "#efb8c829",
                "type": "color"
              },
              "08": {
                "value": "#efb8c814",
                "type": "color"
              }
            }
          },
          "on-tertiary-fixed-variant": {
            "opacity-0": {
              "12": {
                "value": "#633b481f",
                "type": "color"
              },
              "16": {
                "value": "#633b4829",
                "type": "color"
              },
              "08": {
                "value": "#633b4814",
                "type": "color"
              }
            }
          },
          "error": {
            "opacity-0": {
              "12": {
                "value": "#f2b8b51f",
                "type": "color"
              },
              "16": {
                "value": "#f2b8b529",
                "type": "color"
              },
              "08": {
                "value": "#f2b8b514",
                "type": "color"
              }
            }
          },
          "on-error": {
            "opacity-0": {
              "12": {
                "value": "#6014101f",
                "type": "color"
              },
              "16": {
                "value": "#60141029",
                "type": "color"
              },
              "08": {
                "value": "#60141014",
                "type": "color"
              }
            }
          },
          "error-container": {
            "opacity-0": {
              "12": {
                "value": "#8c1d181f",
                "type": "color"
              },
              "16": {
                "value": "#8c1d1829",
                "type": "color"
              },
              "08": {
                "value": "#8c1d1814",
                "type": "color"
              }
            }
          },
          "on-error-container": {
            "opacity-0": {
              "12": {
                "value": "#f9dedc1f",
                "type": "color"
              },
              "16": {
                "value": "#f9dedc29",
                "type": "color"
              },
              "08": {
                "value": "#f9dedc14",
                "type": "color"
              }
            }
          },
          "outline": {
            "opacity-0": {
              "12": {
                "value": "#938f991f",
                "type": "color"
              },
              "16": {
                "value": "#938f9929",
                "type": "color"
              },
              "08": {
                "value": "#938f9914",
                "type": "color"
              }
            }
          },
          "background": {
            "opacity-0": {
              "12": {
                "value": "#1412181f",
                "type": "color"
              },
              "16": {
                "value": "#14121829",
                "type": "color"
              },
              "08": {
                "value": "#14121814",
                "type": "color"
              }
            }
          },
          "on-background": {
            "opacity-0": {
              "12": {
                "value": "#e6e0e91f",
                "type": "color"
              },
              "16": {
                "value": "#e6e0e929",
                "type": "color"
              },
              "08": {
                "value": "#e6e0e914",
                "type": "color"
              }
            }
          },
          "surface": {
            "opacity-0": {
              "12": {
                "value": "#1412181f",
                "type": "color"
              },
              "16": {
                "value": "#14121829",
                "type": "color"
              },
              "08": {
                "value": "#14121814",
                "type": "color"
              }
            }
          },
          "on-surface": {
            "opacity-0": {
              "12": {
                "value": "#e6e0e91f",
                "type": "color"
              },
              "16": {
                "value": "#e6e0e929",
                "type": "color"
              },
              "08": {
                "value": "#e6e0e914",
                "type": "color"
              }
            }
          },
          "surface-variant": {
            "opacity-0": {
              "12": {
                "value": "#49454f1f",
                "type": "color"
              },
              "16": {
                "value": "#49454f29",
                "type": "color"
              },
              "08": {
                "value": "#49454f14",
                "type": "color"
              }
            }
          },
          "on-surface-variant": {
            "opacity-0": {
              "12": {
                "value": "#cac4d01f",
                "type": "color"
              },
              "16": {
                "value": "#cac4d029",
                "type": "color"
              },
              "08": {
                "value": "#cac4d014",
                "type": "color"
              }
            }
          },
          "inverse-surface": {
            "opacity-0": {
              "12": {
                "value": "#e6e0e91f",
                "type": "color"
              },
              "16": {
                "value": "#e6e0e929",
                "type": "color"
              },
              "08": {
                "value": "#e6e0e914",
                "type": "color"
              }
            }
          },
          "inverse-on-surface": {
            "opacity-0": {
              "12": {
                "value": "#322f351f",
                "type": "color"
              },
              "16": {
                "value": "#322f3529",
                "type": "color"
              },
              "08": {
                "value": "#322f3514",
                "type": "color"
              }
            }
          },
          "inverse-primary": {
            "opacity-0": {
              "12": {
                "value": "#6750a41f",
                "type": "color"
              },
              "16": {
                "value": "#6750a429",
                "type": "color"
              },
              "08": {
                "value": "#6750a414",
                "type": "color"
              }
            }
          },
          "shadow": {
            "opacity-0": {
              "12": {
                "value": "#0000001f",
                "type": "color"
              },
              "16": {
                "value": "#00000029",
                "type": "color"
              },
              "08": {
                "value": "#00000014",
                "type": "color"
              }
            }
          },
          "surface-tint": {
            "opacity-0": {
              "12": {
                "value": "#d0bcff1f",
                "type": "color"
              },
              "16": {
                "value": "#d0bcff29",
                "type": "color"
              },
              "08": {
                "value": "#d0bcff14",
                "type": "color"
              }
            }
          },
          "outline-variant": {
            "opacity-0": {
              "12": {
                "value": "#49454f1f",
                "type": "color"
              },
              "16": {
                "value": "#49454f29",
                "type": "color"
              },
              "08": {
                "value": "#49454f14",
                "type": "color"
              }
            }
          },
          "scrim": {
            "opacity-0": {
              "12": {
                "value": "#0000001f",
                "type": "color"
              },
              "16": {
                "value": "#00000029",
                "type": "color"
              },
              "08": {
                "value": "#00000014",
                "type": "color"
              }
            }
          },
          "surface-container-highest": {
            "opacity-0": {
              "12": {
                "value": "#36343b1f",
                "type": "color"
              },
              "16": {
                "value": "#36343b29",
                "type": "color"
              },
              "08": {
                "value": "#36343b14",
                "type": "color"
              }
            }
          },
          "surface-container-high": {
            "opacity-0": {
              "12": {
                "value": "#2b29301f",
                "type": "color"
              },
              "16": {
                "value": "#2b293029",
                "type": "color"
              },
              "08": {
                "value": "#2b293014",
                "type": "color"
              }
            }
          },
          "surface-container": {
            "opacity-0": {
              "12": {
                "value": "#211f261f",
                "type": "color"
              },
              "16": {
                "value": "#211f2629",
                "type": "color"
              },
              "08": {
                "value": "#211f2614",
                "type": "color"
              }
            }
          },
          "surface-container-low": {
            "opacity-0": {
              "12": {
                "value": "#1d1b201f",
                "type": "color"
              },
              "16": {
                "value": "#1d1b2029",
                "type": "color"
              },
              "08": {
                "value": "#1d1b2014",
                "type": "color"
              }
            }
          },
          "surface-container-lowest": {
            "opacity-0": {
              "12": {
                "value": "#0f0d131f",
                "type": "color"
              },
              "16": {
                "value": "#0f0d1329",
                "type": "color"
              },
              "08": {
                "value": "#0f0d1314",
                "type": "color"
              }
            }
          },
          "surface-bright": {
            "opacity-0": {
              "12": {
                "value": "#3b383e1f",
                "type": "color"
              },
              "16": {
                "value": "#3b383e29",
                "type": "color"
              },
              "08": {
                "value": "#3b383e14",
                "type": "color"
              }
            }
          },
          "surface-dim": {
            "opacity-0": {
              "12": {
                "value": "#1412181f",
                "type": "color"
              },
              "16": {
                "value": "#14121829",
                "type": "color"
              },
              "08": {
                "value": "#14121814",
                "type": "color"
              }
            }
          }
        }
      },
      "Elevation Light": {
        "1": {
          "value": [
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 2,
              "spread": 0
            },
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 3,
              "spread": 1
            }
          ],
          "type": "boxShadow"
        },
        "2": {
          "value": [
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 2,
              "spread": 0
            },
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 2,
              "blur": 6,
              "spread": 2
            }
          ],
          "type": "boxShadow"
        },
        "3": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 4,
              "blur": 8,
              "spread": 3
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 3,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "4": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 6,
              "blur": 10,
              "spread": 4
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 2,
              "blur": 3,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "5": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 8,
              "blur": 12,
              "spread": 6
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 4,
              "blur": 4,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        }
      },
      "Elevation Dark": {
        "1": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 3,
              "spread": 1
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 2,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "2": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 2,
              "blur": 6,
              "spread": 2
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 2,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "3": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 4,
              "blur": 8,
              "spread": 3
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 1,
              "blur": 3,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "4": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 6,
              "blur": 10,
              "spread": 4
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 2,
              "blur": 3,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        },
        "5": {
          "value": [
            {
              "color": "#00000026",
              "type": "dropShadow",
              "x": 0,
              "y": 8,
              "blur": 12,
              "spread": 6
            },
            {
              "color": "#0000004d",
              "type": "dropShadow",
              "x": 0,
              "y": 4,
              "blur": 4,
              "spread": 0
            }
          ],
          "type": "boxShadow"
        }
      },
      "display": {
        "large": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.0}",
            "fontSize": "{fontSize.10}",
            "letterSpacing": "{letterSpacing.0}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.1}",
            "fontSize": "{fontSize.9}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "small": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.2}",
            "fontSize": "{fontSize.8}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        }
      },
      "headline": {
        "large": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.3}",
            "fontSize": "{fontSize.7}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.4}",
            "fontSize": "{fontSize.6}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "small": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.5}",
            "fontSize": "{fontSize.5}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        }
      },
      "title": {
        "large": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.6}",
            "fontSize": "{fontSize.4}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-1}",
            "lineHeight": "{lineHeights.7}",
            "fontSize": "{fontSize.3}",
            "letterSpacing": "{letterSpacing.2}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "small": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-1}",
            "lineHeight": "{lineHeights.8}",
            "fontSize": "{fontSize.2}",
            "letterSpacing": "{letterSpacing.3}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        }
      },
      "body": {
        "large": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.7}",
            "fontSize": "{fontSize.3}",
            "letterSpacing": "{letterSpacing.4}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.8}",
            "fontSize": "{fontSize.2}",
            "letterSpacing": "{letterSpacing.5}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "small": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-0}",
            "lineHeight": "{lineHeights.9}",
            "fontSize": "{fontSize.1}",
            "letterSpacing": "{letterSpacing.1}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography",
          "description": "0.4"
        }
      },
      "label": {
        "large - prominent": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-2}",
            "lineHeight": "{lineHeights.8}",
            "fontSize": "{fontSize.2}",
            "letterSpacing": "{letterSpacing.3}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "large": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-1}",
            "lineHeight": "{lineHeights.8}",
            "fontSize": "{fontSize.2}",
            "letterSpacing": "{letterSpacing.3}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium - prominent": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-2}",
            "lineHeight": "{lineHeights.9}",
            "fontSize": "{fontSize.1}",
            "letterSpacing": "{letterSpacing.4}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "medium": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-1}",
            "lineHeight": "{lineHeights.9}",
            "fontSize": "{fontSize.1}",
            "letterSpacing": "{letterSpacing.4}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        },
        "small": {
          "value": {
            "fontFamily": "{fontFamilies.roboto}",
            "fontWeight": "{fontWeights.roboto-1}",
            "lineHeight": "{lineHeights.9}",
            "fontSize": "{fontSize.0}",
            "letterSpacing": "{letterSpacing.4}",
            "paragraphSpacing": "{paragraphSpacing.0}",
            "paragraphIndent": "{paragraphIndent.0}",
            "textCase": "{textCase.none}",
            "textDecoration": "{textDecoration.none}"
          },
          "type": "typography"
        }
      }
    },
    "fontFamilies": {
      "roboto": {
        "value": "Roboto",
        "type": "fontFamilies"
      }
    },
    "lineHeights": {
      "0": {
        "value": "64",
        "type": "lineHeights"
      },
      "1": {
        "value": "52",
        "type": "lineHeights"
      },
      "2": {
        "value": "44",
        "type": "lineHeights"
      },
      "3": {
        "value": "40",
        "type": "lineHeights"
      },
      "4": {
        "value": "36",
        "type": "lineHeights"
      },
      "5": {
        "value": "32",
        "type": "lineHeights"
      },
      "6": {
        "value": "28",
        "type": "lineHeights"
      },
      "7": {
        "value": "24",
        "type": "lineHeights"
      },
      "8": {
        "value": "20",
        "type": "lineHeights"
      },
      "9": {
        "value": "16",
        "type": "lineHeights"
      }
    },
    "fontWeights": {
      "roboto-0": {
        "value": "Regular",
        "type": "fontWeights"
      },
      "roboto-1": {
        "value": "Medium",
        "type": "fontWeights"
      },
      "roboto-2": {
        "value": "SemiBold",
        "type": "fontWeights"
      }
    },
    "fontSize": {
      "0": {
        "value": "11",
        "type": "fontSizes"
      },
      "1": {
        "value": "12",
        "type": "fontSizes"
      },
      "2": {
        "value": "14",
        "type": "fontSizes"
      },
      "3": {
        "value": "16",
        "type": "fontSizes"
      },
      "4": {
        "value": "22",
        "type": "fontSizes"
      },
      "5": {
        "value": "24",
        "type": "fontSizes"
      },
      "6": {
        "value": "28",
        "type": "fontSizes"
      },
      "7": {
        "value": "32",
        "type": "fontSizes"
      },
      "8": {
        "value": "36",
        "type": "fontSizes"
      },
      "9": {
        "value": "45",
        "type": "fontSizes"
      },
      "10": {
        "value": "57",
        "type": "fontSizes"
      }
    },
    "letterSpacing": {
      "0": {
        "value": "-0.25",
        "type": "letterSpacing"
      },
      "1": {
        "value": "0%",
        "type": "letterSpacing"
      },
      "2": {
        "value": "0.15",
        "type": "letterSpacing"
      },
      "3": {
        "value": "0.1",
        "type": "letterSpacing"
      },
      "4": {
        "value": "0.5",
        "type": "letterSpacing"
      },
      "5": {
        "value": "0.25",
        "type": "letterSpacing"
      }
    },
    "paragraphSpacing": {
      "0": {
        "value": "0",
        "type": "paragraphSpacing"
      }
    },
    "textCase": {
      "none": {
        "value": "none",
        "type": "textCase"
      }
    },
    "textDecoration": {
      "none": {
        "value": "none",
        "type": "textDecoration"
      }
    },
    "paragraphIndent": {
      "0": {
        "value": "0px",
        "type": "dimension"
      }
    }
  },
  "$themes": [],
  "$metadata": {
    "tokenSetOrder": [
      "global"
    ]
  }
}

Checklist

  • I added a PR description.
  • I linked all related issues and PRs I could find (no links if there are none).
  • If there is new functionality in code, I added tests covering all my additions.

@codecov-commenter

codecov-commenter commented Nov 26, 2023

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 94.11765% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 80.28%. Comparing base (8304c62) to head (369c1c6).
⚠️ Report is 3 commits behind head on main.

Files with missing lines Patch % Lines
lib/factory/token_set_factory.dart 50.00% 1 Missing ⚠️
Additional details and impacted files
@@           Coverage Diff           @@
##             main       #8   +/-   ##
=======================================
  Coverage   80.28%   80.28%           
=======================================
  Files          23       23           
  Lines         497      497           
=======================================
  Hits          399      399           
  Misses         98       98           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

@Kahoulam Kahoulam left a comment

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

refactor: add trailing comma

@Sese-Schneider Sese-Schneider left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM from my side.
@tomkuschka please have a look also.

@Kahoulam I would love to see a unit test added/adjusted for the change you've introduced please!

New FigmaFontWeight enum with tryParse method

Closes: simpleclub#9
@Kahoulam

Copy link
Copy Markdown
Author

LGTM from my side. @tomkuschka please have a look also.

@Kahoulam I would love to see a unit test added/adjusted for the change you've introduced please!

I've added a unit test for the change. Please let me know if you have any other questions.

@Kahoulam Kahoulam left a comment

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

feat: supports Figma FontWeight

New FigmaFontWeight enum with tryParse method

Closes: #9

@Kahoulam Kahoulam changed the title feat: DimensionParser.buildValue supports int type Supports tokens imported from the Material 3 Design Kit Nov 26, 2023
@Kahoulam

Copy link
Copy Markdown
Author
tokens.json
{
  "global": {
    "fontWeights": {
      "roboto-0": {
        "value": "400",
        "type": "fontWeights"
      },
      "roboto-1": {
        "value": "Medium",
        "type": "fontWeights"
      },
      "roboto-2": {
        "value": "SemiBold",
        "type": "fontWeights"
      }
    }
  },
  "$themes": [],
  "$metadata": {
    "tokenSetOrder": [
      "global"
    ]
  }
}

@Sese-Schneider The _resolveAliasesAndMath (lib/utils/transformer_utils.dart) method will convert "400" to "400.0", is this necessary?

@Kahoulam Kahoulam left a comment

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fix: type cast error

Change defaultSys type to be nullable

Closes: #12

@tomkuschka tomkuschka left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice change!

@Sese-Schneider Sese-Schneider removed their assignment Jan 26, 2024
@CLAassistant

Copy link
Copy Markdown

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
You have signed the CLA already but the status is still pending? Let us recheck it.

@sonarqubecloud

Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Development

Successfully merging this pull request may close these issues.

Exception: Unable to parse dimension value with data: 0

5 participants