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

package/esm/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/esm/ErrorState/ErrorState.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import { ExclamationCircleIcon } from '@patternfly/react-icons/';
 import DefaultErrorMessage from './DefaultErrorMessage';
-import { Title, EmptyState, EmptyStateVariant, EmptyStateIcon, EmptyStateBody, Button, Stack, StackItem, } from '@patternfly/react-core';
+import { Button, EmptyState, EmptyStateBody, EmptyStateIcon, EmptyStateVariant, Stack, StackItem, Title, } from '@patternfly/react-core';
 import '../ErrorState/error-state.css';
 var ErrorState = function (_a) {
     var _b = _a.errorTitle, errorTitle = _b === void 0 ? 'Something went wrong' : _b, errorDescription = _a.errorDescription, props = __rest(_a, ["errorTitle", "errorDescription"]);

package/esm/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/esm/FilterChips/FilterChips.js

@@ -10,7 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React from 'react';
-import { Badge, Chip, ChipGroup, Button } from '@patternfly/react-core';
+import { Badge, Button, Chip, ChipGroup } from '@patternfly/react-core';
 import classNames from 'classnames';
 import '../FilterChips/filter-chips.css';
 function isFilterChipGroup(group) {

package/esm/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/esm/FilterHooks/tagFilterHook.js

@@ -18,7 +18,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     }
     return to.concat(ar || Array.prototype.slice.call(from));
 };
