@gitlab/ui 85.2.1 → 85.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/components/experimental/duo/chat/duo_chat.js +19 -7
  3. package/dist/index.css +1 -1
  4. package/dist/index.css.map +1 -1
  5. package/dist/tokens/build/js/tokens.dark.js +18 -1
  6. package/dist/tokens/build/js/tokens.js +18 -1
  7. package/dist/tokens/css/tokens.css +17 -0
  8. package/dist/tokens/css/tokens.dark.css +17 -0
  9. package/dist/tokens/js/tokens.dark.js +17 -0
  10. package/dist/tokens/js/tokens.js +17 -0
  11. package/dist/tokens/json/tokens.dark.json +416 -0
  12. package/dist/tokens/json/tokens.json +416 -0
  13. package/dist/tokens/scss/_tokens.dark.scss +17 -0
  14. package/dist/tokens/scss/_tokens.scss +17 -0
  15. package/dist/tokens/scss/_tokens_custom_properties.scss +17 -0
  16. package/package.json +1 -1
  17. package/src/components/experimental/duo/chat/duo_chat.vue +18 -5
  18. package/src/tokens/build/css/tokens.css +17 -0
  19. package/src/tokens/build/css/tokens.dark.css +17 -0
  20. package/src/tokens/build/js/tokens.dark.js +17 -0
  21. package/src/tokens/build/js/tokens.js +17 -0
  22. package/src/tokens/build/json/tokens.dark.json +416 -0
  23. package/src/tokens/build/json/tokens.json +416 -0
  24. package/src/tokens/build/scss/_tokens.dark.scss +17 -0
  25. package/src/tokens/build/scss/_tokens.scss +17 -0
  26. package/src/tokens/build/scss/_tokens_custom_properties.scss +17 -0
  27. package/src/tokens/control.tokens.json +144 -0
  28. package/src/tokens/focus-ring.tokens.json +21 -0
package/dist/tokens/json/tokens.dark.json CHANGED
@@ -8969,6 +8969,375 @@
8969
8969
  }
8970
8970
  }
8971
8971
  },
