@patternfly/react-styles 6.0.0-alpha.2 → 6.0.0-alpha.21

package/css/components/Popover/popover.css

@@ -1,211 +1,200 @@
-.pf-v5-c-popover {
-  --pf-v5-c-popover--FontSize: var(--pf-v5-global--FontSize--sm);
-  --pf-v5-c-popover--MinWidth: calc(var(--pf-v5-c-popover__content--PaddingLeft) + var(--pf-v5-c-popover__content--PaddingRight) + 18.75rem);
-  --pf-v5-c-popover--MaxWidth: calc(var(--pf-v5-c-popover__content--PaddingLeft) + var(--pf-v5-c-popover__content--PaddingRight) + 18.75rem);
-  --pf-v5-c-popover--BoxShadow: var(--pf-v5-global--BoxShadow--lg);
-  --pf-v5-c-popover--m-danger__title-icon--Color: var(--pf-v5-global--danger-color--100);
-  --pf-v5-c-popover--m-warning__title-icon--Color: var(--pf-v5-global--warning-color--100);
-  --pf-v5-c-popover--m-success__title-icon--Color: var(--pf-v5-global--success-color--100);
-  --pf-v5-c-popover--m-info__title-icon--Color: var(--pf-v5-global--info-color--100);
-  --pf-v5-c-popover--m-custom__title-icon--Color: var(--pf-v5-global--custom-color--200);
-  --pf-v5-c-popover--m-danger__title-text--Color: var(--pf-v5-global--danger-color--200);
-  --pf-v5-c-popover--m-warning__title-text--Color: var(--pf-v5-global--warning-color--200);
-  --pf-v5-c-popover--m-success__title-text--Color: var(--pf-v5-global--success-color--200);
-  --pf-v5-c-popover--m-info__title-text--Color: var(--pf-v5-global--info-color--200);
-  --pf-v5-c-popover--m-custom__title-text--Color: var(--pf-v5-global--custom-color--300);
-  --pf-v5-c-popover__content--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-popover__content--PaddingTop: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-popover__content--PaddingRight: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-popover__content--PaddingBottom: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-popover__content--PaddingLeft: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-popover__arrow--Width: var(--pf-v5-global--arrow--width-lg);
-  --pf-v5-c-popover__arrow--Height: var(--pf-v5-global--arrow--width-lg);
-  --pf-v5-c-popover__arrow--BoxShadow: var(--pf-v5-global--BoxShadow--lg);
-  --pf-v5-c-popover__arrow--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-popover__arrow--m-top--TranslateX: -50%;
-  --pf-v5-c-popover__arrow--m-top--TranslateY: 50%;
-  --pf-v5-c-popover__arrow--m-top--Rotate: 45deg;
-  --pf-v5-c-popover__arrow--m-right--TranslateX: -50%;
-  --pf-v5-c-popover__arrow--m-right--TranslateY: -50%;
-  --pf-v5-c-popover__arrow--m-right--Rotate: 45deg;
-  --pf-v5-c-popover__arrow--m-bottom--TranslateX: -50%;
-  --pf-v5-c-popover__arrow--m-bottom--TranslateY: -50%;
-  --pf-v5-c-popover__arrow--m-bottom--Rotate: 45deg;
-  --pf-v5-c-popover__arrow--m-left--TranslateX: 50%;
-  --pf-v5-c-popover__arrow--m-left--TranslateY: -50%;
-  --pf-v5-c-popover__arrow--m-left--Rotate: 45deg;
-  --pf-v5-c-popover__close--Top: calc(var(--pf-v5-c-popover__content--PaddingTop) - var(--pf-v5-global--spacer--form-element));
-  --pf-v5-c-popover__close--Right: calc(var(--pf-v5-c-popover__content--PaddingRight) - var(--pf-v5-global--spacer--md));
-  --pf-v5-c-popover__close--sibling--PaddingRight: var(--pf-v5-global--spacer--2xl);
-  --pf-v5-c-popover__header--MarginBottom: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-popover__title-text--LineHeight: var(--pf-v5-global--LineHeight--md);
-  --pf-v5-c-popover__title-text--FontFamily: var(--pf-v5-global--FontFamily--heading);
-  --pf-v5-c-popover__title-text--FontSize: var(--pf-v5-global--FontSize--md);
-  --pf-v5-c-popover__title-icon--MarginRight: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-global--Color--100);
-  --pf-v5-c-popover__title-icon--FontSize: var(--pf-v5-global--FontSize--md);
-  --pf-v5-c-popover__footer--MarginTop: var(--pf-v5-global--spacer--md);
+.pf-v6-c-popover {
+  --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
+  --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
+  --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
+  --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
+  --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
+  --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
+  --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
+  --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
+  --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
+  --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
+  --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--Width: 0.9375rem;
+  --pf-v6-c-popover__arrow--Height: 0.9375rem;
+  --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
+  --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
+  --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
+  --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
+  --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
+  --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
+  --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
+  --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
+  --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
+  --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
+  --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
+  --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
+  --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
+  --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
+  --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - (var(--pf-t--global--spacer--control--vertical--compact) * 1.5));
+  --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
+  --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
+  --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
+  --pf-v6-c-popover__title-text--FontFamily: var(--pf-t--global--font--family--body);
+  --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--lg);
+  --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
+  --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
+  --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
+  --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
   position: relative;
