@patternfly/patternfly 6.0.0-alpha.90 → 6.0.0-alpha.91

package/components/Check/check.css

@@ -1,72 +1,72 @@
 :root,
-.pf-v5-c-check {
-  --pf-v5-c-check--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
-  --pf-v5-c-check--AccentColor: var(--pf-t--global--color--brand--default);
-  --pf-v5-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
-  --pf-v5-c-check__label--Color: var(--pf-t--global--text--color--regular);
-  --pf-v5-c-check__label--FontWeight: var(--pf-t--global--font--weight--body);
-  --pf-v5-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
-  --pf-v5-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
-  --pf-v5-c-check__input--TranslateY: calc((var(--pf-v5-c-check__label--LineHeight) * var(--pf-v5-c-check__label--FontSize) / 2 ) - 50%);
-  --pf-v5-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
-  --pf-v5-c-check__description--Color: var(--pf-t--global--text--color--subtle);
-  --pf-v5-c-check__label-required--MarginLeft: var(--pf-t--global--spacer--xs);
-  --pf-v5-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
-  --pf-v5-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
+.pf-v6-c-check {
+  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
+  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
+  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
+  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
+  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body);
+  --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
+  --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
+  --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
+  --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
+  --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
+  --pf-v6-c-check__label-required--MarginLeft: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
+  --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
 }
 
