@devexpress/design-tokens-internal 261.0.2 → 261.0.3

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

@@ -0,0 +1,688 @@
+{
+  "toast": {
+    "color": {
+      "saturated": {
+        "warning": {
+          "subtitle": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.warning.default.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          }
+        },
+        "info": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "subtitle": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.info.default.rest}"
+            }
+          }
+        },
+        "success": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "subtitle": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.success.default.rest}"
+            }
+          }
+        },
+        "danger": {
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.danger.default.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "subtitle": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          }
+        },
+        "primary": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "subtitle": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.primary.default.rest}"
+            }
+          }
+        }
+      },
+      "dark": {
+        "success": {
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-dark.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.success.default.rest}"
+            }
+          }
+        },
+        "primary": {
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.primary.default.rest}"
+            }
+          }
+        },
+        "warning": {
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.warning.default.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          }
+        },
+        "info": {
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-dark.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.info.default.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          }
+        },
+        "danger": {
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.danger.default.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-dark.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-dark.rest}"
+            }
+          }
+        }
+      },
+      "light": {
+        "info": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.info.default.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-light.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          }
+        },
+        "danger": {
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.danger.default.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-light.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          }
+        },
+        "warning": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.warning.default.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-light.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          }
+        },
+        "success": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.success.default.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-light.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          }
+        },
+        "primary": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.neutral.default.static-light.rest}"
+            }
+          },
+          "title": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "caption": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.neutral.default.static-light.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.primary.default.rest}"
+            }
+          }
+        }
+      },
+      "pastel": {
+        "info": {
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.info.default.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.info.deep.rest}"
+            }
+          }
+        },
+        "primary": {
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.primary.deep.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.primary.default.rest}"
+            }
+          }
+        },
+        "danger": {
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.danger.default.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.danger.deep.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          }
+        },
+        "success": {
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.success.deep.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.success.default.rest}"
+            }
+          }
+        },
+        "warning": {
+          "icon": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.warning.default.rest}"
+            }
+          },
+          "accent-line": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.content.transparent.rest}"
+            }
+          },
+          "bg": {
+            "rest": {
+              "$type": "color",
+              "$value": "{color.surface.warning.deep.rest}"
+            }
+          }
+        }
+      }
+    },
+    "layout": {
+      "content-box": {
+        "gap": {
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.120}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.100}"
+          },
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.80}"
+          }
+        }
+      },
+      "accent-line": {
+        "width": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.0}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.0}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.0}"
+          }
+        }
+      },
+      "close-button": {
+        "horizontal": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.0}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.30}"
+          }
+        },
+        "vertical": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.0}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.10}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.30}"
+          }
+        }
+      },
+      "template-box": {
+        "vertical": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          }
+        },
+        "horizontal": {
+          "small": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          },
+          "medium": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          },
+          "large": {
+            "$type": "number",
+            "$value": "{spacing.40}"
+          }
+        }
+      }
+    }
+  }
+}