@daikin-oss/dds-tokens 0.0.0 → 0.2.0

package/themes/reference.json

@@ -0,0 +1,681 @@
+{
+  "color": {
+    "blue": {
+      "10": {
+        "value": "#DDF3FC",
+        "type": "color"
+      },
+      "20": {
+        "value": "#BBE7F9",
+        "type": "color"
+      },
+      "30": {
+        "value": "#98DBF7",
+        "type": "color"
+      },
+      "40": {
+        "value": "#76CFF4",
+        "type": "color"
+      },
+      "50": {
+        "value": "#54C3F1",
+        "type": "color"
+      },
+      "60": {
+        "value": "#30ADE9",
+        "type": "color"
+      },
+      "70": {
+        "value": "#0097E0",
+        "type": "color"
+      },
+      "80": {
+        "value": "#0081C0",
+        "type": "color"
+      },
+      "90": {
+        "value": "#00689A",
+        "type": "color"
+      },
+      "100": {
+        "value": "#005077",
+        "type": "color"
+      },
+      "110": {
+        "value": "#004160",
+        "type": "color"
+      },
+      "120": {
+        "value": "#002B40",
+        "type": "color"
+      }
+    },
+    "green": {
+      "10": {
+        "value": "#CCFEF8",
+        "type": "color"
+      },
+      "20": {
+        "value": "#9BFAEF",
+        "type": "color"
+      },
+      "30": {
+        "value": "#6CF5E4",
+        "type": "color"
+      },
+      "40": {
+        "value": "#3BF1DC",
+        "type": "color"
+      },
+      "50": {
+        "value": "#13E5CC",
+        "type": "color"
+      },
+      "60": {
+        "value": "#00C3AC",
+        "type": "color"
+      },
+      "70": {
+        "value": "#008F7E",
+        "type": "color"
+      },
+      "80": {
+        "value": "#007B6C",
+        "type": "color"
+      },
+      "90": {
+        "value": "#00665A",
+        "type": "color"
+      },
+      "100": {
+        "value": "#005248",
+        "type": "color"
+      },
+      "110": {
+        "value": "#003D36",
+        "type": "color"
+      },
+      "120": {
+        "value": "#002924",
+        "type": "color"
+      }
+    },
+    "yellow": {
+      "10": {
+        "value": "#FFF4D7",
+        "type": "color"
+      },
+      "20": {
+        "value": "#FFEAAF",
+        "type": "color"
+      },
+      "30": {
+        "value": "#FFD45F",
+        "type": "color"
+      },
+      "40": {
+        "value": "#FFC936",
+        "type": "color"
+      },
+      "50": {
+        "value": "#FFBF0E",
+        "type": "color"
+      },
+      "60": {
+        "value": "#EFB000",
+        "type": "color"
+      },
+      "70": {
+        "value": "#B88700",
+        "type": "color"
+      },
+      "80": {
+        "value": "#9E7400",
+        "type": "color"
+      },
+      "90": {
+        "value": "#836000",
+        "type": "color"
+      },
+      "100": {
+        "value": "#694D00",
+        "type": "color"
+      },
+      "110": {
+        "value": "#4F3A00",
+        "type": "color"
+      },
+      "120": {
+        "value": "#352700",
+        "type": "color"
+      }
+    },
+    "orange": {
+      "10": {
+        "value": "#FEEAD9",
+        "type": "color"
+      },
+      "20": {
+        "value": "#FCD4B3",
+        "type": "color"
+      },
+      "30": {
+        "value": "#FBBF8E",
+        "type": "color"
+      },
+      "40": {
+        "value": "#FF9C4B",
+        "type": "color"
+      },
+      "50": {
+        "value": "#FD8B2E",
+        "type": "color"
+      },
+      "60": {
+        "value": "#FA7A12",
+        "type": "color"
+      },
+      "70": {
+        "value": "#E46B08",
+        "type": "color"
+      },
+      "80": {
+        "value": "#B45100",
+        "type": "color"
+      },
+      "90": {
+        "value": "#964400",
+        "type": "color"
+      },
+      "100": {
+        "value": "#783600",
+        "type": "color"
+      },
+      "110": {
+        "value": "#5A2900",
+        "type": "color"
+      },
+      "120": {
+        "value": "#3C1B00",
+        "type": "color"
+      }
+    },
+    "red": {
+      "10": {
+        "value": "#FDD9DB",
+        "type": "color"
+      },
+      "20": {
+        "value": "#FBB3B7",
+        "type": "color"
+      },
+      "30": {
+        "value": "#F98D93",
+        "type": "color"
+      },
+      "40": {
+        "value": "#F7666F",
+        "type": "color"
+      },
+      "50": {
+        "value": "#F4404B",
+        "type": "color"
+      },
+      "60": {
+        "value": "#F21A27",
+        "type": "color"
+      },
+      "70": {
+        "value": "#D80C18",
+        "type": "color"
+      },
+      "80": {
+        "value": "#B90A15",
+        "type": "color"
+      },
+      "90": {
+        "value": "#9A0911",
+        "type": "color"
+      },
+      "100": {
+        "value": "#7B070E",
+        "type": "color"
+      },
+      "110": {
+        "value": "#5D050A",
+        "type": "color"
+      },
+      "120": {
+        "value": "#3E0307",
+        "type": "color"
+      },
+      "aaf": {
+        "100": {
+          "value": "#FCECEA",
+          "type": "color"
+        },
+        "200": {
+          "value": "#F5C0B8",
+          "type": "color"
+        },
+        "300": {
+          "value": "#F8AEBA",
+          "type": "color"
+        },
+        "400": {
+          "value": "#DB4F66",
+          "type": "color"
+        },
+        "500": {
+          "value": "#D2324C",
+          "type": "color"
+        },
+        "600": {
+          "value": "#C8102E",
+          "type": "color"
+        }
+      }
+    },
+    "gray": {
+      "10": {
+        "value": "#F2F2F2",
+        "type": "color"
+      },
+      "20": {
+        "value": "#EBEBEB",
+        "type": "color"
+      },
+      "30": {
+        "value": "#DCDCDC",
+        "type": "color"
+      },
+      "40": {
+        "value": "#CECECE",
+        "type": "color"
+      },
+      "50": {
+        "value": "#BFBFBF",
+        "type": "color"
+      },
+      "60": {
+        "value": "#A0A0A0",
+        "type": "color"
+      },
+      "70": {
+        "value": "#828282",
+        "type": "color"
+      },
+      "80": {
+        "value": "#616161",
+        "type": "color"
+      },
+      "90": {
+        "value": "#515151",
+        "type": "color"
+      },
+      "100": {
+        "value": "#414141",
+        "type": "color"
+      },
+      "110": {
+        "value": "#313131",
+        "type": "color"
+      },
+      "120": {
+        "value": "#212121",
+        "type": "color"
+      }
+    },
+    "black": {
+      "value": "#000000",
+      "type": "color",
+      "shadow": {
+        "value": "#0000001A",
+        "type": "color"
+      }
+    },
+    "white": {
+      "value": "#ffffff",
+      "type": "color"
+    },
+    "black-shadow": {
+      "value": "#0000001A",
+      "type": "color"
+    },
+    "white-shadow": {
+      "value": "#ffffff1A",
+      "type": "color"
+    },
+    "blue-gray": {
+      "10": {
+        "value": "#EEF0F2",
+        "type": "color"
+      },
+      "20": {
+        "value": "#D8DDE0",
+        "type": "color"
+      },
+      "30": {
+        "value": "#BBC1C7",
+        "type": "color"
+      },
+      "40": {
+        "value": "#A4ACB4",
+        "type": "color"
+      },
+      "50": {
+        "value": "#8D98A1",
+        "type": "color"
+      },
+      "60": {
+        "value": "#76838E",
+        "type": "color"
+      },
+      "70": {
+        "value": "#636E78",
+        "type": "color"
+      },
+      "80": {
+        "value": "#505961",
+        "type": "color"
+      },
+      "90": {
+        "value": "#444B52",
+        "type": "color"
+      },
+      "100": {
+        "value": "#30353A",
+        "type": "color"
+      },
+      "110": {
+        "value": "#282C30",
+        "type": "color"
+      },
+      "120": {
+        "value": "#1B1E21",
+        "type": "color"
+      }
+    },
+    "dark-gray": {
+      "105": {
+        "value": "#383838",
+        "type": "color"
+      },
+      "115": {
+        "value": "#282828",
+        "type": "color"
+      },
+      "125": {
+        "value": "#1A1A1A",
+        "type": "color"
+      }
+    }
+  },
+  "border-radius": {
+    "100": {
+      "value": "4",
+      "type": "borderRadius"
+    },
+    "150": {
+      "value": "6",
+      "type": "borderRadius"
+    },
+    "200": {
+      "value": "8",
+      "type": "borderRadius"
+    },
+    "250": {
+      "value": "10",
+      "type": "borderRadius"
+    },
+    "300": {
+      "value": "12",
+      "type": "borderRadius"
+    },
+    "400": {
+      "value": "16",
+      "type": "borderRadius"
+    },
+    "050": {
+      "value": "2",
+      "type": "borderRadius"
+    }
+  },
+  "border-width": {
+    "100": {
+      "value": "4",
+      "type": "borderWidth"
+    },
+    "025": {
+      "value": "1",
+      "type": "borderWidth"
+    },
+    "050": {
+      "value": "2",
+      "type": "borderWidth"
+    }
+  },
+  "space": {
+    "100": {
+      "value": "4",
+      "type": "spacing"
+    },
+    "200": {
+      "value": "8",
+      "type": "spacing"
+    },
+    "300": {
+      "value": "12",
+      "type": "spacing"
+    },
+    "400": {
+      "value": "16",
+      "type": "spacing"
+    },
+    "800": {
+      "value": "32",
+      "type": "spacing"
+    },
+    "050": {
+      "value": "2",
+      "type": "spacing"
+    }
+  },
+  "shadow": {
+    "black": {
+      "value": {
+        "x": "0",
+        "y": "-2",
+        "blur": "19",
+        "spread": "0",
+        "color": "{color.black-shadow}",
+        "type": "dropShadow"
+      },
+      "type": "boxShadow"
+    },
+    "white": {
+      "value": {
+        "x": "0",
+        "y": "-2",
+        "blur": "19",
+        "spread": "0",
+        "color": "{color.white-shadow}",
+        "type": "dropShadow"
+      },
+      "type": "boxShadow"
+    }
+  },
+  "font-size": {
+    "300": {
+      "value": "12px",
+      "type": "typography"
+    },
+    "350": {
+      "value": "14px",
+      "type": "typography"
+    },
+    "400": {
+      "value": "16px",
+      "type": "typography"
+    }
+  },
+  "line-height": {
+    "tight": {
+      "value": "130%",
+      "type": "typography"
+    },
+    "normal": {
+      "value": "150%",
+      "type": "typography"
+    }
+  },
+  "font-weight": {
+    "bold": {
+      "value": "Bold",
+      "type": "typography"
+    },
+    "regular": {
+      "value": "Regular",
+      "type": "typography"
+    }
+  },
+  "font-family": {
+    "base": {
+      "value": "Roboto",
+      "type": "typography",
+      "description": "The primary font used in the DDS Design Kit is Roboto"
+    }
+  },
+  "regular": {
+    "normal": {
+      "300": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.normal}",
+          "fontSize": "{font-size.300}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      },
+      "350": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.normal}",
+          "fontSize": "{font-size.350}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      },
+      "400": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.normal}",
+          "fontSize": "{font-size.400}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      }
+    },
+    "tight": {
+      "300": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.tight}",
+          "fontSize": "{font-size.300}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      },
+      "350": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.tight}",
+          "fontSize": "{font-size.350}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      },
+      "400": {
+        "value": {
+          "fontFamily": "{font-family.base}",
+          "fontWeight": "{font-weight.regular}",
+          "lineHeight": "{line-height.tight}",
+          "fontSize": "{font-size.400}"
+        },
+        "type": "typography",
+        "description": "Body is primarily used for components and for blocks of text."
+      }
+    },
+    "bold": {
+      "normal": {
+        "300": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.normal}",
+            "fontSize": "{font-size.300}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        },
+        "350": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.normal}",
+            "fontSize": "{font-size.350}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        },
+        "400": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.normal}",
+            "fontSize": "{font-size.400}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        }
+      },
+      "tight": {
+        "300": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.tight}",
+            "fontSize": "{font-size.300}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        },
+        "350": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.tight}",
+            "fontSize": "{font-size.350}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        },
+        "400": {
+          "value": {
+            "fontFamily": "{font-family.base}",
+            "fontWeight": "{font-weight.bold}",
+            "lineHeight": "{line-height.tight}",
+            "fontSize": "{font-size.400}"
+          },
+          "type": "typography",
+          "description": "Header is used to create various levels of typographic hierarchies."
+        }
+      }
+    }
+  }
+}

package/themes/system.json

@@ -0,0 +1,31 @@
+{
+  "color": {
+    "feedback": {
+      "positive": {
+        "value": "{color.green.60}",
+        "type": "color",
+        "description": "System status is positive"
+      },
+      "warning": {
+        "value": "{color.yellow.50}",
+        "type": "color",
+        "description": "System status is warning"
+      },
+      "negative": {
+        "value": "{color.red.60}",
+        "type": "color",
+        "description": "System status is warning"
+      },
+      "alarm": {
+        "value": "{color.orange.60}",
+        "type": "color",
+        "description": "System status is warning"
+      },
+      "information": {
+        "value": "{color.blue.60}",
+        "type": "color",
+        "description": "System status is warning"
+      }
+    }
+  }
+}