-.pf-v5-c-check {
+.pf-v6-c-check {
   display: grid;
   grid-template-columns: auto 1fr;
-  grid-gap: var(--pf-v5-c-check--GridGap);
-  accent-color: var(--pf-v5-c-check--AccentColor);
+  grid-gap: var(--pf-v6-c-check--GridGap);
+  accent-color: var(--pf-v6-c-check--AccentColor);
 }
-.pf-v5-c-check.pf-m-standalone {
-  --pf-v5-c-check--GridGap: 0;
-  --pf-v5-c-check__input--TranslateY: none;
+.pf-v6-c-check.pf-m-standalone {
+  --pf-v6-c-check--GridGap: 0;
+  --pf-v6-c-check__input--TranslateY: none;
   display: inline-grid;
 }
 
-.pf-v5-c-check__input {
+.pf-v6-c-check__input {
   align-self: start;
-  transform: translateY(var(--pf-v5-c-check__input--TranslateY));
+  transform: translateY(var(--pf-v6-c-check__input--TranslateY));
 }
 
-.pf-v5-c-check__label {
-  font-size: var(--pf-v5-c-check__label--FontSize);
-  font-weight: var(--pf-v5-c-check__label--FontWeight);
-  line-height: var(--pf-v5-c-check__label--LineHeight);
-  color: var(--pf-v5-c-check__label--Color);
+.pf-v6-c-check__label {
+  font-size: var(--pf-v6-c-check__label--FontSize);
+  font-weight: var(--pf-v6-c-check__label--FontWeight);
+  line-height: var(--pf-v6-c-check__label--LineHeight);
+  color: var(--pf-v6-c-check__label--Color);
 }
 
-.pf-v5-c-check__description {
+.pf-v6-c-check__description {
   grid-column: 2;
-  font-size: var(--pf-v5-c-check__description--FontSize);
-  color: var(--pf-v5-c-check__description--Color);
+  font-size: var(--pf-v6-c-check__description--FontSize);
+  color: var(--pf-v6-c-check__description--Color);
 }
 
-.pf-v5-c-check__body {
+.pf-v6-c-check__body {
   grid-column: 2;
 }
 
-.pf-v5-c-check__label,
-.pf-v5-c-check__input {
+.pf-v6-c-check__label,
+.pf-v6-c-check__input {
   justify-self: start;
 }
-label.pf-v5-c-check, .pf-v5-c-check__label,
-.pf-v5-c-check__input {
+label.pf-v6-c-check, .pf-v6-c-check__label,
+.pf-v6-c-check__input {
   cursor: pointer;
 }
 
-.pf-v5-c-check__label:disabled, .pf-v5-c-check__label.pf-m-disabled,
-.pf-v5-c-check__input:disabled,
-.pf-v5-c-check__input.pf-m-disabled {
-  --pf-v5-c-check__label--Color: var(--pf-v5-c-check__label--disabled--Color);
+.pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
+.pf-v6-c-check__input:disabled,
+.pf-v6-c-check__input.pf-m-disabled {
+  --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
   cursor: not-allowed;
 }
 
-.pf-v5-c-check__label-required {
-  margin-inline-start: var(--pf-v5-c-check__label-required--MarginLeft);
-  font-size: var(--pf-v5-c-check__label-required--FontSize);
-  color: var(--pf-v5-c-check__label-required--Color);
+.pf-v6-c-check__label-required {
+  margin-inline-start: var(--pf-v6-c-check__label-required--MarginLeft);
+  font-size: var(--pf-v6-c-check__label-required--FontSize);
+  color: var(--pf-v6-c-check__label-required--Color);
 }

package/components/Chip/chip-group.css

@@ -1,93 +1,93 @@
-.pf-v5-c-chip-group {
-  --pf-v5-global--Color--100: var(--pf-v5-global--Color--dark-100);
-  --pf-v5-global--Color--200: var(--pf-v5-global--Color--dark-200);
-  --pf-v5-global--BorderColor--100: var(--pf-v5-global--BorderColor--dark-100);
-  --pf-v5-global--primary-color--100: var(--pf-v5-global--primary-color--dark-100);
-  --pf-v5-global--link--Color: var(--pf-v5-global--link--Color--dark);
-  --pf-v5-global--link--Color--hover: var(--pf-v5-global--link--Color--dark--hover);
-  --pf-v5-global--BackgroundColor--100: var(--pf-v5-global--BackgroundColor--light-100);
-  --pf-v5-global--icon--Color--light: var(--pf-v5-global--icon--Color--light--dark);
-  --pf-v5-global--icon--Color--dark: var(--pf-v5-global--icon--Color--dark--dark);
+.pf-v6-c-chip-group {
+  --pf-v6-global--Color--100: var(--pf-v6-global--Color--dark-100);
+  --pf-v6-global--Color--200: var(--pf-v6-global--Color--dark-200);
+  --pf-v6-global--BorderColor--100: var(--pf-v6-global--BorderColor--dark-100);
+  --pf-v6-global--primary-color--100: var(--pf-v6-global--primary-color--dark-100);
+  --pf-v6-global--link--Color: var(--pf-v6-global--link--Color--dark);
+  --pf-v6-global--link--Color--hover: var(--pf-v6-global--link--Color--dark--hover);
+  --pf-v6-global--BackgroundColor--100: var(--pf-v6-global--BackgroundColor--light-100);
+  --pf-v6-global--icon--Color--light: var(--pf-v6-global--icon--Color--light--dark);
+  --pf-v6-global--icon--Color--dark: var(--pf-v6-global--icon--Color--dark--dark);
 }
 
-.pf-v5-c-chip-group {
-  color: var(--pf-v5-global--Color--100);
-  --pf-v5-c-chip-group--PaddingTop: 0;
-  --pf-v5-c-chip-group--PaddingRight: 0;
-  --pf-v5-c-chip-group--PaddingBottom: 0;
-  --pf-v5-c-chip-group--PaddingLeft: 0;
-  --pf-v5-c-chip-group--RowGap: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip-group--ColumnGap: 0;
-  --pf-v5-c-chip-group__main--RowGap: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group__main--ColumnGap: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip-group__list--RowGap: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group__list--ColumnGap: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group--m-category--PaddingTop: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group--m-category--PaddingRight: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group--m-category--PaddingBottom: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip-group--m-category--PaddingLeft: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip-group--m-category--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
-  --pf-v5-c-chip-group--m-category--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
-  --pf-v5-c-chip-group__label--FontSize: var(--pf-v5-global--FontSize--sm);
-  --pf-v5-c-chip-group__label--MaxWidth: 18ch;
-  --pf-v5-c-chip-group__close--MarginTop: calc(var(--pf-v5-global--spacer--xs) * -1);
-  --pf-v5-c-chip-group__close--MarginBottom: calc(var(--pf-v5-global--spacer--xs) * -1);
-  row-gap: var(--pf-v5-c-chip-group--RowGap);
-  column-gap: var(--pf-v5-c-chip-group--ColumnGap);
+.pf-v6-c-chip-group {
+  color: var(--pf-v6-global--Color--100);
+  --pf-v6-c-chip-group--PaddingTop: 0;
+  --pf-v6-c-chip-group--PaddingRight: 0;
+  --pf-v6-c-chip-group--PaddingBottom: 0;
+  --pf-v6-c-chip-group--PaddingLeft: 0;
+  --pf-v6-c-chip-group--RowGap: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip-group--ColumnGap: 0;
+  --pf-v6-c-chip-group__main--RowGap: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group__main--ColumnGap: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip-group__list--RowGap: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group__list--ColumnGap: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group--m-category--PaddingTop: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group--m-category--PaddingRight: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group--m-category--PaddingBottom: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip-group--m-category--PaddingLeft: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip-group--m-category--BorderRadius: var(--pf-v6-global--BorderRadius--sm);
+  --pf-v6-c-chip-group--m-category--BackgroundColor: var(--pf-v6-global--BackgroundColor--200);
+  --pf-v6-c-chip-group__label--FontSize: var(--pf-v6-global--FontSize--sm);
+  --pf-v6-c-chip-group__label--MaxWidth: 18ch;
+  --pf-v6-c-chip-group__close--MarginTop: calc(var(--pf-v6-global--spacer--xs) * -1);
+  --pf-v6-c-chip-group__close--MarginBottom: calc(var(--pf-v6-global--spacer--xs) * -1);
+  row-gap: var(--pf-v6-c-chip-group--RowGap);
+  column-gap: var(--pf-v6-c-chip-group--ColumnGap);
   max-width: 100%;
-  padding-block-start: var(--pf-v5-c-chip-group--PaddingTop);
-  padding-block-end: var(--pf-v5-c-chip-group--PaddingBottom);
-  padding-inline-start: var(--pf-v5-c-chip-group--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-chip-group--PaddingRight);
+  padding-block-start: var(--pf-v6-c-chip-group--PaddingTop);
+  padding-block-end: var(--pf-v6-c-chip-group--PaddingBottom);
+  padding-inline-start: var(--pf-v6-c-chip-group--PaddingLeft);
+  padding-inline-end: var(--pf-v6-c-chip-group--PaddingRight);
 }
-.pf-v5-c-chip-group.pf-m-category {
-  --pf-v5-c-chip-group--PaddingTop: var(--pf-v5-c-chip-group--m-category--PaddingTop);
-  --pf-v5-c-chip-group--PaddingRight: var(--pf-v5-c-chip-group--m-category--PaddingRight);
-  --pf-v5-c-chip-group--PaddingBottom: var(--pf-v5-c-chip-group--m-category--PaddingBottom);
-  --pf-v5-c-chip-group--PaddingLeft: var(--pf-v5-c-chip-group--m-category--PaddingLeft);
-  background-color: var(--pf-v5-c-chip-group--m-category--BackgroundColor);
-  border-radius: var(--pf-v5-c-chip-group--m-category--BorderRadius);
+.pf-v6-c-chip-group.pf-m-category {
+  --pf-v6-c-chip-group--PaddingTop: var(--pf-v6-c-chip-group--m-category--PaddingTop);
+  --pf-v6-c-chip-group--PaddingRight: var(--pf-v6-c-chip-group--m-category--PaddingRight);
+  --pf-v6-c-chip-group--PaddingBottom: var(--pf-v6-c-chip-group--m-category--PaddingBottom);
+  --pf-v6-c-chip-group--PaddingLeft: var(--pf-v6-c-chip-group--m-category--PaddingLeft);
+  background-color: var(--pf-v6-c-chip-group--m-category--BackgroundColor);
+  border-radius: var(--pf-v6-c-chip-group--m-category--BorderRadius);
 }
 
-.pf-v5-c-chip-group__main {
+.pf-v6-c-chip-group__main {
   display: flex;
   flex: 1;
   flex-wrap: wrap;
-  row-gap: var(--pf-v5-c-chip-group__main--RowGap);
-  column-gap: var(--pf-v5-c-chip-group__main--ColumnGap);
+  row-gap: var(--pf-v6-c-chip-group__main--RowGap);
+  column-gap: var(--pf-v6-c-chip-group__main--ColumnGap);
   align-items: baseline;
   min-width: 0;
 }
 
-.pf-v5-c-chip-group,
-.pf-v5-c-chip-group__list {
+.pf-v6-c-chip-group,
+.pf-v6-c-chip-group__list {
   display: inline-flex;
   flex-wrap: wrap;
   align-items: center;
   min-width: 0;
 }
 
-.pf-v5-c-chip-group__list {
-  row-gap: var(--pf-v5-c-chip-group__list--RowGap);
-  column-gap: var(--pf-v5-c-chip-group__list--ColumnGap);
+.pf-v6-c-chip-group__list {
+  row-gap: var(--pf-v6-c-chip-group__list--RowGap);
+  column-gap: var(--pf-v6-c-chip-group__list--ColumnGap);
 }
 
-.pf-v5-c-chip-group__list-item {
+.pf-v6-c-chip-group__list-item {
   display: inline-flex;
   min-width: 0;
 }
 
-.pf-v5-c-chip-group__label {
+.pf-v6-c-chip-group__label {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  max-width: var(--pf-v5-c-chip-group__label--MaxWidth);
-  font-size: var(--pf-v5-c-chip-group__label--FontSize);
+  max-width: var(--pf-v6-c-chip-group__label--MaxWidth);
+  font-size: var(--pf-v6-c-chip-group__label--FontSize);
 }
 
-.pf-v5-c-chip-group__close {
+.pf-v6-c-chip-group__close {
   display: flex;
   align-self: flex-start;
-  margin-block-start: var(--pf-v5-c-chip-group__close--MarginTop);
-  margin-block-end: var(--pf-v5-c-chip-group__close--MarginBottom);
+  margin-block-start: var(--pf-v6-c-chip-group__close--MarginTop);
+  margin-block-end: var(--pf-v6-c-chip-group__close--MarginBottom);
 }

package/components/Chip/chip.css

@@ -1,122 +1,122 @@
-.pf-v5-c-chip {
-  --pf-v5-global--Color--100: var(--pf-v5-global--Color--dark-100);
-  --pf-v5-global--Color--200: var(--pf-v5-global--Color--dark-200);
-  --pf-v5-global--BorderColor--100: var(--pf-v5-global--BorderColor--dark-100);
-  --pf-v5-global--primary-color--100: var(--pf-v5-global--primary-color--dark-100);
-  --pf-v5-global--link--Color: var(--pf-v5-global--link--Color--dark);
-  --pf-v5-global--link--Color--hover: var(--pf-v5-global--link--Color--dark--hover);
-  --pf-v5-global--BackgroundColor--100: var(--pf-v5-global--BackgroundColor--light-100);
-  --pf-v5-global--icon--Color--light: var(--pf-v5-global--icon--Color--light--dark);
-  --pf-v5-global--icon--Color--dark: var(--pf-v5-global--icon--Color--dark--dark);
+.pf-v6-c-chip {
+  --pf-v6-global--Color--100: var(--pf-v6-global--Color--dark-100);
+  --pf-v6-global--Color--200: var(--pf-v6-global--Color--dark-200);
+  --pf-v6-global--BorderColor--100: var(--pf-v6-global--BorderColor--dark-100);
+  --pf-v6-global--primary-color--100: var(--pf-v6-global--primary-color--dark-100);
+  --pf-v6-global--link--Color: var(--pf-v6-global--link--Color--dark);
+  --pf-v6-global--link--Color--hover: var(--pf-v6-global--link--Color--dark--hover);
+  --pf-v6-global--BackgroundColor--100: var(--pf-v6-global--BackgroundColor--light-100);
+  --pf-v6-global--icon--Color--light: var(--pf-v6-global--icon--Color--light--dark);
+  --pf-v6-global--icon--Color--dark: var(--pf-v6-global--icon--Color--dark--dark);
 }
 
-.pf-v5-c-chip {
-  --pf-v5-c-chip--PaddingTop: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip--PaddingRight: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip--PaddingBottom: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip--PaddingLeft: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip--BackgroundColor: var(--pf-v5-global--Color--light-100);
-  --pf-v5-c-chip--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
-  --pf-v5-c-chip--before--BorderColor: var(--pf-v5-global--BorderColor--300);
-  --pf-v5-c-chip--before--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
-  --pf-v5-c-chip--before--BorderRadius: var(--pf-v5-c-chip--BorderRadius);
-  --pf-v5-c-chip--m-overflow__text--Color: var(--pf-v5-global--primary-color--100);
-  --pf-v5-c-chip--m-draggable--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
-  --pf-v5-c-chip--m-draggable--BoxShadow: var(--pf-v5-global--BoxShadow--sm);
-  --pf-v5-c-chip--m-draggable__icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
-  --pf-v5-c-chip__content--FontSize: var(--pf-v5-global--FontSize--xs);
-  --pf-v5-c-chip__content--ColumnGap: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip__text--Color: var(--pf-v5-global--Color--100);
-  --pf-v5-c-chip__text--MaxWidth: 16ch;
-  --pf-v5-c-chip__c-badge--MarginLeft: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip__actions--FontSize: var(--pf-v5-global--FontSize--xs);
-  --pf-v5-c-chip__actions--c-button--PaddingTop: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip__actions--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip__actions--c-button--PaddingBottom: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-chip__actions--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-chip__actions--c-button--MarginTop: calc(var(--pf-v5-c-chip--PaddingTop) * -1);
-  --pf-v5-c-chip__actions--c-button--MarginRight: calc(var(--pf-v5-c-chip--PaddingRight) / 2 * -1);
-  --pf-v5-c-chip__actions--c-button--MarginBottom: calc(var(--pf-v5-c-chip--PaddingBottom) * -1);
-  --pf-v5-c-chip__actions--c-button--FontSize: var(--pf-v5-global--FontSize--xs);
-  --pf-v5-c-chip__icon--MarginLeft: var(--pf-v5-global--spacer--sm);
-  color: var(--pf-v5-global--Color--100);
+.pf-v6-c-chip {
+  --pf-v6-c-chip--PaddingTop: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip--PaddingRight: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip--PaddingBottom: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip--PaddingLeft: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip--BackgroundColor: var(--pf-v6-global--Color--light-100);
+  --pf-v6-c-chip--BorderRadius: var(--pf-v6-global--BorderRadius--sm);
+  --pf-v6-c-chip--before--BorderColor: var(--pf-v6-global--BorderColor--300);
+  --pf-v6-c-chip--before--BorderWidth: var(--pf-v6-global--BorderWidth--sm);
+  --pf-v6-c-chip--before--BorderRadius: var(--pf-v6-c-chip--BorderRadius);
+  --pf-v6-c-chip--m-overflow__text--Color: var(--pf-v6-global--primary-color--100);
+  --pf-v6-c-chip--m-draggable--BackgroundColor: var(--pf-v6-global--BackgroundColor--200);
+  --pf-v6-c-chip--m-draggable--BoxShadow: var(--pf-v6-global--BoxShadow--sm);
+  --pf-v6-c-chip--m-draggable__icon--FontSize: var(--pf-v6-global--icon--FontSize--sm);
+  --pf-v6-c-chip__content--FontSize: var(--pf-v6-global--FontSize--xs);
+  --pf-v6-c-chip__content--ColumnGap: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip__text--Color: var(--pf-v6-global--Color--100);
+  --pf-v6-c-chip__text--MaxWidth: 16ch;
+  --pf-v6-c-chip__c-badge--MarginLeft: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip__actions--FontSize: var(--pf-v6-global--FontSize--xs);
+  --pf-v6-c-chip__actions--c-button--PaddingTop: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip__actions--c-button--PaddingRight: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip__actions--c-button--PaddingBottom: var(--pf-v6-global--spacer--xs);
+  --pf-v6-c-chip__actions--c-button--PaddingLeft: var(--pf-v6-global--spacer--sm);
+  --pf-v6-c-chip__actions--c-button--MarginTop: calc(var(--pf-v6-c-chip--PaddingTop) * -1);
+  --pf-v6-c-chip__actions--c-button--MarginRight: calc(var(--pf-v6-c-chip--PaddingRight) / 2 * -1);
+  --pf-v6-c-chip__actions--c-button--MarginBottom: calc(var(--pf-v6-c-chip--PaddingBottom) * -1);
+  --pf-v6-c-chip__actions--c-button--FontSize: var(--pf-v6-global--FontSize--xs);
+  --pf-v6-c-chip__icon--MarginLeft: var(--pf-v6-global--spacer--sm);
+  color: var(--pf-v6-global--Color--100);
   position: relative;
   display: inline-flex;
   align-items: center;
   min-width: 0;
-  padding-block-start: var(--pf-v5-c-chip--PaddingTop);
-  padding-block-end: var(--pf-v5-c-chip--PaddingBottom);
-  padding-inline-start: var(--pf-v5-c-chip--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-chip--PaddingRight);
+  padding-block-start: var(--pf-v6-c-chip--PaddingTop);
+  padding-block-end: var(--pf-v6-c-chip--PaddingBottom);
+  padding-inline-start: var(--pf-v6-c-chip--PaddingLeft);
+  padding-inline-end: var(--pf-v6-c-chip--PaddingRight);
   list-style: none;
-  background-color: var(--pf-v5-c-chip--BackgroundColor);
-  border-radius: var(--pf-v5-c-chip--BorderRadius);
+  background-color: var(--pf-v6-c-chip--BackgroundColor);
+  border-radius: var(--pf-v6-c-chip--BorderRadius);
 }
-.pf-v5-c-chip::before {
+.pf-v6-c-chip::before {
   position: absolute;
   inset-block-start: 0;
   inset-block-end: 0;
   inset-inline-start: 0;
   inset-inline-end: 0;
   content: "";
-  border: var(--pf-v5-c-chip--before--BorderWidth) solid var(--pf-v5-c-chip--before--BorderColor);
-  border-radius: var(--pf-v5-c-chip--before--BorderRadius);
+  border: var(--pf-v6-c-chip--before--BorderWidth) solid var(--pf-v6-c-chip--before--BorderColor);
+  border-radius: var(--pf-v6-c-chip--before--BorderRadius);
 }
-.pf-v5-c-chip.pf-m-overflow {
+.pf-v6-c-chip.pf-m-overflow {
   border: 0;
 }
-.pf-v5-c-chip.pf-m-overflow .pf-v5-c-chip__text {
-  color: var(--pf-v5-c-chip--m-overflow__text--Color);
+.pf-v6-c-chip.pf-m-overflow .pf-v6-c-chip__text {
+  color: var(--pf-v6-c-chip--m-overflow__text--Color);
 }
-.pf-v5-c-chip.pf-m-draggable {
-  --pf-v5-c-chip--BackgroundColor: var(--pf-v5-c-chip--m-draggable--BackgroundColor);
-  box-shadow: var(--pf-v5-c-chip--m-draggable--BoxShadow);
+.pf-v6-c-chip.pf-m-draggable {
+  --pf-v6-c-chip--BackgroundColor: var(--pf-v6-c-chip--m-draggable--BackgroundColor);
+  box-shadow: var(--pf-v6-c-chip--m-draggable--BoxShadow);
 }
-.pf-v5-c-chip.pf-m-draggable .pf-v5-c-chip__icon {
-  font-size: var(--pf-v5-c-chip--m-draggable__icon--FontSize);
+.pf-v6-c-chip.pf-m-draggable .pf-v6-c-chip__icon {
+  font-size: var(--pf-v6-c-chip--m-draggable__icon--FontSize);
 }
 
-.pf-v5-c-chip__text {
+.pf-v6-c-chip__text {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   position: relative;
-  max-width: var(--pf-v5-c-chip__text--MaxWidth);
-  color: var(--pf-v5-c-chip__text--Color);
+  max-width: var(--pf-v6-c-chip__text--MaxWidth);
+  color: var(--pf-v6-c-chip__text--Color);
 }
-.pf-v5-c-chip__text .pf-v5-c-badge {
-  margin-inline-start: var(--pf-v5-c-chip__c-badge--MarginLeft);
+.pf-v6-c-chip__text .pf-v6-c-badge {
+  margin-inline-start: var(--pf-v6-c-chip__c-badge--MarginLeft);
 }
 
-.pf-v5-c-chip__icon + .pf-v5-c-chip__text,
-.pf-v5-c-chip__text + .pf-v5-c-chip__icon {
-  margin-inline-start: var(--pf-v5-c-chip__icon--MarginLeft);
+.pf-v6-c-chip__icon + .pf-v6-c-chip__text,
+.pf-v6-c-chip__text + .pf-v6-c-chip__icon {
+  margin-inline-start: var(--pf-v6-c-chip__icon--MarginLeft);
 }
 
-.pf-v5-c-chip__content {
+.pf-v6-c-chip__content {
   display: flex;
-  column-gap: var(--pf-v5-c-chip__content--ColumnGap);
+  column-gap: var(--pf-v6-c-chip__content--ColumnGap);
   align-items: center;
-  font-size: var(--pf-v5-c-chip__content--FontSize);
+  font-size: var(--pf-v6-c-chip__content--FontSize);
 }
 
-.pf-v5-c-chip__actions {
-  font-size: var(--pf-v5-c-chip__actions--FontSize);
+.pf-v6-c-chip__actions {
+  font-size: var(--pf-v6-c-chip__actions--FontSize);
 }
-.pf-v5-c-chip__actions .pf-v5-c-button {
-  --pf-v5-c-button--PaddingTop: var(--pf-v5-c-chip__actions--c-button--PaddingTop);
-  --pf-v5-c-button--PaddingRight: var(--pf-v5-c-chip__actions--c-button--PaddingRight);
-  --pf-v5-c-button--PaddingBottom: var(--pf-v5-c-chip__actions--c-button--PaddingBottom);
-  --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-chip__actions--c-button--PaddingLeft);
-  --pf-v5-c-button--FontSize: var(--pf-v5-c-chip__actions--c-button--FontSize);
-  margin-block-start: var(--pf-v5-c-chip__actions--c-button--MarginTop);
-  margin-block-end: var(--pf-v5-c-chip__actions--c-button--MarginBottom);
-  margin-inline-end: var(--pf-v5-c-chip__actions--c-button--MarginRight);
+.pf-v6-c-chip__actions .pf-v6-c-button {
+  --pf-v6-c-button--PaddingTop: var(--pf-v6-c-chip__actions--c-button--PaddingTop);
+  --pf-v6-c-button--PaddingRight: var(--pf-v6-c-chip__actions--c-button--PaddingRight);
+  --pf-v6-c-button--PaddingBottom: var(--pf-v6-c-chip__actions--c-button--PaddingBottom);
+  --pf-v6-c-button--PaddingLeft: var(--pf-v6-c-chip__actions--c-button--PaddingLeft);
+  --pf-v6-c-button--FontSize: var(--pf-v6-c-chip__actions--c-button--FontSize);
+  margin-block-start: var(--pf-v6-c-chip__actions--c-button--MarginTop);
+  margin-block-end: var(--pf-v6-c-chip__actions--c-button--MarginBottom);
+  margin-inline-end: var(--pf-v6-c-chip__actions--c-button--MarginRight);
   line-height: 1;
 }
 
-:where(.pf-v5-theme-dark) .pf-v5-c-chip {
-  --pf-v5-c-chip--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-chip--before--BorderColor: var(--pf-v5-global--BorderColor--100);
-  --pf-v5-c-chip--m-draggable--BackgroundColor: var(--pf-v5-global--palette--black-600);
+:where(.pf-v6-theme-dark) .pf-v6-c-chip {
+  --pf-v6-c-chip--BackgroundColor: var(--pf-v6-global--BackgroundColor--100);
+  --pf-v6-c-chip--before--BorderColor: var(--pf-v6-global--BorderColor--100);
+  --pf-v6-c-chip--m-draggable--BackgroundColor: var(--pf-v6-global--palette--black-600);
 }