@daikin-oss/dds-tokens 0.2.1 → 0.3.0

package/themes/dkn/light/component.json

@@ -1,241 +1,4 @@
 {
-  "container": {
-    "color": {
-      "background": {
-        "value": "{color.background.component}",
-        "type": "color"
-      },
-      "text": {
-        "header": {
-          "value": "{color.text.default}",
-          "type": "color"
-        },
-        "body": {
-          "value": "{color.text.default-sub}",
-          "type": "color"
-        }
-      }
-    }
-  },
-  "card": {
-    "shadow": {
-      "value": "{shadow.black}",
-      "type": "boxShadow"
-    },
-    "color": {
-      "background": {
-        "value": "{container.color.background}",
-        "type": "color"
-      }
-    },
-    "border": {
-      "hover": {
-        "value": {
-          "color": "#BFBFBF",
-          "width": "2",
-          "style": "solid"
-        },
-        "type": "border"
-      },
-      "alert": {
-        "value": {
-          "color": "{color.feedback.negative}",
-          "width": "2",
-          "style": "solid"
-        },
-        "type": "border"
-      },
-      "underline": {
-        "value": {
-          "color": "{color.blue-gray.20}",
-          "width": "1",
-          "style": "solid"
-        },
-        "type": "border"
-      }
-    }
-  },
-  "notification": {
-    "shadow": {
-      "value": "{shadow.black}",
-      "type": "boxShadow"
-    },
-    "color": {
-      "background": {
-        "theme": {
-          "value": "{color.background.component}",
-          "type": "color"
-        },
-        "success": {
-          "value": "{color.feedback.positive}",
-          "type": "color"
-        },
-        "error": {
-          "value": "{color.feedback.negative}",
-          "type": "color"
-        },
-        "warning": {
-          "value": "{color.feedback.warning}",
-          "type": "color"
-        },
-        "alarm": {
-          "value": "{color.feedback.alarm}",
-          "type": "color"
-        },
-        "information": {
-          "value": "{color.feedback.information}",
-          "type": "color"
-        }
-      },
-      "text": {
-        "value": "{color.text.default}",
-        "type": "color"
-      }
-    }
-  },
-  "icon": {
-    "color": {
-      "background": {
-        "default": {
-          "value": "{color.background.object}",
-          "type": "color"
-        },
-        "theme": {
-          "value": "{color.background.theme}",
-          "type": "color"
-        }
-      }
-    }
-  },
-  "button": {
-    "color": {
-      "background": {
-        "primary": {
-          "active": {
-            "value": "{color.brand.primary}",
-            "type": "color",
-            "description": "Color used for the default state of a secondary button"
-          },
-          "hover": {
-            "value": "{color.brand.secondary}",
-            "type": "color"
-          },
-          "press": {
-            "value": "{color.blue.70}",
-            "type": "color"
-          },
-          "focus": {
-            "value": "{color.blue.80}",
-            "type": "color"
-          },
-          "disabled": {
-            "value": "{color.gray.30}",
-            "type": "color"
-          }
-        }
-      },
-      "border": {
-        "secondary": {
-          "active": {
-            "value": "{color.brand.primary}",
-            "type": "color"
-          },
-          "hover": {
-            "value": "{color.brand.secondary}",
-            "type": "color"
-          },
-          "press": {
-            "value": "{color.blue.70}",
-            "type": "color"
-          },
-          "focus": {
-            "value": "{color.blue.80}",
-            "type": "color"
-          },
-          "disabled": {
-            "value": "{color.gray.30}",
-            "type": "color"
-          }
-        }
-      },
-      "text": {
-        "secondary": {
-          "active": {
-            "value": "{color.text.brand.primary}",
-            "type": "color"
-          },
-          "hover": {
-            "value": "{color.brand.secondary}",
-            "type": "color"
-          },
-          "press": {
-            "value": "{color.blue.70}",
-            "type": "color"
-          },
-          "focus": {
-            "value": "{color.blue.80}",
-            "type": "color"
-          },
-          "disabled": {
-            "value": "{color.gray.30}",
-            "type": "color"
-          }
-        },
-        "primary": {
-          "value": "{color.text.theme}",
-          "type": "color"
-        }
-      }
-    }
-  },
-  "tab": {
-    "color": {
-      "line": {
-        "active": {
-          "value": "{color.brand.primary}",
-          "type": "color"
-        },
-        "hover": {
-          "value": "{color.brand.secondary}",
-          "type": "color"
-        },
-        "press": {
-          "value": "{color.blue.70}",
-          "type": "color"
-        },
-        "focus": {
-          "value": "{color.blue.80}",
-          "type": "color"
-        },
-        "disabled": {
-          "value": "{color.gray.30}",
-          "type": "color"
-        }
-      },
-      "text": {
-        "active": {
-          "value": "{color.text.brand.primary}",
-          "type": "color"
-        },
-        "hover": {
-          "value": "{color.brand.secondary}",
-          "type": "color"
-        },
-        "press": {
-          "value": "{color.blue.70}",
-          "type": "color"
-        },
-        "focus": {
-          "value": "{color.blue.80}",
-          "type": "color"
-        },
-        "disabled": {
-          "value": "{color.gray.30}",
-          "type": "color"
-        }
-      }
-    }
-  },
   "color": {
     "link": {
       "text": {

package/themes/dkn/light/system.json

@@ -1,78 +1,5 @@
 {
   "color": {
-    "brand": {
-      "primary": {
-        "value": "{color.blue.60}",
-        "type": "color",
-        "description": "Primary brand blue"
-      },
-      "secondary": {
-        "value": "{color.blue.40}",
-        "type": "color",
-        "description": "Primary secondary brand blue"
-      }
-    },
-    "text": {
-      "brand": {
-        "primary": {
-          "value": "{color.brand.primary}",
-          "type": "color"
-        }
-      },
-      "theme": {
-        "value": "{color.white}",
-        "type": "color"
-      },
-      "default": {
-        "value": "{color.gray.100}",
-        "type": "color"
-      },
-      "default-sub": {
-        "value": "{color.gray.80}",
-        "type": "color"
-      }
-    },
-    "background": {
-      "theme": {
-        "value": "{color.white}",
-        "type": "color"
-      },
-      "component": {
-        "value": "{color.white}",
-        "type": "color"
-      },
-      "object": {
-        "value": "{color.gray.100}",
-        "type": "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"
-      }
-    },
     "common": {
       "brand": {
         "default": {

package/themes/reference.json

@@ -248,32 +248,6 @@
       "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": {
@@ -338,14 +312,6 @@
       "value": "#ffffff",
       "type": "color"
     },
-    "black-shadow": {
-      "value": "#0000001A",
-      "type": "color"
-    },
-    "white-shadow": {
-      "value": "#ffffff1A",
-      "type": "color"
-    },
     "blue-gray": {
       "10": {
         "value": "#EEF0F2",
@@ -531,201 +497,166 @@
       "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"
-    },
+  "font": {
     "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}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.normal}",
+            "fontSize": "{font.size.300}"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "type": "typography"
         },
         "350": {
           "value": {
-            "fontFamily": "{font-family.base}",
-            "fontWeight": "{font-weight.bold}",
-            "lineHeight": "{line-height.normal}",
-            "fontSize": "{font-size.350}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.normal}",
+            "fontSize": "{font.size.350}"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "type": "typography"
         },
         "400": {
           "value": {
-            "fontFamily": "{font-family.base}",
-            "fontWeight": "{font-weight.bold}",
-            "lineHeight": "{line-height.normal}",
-            "fontSize": "{font-size.400}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.normal}",
+            "fontSize": "{font.size.400}"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "type": "typography"
         }
       },
       "tight": {
         "300": {
           "value": {
-            "fontFamily": "{font-family.base}",
-            "fontWeight": "{font-weight.bold}",
-            "lineHeight": "{line-height.tight}",
-            "fontSize": "{font-size.300}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.tight}",
+            "fontSize": "{font.size.300}"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "type": "typography"
         },
         "350": {
           "value": {
-            "fontFamily": "{font-family.base}",
-            "fontWeight": "{font-weight.bold}",
-            "lineHeight": "{line-height.tight}",
-            "fontSize": "{font-size.350}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.tight}",
+            "fontSize": "{font.size.350}"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "type": "typography"
         },
         "400": {
           "value": {
-            "fontFamily": "{font-family.base}",
-            "fontWeight": "{font-weight.bold}",
-            "lineHeight": "{line-height.tight}",
-            "fontSize": "{font-size.400}"
+            "fontFamily": "{font.family.base}",
+            "fontWeight": "{font.weight.regular}",
+            "lineHeight": "{font.line-height.tight}",
+            "fontSize": "{font.size.400}"
+          },
+          "type": "typography"
+        }
+      },
+      "bold": {
+        "normal": {
+          "300": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.normal}",
+              "fontSize": "{font.size.300}"
+            },
+            "type": "typography"
+          },
+          "350": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.normal}",
+              "fontSize": "{font.size.350}"
+            },
+            "type": "typography"
+          },
+          "400": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.normal}",
+              "fontSize": "{font.size.400}"
+            },
+            "type": "typography"
+          }
+        },
+        "tight": {
+          "300": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.tight}",
+              "fontSize": "{font.size.300}"
+            },
+            "type": "typography"
+          },
+          "350": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.tight}",
+              "fontSize": "{font.size.350}"
+            },
+            "type": "typography"
           },
-          "type": "typography",
-          "description": "Header is used to create various levels of typographic hierarchies."
+          "400": {
+            "value": {
+              "fontFamily": "{font.family.base}",
+              "fontWeight": "{font.weight.bold}",
+              "lineHeight": "{font.line-height.tight}",
+              "fontSize": "{font.size.400}"
+            },
+            "type": "typography"
+          }
         }
       }
+    },
+    "size": {
+      "300": {
+        "value": "12",
+        "type": "fontSizes"
+      },
+      "350": {
+        "value": "14",
+        "type": "fontSizes"
+      },
+      "400": {
+        "value": "16",
+        "type": "fontSizes"
+      }
+    },
+    "line-height": {
+      "tight": {
+        "value": "130%",
+        "type": "lineHeights"
+      },
+      "normal": {
+        "value": "150%",
+        "type": "lineHeights"
+      }
+    },
+    "weight": {
+      "bold": {
+        "value": "Bold",
+        "type": "fontWeights"
+      },
+      "regular": {
+        "value": "Regular",
+        "type": "fontWeights"
+      }
+    },
+    "family": {
+      "base": {
+        "value": "Roboto",
+        "type": "fontFamilies"
+      }
     }
   }
 }