@patternfly/react-styles 4.70.1 → 4.71.1

package/css/components/CodeEditor/code-editor.css

@@ -133,4 +133,8 @@
 
 .pf-c-code-editor__tab-icon + .pf-c-code-editor__tab-text {
   margin-left: var(--pf-c-code-editor__tab-icon--text--MarginLeft);
+}
+
+:where(.pf-theme-dark) .pf-c-code-editor__controls > * + * {
+  border-left: 1px solid var(--pf-global--palette--black-700);
 }

package/css/components/CodeEditor/code-editor.d.ts

@@ -16,6 +16,7 @@ declare const _default: {
     "control": "pf-m-control",
     "dragHover": "pf-m-drag-hover"
   },
-  "monacoEditor": "monaco-editor"
+  "monacoEditor": "monaco-editor",
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/CodeEditor/code-editor.js

@@ -18,5 +18,6 @@ exports.default = {
     "control": "pf-m-control",
     "dragHover": "pf-m-drag-hover"
   },
-  "monacoEditor": "monaco-editor"
+  "monacoEditor": "monaco-editor",
+  "themeDark": "pf-theme-dark"
 };

package/css/components/CodeEditor/code-editor.mjs

@@ -16,5 +16,6 @@ export default {
     "control": "pf-m-control",
     "dragHover": "pf-m-drag-hover"
   },
-  "monacoEditor": "monaco-editor"
+  "monacoEditor": "monaco-editor",
+  "themeDark": "pf-theme-dark"
 };

package/css/components/ContextSelector/context-selector.css

@@ -283,4 +283,21 @@
 .pf-c-context-selector__menu-list-item.pf-m-disabled, .pf-c-context-selector__menu-list-item:disabled {
   --pf-c-context-selector__menu-list-item--Color: var(--pf-c-context-selector__menu-list-item--disabled--Color);
   pointer-events: none;
+}
+
+:where(.pf-theme-dark) .pf-c-context-selector {
+  --pf-c-context-selector__menu--Top: 100%;
+  --pf-c-context-selector__menu-list-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
+}
+:where(.pf-theme-dark) .pf-c-context-selector__toggle {
+  background: var(--pf-global--BackgroundColor--400);
+}
+:where(.pf-theme-dark) .pf-c-context-selector__toggle.pf-m-plain {
+  background: transparent;
+}
+:where(.pf-theme-dark) .pf-c-context-selector__menu {
+  background: var(--pf-global--BackgroundColor--300);
+}
+:where(.pf-theme-dark) .pf-c-context-selector__menu-footer {
+  border-top: 1px solid var(--pf-global--BorderColor--300);
 }

package/css/components/ContextSelector/context-selector.d.ts

