@gitlab/duo-ui 0.1.0 → 0.3.0

package/src/tokens/contextual/datepicker.tokens.json

@@ -1,25 +0,0 @@
-{
-  "datepicker": {
-    "background": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.0}",
-          "dark": "{color.neutral.900}"
-        },
-        "$type": "color",
-        "$description": "Used for the background color of datepicker."
-      }
-    },
-    "date": {
-      "text": {
-        "color": {
-          "selected": {
-            "$value": "{control.indicator.color.selected}",
-            "$type": "color",
-            "$description": "Used for the datepicker date text color state indicators."
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/dropdown.tokens.json

@@ -1,148 +0,0 @@
-{
-  "dropdown": {
-    "background": {
-      "color": {
-        "$value": "{background.color.overlap}",
-        "$type": "color",
-        "$description": "Used for the background of a dropdown."
-      }
-    },
-    "border": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.200}",
-          "dark": "{color.neutral.700}"
-        },
-        "$type": "color",
-        "$description": "Used for the border of a dropdown."
-      }
-    },
-    "option": {
-      "text": {
-        "color": {
-          "default": {
-            "$value": "{action.neutral.foreground.color.default}",
-            "$type": "color",
-            "$description": "Used for the text of a dropdown option in the default state."
-          },
-          "hover": {
-            "$value": "{action.neutral.foreground.color.hover}",
-            "$type": "color",
-            "$description": "Used for the text of a dropdown option in the hover state."
-          },
-          "focus": {
-            "$value": "{action.neutral.foreground.color.focus}",
-            "$type": "color",
-            "$description": "Used for the text of a dropdown option in the focus state."
-          },
-          "active": {
-            "$value": "{action.neutral.foreground.color.active}",
-            "$type": "color",
-            "$description": "Used for the text of a dropdown option in the active state."
-          },
-          "disabled": {
-            "$value": "{action.disabled.foreground.color}",
-            "$type": "color",
-            "$description": "Used for the text of a dropdown option in the disabled state."
-          }
-        }
-      },
-      "indicator": {
-        "color": {
-          "selected": {
-            "default": {
-              "$value": {
-                "default": "{control.background.color.selected.default}",
-                "dark": "{color.neutral.0}"
-              },
-              "$type": "color",
-              "$description": "Used for the dropdown selected option indicator in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{control.background.color.selected.hover}",
-                "dark": "{color.neutral.0}"
-              },
-              "$type": "color",
-              "$description": "Used for the dropdown selected option indicator in the hover state."
-            },
-            "focus": {
-              "$value": {
-                "default": "{control.background.color.selected.focus}",
-                "dark": "{color.neutral.0}"
-              },
-              "$type": "color",
-              "$description": "Used for the dropdown selected option indicator in the focus state."
-            },
-            "active": {
-              "$value": {
-                "default": "{color.blue.700}",
-                "dark": "{color.neutral.100}"
-              },
-              "$type": "color",
-              "$description": "Used for the dropdown selected option indicator in the active state."
-            }
-          }
-        }
-      },
-      "background": {
-        "color": {
-          "unselected": {
-            "default": {
-              "$value": "{action.neutral.background.color.default}",
-              "$type": "color",
-              "$description": "Used for the background of an unselected dropdown option in the default state."
-            },
-            "hover": {
-              "$value": "{action.neutral.background.color.hover}",
-              "$type": "color",
-              "$description": "Used for the background of an unselected dropdown option in the hover state."
-            },
-            "focus": {
-              "$value": "{action.neutral.background.color.focus}",
-              "$type": "color",
-              "$description": "Used for the background of an unselected dropdown option in the focus state."
-            },
-            "active": {
-              "$value": "{action.neutral.background.color.active}",
-              "$type": "color",
-              "$description": "Used for the background of an unselected dropdown option in the active state."
-            }
-          },
-          "selected": {
-            "default": {
-              "$value": {
-                "default": "{color.neutral.50}",
-                "dark": "{color.neutral.800}"
-              },
-              "$type": "color",
-              "$description": "Used for the background of a selected dropdown option in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.100}",
-                "dark": "{color.neutral.700}"
-              },
-              "$type": "color",
-              "$description": "Used for the background of a selected dropdown option in the hover state."
-            },
-            "focus": {
-              "$value": "{dropdown.option.background.color.selected.hover}",
-              "$type": "color",
-              "$description": "Used for the background of a selected dropdown option in the focus state."
-            },
-            "active": {
-              "$value": {
-                "default": "{color.neutral.200}",
-                "dark": "{color.neutral.900}"
-              },
-              "$type": "color",
-              "$description": "Used for the background of a selected dropdown option in the active state."
-            }
-          }
-        }
-      }
-    }
-  }
-}
-

package/src/tokens/contextual/filtered-search.tokens.json