8972
+ "control": {
8973
+ "background": {
8974
+ "color": {
8975
+ "default": {
8976
+ "value": "#333238",
8977
+ "$type": "color",
8978
+ "comment": "Used for form control (input, radio button, checkbox, textarea) default background.",
8979
+ "filePath": "src/tokens/control.tokens.json",
8980
+ "isSource": true,
8981
+ "original": {
8982
+ "value": {
8983
+ "default": "{color.neutral.0}",
8984
+ "dark": "{color.neutral.900}"
8985
+ },
8986
+ "$type": "color",
8987
+ "comment": "Used for form control (input, radio button, checkbox, textarea) default background."
8988
+ },
8989
+ "name": "CONTROL_BACKGROUND_COLOR_DEFAULT",
8990
+ "attributes": {},
8991
+ "path": [
8992
+ "control",
8993
+ "background",
8994
+ "color",
8995
+ "default"
8996
+ ]
8997
+ },
8998
+ "disabled": {
8999
+ "value": "#1f1e24",
9000
+ "$type": "color",
9001
+ "comment": "Used for disabled form control (checkbox, input, radio button, textarea) background.",
9002
+ "filePath": "src/tokens/control.tokens.json",
9003
+ "isSource": true,
9004
+ "original": {
9005
+ "value": {
9006
+ "default": "{color.neutral.10}",
9007
+ "dark": "{color.neutral.950}"
9008
+ },
9009
+ "$type": "color",
9010
+ "comment": "Used for disabled form control (checkbox, input, radio button, textarea) background."
9011
+ },
9012
+ "name": "CONTROL_BACKGROUND_COLOR_DISABLED",
9013
+ "attributes": {},
9014
+ "path": [
9015
+ "control",
9016
+ "background",
9017
+ "color",
9018
+ "disabled"
9019
+ ]
9020
+ },
9021
+ "selected": {
9022
+ "default": {
9023
+ "value": "#428fdc",
9024
+ "$type": "color",
9025
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background.",
9026
+ "filePath": "src/tokens/control.tokens.json",
9027
+ "isSource": true,
9028
+ "original": {
9029
+ "value": {
9030
+ "default": "{color.blue.500}",
9031
+ "dark": "{color.blue.400}"
9032
+ },
9033
+ "$type": "color",
9034
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background."
9035
+ },
9036
+ "name": "CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT",
9037
+ "attributes": {},
9038
+ "path": [
9039
+ "control",
9040
+ "background",
9041
+ "color",
9042
+ "selected",
9043
+ "default"
9044
+ ]
9045
+ },
9046
+ "hover": {
9047
+ "value": "#9dc7f1",
9048
+ "$type": "color",
9049
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
9050
+ "filePath": "src/tokens/control.tokens.json",
9051
+ "isSource": true,
9052
+ "original": {
9053
+ "value": {
9054
+ "default": "{color.blue.700}",
9055
+ "dark": "{color.blue.200}"
9056
+ },
9057
+ "$type": "color",
9058
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover."
9059
+ },
9060
+ "name": "CONTROL_BACKGROUND_COLOR_SELECTED_HOVER",
9061
+ "attributes": {},
9062
+ "path": [
9063
+ "control",
9064
+ "background",
9065
+ "color",
9066
+ "selected",
9067
+ "hover"
9068
+ ]
9069
+ },
9070
+ "focus": {
9071
+ "value": "#9dc7f1",
9072
+ "$type": "color",
9073
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.",
9074
+ "filePath": "src/tokens/control.tokens.json",
9075
+ "isSource": true,
9076
+ "original": {
9077
+ "value": {
9078
+ "default": "{color.blue.700}",
9079
+ "dark": "{color.blue.200}"
9080
+ },
9081
+ "$type": "color",
9082
+ "comment": "Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover."
9083
+ },
9084
+ "name": "CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS",
9085
+ "attributes": {},
9086
+ "path": [
9087
+ "control",
9088
+ "background",
9089
+ "color",
9090
+ "selected",
9091
+ "focus"
9092
+ ]
9093
+ }
9094
+ }
9095
+ }
9096
+ },
9097
+ "border": {
9098
+ "color": {
9099
+ "default": {
9100
+ "value": "#737278",
9101
+ "$type": "color",
9102
+ "comment": "Used for form control (input, radio button, checkbox, textarea) default border.",
9103
+ "filePath": "src/tokens/control.tokens.json",
9104
+ "isSource": true,
9105
+ "original": {
9106
+ "value": {
9107
+ "default": "{color.neutral.400}",
9108
+ "dark": "{color.neutral.500}"
9109
+ },
9110
+ "$type": "color",
9111
+ "comment": "Used for form control (input, radio button, checkbox, textarea) default border."
9112
+ },
9113
+ "name": "CONTROL_BORDER_COLOR_DEFAULT",
9114
+ "attributes": {},
9115
+ "path": [
9116
+ "control",
9117
+ "border",
9118
+ "color",
9119
+ "default"
9120
+ ]
9121
+ },
9122
+ "hover": {
9123
+ "value": "#a4a3a8",
9124
+ "$type": "color",
9125
+ "comment": "Used for form control (input, radio button, checkbox, textarea) border on hover.",
9126
+ "filePath": "src/tokens/control.tokens.json",
9127
+ "isSource": true,
9128
+ "original": {
9129
+ "value": {
9130
+ "default": "{color.neutral.600}",
9131
+ "dark": "{color.neutral.300}"
9132
+ },
9133
+ "$type": "color",
9134
+ "comment": "Used for form control (input, radio button, checkbox, textarea) border on hover."
9135
+ },
9136
+ "name": "CONTROL_BORDER_COLOR_HOVER",
9137
+ "attributes": {},
9138
+ "path": [
9139
+ "control",
9140
+ "border",
9141
+ "color",
9142
+ "hover"
9143
+ ]
9144
+ },
9145
+ "focus": {
9146
+ "value": "#ececef",
9147
+ "$type": "color",
9148
+ "comment": "Used for form control (input, radio button, checkbox, textarea) border on focus.",
9149
+ "filePath": "src/tokens/control.tokens.json",
9150
+ "isSource": true,
9151
+ "original": {
9152
+ "value": {
9153
+ "default": "{color.neutral.900}",
9154
+ "dark": "{color.neutral.50}"
9155
+ },
9156
+ "$type": "color",
9157
+ "comment": "Used for form control (input, radio button, checkbox, textarea) border on focus."
9158
+ },
9159
+ "name": "CONTROL_BORDER_COLOR_FOCUS",
9160
+ "attributes": {},
9161
+ "path": [
9162
+ "control",
9163
+ "border",
9164
+ "color",
9165
+ "focus"
9166
+ ]
9167
+ },
9168
+ "disabled": {
9169
+ "value": "#434248",
9170
+ "$type": "color",
9171
+ "comment": "Used for disabled form control (input, radio button, checkbox, textarea) border.",
9172
+ "filePath": "src/tokens/control.tokens.json",
9173
+ "isSource": true,
9174
+ "original": {
9175
+ "value": {
9176
+ "default": "{color.neutral.100}",
9177
+ "dark": "{color.neutral.800}"
9178
+ },
9179
+ "$type": "color",
9180
+ "comment": "Used for disabled form control (input, radio button, checkbox, textarea) border."
9181
+ },
9182
+ "name": "CONTROL_BORDER_COLOR_DISABLED",
9183
+ "attributes": {},
9184
+ "path": [
9185
+ "control",
9186
+ "border",
9187
+ "color",
9188
+ "disabled"
9189
+ ]
9190
+ },
9191
+ "error": {
9192
+ "value": "#ec5941",
9193
+ "$type": "color",
9194
+ "comment": "Used for invalid form control (input, textarea) border.",
9195
+ "filePath": "src/tokens/control.tokens.json",
9196
+ "isSource": true,
9197
+ "original": {
9198
+ "value": {
9199
+ "default": "{color.red.500}",
9200
+ "dark": "{color.red.400}"
9201
+ },
9202
+ "$type": "color",
9203
+ "comment": "Used for invalid form control (input, textarea) border."
9204
+ },
9205
+ "name": "CONTROL_BORDER_COLOR_ERROR",
9206
+ "attributes": {},
9207
+ "path": [
9208
+ "control",
9209
+ "border",
9210
+ "color",
9211
+ "error"
9212
+ ]
9213
+ }
9214
+ }
9215
+ },
9216
+ "text": {
9217
+ "color": {
9218
+ "error": {
9219
+ "value": "#ec5941",
9220
+ "$type": "color",
9221
+ "comment": "Used for the helper text when the input is invalid.",
9222
+ "filePath": "src/tokens/control.tokens.json",
9223
+ "isSource": true,
9224
+ "original": {
9225
+ "value": {
9226
+ "default": "{color.red.500}",
9227
+ "dark": "{color.red.400}"
9228
+ },
9229
+ "$type": "color",
9230
+ "comment": "Used for the helper text when the input is invalid."
9231
+ },
9232
+ "name": "CONTROL_TEXT_COLOR_ERROR",
9233
+ "attributes": {},
9234
+ "path": [
9235
+ "control",
9236
+ "text",
9237
+ "color",
9238
+ "error"
9239
+ ]
9240
+ },
9241
+ "valid": {
9242
+ "value": "#2da160",
9243
+ "$type": "color",
9244
+ "comment": "Used for the helper text when the input is valid.",
9245
+ "filePath": "src/tokens/control.tokens.json",
9246
+ "isSource": true,
9247
+ "original": {
9248
+ "value": {
9249
+ "default": "{color.green.500}",
9250
+ "dark": "{color.green.400}"
9251
+ },
9252
+ "$type": "color",
9253
+ "comment": "Used for the helper text when the input is valid."
9254
+ },
9255
+ "name": "CONTROL_TEXT_COLOR_VALID",
9256
+ "attributes": {},
9257
+ "path": [
9258
+ "control",
9259
+ "text",
9260
+ "color",
9261
+ "valid"
9262
+ ]
9263
+ }
9264
+ }
9265
+ },
9266
+ "placeholder": {
9267
+ "color": {
9268
+ "value": "#737278",
9269
+ "$type": "color",
9270
+ "comment": "Used for placeholder text within inputs.",
9271
+ "filePath": "src/tokens/control.tokens.json",
9272
+ "isSource": true,
9273
+ "original": {
9274
+ "value": {
9275
+ "default": "{color.neutral.400}",
9276
+ "dark": "{color.neutral.500}"
9277
+ },
9278
+ "$type": "color",
9279
+ "comment": "Used for placeholder text within inputs."
9280
+ },
9281
+ "name": "CONTROL_PLACEHOLDER_COLOR",
9282
+ "attributes": {},
9283
+ "path": [
9284
+ "control",
9285
+ "placeholder",
9286
+ "color"
9287
+ ]
9288
+ }
9289
+ },
9290
+ "indicator": {
9291
+ "color": {
9292
+ "selected": {
9293
+ "value": "#333238",
9294
+ "$type": "color",
9295
+ "comment": "Used for checkbox and radio button state indicators.",
9296
+ "filePath": "src/tokens/control.tokens.json",
9297
+ "isSource": true,
9298
+ "original": {
9299
+ "value": {
9300
+ "default": "{color.neutral.0}",
9301
+ "dark": "{color.neutral.900}"
9302
+ },
9303
+ "$type": "color",
9304
+ "comment": "Used for checkbox and radio button state indicators."
9305
+ },
9306
+ "name": "CONTROL_INDICATOR_COLOR_SELECTED",
9307
+ "attributes": {},
9308
+ "path": [
9309
+ "control",
9310
+ "indicator",
9311
+ "color",
9312
+ "selected"
9313
+ ]
9314
+ },
9315
+ "disabled": {
9316
+ "value": "#89888d",
9317
+ "$type": "color",
9318
+ "comment": "Used for disabled checkbox and radio button state indicators.",
9319
+ "filePath": "src/tokens/control.tokens.json",
9320
+ "isSource": true,
9321
+ "original": {
9322
+ "value": {
9323
+ "default": "{color.neutral.500}",
9324
+ "dark": "{color.neutral.400}"
9325
+ },
9326
+ "$type": "color",
9327
+ "comment": "Used for disabled checkbox and radio button state indicators."
9328
+ },
9329
+ "name": "CONTROL_INDICATOR_COLOR_DISABLED",
9330
+ "attributes": {},
9331
+ "path": [
9332
+ "control",
9333
+ "indicator",
9334
+ "color",
9335
+ "disabled"
9336
+ ]
9337
+ }
9338
+ }
9339
+ }
9340
+ },
8972
9341
  "feedback": {
8973
9342
  "background": {
8974
9343
  "color": {
@@ -9339,6 +9708,53 @@
9339
9708
  }
9340
9709
  }
9341
9710
  },
