@devexpress/design-tokens-internal 261.0.2 → 261.0.3

package/tokens/components/web/switcher/fluent.json

@@ -0,0 +1,102 @@
+{
+  "switcher": {
+    "color": {
+      "checked": {
+        "invalid": {
+          "border": {
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.hovered}"
+            },
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.rest}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.surface.danger.default.active}"
+            }
+          },
+          "bg": {
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.surface.danger.compound.hovered}"
+            },
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.danger.compound.rest}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.surface.danger.default.active}"
+            }
+          }
+        },
+        "success": {
+          "bg": {
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.surface.success.compound.hovered}"
+            },
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.success.compound.rest}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.surface.success.default.active}"
+            }
+          },
+          "border": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.rest}"
+            },
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.hovered}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.active}"
+            }
+          }
+        }
+      },
+      "unchecked": {
+        "invalid": {
+          "border": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.rest}"
+            },
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.hovered}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.surface.danger.default.active}"
+            }
+          }
+        },
+        "success": {
+          "border": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.rest}"
+            },
+            "hovered": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.hovered}"
+            },
+            "active": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.active}"
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/tabs/fluent.json

@@ -0,0 +1,148 @@
+{
+  "tabs": {
+    "item": {
+      "color": {
+        "context": {
+          "text": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.primary.default.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.primary.default.rest}"
+            }
+          }
+        }
+      },
+      "typography": {
+        "context": {
+          "font-weight": {
+            "small": {
+              "$type": "number",
+              "$value": "{font-weight.base.strong}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{font-weight.base.strong}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{font-weight.base.strong}"
+            }
+          }
+        }
+      }
+    },
+    "close-button": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.transparent.rest}"
+          }
+        },
+        "icon": {
+          "hovered": {
+            "$type": "color",
+            "$value": "{color.content.primary.default.hovered}"
+          },
+          "active": {
+            "$type": "color",
+            "$value": "{color.content.primary.default.active}"
+          }
+        }
+      },
+      "layout": {
+        "sizing": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.160}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.240}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.200}"
+          }
+        },
+        "horizontal": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          }
+        },
+        "vertical": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          }
+        }
+      }
+    },
+    "navigation-button": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.transparent.rest}"
+          }
+        }
+      },
+      "layout": {
+        "button": {
+          "inner-box": {
+            "horizontal": {
+              "medium": {
+                "medium": {
+                  "$type": "number",
+                  "$value": "{spacing.10}"
+                }
+              },
+              "large": {
+                "large": {
+                  "$type": "number",
+                  "$value": "{spacing.30}"
+                }
+              }
+            },
+            "vertical": {
+              "medium": {
+                "medium": {
+                  "$type": "number",
+                  "$value": "{spacing.10}"
+                }
+              },
+              "large": {
+                "large": {
+                  "$type": "number",
+                  "$value": "{spacing.30}"
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/tagbox/fluent.json

@@ -0,0 +1,82 @@
+{
+  "tagbox": {
+    "delete-button": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.transparent.rest}"
+          }
+        }
+      },
+      "layout": {
+        "sizing": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.160}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.240}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.200}"
+          }
+        }
+      }
+    },
+    "tag-group": {
+      "layout": {
+        "text-box": {
+          "vertical": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.30}"
+            }
+          }
+        },
+        "outter-box": {
+          "gap": {
+            "vertical": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.20}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.30}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.40}"
+              }
+            },
+            "horizontal": {
+              "small": {
+                "$type": "number",
+                "$value": "{spacing.40}"
+              },
+              "medium": {
+                "$type": "number",
+                "$value": "{spacing.60}"
+              },
+              "large": {
+                "$type": "number",
+                "$value": "{spacing.80}"
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/text-edit/fluent.json

@@ -0,0 +1,184 @@
+{
+  "text-edit": {
+    "text-edit": {
+      "color": {
+        "success": {
+          "border": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.rest}"
+            }
+          },
+          "line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.success.compound.rest}"
+            }
+          }
+        },
+        "invalid": {
+          "border": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.rest}"
+            }
+          },
+          "line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.border.danger.compound.rest}"
+            }
+          }
+        }
+      }
+    },
+    "input-icon": {
+      "color": {
+        "error": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.content.danger.default.rest}"
+          }
+        },
+        "success": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.content.success.default.rest}"
+          }
+        },
+        "default": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.content.neutral.deep.rest}"
+          },
+          "disabled": {
+            "$type": "color",
+            "$value": "{color.content.neutral.deep.disabled}"
+          }
+        }
+      }
+    },
+    "clear-button": {
+      "color": {
+        "bg": {
+          "rest": {
+            "$type": "color",
+            "$value": "{color.surface.transparent.rest}"
+          }
+        }
+      },
+      "layout": {
+        "inner-box": {
+          "horizontal": {
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          },
+          "vertical": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          }
+        },
+        "outer-box": {
+          "horizontal": {
+            "small": {
+              "$type": "number",
+              "$value": "{spacing.20}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{spacing.60}"
+            }
+          }
+        }
+      },
+      "borders": {
+        "border-width": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          }
+        }
+      }
+    },
+    "input-buttons": {
+      "borders": {
+        "border-radius": {
+          "inner-corner": {
+            "large": {
+              "$type": "number",
+              "$value": "{border-radius.0}"
+            },
+            "small": {
+              "$type": "number",
+              "$value": "{border-radius.0}"
+            },
+            "medium": {
+              "$type": "number",
+              "$value": "{border-radius.0}"
+            }
+          },
+          "outer-corner": {
+            "medium": {
+              "$type": "number",
+              "$value": "{border-radius.30}"
+            },
+            "small": {
+              "$type": "number",
+              "$value": "{border-radius.30}"
+            },
+            "large": {
+              "$type": "number",
+              "$value": "{border-radius.30}"
+            }
+          }
+        },
+        "border-width": {
+          "small": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{border-width.0}"
+          }
+        }
+      }
+    }
+  }
+}