-  min-width: var(--pf-v5-c-popover--MinWidth);
-  max-width: var(--pf-v5-c-popover--MaxWidth);
-  font-size: var(--pf-v5-c-popover--FontSize);
-  box-shadow: var(--pf-v5-c-popover--BoxShadow);
-}
-.pf-v5-c-popover.pf-m-no-padding {
-  --pf-v5-c-popover__content--PaddingTop: 0px;
-  --pf-v5-c-popover__content--PaddingRight: 0px;
-  --pf-v5-c-popover__content--PaddingBottom: 0px;
-  --pf-v5-c-popover__content--PaddingLeft: 0px;
-}
-.pf-v5-c-popover.pf-m-width-auto {
-  --pf-v5-c-popover--MinWidth: auto;
-  --pf-v5-c-popover--MaxWidth: none;
-}
-.pf-v5-c-popover:is(.pf-m-top,
+  min-width: var(--pf-v6-c-popover--MinWidth);
+  max-width: var(--pf-v6-c-popover--MaxWidth);
+  font-size: var(--pf-v6-c-popover--FontSize);
+  border-radius: var(--pf-v6-c-popover--BorderRadius);
+  box-shadow: var(--pf-v6-c-popover--BoxShadow);
+}
+.pf-v6-c-popover.pf-m-no-padding {
+  --pf-v6-c-popover__content--PaddingBlockStart: 0px;
+  --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
+  --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
+  --pf-v6-c-popover__content--PaddingInlineStart: 0px;
+}
+.pf-v6-c-popover.pf-m-width-auto {
+  --pf-v6-c-popover--MinWidth: auto;
+  --pf-v6-c-popover--MaxWidth: none;
+}
+.pf-v6-c-popover:is(.pf-m-top,
 .pf-m-top-left,
 .pf-m-top-right) {
-  --pf-v5-c-popover__arrow--Bottom: var(--pf-v5-c-popover--m-top--Bottom, 0);
-  --pf-v5-c-popover__arrow--Left: var(--pf-v5-c-popover--m-top--Left, 50%);
-  --pf-v5-c-popover__arrow--TranslateX: var(--pf-v5-c-popover__arrow--m-top--TranslateX);
-  --pf-v5-c-popover__arrow--TranslateY: var(--pf-v5-c-popover__arrow--m-top--TranslateY);
-  --pf-v5-c-popover__arrow--Rotate: var(--pf-v5-c-popover__arrow--m-top--Rotate);
+  --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
+  --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
+  --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
+  --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
 }