9711
+ "focus-ring": {
9712
+ "outer": {
9713
+ "color": {
9714
+ "value": "#428fdc",
9715
+ "$type": "color",
9716
+ "comment": "Used for the outer color portion of the focus ring.",
9717
+ "filePath": "src/tokens/focus-ring.tokens.json",
9718
+ "isSource": true,
9719
+ "original": {
9720
+ "value": {
9721
+ "default": "{color.blue.500}",
9722
+ "dark": "{color.blue.400}"
9723
+ },
9724
+ "$type": "color",
9725
+ "comment": "Used for the outer color portion of the focus ring."
9726
+ },
9727
+ "name": "FOCUS_RING_OUTER_COLOR",
9728
+ "attributes": {},
9729
+ "path": [
9730
+ "focus-ring",
9731
+ "outer",
9732
+ "color"
9733
+ ]
9734
+ }
9735
+ },
9736
+ "inner": {
9737
+ "color": {
9738
+ "value": "#1f1e24",
9739
+ "$type": "color",
9740
+ "comment": "Used for the inner neutral portion of the focus ring.",
9741
+ "filePath": "src/tokens/focus-ring.tokens.json",
9742
+ "isSource": true,
9743
+ "original": {
9744
+ "value": "{background.color.default}",
9745
+ "$type": "color",
9746
+ "comment": "Used for the inner neutral portion of the focus ring."
9747
+ },
9748
+ "name": "FOCUS_RING_INNER_COLOR",
9749
+ "attributes": {},
9750
+ "path": [
9751
+ "focus-ring",
9752
+ "inner",
9753
+ "color"
9754
+ ]
9755
+ }
9756
+ }
9757
+ },
9342
9758
  "icon": {
9343
9759
  "color": {
9344
9760
  "default": {