@datatechsolutions/tympan-tokens 0.3.0

package/dist/dtcg/base.tokens.json

@@ -0,0 +1,422 @@
+{
+  "$description": "Stacking order. Not in the design direction; chosen by the implementer.",
+  "duration": {
+    "$type": "duration",
+    "instant": {
+      "$value": {
+        "value": 90,
+        "unit": "ms"
+      },
+      "$description": "Hover, press."
+    },
+    "quick": {
+      "$value": {
+        "value": 150,
+        "unit": "ms"
+      },
+      "$description": "Open a menu, switch a tab."
+    },
+    "base": {
+      "$value": {
+        "value": 240,
+        "unit": "ms"
+      },
+      "$description": "Drawer and evidence panel entry."
+    },
+    "pulse": {
+      "$value": {
+        "value": 1600,
+        "unit": "ms"
+      },
+      "$description": "Skeleton opacity pulse period (§2.12)."
+    }
+  },
+  "ease": {
+    "$type": "cubicBezier",
+    "enter": {
+      "$value": [
+        0.2,
+        0,
+        0,
+        1
+      ],
+      "$description": "Entries."
+    },
+    "exit": {
+      "$value": [
+        0.4,
+        0,
+        1,
+        1
+      ],
+      "$description": "Exits."
+    }
+  },
+  "space": {
+    "1": {
+      "$value": {
+        "value": 4,
+        "unit": "px"
+      }
+    },
+    "2": {
+      "$value": {
+        "value": 8,
+        "unit": "px"
+      }
+    },
+    "3": {
+      "$value": {
+        "value": 12,
+        "unit": "px"
+      }
+    },
+    "4": {
+      "$value": {
+        "value": 16,
+        "unit": "px"
+      }
+    },
+    "5": {
+      "$value": {
+        "value": 24,
+        "unit": "px"
+      }
+    },
+    "6": {
+      "$value": {
+        "value": 32,
+        "unit": "px"
+      }
+    },
+    "7": {
+      "$value": {
+        "value": 48,
+        "unit": "px"
+      }
+    },
+    "8": {
+      "$value": {
+        "value": 64,
+        "unit": "px"
+      }
+    },
+    "9": {
+      "$value": {
+        "value": 96,
+        "unit": "px"
+      }
+    },
+    "$type": "dimension"
+  },
+  "layout": {
+    "$type": "dimension",
+    "sidebar": {
+      "$value": {
+        "value": 272,
+        "unit": "px"
+      },
+      "$description": "Side navigation width (§2.8)."
+    },
+    "rail": {
+      "$value": {
+        "value": 72,
+        "unit": "px"
+      },
+      "$description": "Collapsed navigation rail (§2.8)."
+    },
+    "topbar": {
+      "$value": {
+        "value": 56,
+        "unit": "px"
+      },
+      "$description": "Top bar height (§2.8)."
+    },
+    "aside": {
+      "$value": {
+        "value": 420,
+        "unit": "px"
+      },
+      "$description": "Evidence panel column (§2.8)."
+    },
+    "reading": {
+      "$value": {
+        "value": 1200,
+        "unit": "px"
+      },
+      "$description": "Reading content max width."
+    },
+    "data": {
+      "$value": {
+        "value": 1440,
+        "unit": "px"
+      },
+      "$description": "Data content max width."
+    },
+    "scroll-padding": {
+      "$value": {
+        "value": 80,
+        "unit": "px"
+      },
+      "$description": "scroll-padding-top under the sticky bar (§2.6)."
+    }
+  },
+  "control": {
+    "$type": "dimension",
+    "target": {
+      "$value": {
+        "value": 44,
+        "unit": "px"
+      },
+      "$description": "Minimum touch hit area (§2.10); constant across densities."
+    }
+  },
+  "font": {
+    "family": {
+      "$type": "fontFamily",
+      "serif": {
+        "$value": [
+          "Source Serif 4",
+          "Source Serif Pro",
+          "Noto Serif",
+          "Georgia",
+          "Noto Naskh Arabic",
+          "Noto Serif Hebrew",
+          "Noto Serif Devanagari",
+          "Noto Serif Thai",
+          "Noto Serif Ethiopic",
+          "Noto Serif JP",
+          "Noto Serif SC",
+          "Noto Serif KR",
+          "serif"
+        ],
+        "$description": "Headings h1 to h3 and KPI numbers only."
+      },
+      "sans": {
+        "$value": [
+          "IBM Plex Sans",
+          "Noto Sans",
+          "system-ui",
+          "-apple-system",
+          "Segoe UI",
+          "Roboto",
+          "Noto Sans Arabic",
+          "Noto Sans Hebrew",
+          "Noto Sans Devanagari",
+          "Noto Sans Bengali",
+          "Noto Sans Tamil",
+          "Noto Sans Thai",
+          "Noto Sans Ethiopic",
+          "Noto Sans Armenian",
+          "Noto Sans Georgian",
+          "Noto Sans JP",
+          "Noto Sans SC",
+          "Noto Sans KR",
+          "sans-serif"
+        ],
+        "$description": "Everything but headings. Latin, Cyrillic and Greek from Plex/Noto Sans; per-glyph fallback to the Noto family of each script; :lang() overrides reorder CJK and adapt other scripts."
+      },
+      "mono": {
+        "$value": [
+          "IBM Plex Mono",
+          "Noto Sans Mono",
+          "ui-monospace",
+          "SFMono-Regular",
+          "Menlo",
+          "monospace"
+        ],
+        "$description": "Identifiers, hashes, keys, versions only."
+      }
+    },
+    "weight": {
+      "$type": "fontWeight",
+      "regular": {
+        "$value": 400
+      },
+      "semibold": {
+        "$value": 600
+      },
+      "bold": {
+        "$value": 700
+      }
+    },
+    "size": {
+      "$type": "dimension",
+      "display": {
+        "$value": {
+          "value": 36,
+          "unit": "px"
+        }
+      },
+      "h1": {
+        "$value": {
+          "value": 30,
+          "unit": "px"
+        }
+      },
+      "h1-narrow": {
+        "$value": {
+          "value": 24,
+          "unit": "px"
+        }
+      },
+      "h2": {
+        "$value": {
+          "value": 22,
+          "unit": "px"
+        }
+      },
+      "h3": {
+        "$value": {
+          "value": 18,
+          "unit": "px"
+        }
+      },
+      "body-lg": {
+        "$value": {
+          "value": 16,
+          "unit": "px"
+        }
+      },
+      "body": {
+        "$value": {
+          "value": 14,
+          "unit": "px"
+        }
+      },
+      "label": {
+        "$value": {
+          "value": 13,
+          "unit": "px"
+        }
+      },
+      "meta": {
+        "$value": {
+          "value": 12,
+          "unit": "px"
+        }
+      },
+      "eyebrow": {
+        "$value": {
+          "value": 12,
+          "unit": "px"
+        }
+      }
+    },
+    "line-height": {
+      "$type": "dimension",
+      "display": {
+        "$value": {
+          "value": 44,
+          "unit": "px"
+        }
+      },
+      "h1": {
+        "$value": {
+          "value": 38,
+          "unit": "px"
+        }
+      },
+      "h1-narrow": {
+        "$value": {
+          "value": 32,
+          "unit": "px"
+        }
+      },
+      "h2": {
+        "$value": {
+          "value": 30,
+          "unit": "px"
+        }
+      },
+      "h3": {
+        "$value": {
+          "value": 26,
+          "unit": "px"
+        }
+      },
+      "body-lg": {
+        "$value": {
+          "value": 26,
+          "unit": "px"
+        }
+      },
+      "body": {
+        "$value": {
+          "value": 22,
+          "unit": "px"
+        }
+      },
+      "label": {
+        "$value": {
+          "value": 18,
+          "unit": "px"
+        }
+      },
+      "meta": {
+        "$value": {
+          "value": 18,
+          "unit": "px"
+        }
+      },
+      "eyebrow": {
+        "$value": {
+          "value": 16,
+          "unit": "px"
+        }
+      }
+    },
+    "tracking": {
+      "$type": "dimension",
+      "h1": {
+        "$value": {
+          "value": -0.01,
+          "unit": "rem"
+        },
+        "$description": "-0.01em per §2.2; stored in rem for DTCG, emitted as em."
+      },
+      "eyebrow": {
+        "$value": {
+          "value": 0.08,
+          "unit": "rem"
+        },
+        "$description": "0.08em per §2.2; stored in rem for DTCG, emitted as em."
+      }
+    }
+  },
+  "measure": {
+    "$type": "number",
+    "prose": {
+      "$value": 68,
+      "$description": "Prose max width in ch."
+    },
+    "summary": {
+      "$value": 60,
+      "$description": "Reading summary max width in ch."
+    }
+  },
+  "z": {
+    "$type": "number",
+    "base": {
+      "$value": 0
+    },
+    "sticky": {
+      "$value": 100
+    },
+    "nav-drawer": {
+      "$value": 400
+    },
+    "modal": {
+      "$value": 500
+    },
+    "popover": {
+      "$value": 600
+    },
+    "toast": {
+      "$value": 700
+    },
+    "skip-link": {
+      "$value": 800
+    }
+  }
+}