@@ -18,6 +18,7 @@ declare const _default: {
     "plain": "pf-m-plain",
     "text": "pf-m-text",
     "disabled": "pf-m-disabled"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/ContextSelector/context-selector.js

@@ -20,5 +20,6 @@ exports.default = {
     "plain": "pf-m-plain",
     "text": "pf-m-text",
     "disabled": "pf-m-disabled"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/ContextSelector/context-selector.mjs

@@ -18,5 +18,6 @@ export default {
     "plain": "pf-m-plain",
     "text": "pf-m-text",
     "disabled": "pf-m-disabled"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/DataList/data-list.css

@@ -906,4 +906,11 @@
 }
 .pf-c-data-list__expandable-content .pf-c-data-list__expandable-content-body.pf-m-no-padding {
   padding: 0;
+}
+
+:where(.pf-theme-dark) .pf-c-data-list {
+  --pf-c-data-list--BorderTopColor: var(--pf-global--BorderColor--100);
+  --pf-c-data-list--sm--BorderTopColor: var(--pf-global--BorderColor--100);
+  --pf-c-data-list__item--BorderBottomColor: var(--pf-global--BorderColor--100);
+  --pf-c-data-list__item--sm--BorderBottomColor: var(--pf-global--BorderColor--100);
 }

package/css/components/DataList/data-list.d.ts

@@ -52,6 +52,7 @@ declare const _default: {
     "expanded": "pf-m-expanded",
     "disabled": "pf-m-disabled",
     "noPadding": "pf-m-no-padding"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/DataList/data-list.js

@@ -54,5 +54,6 @@ exports.default = {
     "expanded": "pf-m-expanded",
     "disabled": "pf-m-disabled",
     "noPadding": "pf-m-no-padding"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/DataList/data-list.mjs

@@ -52,5 +52,6 @@ export default {
     "expanded": "pf-m-expanded",
     "disabled": "pf-m-disabled",
     "noPadding": "pf-m-no-padding"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/DatePicker/date-picker.css

@@ -49,4 +49,9 @@
 .pf-c-date-picker.pf-m-top .pf-c-date-picker__calendar {
   --pf-c-date-picker__calendar--Top: var(--pf-c-date-picker--m-top__calendar--Top);
   transform: translateY(var(--pf-c-date-picker--m-top__calendar--TranslateY));
+}
+
+:where(.pf-theme-dark) .pf-c-date-picker {
+  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-date-picker__calendar--Top: 100%;
 }

package/css/components/DatePicker/date-picker.d.ts

@@ -9,6 +9,7 @@ declare const _default: {
     "error": "pf-m-error",
     "alignRight": "pf-m-align-right",
     "top": "pf-m-top"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/DatePicker/date-picker.js

@@ -11,5 +11,6 @@ exports.default = {
     "error": "pf-m-error",
     "alignRight": "pf-m-align-right",
     "top": "pf-m-top"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/DatePicker/date-picker.mjs

@@ -9,5 +9,6 @@ export default {
     "error": "pf-m-error",
     "alignRight": "pf-m-align-right",
     "top": "pf-m-top"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Drawer/drawer.css

@@ -820,4 +820,11 @@
     display: none;
     visibility: hidden;
   }
+}
+:where(.pf-theme-dark) .pf-c-drawer {
+  --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  --pf-c-drawer__splitter--BackgroundColor: transparent;
+}
+:where(.pf-theme-dark) .pf-c-drawer.pf-m-inline, :where(.pf-theme-dark) .pf-c-drawer.pf-m-static {
+  --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--100);
 }

package/css/components/Drawer/drawer.d.ts

@@ -57,6 +57,7 @@ declare const _default: {
     "inlineOn_2xl": "pf-m-inline-on-2xl",
     "staticOn_2xl": "pf-m-static-on-2xl"
   },
-  "pageMain": "pf-c-page__main"
+  "pageMain": "pf-c-page__main",
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/Drawer/drawer.js

@@ -59,5 +59,6 @@ exports.default = {
     "inlineOn_2xl": "pf-m-inline-on-2xl",
     "staticOn_2xl": "pf-m-static-on-2xl"
   },
-  "pageMain": "pf-c-page__main"
+  "pageMain": "pf-c-page__main",
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Drawer/drawer.mjs

@@ -57,5 +57,6 @@ export default {
     "inlineOn_2xl": "pf-m-inline-on-2xl",
     "staticOn_2xl": "pf-m-static-on-2xl"
   },
-  "pageMain": "pf-c-page__main"
+  "pageMain": "pf-c-page__main",
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Dropdown/dropdown.css

@@ -564,4 +564,26 @@
   font-size: var(--pf-c-dropdown__group-title--FontSize);
   font-weight: var(--pf-c-dropdown__group-title--FontWeight);
   color: var(--pf-c-dropdown__group-title--Color);
+}
+
+:where(.pf-theme-dark) .pf-c-dropdown {
+  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
+  --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
+  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
+  --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
+  --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
+  --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
+  --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-dropdown__menu--Top: 100%;
+  --pf-c-dropdown--m-top__menu--TranslateY: -100%;
+  --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  --pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--bold);
+}
+:where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
+  color: var(--pf-global--palette--black-100);
+}
+:where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
+  background: transparent;
 }

package/css/components/Dropdown/dropdown.d.ts

@@ -45,6 +45,7 @@ declare const _default: {
     "ariaDisabled": "pf-m-aria-disabled",
     "icon": "pf-m-icon",
     "description": "pf-m-description"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/Dropdown/dropdown.js

@@ -47,5 +47,6 @@ exports.default = {
     "ariaDisabled": "pf-m-aria-disabled",
     "icon": "pf-m-icon",
     "description": "pf-m-description"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Dropdown/dropdown.mjs

@@ -45,5 +45,6 @@ export default {
     "ariaDisabled": "pf-m-aria-disabled",
     "icon": "pf-m-icon",
     "description": "pf-m-description"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Form/form.css

@@ -500,4 +500,8 @@
 }
 .pf-c-form__field-group-body > .pf-c-form__field-group:last-child {
   margin-bottom: var(--pf-c-form__field-group-body__field-group--last-child--MarginBottom);
+}
+
+:where(.pf-theme-dark) .pf-c-form {
+  --pf-c-form__helper-text--m-success--Color: var(--pf-global--success-color--100);
 }

package/css/components/Form/form.d.ts

@@ -49,6 +49,7 @@ declare const _default: {
     "inactive": "pf-m-inactive",
     "hidden": "pf-m-hidden",
     "expanded": "pf-m-expanded"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/Form/form.js

@@ -51,5 +51,6 @@ exports.default = {
     "inactive": "pf-m-inactive",
     "hidden": "pf-m-hidden",
     "expanded": "pf-m-expanded"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Form/form.mjs

@@ -49,5 +49,6 @@ export default {
     "inactive": "pf-m-inactive",
     "hidden": "pf-m-hidden",
     "expanded": "pf-m-expanded"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/FormControl/form-control.css

@@ -315,4 +315,26 @@ textarea.pf-c-form-control {
 }
 .pf-c-form-control.pf-m-resize-horizontal {
   resize: horizontal;
+}
+
+:where(.pf-theme-dark) .pf-c-form-control {
+  --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%235ba352' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'/%3E%3C/svg%3E");
+  --pf-c-form-control--BorderTopColor: transparent;
+  --pf-c-form-control--BorderRightColor: transparent;
+  --pf-c-form-control--BorderBottomColor: var(--pf-global--BorderColor--400);
+  --pf-c-form-control--BorderLeftColor: transparent;
+  --pf-c-form-control--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  --pf-c-form-control--disabled--Color: var(--pf-global--disabled-color--300);
+  --pf-c-form-control--disabled--BackgroundColor: var(--pf-global--disabled-color--200);
+  --pf-c-form-control--readonly--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  color: var(--pf-global--Color--100);
+}
+:where(.pf-theme-dark) .pf-c-form-control::-webkit-calendar-picker-indicator {
+  filter: invert(1);
+}
+:where(.pf-theme-dark) .pf-c-form-control[readonly] {
+  border-bottom-color: var(--pf-global--palette--black-700);
+}
+:where(.pf-theme-dark) .pf-c-form-control:disabled {
+  color: var(--pf-global--palette--black-100);
 }

package/css/components/FormControl/form-control.d.ts

@@ -13,6 +13,7 @@ declare const _default: {
     "placeholder": "pf-m-placeholder",
     "resizeVertical": "pf-m-resize-vertical",
     "resizeHorizontal": "pf-m-resize-horizontal"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/FormControl/form-control.js

@@ -15,5 +15,6 @@ exports.default = {
     "placeholder": "pf-m-placeholder",
     "resizeVertical": "pf-m-resize-vertical",
     "resizeHorizontal": "pf-m-resize-horizontal"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/FormControl/form-control.mjs

@@ -13,5 +13,6 @@ export default {
     "placeholder": "pf-m-placeholder",
     "resizeVertical": "pf-m-resize-vertical",
     "resizeHorizontal": "pf-m-resize-horizontal"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/HelperText/helper-text.css

@@ -66,4 +66,8 @@
 
 .pf-c-helper-text__item-text {
   color: var(--pf-c-helper-text__item-text--Color);
+}
+
+:where(.pf-theme-dark) .pf-c-helper-text {
+  --pf-c-helper-text__item-text--m-success--Color: var(--pf-global--success-color--100);
 }

package/css/components/HelperText/helper-text.d.ts

@@ -10,6 +10,7 @@ declare const _default: {
     "success": "pf-m-success",
     "error": "pf-m-error",
     "dynamic": "pf-m-dynamic"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/HelperText/helper-text.js

@@ -12,5 +12,6 @@ exports.default = {
     "success": "pf-m-success",
     "error": "pf-m-error",
     "dynamic": "pf-m-dynamic"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/HelperText/helper-text.mjs

@@ -10,5 +10,6 @@ export default {
     "success": "pf-m-success",
     "error": "pf-m-error",
     "dynamic": "pf-m-dynamic"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Hint/hint.css

@@ -57,4 +57,9 @@
 }
 .pf-c-hint__footer > :not(:last-child) {
   margin-right: var(--pf-c-hint__footer--child--MarginRight);
+}
+
+:where(.pf-theme-dark) .pf-c-hint {
+  --pf-c-hint--BackgroundColor: var(--pf-global--BackgroundColor--400);
+  --pf-c-hint--BorderColor: var(--pf-global--BorderColor--300);
 }

package/css/components/Hint/hint.d.ts

@@ -12,6 +12,7 @@ declare const _default: {
     "link": "pf-m-link",
     "inline": "pf-m-inline",
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/Hint/hint.js

@@ -14,5 +14,6 @@ exports.default = {
     "link": "pf-m-link",
     "inline": "pf-m-inline",
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Hint/hint.mjs

@@ -12,5 +12,6 @@ export default {
     "link": "pf-m-link",
     "inline": "pf-m-inline",
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/InputGroup/input-group.css

@@ -67,4 +67,26 @@ label.pf-c-input-group__text {
 .pf-c-input-group__text.pf-m-plain {
   --pf-c-input-group__text--BorderWidth: 0;
   margin-left: 0;
+}
+
+:where(.pf-theme-dark) .pf-c-input-group {
+  --pf-c-input-group--BackgroundColor: transparent;
+  --pf-c-input-group__text--BorderTopColor: transparent;
+  --pf-c-input-group__text--BorderRightColor: transparent;
+  --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
+  --pf-c-input-group__text--BorderLeftColor: transparent;
+  --pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
+}
+:where(.pf-theme-dark) .pf-c-input-group > * + * {
+  margin-left: 0;
+  border-left: 1px solid var(--pf-global--palette--black-700);
+}
+:where(.pf-theme-dark) .pf-c-input-group__text {
+  --pf-c-input-group__text--BorderTopColor: transparent;
+  --pf-c-input-group__text--BorderRightColor: transparent;
+  --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
+  --pf-c-input-group__text--BorderLeftColor: transparent;
+}
+:where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
+  --pf-c-input-group__text--BackgroundColor: transparent;
 }

package/css/components/InputGroup/input-group.d.ts

@@ -5,6 +5,7 @@ declare const _default: {
   "inputGroupText": "pf-c-input-group__text",
   "modifiers": {
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/InputGroup/input-group.js

@@ -7,5 +7,6 @@ exports.default = {
   "inputGroupText": "pf-c-input-group__text",
   "modifiers": {
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/InputGroup/input-group.mjs

@@ -5,5 +5,6 @@ export default {
   "inputGroupText": "pf-c-input-group__text",
   "modifiers": {
     "plain": "pf-m-plain"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };

package/css/components/Label/label.css

@@ -40,9 +40,9 @@
   --pf-c-label--m-outline--m-green__content--before--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor: var(--pf-global--BorderColor--100);
-  --pf-c-label--m-orange--BackgroundColor: var(--pf-global--palette--gold-50);
+  --pf-c-label--m-orange--BackgroundColor: var(--pf-global--palette--orange-50);
   --pf-c-label--m-orange__icon--Color: var(--pf-global--palette--orange-300);
-  --pf-c-label--m-orange__content--Color: var(--pf-global--palette--gold-700);
+  --pf-c-label--m-orange__content--Color: var(--pf-global--palette--orange-700);
   --pf-c-label--m-orange__content--before--BorderColor: var(--pf-global--palette--orange-100);
   --pf-c-label--m-orange__content--link--hover--before--BorderColor: var(--pf-global--palette--orange-300);
   --pf-c-label--m-orange__content--link--focus--before--BorderColor: var(--pf-global--palette--orange-300);
@@ -80,6 +80,16 @@
   --pf-c-label--m-outline--m-cyan__content--before--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor: var(--pf-global--BorderColor--100);
+  --pf-c-label--m-gold--BackgroundColor: var(--pf-global--palette--gold-50);
+  --pf-c-label--m-gold__icon--Color: var(--pf-global--palette--gold-400);
+  --pf-c-label--m-gold__content--Color: var(--pf-global--palette--gold-700);
+  --pf-c-label--m-gold__content--before--BorderColor: var(--pf-global--palette--gold-100);
+  --pf-c-label--m-gold__content--link--hover--before--BorderColor: var(--pf-global--palette--gold-300);
+  --pf-c-label--m-gold__content--link--focus--before--BorderColor: var(--pf-global--palette--gold-300);
+  --pf-c-label--m-outline--m-gold__content--Color: var(--pf-global--palette--gold-600);
+  --pf-c-label--m-outline--m-gold__content--before--BorderColor: var(--pf-global--BorderColor--100);
+  --pf-c-label--m-outline--m-gold__content--link--hover--before--BorderColor: var(--pf-global--BorderColor--100);
+  --pf-c-label--m-outline--m-gold__content--link--focus--before--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-label--m-overflow__content--Color: var(--pf-global--link--Color);
   --pf-c-label--m-overflow__content--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-label--m-overflow__content--before--BorderWidth: var(--pf-global--BorderWidth--sm);
@@ -236,6 +246,21 @@
   --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
   --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-cyan__content--before--BorderColor);
 }
+.pf-c-label.pf-m-gold {
+  --pf-c-label--BackgroundColor: var(--pf-c-label--m-gold--BackgroundColor);
+  --pf-c-label__icon--Color: var(--pf-c-label--m-gold__icon--Color);
+  --pf-c-label__content--Color: var(--pf-c-label--m-gold__content--Color);
+  --pf-c-label__content--before--BorderColor: var(--pf-c-label--m-gold__content--before--BorderColor);
+  --pf-c-label__content--link--hover--before--BorderColor: var(--pf-c-label--m-gold__content--link--hover--before--BorderColor);
+  --pf-c-label__content--link--focus--before--BorderColor: var(--pf-c-label--m-gold__content--link--focus--before--BorderColor);
+  --pf-c-label--m-outline__content--Color: var(--pf-c-label--m-outline--m-gold__content--Color);
+  --pf-c-label--m-outline__content--before--BorderColor: var(--pf-c-label--m-outline--m-gold__content--before--BorderColor);
+  --pf-c-label--m-outline__content--link--hover--before--BorderColor: var(--pf-c-label--m-outline--m-gold__content--link--hover--before--BorderColor);
+  --pf-c-label--m-outline__content--link--focus--before--BorderColor: var(--pf-c-label--m-outline--m-gold__content--link--focus--before--BorderColor);
+  --pf-c-label--m-editable__content--before--BorderColor: var(--pf-c-label--m-gold__content--before--BorderColor);
+  --pf-c-label--m-editable__content--hover--before--BorderColor: var(--pf-c-label--m-gold__content--before--BorderColor);
+  --pf-c-label--m-editable__content--focus--before--BorderColor: var(--pf-c-label--m-gold__content--before--BorderColor);
+}
 .pf-c-label.pf-m-outline {
   --pf-c-label__content--Color: var(--pf-c-label--m-outline__content--Color);
   --pf-c-label__content--before--BorderWidth: var(--pf-c-label--m-outline__content--before--BorderWidth);
@@ -368,4 +393,48 @@ button.pf-c-label__content:focus {
 .pf-c-label__icon {
   margin-right: var(--pf-c-label__icon--MarginRight);
   color: var(--pf-c-label__icon--Color);
+}
+
+:where(.pf-theme-dark) .pf-c-label {
+  --pf-c-label--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-blue--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-green--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-orange--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-red--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-purple--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label--m-cyan--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-label__content--before--BorderWidth: 0;
+  --pf-c-label__content--before--BorderColor: transparent;
+  --pf-c-label__content--link--hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-label__content--link--focus--before--BorderWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-label--m-blue__content--Color: var(--pf-global--primary-color--100);
+  --pf-c-label--m-outline--m-blue__content--before--BorderColor: var(--pf-global--active-color--200);
+  --pf-c-label--m-outline--m-blue__content--link--hover--before--BorderColor: var(--pf-global--active-color--200);
+  --pf-c-label--m-outline--m-blue__content--link--focus--before--BorderColor: var(--pf-global--active-color--200);
+  --pf-c-label--m-green__content--Color: var(--pf-global--success-color--100);
+  --pf-c-label--m-outline--m-green__content--before--BorderColor: var(--pf-global--palette--green-100);
+  --pf-c-label--m-outline--m-green__content--link--hover--before--BorderColor: var(--pf-global--palette--green-100);
+  --pf-c-label--m-outline--m-green__content--link--focus--before--BorderColor: var(--pf-global--palette--green-100);
+  --pf-c-label--m-orange__content--Color: var(--pf-global--palette--orange-300);
+  --pf-c-label--m-outline--m-orange__content--Color: var(--pf-global--palette--orange-300);
+  --pf-c-label--m-outline--m-orange__content--before--BorderColor: var(--pf-global--palette--gold-100);
+  --pf-c-label--m-outline--m-orange__content--link--hover--before--BorderColor: var(--pf-global--palette--gold-100);
+  --pf-c-label--m-outline--m-orange__content--link--focus--before--BorderColor: var(--pf-global--palette--gold-100);
+  --pf-c-label--m-red__content--Color: var(--pf-global--danger-color--100);
+  --pf-c-label--m-outline--m-red__content--before--BorderColor: var(--pf-global--danger-color--100);
+  --pf-c-label--m-outline--m-red__content--link--hover--before--BorderColor: var(--pf-global--danger-color--100);
+  --pf-c-label--m-outline--m-red__content--link--focus--before--BorderColor: var(--pf-global--danger-color--100);
+  --pf-c-label--m-purple__content--Color: var(--pf-global--palette--purple-300);
+  --pf-c-label--m-purple__icon--Color: var(--pf-global--palette--purple-300);
+  --pf-c-label--m-purple__content--link--hover--before--BorderColor: var(--pf-global--palette--purple-300);
+  --pf-c-label--m-purple__content--link--focus--before--BorderColor: var(--pf-global--palette--purple-300);
+  --pf-c-label--m-outline--m-purple__content--before--BorderColor: var(--pf-global--palette--purple-100);
+  --pf-c-label--m-outline--m-purple__content--link--hover--before--BorderColor: var(--pf-global--palette--purple-100);
+  --pf-c-label--m-outline--m-purple__content--link--focus--before--BorderColor: var(--pf-global--palette--purple-100);
+  --pf-c-label--m-outline--m-purple__content--Color: var(--pf-global--palette--purple-300);
+  --pf-c-label--m-cyan__content--Color: var(--pf-global--default-color--200);
+  --pf-c-label--m-outline--m-cyan__content--Color: var(--pf-global--default-color--200);
+  --pf-c-label--m-outline--m-cyan__content--before--BorderColor: var(--pf-global--palette--cyan-100);
+  --pf-c-label--m-outline--m-cyan__content--link--hover--before--BorderColor: var(--pf-global--palette--cyan-100);
+  --pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor: var(--pf-global--palette--cyan-100);
 }

package/css/components/Label/label.d.ts

@@ -13,11 +13,13 @@ declare const _default: {
     "red": "pf-m-red",
     "purple": "pf-m-purple",
     "cyan": "pf-m-cyan",
+    "gold": "pf-m-gold",
     "outline": "pf-m-outline",
     "overflow": "pf-m-overflow",
     "add": "pf-m-add",
     "editable": "pf-m-editable",
     "editableActive": "pf-m-editable-active"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };
 export default _default;

package/css/components/Label/label.js

@@ -15,10 +15,12 @@ exports.default = {
     "red": "pf-m-red",
     "purple": "pf-m-purple",
     "cyan": "pf-m-cyan",
+    "gold": "pf-m-gold",
     "outline": "pf-m-outline",
     "overflow": "pf-m-overflow",
     "add": "pf-m-add",
     "editable": "pf-m-editable",
     "editableActive": "pf-m-editable-active"
-  }
+  },
+  "themeDark": "pf-theme-dark"
 };