{
  "name": "ds-chart",
  "description": "Chart component for data visualization",
  "docUrl": "https://design.soracom.io/design-system/elements/chart/",
  "category": "elements",
  "htmlElements": [
    "div",
    "svg"
  ],
  "isWebComponent": false,
  "modifiers": {
    "variant": {
      "support": "custom",
      "values": [
        "--scaled"
      ]
    },
    "utility": {
      "support": "custom",
      "values": [
        "--clip",
        "--3",
        "--4",
        "--5",
        "--6",
        "--7",
        "--8",
        "--9",
        "--10",
        "--11",
        "--12",
        "--13",
        "--14",
        "--15",
        "--16"
      ]
    }
  },
  "examples": [
    {
      "name": "basic",
      "html": "<div class=\"ds-chart\"><canvas></canvas></div>"
    },
    {
      "name": "scaled",
      "html": "<div class=\"ds-chart --scaled\"><canvas></canvas></div>"
    },
    {
      "name": "clipped",
      "html": "<div class=\"ds-chart --clip --9\"><canvas></canvas></div>"
    }
  ]
}
