@redhat-cloud-services/frontend-components 3.9.3 → 3.9.6

package/BulkSelect/BulkSelect.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DropdownItemProps, DropdownToggleProps, DropdownToggleCheckboxProps } from '@patternfly/react-core';
+import { DropdownItemProps, DropdownToggleCheckboxProps, DropdownToggleProps } from '@patternfly/react-core';
 import './bulk-select.scss';
 export declare type BulkSelectItem = {
     key?: string | number;

package/BulkSelect/bulk-select.scss

@@ -1,19 +1,19 @@
 .ins-c-bulk-select {
-    .pf-c-dropdown__toggle-check span.pf-c-dropdown__toggle-text {
-        display: initial;
-    }
-    .ins-c-bulk-select__selected {
-        display: none;
-    }
+  .pf-c-dropdown__toggle-check span.pf-c-dropdown__toggle-text {
+    display: initial;
+  }
+  .ins-c-bulk-select__selected {
+    display: none;
+  }
 }
 
 @media only screen and (max-width: 768px) {
-    .ins-c-bulk-select {
-        .pf-c-dropdown__toggle-check span.pf-c-dropdown__toggle-text {
-            display: none;
-        }
-        .ins-c-bulk-select__selected {
-            display: initial;
-        }
+  .ins-c-bulk-select {
+    .pf-c-dropdown__toggle-check span.pf-c-dropdown__toggle-text {
+      display: none;
+    }
+    .ins-c-bulk-select__selected {
+      display: initial;
     }
+  }
 }

package/ConditionalFilter/conditional-filter.scss

@@ -1,110 +1,101 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 .ins-c-conditional-filter {
-    &.mobile {
-        display: none !important;
-        visibility: hidden !important;
-    }
-    .pf-c-select__toggle-wrapper .pf-c-select__toggle-text {
-        @include rem('max-width', 150px);
-    }
-
-    .ins-c-conditional-filter__group {
-        .pf-c-dropdown__toggle-text {
-            width: auto;
-            text-align: left;
-
-            & > svg {
-                margin-right: var(--pf-global--spacer--xs);
-            }
-        }
-
-        .ins-c-conditional-filter__no-label .pf-c-dropdown__toggle-text  {
-            width: auto;
+  &.mobile {
+    display: none !important;
+    visibility: hidden !important;
+  }
+  .pf-c-select__toggle-wrapper .pf-c-select__toggle-text {
+    @include rem('max-width', 150px);
+  }
+  .ins-c-conditional-filter__group {
+    .pf-c-dropdown__toggle-text {
+      width: auto;
+      text-align: left;
+        & > svg {
+          margin-right: var(--pf-global--spacer--xs);
         }
+      }
+    .ins-c-conditional-filter__no-label .pf-c-dropdown__toggle-text  {
+      width: auto;
     }
+  }
 
-    .pf-l-split__item {
-        .pf-c-select__menu-group {
-            .pf-c-select__menu-group-title:empty {
-                display: none;
-            }
-
-            padding: 0;
-        }
-        
-        .pf-c-select__option-button {
-            padding: 0;
-        }
-
-        .pf-c-select__menu-item-icon {
-            display: none;
-        }
-    }
-
-    input.ins-c-conditional-filter[type="text"] {
-        @include rem('padding-right', 35px);
-        @include rem('margin-right', -23px);
-
-        & + svg {
-            position: relative;
-            @include rem('left', -5px);
-            @include rem('top', 2px);
-        }
+  .pf-l-split__item {
+    .pf-c-select__menu-group {
+      .pf-c-select__menu-group-title:empty {
+        display: none;
+      }
+      padding: 0;
     }
-
-    .pf-c-select__toggle-text {
-        margin-right: 0;
+    .pf-c-select__option-button {
+      padding: 0;
     }
-    .pf-c-select__toggle-badge {
-        display: none;
+    .pf-c-select__menu-item-icon {
+      display: none;
     }
+  }
+  input.ins-c-conditional-filter[type="text"] {
+    @include rem('padding-right', 35px);
+    @include rem('margin-right', -23px);
 
-    .pf-c-menu-toggle {
-        .pf-c-menu-toggle__text {
-            flex: 1;
-            input { border: none; }
-        }
+    & + svg {
+      position: relative;
+      @include rem('left', -5px);
+      @include rem('top', 2px);
+    }
+  }
+  .pf-c-select__toggle-text {
+    margin-right: 0;
+  }
+  .pf-c-select__toggle-badge {
+    display: none;
+  }
+  .pf-c-menu-toggle {
+    .pf-c-menu-toggle__text {
+      flex: 1;
+      input { border: none; }
     }
+  }
 }
 
 .pf-c-menu {
-    &.ins-c-menu__scrollable {
-        max-height: 416px;
-        overflow-y: auto;
-        min-width: initial;
-    }
-    .ins-c-menu__show--more {
-        background: none;
-        .pf-c-menu__item-text{ color: var(--pf-global--active-color--100); }
-    }
+  &.ins-c-menu__scrollable {
+    max-height: 416px;
+    overflow-y: auto;
+    min-width: initial;
+  }
+  .ins-c-menu__show--more {
+    background: none;
+    .pf-c-menu__item-text{ color: var(--pf-global--active-color--100); }
+  }
 }
 
 @media only screen and (max-width: 768px) {
-    .ins-c-conditional-filter {
-        &.mobile {
-            visibility: visible !important;
-            display: grid !important;
-        }
-        &.desktop {
-            visibility: hidden;
-            display: none;
-        }
+  .ins-c-conditional-filter {
+    &.mobile {
+      visibility: visible !important;
+      display: grid !important;
+    }
+    &.desktop {
+      visibility: hidden;
+      display: none;
     }
+  }
 }
 
 @media only screen and (max-width: 884px) {
-    .ins-c-conditional-filter {
-        .ins-c-conditional-filter__group {
-            .pf-c-dropdown__toggle-text {
-                width: auto;
-            }
-            .ins-c-conditional-filter__value-selector {
-                display: none;
-            }
-            .ins-c-conditional-filter__group {
-                width: initial;
-            }
-        }
+  .ins-c-conditional-filter {
+    .ins-c-conditional-filter__group {
+      .pf-c-dropdown__toggle-text {
+        width: auto;
+      }
+      .ins-c-conditional-filter__value-selector {
+        display: none;
+      }
+      .ins-c-conditional-filter__group {
+        width: initial;
+      }
     }
+  }
 }

package/CullingInfo/CullingInformation.scss

@@ -3,8 +3,8 @@
 .ins-c-inventory__culling-danger { color: var(--pf-global--danger-color--100); }
 
 .ins-c-inventory__culling-danger, .ins-c-inventory__culling-warning {
-    font-weight: var(--pf-global--FontWeight--bold);
-    svg {
-        margin-right: var(--pf-global--spacer--sm);
-    }
+  font-weight: var(--pf-global--FontWeight--bold);
+  svg {
+    margin-right: var(--pf-global--spacer--sm);
+  }
 }

package/DownloadButton/DownloadButton.spec.ct.d.ts

@@ -0,0 +1 @@
+export {};

package/DownloadButton/DownloadButton.spec.ct.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@cypress/react");
+var __1 = require("..");
+describe('DownloadButton component', function () {
+    beforeEach(function () {
+        (0, react_2.mount)(react_1.default.createElement(__1.DownloadButton, null));
+    });
+    it('renders the dropdown', function () {
+        cy.get('.pf-c-dropdown');
+    });
+    it('on download callback fired', function () {
+        var onSelectSpy = cy.spy().as('onSelectSpy');
+        (0, react_2.mount)(react_1.default.createElement(__1.DownloadButton, { onSelect: onSelectSpy }));
+        cy.get('div[data-ouia-component-id="Export"] > button').click();
+        cy.get('div[data-ouia-component-id="Export"] > ul > li > button[data-ouia-component-id="DownloadCSV"]').click();
+        cy.get('@onSelectSpy').should('have.been.called.with', 'csv');
+    });
+});
+//# sourceMappingURL=DownloadButton.spec.ct.js.map

package/EmptyTable/EmptyTable.scss

@@ -1,11 +1,11 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 .ins-c-table__empty {
-    background: var(--pf-global--Color--light-100);
-    border-bottom: 1px solid var(--pf-global--BorderColor--light-200);
-    @include rem('padding', 20px);
-    &.is-centered {
-        display: flex;
-        justify-content: center;
-    }
+  background: var(--pf-global--Color--light-100);
+  border-bottom: 1px solid var(--pf-global--BorderColor--light-200);
+  @include rem('padding', 20px);
+  &.is-centered {
+    display: flex;
+    justify-content: center;
+  }
 }

package/ErrorState/error-state.scss

@@ -1,5 +1,5 @@
 .ins-c-error-state.pf-c-empty-state {
-    .pf-c-empty-state__icon {
-        fill: var(--pf-global--danger-color--100);
-    }
+  .pf-c-empty-state__icon {
+    fill: var(--pf-global--danger-color--100);
+  }
 }

package/FilterChips/filter-chips.scss

@@ -1,15 +1,14 @@
 .ins-c-chip-filters .ins-c-chip-group__plain.pf-m-toolbar > li:not(.pf-m-overflow) {
-    background: none;
-    padding: 0;
-    background-color: initial;
-
-    h4 {
-        display: none;
-    }
+  background: none;
+  padding: 0;
+  background-color: initial;
+  h4 {
+    display: none;
+  }
 }
 
 .ins-c-chip-filters {
-    .pf-c-chip-group:not(:last-child) {
-        margin-right: var(--pf-global--spacer--sm);
-    }
+  .pf-c-chip-group:not(:last-child) {
+    margin-right: var(--pf-global--spacer--sm);
+  }
 }

package/FilterHooks/tagFilterHook.scss

@@ -1,21 +1,20 @@
 .ins-c-tagfilter {
-    .ins-c-tagfilter__option label {
-        display: flex;
-        width: 100%;
-
-        .ins-c-tagfilter__option-value {
-            max-width: 12.5rem;
-            overflow: hidden;
-            text-overflow: ellipsis;
-        }
-        .pf-c-badge {
-            margin-left: auto;
-            padding-top: 0.2;
-        }
+  .ins-c-tagfilter__option label {
+    display: flex;
+    width: 100%;
+    .ins-c-tagfilter__option-value {
+      max-width: 12.5rem;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .pf-c-badge {
+      margin-left: auto;
+      padding-top: 0.2;
     }
-    .pf-c-select__menu-group-title:empty { display: none; }
+  }
+  .pf-c-select__menu-group-title:empty { display: none; }
 
-    .pf-c-select__menu > div { padding-top: 0; }
+  .pf-c-select__menu > div { padding-top: 0; }
 
-    &.pf-m-expanded { width: 18.75rem !important; }
+  &.pf-m-expanded { width: 18.75rem !important; }
 }

package/InsightsLabel/labels.scss

@@ -1,19 +1,21 @@
 .pf-c-label {
-    --ins-c-label--gold-bg:             #fdf7e7;
-    --inc-c-label--content-gold:        var(--pf-global--palette--gold-700);
-    --inc-c-label--icon-gold:           #F4C145;
-    --inc-c-label--border-gold:         var(--pf-global--palette--gold-100)
+  --ins-c-label--gold-bg: #fdf7e7;
+  --inc-c-label--content-gold: var(--pf-global--palette--gold-700);
+  --inc-c-label--icon-gold: #F4C145;
+  --inc-c-label--border-gold: var(--pf-global--palette--gold-100)
 }
 
 .ins-c-label-2.pf-c-label {
-    background-color: var(--ins-c-label--gold-bg);
-    .pf-c-label__content {
-        color: var(--inc-c-label--content-gold);
-        .pf-c-label__icon {
-            color: var(--inc-c-label--icon-gold);
-        }
+  background-color: var(--ins-c-label--gold-bg);
+  .pf-c-label__content {
+    color: var(--inc-c-label--content-gold);
+    .pf-c-label__icon {
+      color: var(--inc-c-label--icon-gold);
     }
+  }
 }
-.ins-c-label-2.pf-c-label {.pf-c-label__content::before {
+.ins-c-label-2.pf-c-label {
+  .pf-c-label__content::before {
     border: 1px solid var(--inc-c-label--border-gold);
-        }}
+  }
+}

package/InvalidObject/icon-404.scss

@@ -1,11 +1,7 @@
 .Icon404 {
-    height: 150px;
-
-    .cls-1 { fill:#fff; }
-
-    .cls-1,.cls-3{ fill-rule:evenodd;}
-    
-    .cls-2{ opacity:0.5;}
-    
-    .cls-4{ mask:url(#mask); }
+  height: 150px;
+  .cls-1 { fill:#fff; }
+  .cls-1,.cls-3{ fill-rule:evenodd;} 
+  .cls-2{ opacity:0.5;}
+  .cls-4{ mask:url(#mask); }
 }

package/LongTextTooltip/index.d.ts

@@ -1,3 +1,3 @@
 export { default } from './LongTextTooltip';
-export { default as LongTextTooltip } from './LongTextTooltip.js';
+export { default as LongTextTooltip } from './LongTextTooltip';
 export * from './LongTextTooltip';

package/LongTextTooltip/index.js

@@ -16,7 +16,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LongTextTooltip = exports.default = void 0;
 var LongTextTooltip_1 = require("./LongTextTooltip");
 Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(LongTextTooltip_1).default; } });
-var LongTextTooltip_js_1 = require("./LongTextTooltip.js");
-Object.defineProperty(exports, "LongTextTooltip", { enumerable: true, get: function () { return __importDefault(LongTextTooltip_js_1).default; } });
+var LongTextTooltip_2 = require("./LongTextTooltip");
+Object.defineProperty(exports, "LongTextTooltip", { enumerable: true, get: function () { return __importDefault(LongTextTooltip_2).default; } });
 __exportStar(require("./LongTextTooltip"), exports);
 //# sourceMappingURL=index.js.map

package/Main/Main.d.ts

@@ -1,5 +1,13 @@
 import React from 'react';
 import './main.scss';
+import type { ChromeAPI } from '@redhat-cloud-services/types';
+declare global {
+    interface Window {
+        insights: {
+            chrome: ChromeAPI;
+        };
+    }
+}
 export interface InternalMainProps {
     params?: {
         [key: string]: string;

package/Main/main.scss

@@ -1,3 +1,3 @@
 .pf-l-page__main .pf-l-page__main-section.pf-m-dark:not(:first-child) {
-    background: var(--pf-global--BackgroundColor--dark-transparent-100);
+  background: var(--pf-global--BackgroundColor--dark-transparent-100);
 }

package/Maintenance/maintenance.scss

@@ -1,7 +1,7 @@
 .ins-c-empty-state__maintenance {
-    .pf-c-empty-state__body {
-        color: var(--pf-global--Color--100);
-    }
-    .pf-c-empty-state__icon { fill: #EE0000; } // This is Red Hat's red, not Patternfly's red.
-    .pf-c-title { font-weight: 500; }
+  .pf-c-empty-state__body {
+    color: var(--pf-global--Color--100);
+  }
+  .pf-c-empty-state__icon { fill: #EE0000; } // This is Red Hat's red, not Patternfly's red.
+  .pf-c-title { font-weight: 500; }
 }

package/NotAuthorized/NotAuthorized.scss

@@ -1,7 +1,7 @@
 .ins-c-not-authorized {
-    .pf-c-title {
-        max-width: 540px;
-        margin-left: auto;
-        margin-right: auto;
-    }
+  .pf-c-title {
+    max-width: 540px;
+    margin-left: auto;
+    margin-right: auto;
+  }
 }

package/Ouia/WithOuia.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { OuiaProps, OuiaDataAttributes } from './Ouia';
+import { OuiaDataAttributes, OuiaProps } from './Ouia';
 export declare type WithOuiaParams = string | {
     type: string;
     module?: string;

package/Ouia/useOuia.d.ts

@@ -1,4 +1,4 @@
-import { OuiaProps, OuiaDataAttributes } from './Ouia';
+import { OuiaDataAttributes, OuiaProps } from './Ouia';
 export interface UseOuiaParams extends OuiaProps {
     type: string;
     module?: string;

package/PageHeader/page-header.scss

@@ -1,12 +1,12 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 .pf-l-page__main-section.pf-l-page-header.pf-m-dark-200 {
-    h1.pf-c-title.pf-m-2xl, * { color: #fff; }
+  h1.pf-c-title.pf-m-2xl, * { color: #fff; }
 }
 
 .pf-l-page__main-section.pf-l-page-header {
-    .pf-c-breadcrumb {
-        display: block;
-        @include rem('margin-bottom', 15px);
-    }
+  .pf-c-breadcrumb {
+    display: block;
+    @include rem('margin-bottom', 15px);
+  }
 }

package/Pagination/pagination.scss

@@ -3,13 +3,12 @@
 @import '~@patternfly/patternfly/components/OptionsMenu/options-menu.scss';
 
 .ins-c-pagination-next .pf-c-options-menu {
-    .pf-c-dropdown__menu .pf-c-dropdown__menu-item {
-        display: flex;
-
-        .pf-c-options-menu__menu-item-icon {
-            padding-left: 0;
-        }
+  .pf-c-dropdown__menu .pf-c-dropdown__menu-item {
+    display: flex;
+    .pf-c-options-menu__menu-item-icon {
+      padding-left: 0;
     }
+  }
 }
 
 .pf-c-pagination .pf-c-pagination__nav .pf-c-pagination__nav-page-select input { width: 75px; } 

package/PrimaryToolbar/PrimaryToolbar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { PaginationProps, ButtonProps } from '@patternfly/react-core';
+import { ButtonProps, PaginationProps } from '@patternfly/react-core';
 import { ActionsProps } from './Actions';
 import { BulkSelectProps } from '../BulkSelect';
 import { ConditionalFilterProps } from '../ConditionalFilter';

package/PrimaryToolbar/primary-toolbar.scss

@@ -1,64 +1,53 @@
 .ins-c-primary-toolbar {
+  .pf-c-toolbar__item.ins-c-primary-toolbar__first-action {
+    display: initial;
+  }
+  .ins-c-primary-toolbar__first-action {
+    display: none;
+  }
+  .ins-c-primary-toolbar__pagination {
+    margin-left: auto;
+  }
+  .ins-c-primary-toolbar__sort-by {
+    display: initial
+  }
+  .ins-c-primary-toolbar__overflow-actions, .ins-c-primary-toolbar__overflow-actions-separator {
+    display: none;
+  }
+  .ins-m-actions--empty {
+    display: none;
+  }
+  .ins-c-primary-toolbar__group-filter {
+    flex-grow: initial;
+    .ins-c-primary-toolbar__filter {
+      flex: initial;
+    }
+  }
+}
+
+@media only screen and (max-width: 768px) {
+  .ins-c-primary-toolbar {
     .pf-c-toolbar__item.ins-c-primary-toolbar__first-action {
-        display: initial;
+      display: none;
     }
-
     .ins-c-primary-toolbar__first-action {
-        display: none;
-    }
-
-    .ins-c-primary-toolbar__pagination {
-        margin-left: auto;
+      display: block;
     }
-
     .ins-c-primary-toolbar__sort-by {
-        display: initial
+      display: none
     }
-
     .ins-c-primary-toolbar__overflow-actions, .ins-c-primary-toolbar__overflow-actions-separator {
-        display: none;
-    }
-
-    .ins-m-actions--empty {
-        display: none;
+      display: block;
     }
-
     .ins-c-primary-toolbar__group-filter {
-        flex-grow: initial;
-        .ins-c-primary-toolbar__filter {
-            flex: initial;
-        }
+      margin-right: 0;
+      flex-grow: 1;
+      .ins-c-primary-toolbar__filter {
+        flex: 1;
+      }
     }
-}
-
-@media only screen and (max-width: 768px) {
-    .ins-c-primary-toolbar {
-        .pf-c-toolbar__item.ins-c-primary-toolbar__first-action {
-            display: none;
-        }
-
-        .ins-c-primary-toolbar__first-action {
-            display: block;
-        }
-
-        .ins-c-primary-toolbar__sort-by {
-            display: none
-        }
-
-        .ins-c-primary-toolbar__overflow-actions, .ins-c-primary-toolbar__overflow-actions-separator {
-            display: block;
-        }
-
-        .ins-c-primary-toolbar__group-filter {
-            margin-right: 0;
-            flex-grow: 1;
-            .ins-c-primary-toolbar__filter {
-                flex: 1;
-            }
-        }
-
-        .ins-m-actions--empty {
-            display: block;
-        }
+    .ins-m-actions--empty {
+      display: block;
     }
+  }
 }