-.pf-v5-c-popover:is(.pf-m-bottom,
+.pf-v6-c-popover:is(.pf-m-bottom,
 .pf-m-bottom-left,
 .pf-m-bottom-right) {
-  --pf-v5-c-popover__arrow--Top: var(--pf-v5-c-popover--m-bottom--Top, 0);
-  --pf-v5-c-popover__arrow--Left: var(--pf-v5-c-popover--m-bottom--Left, 50%);
-  --pf-v5-c-popover__arrow--TranslateX: var(--pf-v5-c-popover__arrow--m-bottom--TranslateX);
-  --pf-v5-c-popover__arrow--TranslateY: var(--pf-v5-c-popover__arrow--m-bottom--TranslateY);
-  --pf-v5-c-popover__arrow--Rotate: var(--pf-v5-c-popover__arrow--m-bottom--Rotate);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
+  --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
+  --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
+  --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
 }
-.pf-v5-c-popover:is(.pf-m-left,
+.pf-v6-c-popover:is(.pf-m-left,
 .pf-m-left-top,
 .pf-m-left-bottom) {
-  --pf-v5-c-popover__arrow--Top: var(--pf-v5-c-popover--m-left--Top, 50%);
-  --pf-v5-c-popover__arrow--Right: var(--pf-v5-c-popover--m-left--Right, 0);
-  --pf-v5-c-popover__arrow--TranslateX: var(--pf-v5-c-popover__arrow--m-left--TranslateX);
-  --pf-v5-c-popover__arrow--TranslateY: var(--pf-v5-c-popover__arrow--m-left--TranslateY);
-  --pf-v5-c-popover__arrow--Rotate: var(--pf-v5-c-popover__arrow--m-left--Rotate);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
+  --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
+  --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
+  --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
+  --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
 }
-.pf-v5-c-popover:is(.pf-m-right,
+.pf-v6-c-popover:is(.pf-m-right,
 .pf-m-right-top,
 .pf-m-right-bottom) {
-  --pf-v5-c-popover__arrow--Top: var(--pf-v5-c-popover--m-right--Top, 50%);
-  --pf-v5-c-popover__arrow--Left: var(--pf-v5-c-popover--m-right--Left, 0);
-  --pf-v5-c-popover__arrow--TranslateX: var(--pf-v5-c-popover__arrow--m-right--TranslateX);
-  --pf-v5-c-popover__arrow--TranslateY: var(--pf-v5-c-popover__arrow--m-right--TranslateY);
-  --pf-v5-c-popover__arrow--Rotate: var(--pf-v5-c-popover__arrow--m-right--Rotate);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
+  --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
+  --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
+  --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
 }
-.pf-v5-c-popover:is(.pf-m-left-top,
+.pf-v6-c-popover:is(.pf-m-left-top,
 .pf-m-right-top) {
-  --pf-v5-c-popover__arrow--Top: 0;
-  --pf-v5-c-popover__arrow--TranslateY: var(--pf-v5-c-popover__arrow--m-top--TranslateY);
+  --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
+  --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
 }
-.pf-v5-c-popover:is(.pf-m-left-bottom,
+.pf-v6-c-popover:is(.pf-m-left-bottom,
 .pf-m-right-bottom) {
-  --pf-v5-c-popover__arrow--Top: auto;
-  --pf-v5-c-popover__arrow--Bottom: 0;
+  --pf-v6-c-popover__arrow--InsetBlockStart: auto;
+  --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
 }
-.pf-v5-c-popover:is(.pf-m-top-left,
+.pf-v6-c-popover:is(.pf-m-top-left,
 .pf-m-bottom-left) {
-  --pf-v5-c-popover__arrow--Left: 0;
-  --pf-v5-c-popover__arrow--TranslateX: var(--pf-v5-c-popover__arrow--m-left--TranslateX);
+  --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
+  --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
 }
-.pf-v5-c-popover:is(.pf-m-top-right,
+.pf-v6-c-popover:is(.pf-m-top-right,
 .pf-m-bottom-right) {
-  --pf-v5-c-popover__arrow--Right: 0;
-  --pf-v5-c-popover__arrow--Left: auto;
+  --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
+  --pf-v6-c-popover__arrow--InsetInlineStart: auto;
 }
-.pf-v5-c-popover.pf-m-danger {
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-c-popover--m-danger__title-icon--Color);
-  --pf-v5-c-popover__title-text--Color: var(--pf-v5-c-popover--m-danger__title-text--Color);
+.pf-v6-c-popover.pf-m-danger {
+  --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
 }
-.pf-v5-c-popover.pf-m-warning {
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-c-popover--m-warning__title-icon--Color);
-  --pf-v5-c-popover__title-text--Color: var(--pf-v5-c-popover--m-warning__title-text--Color);
+.pf-v6-c-popover.pf-m-warning {
+  --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
 }
-.pf-v5-c-popover.pf-m-success {
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-c-popover--m-success__title-icon--Color);
-  --pf-v5-c-popover__title-text--Color: var(--pf-v5-c-popover--m-success__title-text--Color);
+.pf-v6-c-popover.pf-m-success {
+  --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
 }
-.pf-v5-c-popover.pf-m-custom {
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-c-popover--m-custom__title-icon--Color);
-  --pf-v5-c-popover__title-text--Color: var(--pf-v5-c-popover--m-custom__title-text--Color);
+.pf-v6-c-popover.pf-m-custom {
+  --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
 }
-.pf-v5-c-popover.pf-m-info {
-  --pf-v5-c-popover__title-icon--Color: var(--pf-v5-c-popover--m-info__title-icon--Color);
-  --pf-v5-c-popover__title-text--Color: var(--pf-v5-c-popover--m-info__title-text--Color);
+.pf-v6-c-popover.pf-m-info {
+  --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
 }
 
-.pf-v5-c-popover__content {
+.pf-v6-c-popover__content {
   position: relative;
-  padding-block-start: var(--pf-v5-c-popover__content--PaddingTop);
-  padding-block-end: var(--pf-v5-c-popover__content--PaddingBottom);
-  padding-inline-start: var(--pf-v5-c-popover__content--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-popover__content--PaddingRight);
-  background-color: var(--pf-v5-c-popover__content--BackgroundColor);
+  padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
+  background-color: var(--pf-v6-c-popover__content--BackgroundColor);
+  border-radius: var(--pf-v6-c-popover__content--BorderRadius);
 }
 
-.pf-v5-c-popover__close {
+.pf-v6-c-popover__close {
   position: absolute;
-  inset-block-start: var(--pf-v5-c-popover__close--Top);
-  inset-inline-end: var(--pf-v5-c-popover__close--Right);
+  inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
+  inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
 }
-.pf-v5-c-popover__close + * {
-  padding-inline-end: var(--pf-v5-c-popover__close--sibling--PaddingRight);
+.pf-v6-c-popover__close + * {
+  padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
 }
 
-.pf-v5-c-popover__arrow {
+.pf-v6-c-popover__arrow {
   position: absolute;
-  /* stylelint-disable liberty/use-logical-spec */
-  top: var(--pf-v5-c-popover__arrow--Top, auto);
-  right: var(--pf-v5-c-popover__arrow--Right, auto);
-  bottom: var(--pf-v5-c-popover__arrow--Bottom, auto);
-  left: var(--pf-v5-c-popover__arrow--Left, auto);
-  /* stylelint-enable */
-  width: var(--pf-v5-c-popover__arrow--Width);
-  height: var(--pf-v5-c-popover__arrow--Height);
+  top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
+  right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
+  bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
+  left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
+  width: var(--pf-v6-c-popover__arrow--Width);
+  height: var(--pf-v6-c-popover__arrow--Height);
   pointer-events: none;
-  background-color: var(--pf-v5-c-popover__arrow--BackgroundColor);
-  box-shadow: var(--pf-v5-c-popover__arrow--BoxShadow);
-  transform: translateX(var(--pf-v5-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v5-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v5-c-popover__arrow--Rotate, 0));
+  background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
+  box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
+  transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
 }
 
-.pf-v5-c-popover__header {
-  margin-block-end: var(--pf-v5-c-popover__header--MarginBottom);
+.pf-v6-c-popover__header {
+  margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
 }
 
-.pf-v5-c-popover__title {
+.pf-v6-c-popover__title {
   display: flex;
   flex: 0 0 auto;
 }
 
-.pf-v5-c-popover__title-icon {
-  margin-inline-end: var(--pf-v5-c-popover__title-icon--MarginRight);
-  font-size: var(--pf-v5-c-popover__title-icon--FontSize);
-  color: var(--pf-v5-c-popover__title-icon--Color);
+.pf-v6-c-popover__title-icon {
+  margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
+  font-size: var(--pf-v6-c-popover__title-icon--FontSize);
+  color: var(--pf-v6-c-popover__title-icon--Color);
 }
 
-.pf-v5-c-popover__title-text {
-  font-family: var(--pf-v5-c-popover__title-text--FontFamily);
-  font-size: var(--pf-v5-c-popover__title-text--FontSize);
-  line-height: var(--pf-v5-c-popover__title-text--LineHeight);
-  color: var(--pf-v5-c-popover__title-text--Color, inherit);
+.pf-v6-c-popover__title-text {
+  font-family: var(--pf-v6-c-popover__title-text--FontFamily);
+  font-size: var(--pf-v6-c-popover__title-text--FontSize);
+  font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
+  color: var(--pf-v6-c-popover__title-text--Color);
 }
 
-.pf-v5-c-popover__body {
+.pf-v6-c-popover__body {
   word-wrap: break-word;
 }
 
-.pf-v5-c-popover__footer {
-  margin-block-start: var(--pf-v5-c-popover__footer--MarginTop);
-}
-
-:where(.pf-v5-theme-dark) .pf-v5-c-popover {
-  --pf-v5-c-popover__content--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
-  --pf-v5-c-popover__arrow--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
-  --pf-v5-c-popover--m-custom__title-text--Color: var(--pf-v5-global--custom-color--200);
-  --pf-v5-c-popover--m-info__title-text--Color: var(--pf-v5-global--info-color--100);
-  --pf-v5-c-popover--m-success__title-text--Color: var(--pf-v5-global--success-color--100);
+.pf-v6-c-popover__footer {
+  margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
 }

package/css/components/Popover/popover.d.ts

@@ -21,16 +21,15 @@ declare const _default: {
     "custom": "pf-m-custom",
     "info": "pf-m-info"
   },
-  "popover": "pf-v5-c-popover",
-  "popoverArrow": "pf-v5-c-popover__arrow",
-  "popoverBody": "pf-v5-c-popover__body",
-  "popoverClose": "pf-v5-c-popover__close",
-  "popoverContent": "pf-v5-c-popover__content",
-  "popoverFooter": "pf-v5-c-popover__footer",
-  "popoverHeader": "pf-v5-c-popover__header",
-  "popoverTitle": "pf-v5-c-popover__title",
-  "popoverTitleIcon": "pf-v5-c-popover__title-icon",
-  "popoverTitleText": "pf-v5-c-popover__title-text",
-  "themeDark": "pf-v5-theme-dark"
+  "popover": "pf-v6-c-popover",
+  "popoverArrow": "pf-v6-c-popover__arrow",
+  "popoverBody": "pf-v6-c-popover__body",
+  "popoverClose": "pf-v6-c-popover__close",
+  "popoverContent": "pf-v6-c-popover__content",
+  "popoverFooter": "pf-v6-c-popover__footer",
+  "popoverHeader": "pf-v6-c-popover__header",
+  "popoverTitle": "pf-v6-c-popover__title",
+  "popoverTitleIcon": "pf-v6-c-popover__title-icon",
+  "popoverTitleText": "pf-v6-c-popover__title-text"
 };
 export default _default;

package/css/components/Popover/popover.js

@@ -23,15 +23,14 @@ exports.default = {
     "custom": "pf-m-custom",
     "info": "pf-m-info"
   },
-  "popover": "pf-v5-c-popover",
-  "popoverArrow": "pf-v5-c-popover__arrow",
-  "popoverBody": "pf-v5-c-popover__body",
-  "popoverClose": "pf-v5-c-popover__close",
-  "popoverContent": "pf-v5-c-popover__content",
-  "popoverFooter": "pf-v5-c-popover__footer",
-  "popoverHeader": "pf-v5-c-popover__header",
-  "popoverTitle": "pf-v5-c-popover__title",
-  "popoverTitleIcon": "pf-v5-c-popover__title-icon",
-  "popoverTitleText": "pf-v5-c-popover__title-text",
-  "themeDark": "pf-v5-theme-dark"
+  "popover": "pf-v6-c-popover",
+  "popoverArrow": "pf-v6-c-popover__arrow",
+  "popoverBody": "pf-v6-c-popover__body",
+  "popoverClose": "pf-v6-c-popover__close",
+  "popoverContent": "pf-v6-c-popover__content",
+  "popoverFooter": "pf-v6-c-popover__footer",
+  "popoverHeader": "pf-v6-c-popover__header",
+  "popoverTitle": "pf-v6-c-popover__title",
+  "popoverTitleIcon": "pf-v6-c-popover__title-icon",
+  "popoverTitleText": "pf-v6-c-popover__title-text"
 };

package/css/components/Popover/popover.mjs

@@ -21,15 +21,14 @@ export default {
     "custom": "pf-m-custom",
     "info": "pf-m-info"
   },
-  "popover": "pf-v5-c-popover",
-  "popoverArrow": "pf-v5-c-popover__arrow",
-  "popoverBody": "pf-v5-c-popover__body",
-  "popoverClose": "pf-v5-c-popover__close",
-  "popoverContent": "pf-v5-c-popover__content",
-  "popoverFooter": "pf-v5-c-popover__footer",
-  "popoverHeader": "pf-v5-c-popover__header",
-  "popoverTitle": "pf-v5-c-popover__title",
-  "popoverTitleIcon": "pf-v5-c-popover__title-icon",
-  "popoverTitleText": "pf-v5-c-popover__title-text",
-  "themeDark": "pf-v5-theme-dark"
+  "popover": "pf-v6-c-popover",
+  "popoverArrow": "pf-v6-c-popover__arrow",
+  "popoverBody": "pf-v6-c-popover__body",
+  "popoverClose": "pf-v6-c-popover__close",
+  "popoverContent": "pf-v6-c-popover__content",
+  "popoverFooter": "pf-v6-c-popover__footer",
+  "popoverHeader": "pf-v6-c-popover__header",
+  "popoverTitle": "pf-v6-c-popover__title",
+  "popoverTitleIcon": "pf-v6-c-popover__title-icon",
+  "popoverTitleText": "pf-v6-c-popover__title-text"
 };

package/css/components/Popper/Popper.css

@@ -1,4 +1,4 @@
-.pf-v5-c-popover[data-popper-reference-hidden="true"] {
+.pf-v6-c-popover[data-popper-reference-hidden="true"] {
     visibility: hidden;
     pointer-events: none;
 }

package/css/components/Popper/Popper.d.ts

@@ -1,5 +1,5 @@
 import './Popper.css';
 declare const _default: {
-  "popover": "pf-v5-c-popover"
+  "popover": "pf-v6-c-popover"
 };
 export default _default;

package/css/components/Popper/Popper.js

@@ -2,5 +2,5 @@
 exports.__esModule = true;
 require('./Popper.css');
 exports.default = {
-  "popover": "pf-v5-c-popover"
+  "popover": "pf-v6-c-popover"
 };

package/css/components/Popper/Popper.mjs

@@ -1,4 +1,4 @@
 import './Popper.css';
 export default {
-  "popover": "pf-v5-c-popover"
+  "popover": "pf-v6-c-popover"
 };