package/dist/dtcg/density.comfortable.tokens.json

@@ -0,0 +1,48 @@
+{
+  "$description": "Density comfortable.",
+  "density": {
+    "$type": "dimension",
+    "control-height": {
+      "$value": {
+        "value": 44,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height"
+        }
+      }
+    },
+    "control-height-touch": {
+      "$value": {
+        "value": 48,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-touch"
+        }
+      }
+    },
+    "control-height-compact": {
+      "$value": {
+        "value": 36,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-compact"
+        }
+      }
+    },
+    "density": {
+      "$type": "number",
+      "$value": 1.125,
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-density"
+        }
+      }
+    }
+  }
+}

package/dist/dtcg/density.compact.tokens.json

@@ -0,0 +1,48 @@
+{
+  "$description": "Density compact.",
+  "density": {
+    "$type": "dimension",
+    "control-height": {
+      "$value": {
+        "value": 36,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height"
+        }
+      }
+    },
+    "control-height-touch": {
+      "$value": {
+        "value": 44,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-touch"
+        }
+      }
+    },
+    "control-height-compact": {
+      "$value": {
+        "value": 28,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-compact"
+        }
+      }
+    },
+    "density": {
+      "$type": "number",
+      "$value": 0.875,
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-density"
+        }
+      }
+    }
+  }
+}

package/dist/dtcg/density.default.tokens.json

@@ -0,0 +1,48 @@
+{
+  "$description": "Density default.",
+  "density": {
+    "$type": "dimension",
+    "control-height": {
+      "$value": {
+        "value": 40,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height"
+        }
+      }
+    },
+    "control-height-touch": {
+      "$value": {
+        "value": 44,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-touch"
+        }
+      }
+    },
+    "control-height-compact": {
+      "$value": {
+        "value": 32,
+        "unit": "px"
+      },
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-control-height-compact"
+        }
+      }
+    },
+    "density": {
+      "$type": "number",
+      "$value": 1,
+      "$extensions": {
+        "br.com.datatechsolutions.tympan": {
+          "cssName": "--ty-density"
+        }
+      }
+    }
+  }
+}