@devexpress/design-tokens-internal 261.0.2 → 261.0.3

package/tokens/components/core/ribbon/fluent.json

@@ -0,0 +1,922 @@
+{
+  "ribbon": {
+    "simplified-items": {
+      "color": {
+        "dropdown": {
+          "border": {
+            "selected": {
+              "$type": "color",
+              "$value": "{color.border.transparent.rest}"
+            }
+          }
+        }
+      },
+      "layout": {
+        "split": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.minus-20}"
+            }
+          },
+          "horizontal-end": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.60}"
+            }
+          }
+        }
+      },
+      "borders": {
+        "split": {
+          "border-radius": {
+            "inner-corner": {
+              "small": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              }
+            }
+          },
+          "border-width": {
+            "inner-border": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              }
+            }
+          }
+        }
+      }
+    },
+    "button-base": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.transparent.rest}"
+          },
+          "hovered": {
+            "$type": "color",
+            "$value": "{color.surface.neutral.default.hovered}"
+          },
+          "active": {
+            "$type": "color",
+            "$value": "{color.surface.neutral.default.active}"
+          },
+          "selected": {
+            "$type": "color",
+            "$value": "{color.surface.neutral.default.selected}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.border.transparent.rest}"
+          },
+          "selected": {
+            "$type": "color",
+            "$value": "{color.border.neutral.default.static-dark.rest}"
+          }
+        },
+        "text": {
+          "disabled": {
+            "$type": "color",
+            "$value": "{color.content.neutral.default.disabled}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.content.neutral.default.rest}"
+          },
+          "disabled": {
+            "$type": "color",
+            "$value": "{color.content.neutral.default.disabled}"
+          }
+        }
+      },
+      "layout": {
+        "simplified": {
+          "outer-box": {
+            "horizontal": {
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.50}"
+              },
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.70}"
+              }
+            },
+            "vertical": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.50}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.70}"
+              }
+            },
+            "gap": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              }
+            }
+          }
+        },
+        "classic-standard": {
+          "outer-box": {
+            "horizontal": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.50}"
+              }
+            },
+            "vertical": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              }
+            },
+            "min-width": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.400}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.480}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.560}"
+              }
+            },
+            "max-width": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.640}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.720}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.800}"
+              }
+            },
+            "gap": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              }
+            }
+          }
+        },
+        "classic-compact": {
+          "outer-box": {
+            "horizontal": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.40}"
+              }
+            },
+            "vertical": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.10}"
+              }
+            },
+            "gap": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              }
+            }
+          }
+        }
+      },
+      "borders": {
+        "border-radius": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          }
+        },
+        "border-width": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          }
+        }
+      }
+    },
+    "classic-items": {
+      "dropdown": {
+        "color": {
+          "border": {
+            "selected": {
+              "$type": "color",
+              "$value": "{color.border.transparent.rest}"
+            }
+          }
+        },
+        "layout": {
+          "height": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.560}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.760}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.940}"
+            }
+          }
+        }
+      },
+      "split": {
+        "layout": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            }
+          },
+          "height": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.560}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.760}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.940}"
+            }
+          }
+        },
+        "borders": {
+          "border-radius": {
+            "inner-corner": {
+              "small": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              }
+            }
+          },
+          "border-width": {
+            "inner-width": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              }
+            }
+          }
+        }
+      },
+      "default": {
+        "layout": {
+          "height": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.560}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.760}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.940}"
+            }
+          }
+        }
+      }
+    },
+    "classic-compact-items": {
+      "dropdown": {
+        "color": {
+          "border": {
+            "selected": {
+              "$type": "color",
+              "$value": "{color.border.transparent.rest}"
+            }
+          }
+        }
+      },
+      "split": {
+        "layout": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.minus-10}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.minus-20}"
+            }
+          },
+          "right": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            }
+          }
+        },
+        "borders": {
+          "border-radius": {
+            "inner-corner": {
+              "small": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{border-radius.0}"
+              }
+            }
+          },
+          "border-width": {
+            "inner-border": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.0}"
+              }
+            }
+          }
+        }
+      }
+    },
+    "сaption": {
+      "color": {
+        "text": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.content.neutral.subdued.rest}"
+          }
+        }
+      },
+      "typography": {
+        "font-size": {
+          "small": {
+            "$type": "number",
+            "$value": "{font-size.base.xs}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{font-size.base.xs}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{font-size.base.sm}"
+          }
+        },
+        "line-height": {
+          "medium": {
+            "$type": "number",
+            "$value": "{line-height.base.xs}"
+          },
+          "small": {
+            "$type": "number",
+            "$value": "{line-height.base.xs}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{line-height.base.sm}"
+          }
+        },
+        "font-weight": {
+          "small": {
+            "$type": "number",
+            "$value": "{font-weight.base.default}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{font-weight.base.default}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{font-weight.base.default}"
+          }
+        }
+      }
+    },
+    "group-container": {
+      "separator": {
+        "color": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.border.neutral.default.rest}"
+          }
+        }
+      },
+      "layout": {
+        "outer-box": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            }
+          }
+        },
+        "group-box": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          },
+          "horizontal": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          }
+        },
+        "separator-box": {
+          "horizontal": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          },
+          "vertical": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            }
+          },
+          "width": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.10}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.10}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.10}"
+            }
+          }
+        },
+        "content-box": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          }
+        }
+      }
+    },
+    "ribbon-toolbar": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.neutral.default.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.border.transparent.rest}"
+          }
+        }
+      },
+      "box-shadow": {
+        "layer-1": {
+          "color": {
+            "$type": "color",
+            "$value": "{box-shadow.layer-1.color.sm}"
+          },
+          "x": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.x.sm}"
+          },
+          "y": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.y.sm}"
+          },
+          "blur": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.blur.sm}"
+          },
+          "spread": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.spread.sm}"
+          }
+        },
+        "layer-2": {
+          "color": {
+            "$type": "color",
+            "$value": "{box-shadow.layer-2.color.sm}"
+          },
+          "x": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.x.sm}"
+          },
+          "y": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.y.sm}"
+          },
+          "blur": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.blur.sm}"
+          },
+          "spread": {
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.spread.sm}"
+          }
+        },
+        "composite": {
+          "$type": "text",
+          "$value": "{box-shadow.md}"
+        }
+      },
+      "layout": {
+        "outer-box": {
+          "horizontal": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.50}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.70}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.90}"
+            }
+          },
+          "vertical": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.30}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.30}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.30}"
+            }
+          },
+          "height": {
+            "classic": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.800}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.1000}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.1200}"
+              }
+            },
+            "simplified": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.320}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.400}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.480}"
+              }
+            }
+          }
+        },
+        "content-box": {
+          "gap": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.0}"
+            }
+          }
+        }
+      },
+      "borders": {
+        "corner-radius": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-radius.60}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-radius.80}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-radius.80}"
+          }
+        },
+        "border-width": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-width.10}"
+          }
+        }
+      }
+    },
+    "button-group": {
+      "layout": {
+        "gap": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          }
+        }
+      }
+    },
+    "ribbon": {
+      "layout": {
+        "gap": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.60}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.60}"
+          }
+        }
+      }
+    }
+  },
+  "tabs": {
+    "tab-item": {
+      "layout": {
+        "vertical": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.60}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.80}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.100}"
+          }
+        }
+      }
+    }
+  }
+}