@@ -1,72 +0,0 @@
-{
-  "filtered-search": {
-    "token": {
-      "type": {
-        "background": {
-          "color": {
-            "default": {
-              "$value": {
-                "default": "{color.neutral.50}",
-                "dark": "{color.neutral.900}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search type token background color in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.100}",
-                "dark": "{color.neutral.800}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search type token background color in the hover state."
-            }
-          }
-        }
-      },
-      "data": {
-        "background": {
-          "color": {
-            "default": {
-              "$value": {
-                "default": "{color.neutral.100}",
-                "dark": "{color.neutral.800}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search data background color in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.200}",
-                "dark": "{color.neutral.700}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search data token background color in the hover state."
-            }
-          }
-        }
-      },
-      "operator": {
-        "background": {
-          "color": {
-            "default": {
-              "$value": {
-                "default": "{color.neutral.50}",
-                "dark": "{color.neutral.900}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search operator background color in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.200}",
-                "dark": "{color.neutral.700}"
-              },
-              "$type": "color",
-              "$description": "Used for the filtered search operator token background color in the hover state."
-            }
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/label.tokens.json

@@ -1,118 +0,0 @@
-{
-  "label": {
-    "light": {
-      "text": {
-        "color": {
-          "$value": "{color.neutral.950}",
-          "$type": "color",
-          "$description": "Used for the label text color on a light background color."
-        }
-      },
-      "button": {
-        "background": {
-          "color": {
-            "default": {
-              "$value": "{color.alpha.0}",
-              "$type": "color",
-              "$description": "Used for the label remove button background on a light background color in the default state."
-            },
-            "hover": {
-              "$value": "{color.neutral.950}",
-              "$type": "color",
-              "$description": "Used for the label remove button background on a light background color in the hover state."
-            }
-          }
-        },
-        "icon": {
-          "color": {
-            "default": {
-              "$value": "{color.neutral.950}",
-              "$type": "color",
-              "$description": "Used for the label remove button icon on a light background color in the default state."
-            }
-          }
-        }
-      }
-    },
-    "dark": {
-      "text": {
-        "color": {
-          "$value": "{color.neutral.0}",
-          "$type": "color",
-          "$description": "Used for the label text color on a dark background color."
-        }
-      },
-      "button": {
-        "background": {
-          "color": {
-            "default": {
-              "$value": "{color.alpha.0}",
-              "$type": "color",
-              "$description": "Used for the label remove button background on a dark background color in the default state."
-            },
-            "hover": {
-              "$value": "{color.neutral.0}",
-              "$type": "color",
-              "$description": "Used for the label remove button background on a dark background color in the hover state."
-            }
-          }
-        },
-        "icon": {
-          "color": {
-            "default": {
-              "$value": "{color.neutral.0}",
-              "$type": "color",
-              "$description": "Used for the label remove button icon on a dark background color in the default state."
-            }
-          }
-        }
-      }
-    },
-    "scoped": {
-      "text": {
-        "color": {
-          "$value": {
-            "default": "{color.neutral.950}",
-            "dark": "{color.neutral.0}"
-          },
-          "$type": "color",
-          "$description": "Used for the scoped label text color."
-        }
-      },
-      "button": {
-        "background": {
-          "color": {
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.950}",
-                "dark": "{color.neutral.0}"
-              },
-              "$type": "color",
-              "$description": "Used for the scoped label remove button background in the hover state."
-            }
-          }
-        },
-        "icon": {
-          "color": {
-            "default": {
-              "$value": {
-                "default": "{color.neutral.950}",
-                "dark": "{color.neutral.0}"
-              },
-              "$type": "color",
-              "$description": "Used for the scoped label remove button icon in the default state."
-            },
-            "hover": {
-              "$value": {
-                "default": "{color.neutral.0}",
-                "dark": "{color.neutral.950}"
-              },
-              "$type": "color",
-              "$description": "Used for the scoped label remove button icon in the hover state."
-            }
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/link.tokens.json

@@ -1,46 +0,0 @@
-{
-  "link": {
-    "mention": {
-      "text": {
-        "color": {
-          "default": {
-            "$value": {
-              "default": "{color.blue.700}",
-              "dark": "{color.blue.200}"
-            },
-            "$type": "color",
-            "$description": "Used for the mention link text color."
-          },
-          "current": {
-            "$value": {
-              "default": "{color.orange.800}",
-              "dark": "{color.orange.100}"
-            },
-            "$type": "color",
-            "$description": "Used for the mention link text color when referencing the current user."
-          }
-        }
-      },
-      "background": {
-        "color": {
-          "default": {
-            "$value": {
-              "default": "{color.blue.100}",
-              "dark": "{color.blue.800}"
-            },
-            "$type": "color",
-            "$description": "Used for the mention link default background."
-          },
-          "current": {
-            "$value": {
-              "default": "{color.orange.100}",
-              "dark": "{color.orange.800}"
-            },
-            "$type": "color",
-            "$description": "Used for the mention link background when referencing the current user."
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/progress-bar.tokens.json

@@ -1,38 +0,0 @@
-{
-  "progress-bar": {
-    "indicator": {
-      "color": {
-        "default": {
-          "$value": "{status.info.icon.color}",
-          "$type": "color",
-          "$description": "Used for the indicator color for the primary progress-bar variant."
-        },
-        "success": {
-          "$value": "{status.success.icon.color}",
-          "$type": "color",
-          "$description": "Used for the indicator color for the success progress-bar variant."
-        },
-        "warning": {
-          "$value": "{status.warning.icon.color}",
-          "$type": "color",
-          "$description": "Used for the indicator color for the warning progress-bar variant."
-        },
-        "danger": {
-          "$value": "{status.danger.icon.color}",
-          "$type": "color",
-          "$description": "Used for the indicator color for the danger progress-bar variant."
-        }
-      }
-    },
-    "track": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.200}",
-          "dark": "{color.neutral.700}"
-        },
-        "$type": "color",
-        "$description": "Used for the track color for all progress-bar variants."
-      }
-    }
-  }
-}

package/src/tokens/contextual/skeleton-loader.tokens.json

@@ -1,24 +0,0 @@
-{
-  "skeleton-loader": {
-    "background": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.100}",
-          "dark": "{color.neutral.800}"
-        },
-        "$type": "color",
-        "$description": "Used for the skeleton loader background color."
-      }
-    },
-    "shimmer": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.50}",
-          "dark": "{color.neutral.700}"
-        },
-        "$type": "color",
-        "$description": "Used for the animated shimmer effect in a skeleton loader."
-      }
-    }
-  }
-}

package/src/tokens/contextual/spinner.tokens.json

@@ -1,38 +0,0 @@
-{
-  "spinner": {
-    "track": {
-      "color": {
-        "default": {
-          "$value": {
-            "default": "{color.neutral.100}",
-            "dark": "{color.neutral.800}"
-          },
-          "$type": "color",
-          "$description": "Used for the static track (background) of a loading spinner."
-        },
-        "light": {
-          "$value": "{color.neutral.800}",
-          "$type": "color",
-          "$description": "Used for the static track (background) of a loading spinner on a dark background."
-        }
-      }
-    },
-    "segment": {
-      "color": {
-        "default": {
-          "$value": {
-            "default": "{color.neutral.700}",
-            "dark": "{color.neutral.200}"
-          },
-          "$type": "color",
-          "$description": "Used for the animated segment of a loading spinner."
-        },
-        "light": {
-          "$value": "{color.neutral.200}",
-          "$type": "color",
-          "$description": "Used for the animated segment of a loading spinner on a dark background."
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/table.tokens.json

@@ -1,24 +0,0 @@
-{
-  "table": {
-    "row": {
-      "background": {
-        "color": {
-          "hover": {
-            "$value": "{background.color.subtle}",
-            "$type": "color",
-            "$description": "Used for the background of a table row in hover state."
-          }
-        }
-      }
-    },
-    "sorting": {
-      "icon": {
-        "color": {
-          "$value": "{text.color.heading}",
-          "$type": "color",
-          "$description": "Used for the color of the sorting icons in the column headers."
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/tabs.tokens.json

@@ -1,18 +0,0 @@
-{
-  "tab": {
-    "selected": {
-      "indicator": {
-        "color": {
-          "default": {
-            "$value": {
-              "default": "{color.blue.500}",
-              "dark": "{color.blue.400}"
-            },
-            "$type": "color",
-            "$description": "Used for the selected indicator of a tab."
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/toggle.tokens.json

@@ -1,59 +0,0 @@
-{
-  "toggle": {
-    "switch": {
-      "icon": {
-        "color": {
-          "unchecked": {
-            "default": {
-              "$value": "{action.strong.neutral.background.color.default}",
-              "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the default state."
-            },
-            "hover": {
-              "$value": "{action.strong.neutral.background.color.hover}",
-              "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the hover state."
-            },
-            "focus": {
-              "$value": "{action.strong.neutral.background.color.focus}",
-              "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the focus state."
-            },
-            "active": {
-              "$value": "{action.strong.neutral.background.color.active}",
-              "$type": "color",
-              "$description": "Used for the icon color of an unchecked toggle switch in the active state."
-            }
-          },
-          "checked": {
-            "default": {
-              "$value": "{action.strong.confirm.background.color.default}",
-              "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the default state."
-            },
-            "hover": {
-              "$value": "{action.strong.confirm.background.color.hover}",
-              "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the hover state."
-            },
-            "focus": {
-              "$value": "{action.strong.confirm.background.color.focus}",
-              "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the focus state."
-            },
-            "active": {
-              "$value": "{action.strong.confirm.background.color.active}",
-              "$type": "color",
-              "$description": "Used for the icon color of a checked toggle switch in the active state."
-            }
-          },
-          "disabled": {
-            "$value": "{action.disabled.background.color}",
-            "$type": "color",
-            "$description": "Used for the icon color of a disabled toggle switch."
-          }
-        }
-      }
-    }
-  }
-}

package/src/tokens/contextual/token.tokens.json

@@ -1,21 +0,0 @@
-{
-  "token": {
-    "foreground": {
-      "color": {
-        "$value": "{text.color.default}",
-        "$type": "color",
-        "$description": "Used for the token foreground color."
-      }
-    },
-    "background": {
-      "color": {
-        "$value": {
-          "default": "{color.neutral.100}",
-          "dark": "{color.neutral.800}"
-        },
-        "$type": "color",
-        "$description": "Used for the token background color."
-      }
-    }
-  }
-}