@devexpress/design-tokens-internal 261.0.2 → 261.0.4

package/tokens/components/web/loading-panel_wait-indicator/fluent.json

@@ -0,0 +1,225 @@
+{
+  "loading-panel": {
+    "color": {
+      "bg": {
+        "rest": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "FRAME_FILL",
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.neutral.default.inverted.rest}"
+        }
+      },
+      "backdrop": {
+        "rest": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "FRAME_FILL",
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "#fffffebf"
+        }
+      }
+    },
+    "box-shadow": {
+      "inner-box": {
+        "layer-2": {
+          "color": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{box-shadow.layer-2.color.sm}"
+          },
+          "y": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.y.sm}"
+          },
+          "x": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.x.sm}"
+          },
+          "blur": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.blur.sm}"
+          },
+          "spread": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-2.spread.sm}"
+          }
+        },
+        "layer-1": {
+          "color": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{box-shadow.layer-1.color.sm}"
+          },
+          "blur": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.blur.sm}"
+          },
+          "x": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.x.sm}"
+          },
+          "y": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.y.sm}"
+          },
+          "spread": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "EFFECT_FLOAT"
+              ]
+            },
+            "$type": "number",
+            "$value": "{box-shadow.layer-1.spread.sm}"
+          }
+        },
+        "composite": {
+          "$type": "text",
+          "$value": "{box-shadow.sm}"
+        }
+      }
+    },
+    "layout": {
+      "inner-box": {
+        "horizontal": {
+          "small": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.160}"
+          },
+          "medium": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.200}"
+          },
+          "large": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.240}"
+          }
+        },
+        "vertical": {
+          "medium": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.160}"
+          },
+          "large": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.160}"
+          },
+          "small": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.160}"
+          }
+        }
+      }
+    },
+    "borders": {
+      "border-radius": {
+        "large": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "CORNER_RADIUS"
+            ]
+          },
+          "$type": "number",
+          "$value": "{border-radius.theme-builder.default}"
+        },
+        "medium": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "CORNER_RADIUS"
+            ]
+          },
+          "$type": "number",
+          "$value": "{border-radius.theme-builder.default}"
+        },
+        "small": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "CORNER_RADIUS"
+            ]
+          },
+          "$type": "number",
+          "$value": "{border-radius.theme-builder.default}"
+        }
+      }
+    }
+  }
+}

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

@@ -0,0 +1,50 @@
+{
+  "memo": {
+    "color": {
+      "size-grip": {
+        "rest": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.neutral.subdued.rest}"
+        }
+      }
+    },
+    "layout": {
+      "size-grip-box": {
+        "vertical-end": {
+          "small": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.20}"
+          },
+          "medium": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.20}"
+          },
+          "large": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "GAP"
+              ]
+            },
+            "$type": "number",
+            "$value": "{spacing.20}"
+          }
+        }
+      }
+    }
+  }
+}

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

@@ -0,0 +1,39 @@
+{
+  "menu": {
+    "button": {
+      "layout": {
+        "outter-box": {
+          "horizontal": {
+            "large": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "medium": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.40}"
+            },
+            "small": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.40}"
+            }
+          }
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/message-bar/fluent.json

@@ -0,0 +1,181 @@
+{
+  "message-bar": {
+    "color": {
+      "warning": {
+        "bg": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "FRAME_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.surface.warning.deep.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "STROKE_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.border.warning.default.rest}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.content.warning.default.rest}"
+          }
+        }
+      },
+      "danger": {
+        "bg": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "FRAME_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.surface.danger.deep.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "STROKE_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.border.danger.default.rest}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.content.danger.default.rest}"
+          }
+        }
+      },
+      "success": {
+        "bg": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "FRAME_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.surface.success.deep.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "STROKE_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.border.success.default.rest}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.content.success.default.rest}"
+          }
+        }
+      },
+      "primary": {
+        "bg": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "FRAME_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.surface.primary.deep.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "STROKE_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.border.primary.default.rest}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.content.primary.default.rest}"
+          }
+        }
+      },
+      "info": {
+        "bg": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "FRAME_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.surface.info.deep.rest}"
+          }
+        },
+        "border": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "STROKE_COLOR"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.border.info.default.rest}"
+          }
+        },
+        "icon": {
+          "rest": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "SHAPE_FILL"
+              ]
+            },
+            "$type": "color",
+            "$value": "{color.content.info.default.rest}"
+          }
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/message-box/fluent.json

@@ -0,0 +1,61 @@
+{
+  "message-box": {
+    "header": {
+      "primary": {
+        "icon": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.primary.default.rest}"
+        }
+      },
+      "warning": {
+        "icon": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.warning.default.rest}"
+        }
+      },
+      "danger": {
+        "icon": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.danger.default.rest}"
+        }
+      },
+      "info": {
+        "icon": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.info.default.rest}"
+        }
+      },
+      "success": {
+        "icon": {
+          "$extensions": {
+            "com.figma.scopes": [
+              "SHAPE_FILL"
+            ]
+          },
+          "$type": "color",
+          "$value": "{color.content.success.default.rest}"
+        }
+      }
+    }
+  }
+}

package/tokens/components/web/overflow-menu/fluent.json

@@ -0,0 +1,109 @@
+{
+  "overflow-menu": {
+    "tree": {
+      "layout": {
+        "overflow-menu": {
+          "outter-box": {
+            "gap": {
+              "large": {
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "GAP"
+                  ]
+                },
+                "$type": "number",
+                "$value": "{spacing.minus-40}"
+              },
+              "medium": {
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "GAP"
+                  ]
+                },
+                "$type": "number",
+                "$value": "{spacing.minus-40}"
+              },
+              "small": {
+                "$extensions": {
+                  "com.figma.scopes": [
+                    "GAP"
+                  ]
+                },
+                "$type": "number",
+                "$value": "{spacing.minus-40}"
+              }
+            }
+          }
+        }
+      }
+    },
+    "button": {
+      "layout": {
+        "inner-box": {
+          "horizontal": {
+            "small": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.10}"
+            },
+            "medium": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.10}"
+            },
+            "large": {
+              "$extensions": {
+                "com.figma.scopes": [
+                  "GAP"
+                ]
+              },
+              "$type": "number",
+              "$value": "{spacing.20}"
+            }
+          }
+        }
+      }
+    },
+    "root": {
+      "borders": {
+        "border-radius": {
+          "small": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "CORNER_RADIUS"
+              ]
+            },
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          },
+          "medium": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "CORNER_RADIUS"
+              ]
+            },
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          },
+          "large": {
+            "$extensions": {
+              "com.figma.scopes": [
+                "CORNER_RADIUS"
+              ]
+            },
+            "$type": "number",
+            "$value": "{border-radius.40}"
+          }
+        }
+      }
+    }
+  }
+}