-import React, { useState, useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { constructGroups, mapGroups } from './constants';
 import { Spinner } from '@patternfly/react-core';
 import '../FilterHooks/tagFilterHook.css';

package/esm/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/esm/Filters/FilterInput.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { Checkbox, Radio } from '@patternfly/react-core';
 var FilterInput = function (_a) {
     var addRemoveFilters = _a.addRemoveFilters, _b = _a.param, param = _b === void 0 ? '' : _b, _c = _a.filters, filters = _c === void 0 ? {} : _c, _d = _a.type, type = _d === void 0 ? 'checkbox' : _d, value = _a.value, id = _a.id, label = _a.label;

package/esm/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/esm/InvalidObject/InvalidObject.js

@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import Icon404 from './icon-404';
-import { Title, Button } from '@patternfly/react-core';
+import { Button, Title } from '@patternfly/react-core';
 import '../InvalidObject/invalidObject.css';
 var isBeta = function () {
     return window.location.pathname.split('/')[1] === 'beta' ? '/beta' : '';

package/esm/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/esm/LongTextTooltip/index.js

@@ -1,4 +1,4 @@
 export { default } from './LongTextTooltip';
-export { default as LongTextTooltip } from './LongTextTooltip.js';
+export { default as LongTextTooltip } from './LongTextTooltip';
 export * from './LongTextTooltip';
 //# sourceMappingURL=index.js.map

package/esm/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/esm/Maintenance/Maintenance.js

@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import classNames from 'classnames';
-import { EmptyState, EmptyStateBody, Title, Stack, StackItem, EmptyStateIcon } from '@patternfly/react-core';
+import { EmptyState, EmptyStateBody, EmptyStateIcon, Stack, StackItem, Title } from '@patternfly/react-core';
 import { HourglassHalfIcon } from '@patternfly/react-icons';
 import '../Maintenance/maintenance.css';
 var Maintenance = function (_a) {

package/esm/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/esm/NotAuthorized/NotAuthorized.js

@@ -21,7 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React from 'react';
-import { Title, Button, EmptyState, EmptyStateVariant, EmptyStateIcon, EmptyStateBody } from '@patternfly/react-core';
+import { Button, EmptyState, EmptyStateBody, EmptyStateIcon, EmptyStateVariant, Title } from '@patternfly/react-core';
 import { LockIcon } from '@patternfly/react-icons';
 import '../NotAuthorized/NotAuthorized.css';
 var ContactBody = function () { return (React.createElement(React.Fragment, null,

package/esm/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/esm/NotConnected/NotConnected.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { EmptyState, EmptyStateIcon, EmptyStateBody, Title, Button } from '@patternfly/react-core';
+import { Button, EmptyState, EmptyStateBody, EmptyStateIcon, Title } from '@patternfly/react-core';
 import { DisconnectedIcon } from '@patternfly/react-icons';
 var NotConnected = function (_a) {
     var _b = _a.titleText, titleText = _b === void 0 ? 'This system isn’t connected to Insights yet' : _b, _c = _a.bodyText, bodyText = _c === void 0 ? 'To get started, activate the Insights client for this system.' : _c, _d = _a.buttonText, buttonText = _d === void 0 ? 'Learn how to activate the Insights client' : _d;

package/esm/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/esm/Pagination/PaginationNav.js

@@ -22,7 +22,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import { Button, ButtonVariant, TextInput } from '@patternfly/react-core';
-import { AngleDoubleLeftIcon, AngleLeftIcon, AngleDoubleRightIcon, AngleRightIcon } from '@patternfly/react-icons';
+import { AngleDoubleLeftIcon, AngleDoubleRightIcon, AngleLeftIcon, AngleRightIcon } from '@patternfly/react-icons';
 var PaginationNav = function (_a) {
     var _b = _a.lastPage, lastPage = _b === void 0 ? 0 : _b, setPage = _a.setPage, _c = _a.pageTitle, pageTitle = _c === void 0 ? 'pages' : _c, amountOfPages = _a.amountOfPages, _d = _a.page, page = _d === void 0 ? 0 : _d, _e = _a.onFirstPage, onFirstPage = _e === void 0 ? function () { return undefined; } : _e, _f = _a.onLastPage, onLastPage = _f === void 0 ? function () { return undefined; } : _f, _g = _a.onPreviousPage, onPreviousPage = _g === void 0 ? function () { return undefined; } : _g, _h = _a.onNextPage, onNextPage = _h === void 0 ? function () { return undefined; } : _h, props = __rest(_a, ["lastPage", "setPage", "pageTitle", "amountOfPages", "page", "onFirstPage", "onLastPage", "onPreviousPage", "onNextPage"]);
     return (React.createElement("nav", __assign({ className: "pf-c-pagination__nav", "aria-label": "Pagination" }, props),

package/esm/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/esm/PrimaryToolbar/Actions.js

@@ -19,7 +19,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React, { Fragment, useState } from 'react';
-import { Dropdown, DropdownItem, KebabToggle, Button, DropdownSeparator, ToolbarItem } from '@patternfly/react-core';
+import { Button, Dropdown, DropdownItem, DropdownSeparator, KebabToggle, ToolbarItem } from '@patternfly/react-core';
 import { DownloadButton } from '../DownloadButton';
 import classNames from 'classnames';
 function isActionObject(node) {

package/esm/PrimaryToolbar/PrimaryToolbar.js

@@ -30,7 +30,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React from 'react';
-import { Toolbar, ToolbarContent, ToolbarGroup, ToolbarItem, Pagination, Button, ToolbarExpandIconWrapper, } from '@patternfly/react-core';
+import { Button, Pagination, Toolbar, ToolbarContent, ToolbarExpandIconWrapper, ToolbarGroup, ToolbarItem, } from '@patternfly/react-core';
 import { AngleDownIcon, AngleRightIcon } from '@patternfly/react-icons';
 import { SortByDirection } from '@patternfly/react-table';
 import Actions from './Actions';

package/esm/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;
     }
+  }
 }

package/esm/Reboot/reboot.scss

@@ -1,12 +1,12 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 .ins-c-reboot {
-    span {
-        // 4px because the battery icon is 1px bigger than the reboot icon
-        @include rem('margin-left', 4px);
-    }
+  span {
+    // 4px because the battery icon is 1px bigger than the reboot icon
+    @include rem('margin-left', 4px);
+  }
 
-    &.ins-m-red {
-        span, svg { color: var(--pf-global--danger-color--100); }
-    }
+  &.ins-m-red {
+    span, svg { color: var(--pf-global--danger-color--100); }
+  }
 }

package/esm/SimpleTableFilter/SimpleTableFilter.js

@@ -21,7 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { useState } from 'react';
-import { Button, ButtonVariant, Dropdown, DropdownToggle, DropdownItem } from '@patternfly/react-core';
+import { Button, ButtonVariant, Dropdown, DropdownItem, DropdownToggle } from '@patternfly/react-core';
 import { Input } from '../Input';
 import { SearchIcon } from '@patternfly/react-icons';
 import '../SimpleTableFilter/simple-table-filter.css';

package/esm/SimpleTableFilter/simple-table-filter.scss

@@ -5,14 +5,14 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 .pf-c-input-group.ins-c-filter {
-    &.ins-u-no-title input {
-        @include rem('padding-right', 35px);
-        @include rem('margin-right', -23px);
-    }
-    .ins-c-search-icon {
-        color: var(--pf-global--secondary-color--100);
-        position: relative;
-        @include rem('left', -5px);
-        @include rem('top', 8px);
-    }
+  &.ins-u-no-title input {
+    @include rem('padding-right', 35px);
+    @include rem('margin-right', -23px);
+  }
+  .ins-c-search-icon {
+    color: var(--pf-global--secondary-color--100);
+    position: relative;
+    @include rem('left', -5px);
+    @include rem('top', 8px);
+  }
 }

package/esm/Skeleton/skeleton.scss

@@ -1,18 +1,18 @@
 .ins-c-skeleton {
-    &__xs { width: 16% !important; }
-    &__sm { width: 33% !important; }
-    &__md { width: 66% !important; }
-    &__lg { width: 100% !important; }
-    &.ins-m-dark {
-        --pf-c-skeleton--BackgroundColor: var(--pf-global--palette--black-600);
-        --pf-c-skeleton--after--LinearGradientColorStop1: var(
-          --pf-global--palette--black-600
-        );
-        --pf-c-skeleton--after--LinearGradientColorStop2: var(
-          --pf-global--palette--black-500
-        );
-        --pf-c-skeleton--after--LinearGradientColorStop3: var(
-          --pf-global--palette--black-600
-        );
-    }
+  &__xs { width: 16% !important; }
+  &__sm { width: 33% !important; }
+  &__md { width: 66% !important; }
+  &__lg { width: 100% !important; }
+  &.ins-m-dark {
+    --pf-c-skeleton--BackgroundColor: var(--pf-global--palette--black-600);
+    --pf-c-skeleton--after--LinearGradientColorStop1: var(
+      --pf-global--palette--black-600
+    );
+    --pf-c-skeleton--after--LinearGradientColorStop2: var(
+      --pf-global--palette--black-500
+    );
+    --pf-c-skeleton--after--LinearGradientColorStop3: var(
+      --pf-global--palette--black-600
+    );
+  }
 }

package/esm/SkeletonTable/SkeletonTable.js

@@ -8,7 +8,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React from 'react';
-import { RowSelectVariant, Table, TableHeader, TableBody } from '@patternfly/react-table';
+import { RowSelectVariant, Table, TableBody, TableHeader } from '@patternfly/react-table';
 import { Skeleton, SkeletonSize } from '../Skeleton';
 import classNames from 'classnames';
 import '../SkeletonTable/SkeletonTable.css';

package/esm/SkeletonTable/SkeletonTable.scss

@@ -1,3 +1,3 @@
 .ins-c-skeleton-table__dark {
-    background-color: #1b1d21 !important;
+  background-color: #1b1d21 !important;
 }

package/esm/Spinner/spinner.scss

@@ -1,24 +1,22 @@
 @import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
 
 @keyframes spinner {
-    to { transform: rotate(360deg); }
+  to { transform: rotate(360deg); }
 }
    
 .ins-c-spinner {
-    display: inline-flex;
-    
-    &.ins-m-center {
-        display: flex;
-        justify-content: center;
-    }
-
-    &:before {
-        content: '';
-        @include rem('width', 30px);
-        @include rem('height', 30px);
-        border-radius: 50%;
-        border: 3px solid var(--pf-global--active-color--200);
-        border-top-color: var(--pf-global--active-color--100);
-        animation: spinner 1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
-    }
+  display: inline-flex;
+  &.ins-m-center {
+    display: flex;
+    justify-content: center;
+  }
+  &:before {
+    content: '';
+    @include rem('width', 30px);
+    @include rem('height', 30px);
+    border-radius: 50%;
+    border: 3px solid var(--pf-global--active-color--200);
+    border-top-color: var(--pf-global--active-color--100);
+    animation: spinner 1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
+  }
 }

package/esm/TableToolbar/TableToolbar.scss

@@ -6,9 +6,9 @@
 }
 
 .ins-c-table__toolbar, .ins-c-table__toolbar-results {
-    background: var(--pf-global--Color--light-100);
-    border-bottom: 1px solid var(--pf-global--BorderColor--light-200);
-    padding: var(--ins-c-table-toolbar--PaddingVertical) var(--ins-c-table-toolbar--PaddingHorizontal);
+  background: var(--pf-global--Color--light-100);
+  border-bottom: 1px solid var(--pf-global--BorderColor--light-200);
+  padding: var(--ins-c-table-toolbar--PaddingVertical) var(--ins-c-table-toolbar--PaddingHorizontal);
 }
 
 .ins-c-table__toolbar.ins-m-footer { border-top: 1px solid var(--pf-global--BorderColor--light-200); }
@@ -16,13 +16,13 @@
 .ins-c-table__toolbar-results { color: var(--pf-global--Color--200); }
 
 .ins-c-table__toolbar-results-count + .ins-c-table__toolbar-results-selected {
-    @include rem('margin-left', 15px);
-    @include rem('padding-left', 15px);
-    border-left: 2px solid var(--pf-global--BorderColor--light);
+  @include rem('margin-left', 15px);
+  @include rem('padding-left', 15px);
+  border-left: 2px solid var(--pf-global--BorderColor--light);
 }
 
 @media only screen and (max-width: 768px) {
-    .ins-c-table__toolbar, .ins-c-table__toolbar-results {
-        padding: 0 0;
-    }
+  .ins-c-table__toolbar, .ins-c-table__toolbar-results {
+    padding: 0 0;
+  }
 }

package/esm/TagCount/tagCount.scss

@@ -1,9 +1,9 @@
 button.ins-c-tag-count {
-    color: var(--pf-global--icon--Color--light);
-    display: flex;
-    align-content: center;
+  color: var(--pf-global--icon--Color--light);
+  display: flex;
+  align-content: center;
 }
 
 .ins-c-tag__text {
-    margin-left: 10px;
+  margin-left: 10px;
 }