@redhat-cloud-services/frontend-components 3.4.13 → 3.6.0

package/esm/SkeletonTable/SkeletonTable.js

@@ -1,136 +1,90 @@
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import React from 'react';
 import { RowSelectVariant, Table, TableHeader, TableBody } from '@patternfly/react-table';
 import { Skeleton, SkeletonSize } from '../Skeleton';
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
-
-var SkeletonTable = /*#__PURE__*/function (_React$Component) {
-  _inherits(SkeletonTable, _React$Component);
-
-  var _super = _createSuper(SkeletonTable);
-
-  function SkeletonTable() {
-    var _this;
-
-    _classCallCheck(this, SkeletonTable);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "createColumns", function () {
-      var colSize = _this.props.colSize;
-      return _toConsumableArray(Array(colSize)).map(function () {
-        return {
-          title: /*#__PURE__*/React.createElement(Skeleton, {
-            size: SkeletonSize.sm
-          })
+import './SkeletonTable.css';
+var SkeletonTable = (function (_super) {
+    __extends(SkeletonTable, _super);
+    function SkeletonTable() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.createColumns = function () {
+            var _a = _this.props, colSize = _a.colSize, isDark = _a.isDark;
+            return __spreadArray([], Array(colSize), true).map(function () { return ({ title: React.createElement(Skeleton, { isDark: isDark, size: SkeletonSize.sm }) }); });
+        };
+        _this.getColumns = function () {
+            var _a = _this.props, paddingColumnSize = _a.paddingColumnSize, columns = _a.columns;
+            return _this.newArray(paddingColumnSize).map(function () { return ''; }).concat(columns || _this.createColumns());
+        };
+        _this.createRows = function () {
+            var _a = _this.props, colSize = _a.colSize, rowSize = _a.rowSize, columns = _a.columns, paddingColumnSize = _a.paddingColumnSize, isDark = _a.isDark;
+            var numberOfCols = columns ? columns.length : colSize;
+            return _this.newArray(rowSize).map(function () { return ({ disableSelection: true, cells: _this.newArray(paddingColumnSize).map(function () { return ''; }).concat(_this.newArray(numberOfCols).map(function () { return ({ title: React.createElement(Skeleton, { isDark: isDark, size: SkeletonSize.md }) }); })) }); });
         };
-      });
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "getColumns", function () {
-      var _this$props = _this.props,
-          paddingColumnSize = _this$props.paddingColumnSize,
-          columns = _this$props.columns;
-      return _this.newArray(paddingColumnSize).map(function () {
-        return '';
-      }).concat(columns || _this.createColumns());
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "createRows", function () {
-      var _this$props2 = _this.props,
-          colSize = _this$props2.colSize,
-          rowSize = _this$props2.rowSize,
-          columns = _this$props2.columns,
-          paddingColumnSize = _this$props2.paddingColumnSize;
-      var numberOfCols = columns ? columns.length : colSize;
-      return _this.newArray(rowSize).map(function () {
-        return {
-          disableSelection: true,
-          cells: _this.newArray(paddingColumnSize).map(function () {
-            return '';
-          }).concat(_this.newArray(numberOfCols).map(function () {
-            return {
-              title: /*#__PURE__*/React.createElement(Skeleton, {
-                size: SkeletonSize.md
-              })
-            };
-          }))
+        _this.selectVariant = function () {
+            var hasRadio = _this.props.hasRadio;
+            return hasRadio ? ((RowSelectVariant === null || RowSelectVariant === void 0 ? void 0 : RowSelectVariant.radio) || 'radio') : ((RowSelectVariant === null || RowSelectVariant === void 0 ? void 0 : RowSelectVariant.checkbox) || 'checkbox');
         };
-      });
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "selectVariant", function () {
-      var hasRadio = _this.props.hasRadio;
-      return hasRadio ? (RowSelectVariant === null || RowSelectVariant === void 0 ? void 0 : RowSelectVariant.radio) || 'radio' : (RowSelectVariant === null || RowSelectVariant === void 0 ? void 0 : RowSelectVariant.checkbox) || 'checkbox';
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "newArray", function (size) {
-      return _toConsumableArray(Array(size));
-    });
-
-    return _this;
-  }
-
-  _createClass(SkeletonTable, [{
-    key: "render",
-    value: function render() {
-      var _this$props3 = this.props,
-          canSelectAll = _this$props3.canSelectAll,
-          isSelectable = _this$props3.isSelectable,
-          sortBy = _this$props3.sortBy,
-          variant = _this$props3.variant;
-      return /*#__PURE__*/React.createElement(Table, {
-        cells: this.getColumns(),
-        rows: this.createRows(),
-        sortBy: sortBy,
-        "aria-label": "Loading",
-        onSelect: isSelectable,
-        selectVariant: isSelectable ? this.selectVariant() : null,
-        canSelectAll: canSelectAll,
-        variant: variant
-      }, /*#__PURE__*/React.createElement(TableHeader, null), /*#__PURE__*/React.createElement(TableBody, null));
+        _this.newArray = function (size) { return __spreadArray([], Array(size), true); };
+        return _this;
     }
-  }]);
-
-  return SkeletonTable;
-}(React.Component);
-
+    SkeletonTable.prototype.render = function () {
+        var _a = this.props, canSelectAll = _a.canSelectAll, isSelectable = _a.isSelectable, sortBy = _a.sortBy, variant = _a.variant, isDark = _a.isDark;
+        return (React.createElement(Table, { className: classNames({
+                'ins-c-skeleton-table__dark': isDark
+            }), cells: this.getColumns(), rows: this.createRows(), sortBy: sortBy, "aria-label": "Loading", onSelect: isSelectable, selectVariant: isSelectable ? this.selectVariant() : null, canSelectAll: canSelectAll, variant: variant },
+            React.createElement(TableHeader, null),
+            React.createElement(TableBody, null)));
+    };
+    return SkeletonTable;
+}(React.Component));
 SkeletonTable.propTypes = {
-  colSize: PropTypes.number,
-  rowSize: PropTypes.number,
-  columns: PropTypes.array,
-  paddingColumnSize: PropTypes.number,
-  sortBy: PropTypes.shape({
-    index: PropTypes.number,
-    direction: PropTypes.oneOf(['asc', 'desc'])
-  }),
-  isSelectable: PropTypes.bool,
-  canSelectAll: PropTypes.bool,
-  hasRadio: PropTypes.bool,
-  variant: PropTypes.string
+    colSize: PropTypes.number,
+    rowSize: PropTypes.number,
+    columns: PropTypes.array,
+    paddingColumnSize: PropTypes.number,
+    sortBy: PropTypes.shape({
+        index: PropTypes.number,
+        direction: PropTypes.oneOf(['asc', 'desc'])
+    }),
+    isSelectable: PropTypes.bool,
+    canSelectAll: PropTypes.bool,
+    hasRadio: PropTypes.bool,
+    variant: PropTypes.string,
+    isDark: PropTypes.bool
 };
 SkeletonTable.defaultProps = {
-  rowSize: 0,
-  paddingColumnSize: 0,
-  canSelectAll: false,
-  isSelectable: false,
-  hasRadio: false,
-  variant: null
+    rowSize: 0,
+    paddingColumnSize: 0,
+    canSelectAll: false,
+    isSelectable: false,
+    hasRadio: false,
+    variant: null,
+    isDark: false
 };
-export default SkeletonTable;
+export default SkeletonTable;
+//# sourceMappingURL=SkeletonTable.js.map

package/esm/SkeletonTable/SkeletonTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonTable.js","sourceRoot":"","sources":["../../src/SkeletonTable/SkeletonTable.js"],"names":[],"mappings":"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"}

package/esm/SkeletonTable/SkeletonTable.scss

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

package/esm/SkeletonTable/index.js

@@ -1,2 +1,3 @@
 export { default } from './SkeletonTable';
-export { default as SkeletonTable } from './SkeletonTable';
+export { default as SkeletonTable } from './SkeletonTable';
+//# sourceMappingURL=index.js.map

package/esm/SkeletonTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/SkeletonTable/index.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/esm/Spinner/Spinner.js

@@ -1,27 +1,34 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from 'react';
-import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import "../../Spinner/./spinner.css";
-
-var Spinner = function Spinner(_ref) {
-  var centered = _ref.centered,
-      className = _ref.className,
-      props = _objectWithoutProperties(_ref, ["centered", "className"]);
-
-  var spinnerClasses = classNames('ins-c-spinner', _defineProperty({}, "ins-m-center", centered), className);
-  return /*#__PURE__*/React.createElement("div", _extends({
-    role: "status",
-    className: spinnerClasses
-  }, props), /*#__PURE__*/React.createElement("span", {
-    className: "pf-u-screen-reader"
-  }, "Loading..."));
-};
-
-Spinner.propTypes = {
-  centered: PropTypes.bool,
-  className: PropTypes.string
+import './spinner.css';
+var Spinner = function (_a) {
+    var _b;
+    var centered = _a.centered, className = _a.className, props = __rest(_a, ["centered", "className"]);
+    var spinnerClasses = classNames('ins-c-spinner', (_b = {}, _b["ins-m-center"] = centered, _b), className);
+    return (React.createElement("div", __assign({ role: 'status', className: spinnerClasses }, props),
+        React.createElement("span", { className: "pf-u-screen-reader" }, "Loading...")));
 };
-export default Spinner;
+export default Spinner;
+//# sourceMappingURL=Spinner.js.map

package/esm/Spinner/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,gBAAgB,CAAC;AAOxB,IAAM,OAAO,GAA0C,UAAC,EAAiC;;IAA/B,IAAA,QAAQ,cAAA,EAAE,SAAS,eAAA,EAAK,KAAK,cAA/B,yBAAiC,CAAF;IACnF,IAAM,cAAc,GAAG,UAAU,CAC7B,eAAe,YACb,GAAC,cAAc,IAAG,QAAQ,OAC5B,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,sCAAK,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAG,cAAc,IAAQ,KAAK;QACtD,8BAAM,SAAS,EAAC,oBAAoB,iBAAkB,CACpD,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/esm/Spinner/index.js

@@ -1,2 +1,3 @@
 export { default } from './Spinner';
-export { default as Spinner } from './Spinner';
+export { default as Spinner } from './Spinner';
+//# sourceMappingURL=index.js.map

package/esm/Spinner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Spinner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC"}

package/esm/Spinner/spinner.css

@@ -0,0 +1,27 @@
+:root {
+  --ins-color--orange: #ec7a08;
+}
+
+@keyframes spinner {
+  to {
+    transform: rotate(360deg);
+  }
+}
+.ins-c-spinner {
+  display: inline-flex;
+}
+.ins-c-spinner.ins-m-center {
+  display: flex;
+  justify-content: center;
+}
+.ins-c-spinner:before {
+  content: "";
+  width: 30px;
+  width: 1.875rem;
+  height: 30px;
+  height: 1.875rem;
+  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/Spinner/spinner.scss

@@ -0,0 +1,24 @@
+@import '~@redhat-cloud-services/frontend-components-utilities/styles/_all.scss';
+
+@keyframes spinner {
+    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;
+    }
+}

package/esm/TabLayout/TabLayout.js

@@ -1,54 +1,48 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import "../../TabLayout/./tab-layout.css";
-
-var TabLayout = function TabLayout(_ref) {
-  var children = _ref.children,
-      items = _ref.items,
-      classNames = _ref.classNames,
-      active = _ref.active,
-      onTabClick = _ref.onTabClick,
-      props = _objectWithoutProperties(_ref, ["children", "items", "classNames", "active", "onTabClick"]);
-
-  return /*#__PURE__*/React.createElement("section", _extends({}, props, {
-    className: classnames(classNames, 'ins-tab-layout'),
-    "widget-type": "InsightsTabs"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "ins-tabs"
-  }, items.map(function (oneItem) {
-    return /*#__PURE__*/React.createElement("div", {
-      key: oneItem.name,
-      className: classnames({
-        active: oneItem.name === active
-      }),
-      onClick: function onClick(event) {
-        return onTabClick(event, oneItem);
-      },
-      "widget-type": "InsightsTabsItem",
-      "widget-id": oneItem.name
-    }, oneItem.title);
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "ins-tab-content"
-  }, children));
+import './tab-layout.css';
+var TabLayout = function (_a) {
+    var children = _a.children, items = _a.items, classNames = _a.classNames, active = _a.active, onTabClick = _a.onTabClick, props = __rest(_a, ["children", "items", "classNames", "active", "onTabClick"]);
+    return (React.createElement("section", __assign({}, props, { className: classnames(classNames, 'ins-tab-layout'), "widget-type": 'InsightsTabs' }),
+        React.createElement("div", { className: "ins-tabs" }, items.map(function (oneItem) { return (React.createElement("div", { key: oneItem.name, className: classnames({ active: oneItem.name === active }), onClick: function (event) { return onTabClick(event, oneItem); }, "widget-type": 'InsightsTabsItem', "widget-id": oneItem.name }, oneItem.title)); })),
+        React.createElement("div", { className: "ins-tab-content" }, children)));
 };
-
 TabLayout.propTypes = {
-  items: PropTypes.arrayOf(PropTypes.shape({
-    name: PropTypes.string,
-    title: PropTypes.node
-  })),
-  children: PropTypes.node,
-  classNames: PropTypes.string,
-  active: PropTypes.string,
-  onTabClick: PropTypes.func
+    items: PropTypes.arrayOf(PropTypes.shape({
+        name: PropTypes.string,
+        title: PropTypes.node
+    })),
+    children: PropTypes.node,
+    classNames: PropTypes.string,
+    active: PropTypes.string,
+    onTabClick: PropTypes.func
 };
 TabLayout.defaultProps = {
-  items: [],
-  onTabClick: function onTabClick() {
-    return undefined;
-  }
+    items: [],
+    onTabClick: function () { return undefined; }
 };
-export default TabLayout;
+export default TabLayout;
+//# sourceMappingURL=TabLayout.js.map

package/esm/TabLayout/TabLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabLayout.js","sourceRoot":"","sources":["../../src/TabLayout/TabLayout.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,mBAAmB,CAAC;AAE3B,IAAM,SAAS,GAAG,UAAC,EAA6D;IAA3D,IAAA,QAAQ,cAAA,EAAE,KAAK,WAAA,EAAE,UAAU,gBAAA,EAAE,MAAM,YAAA,EAAE,UAAU,gBAAA,EAAK,KAAK,cAA3D,2DAA6D,CAAF;IAAO,OAAA,CACjF,4CAAc,KAAK,IAAG,SAAS,EAAG,UAAU,CAAC,UAAU,EAAE,gBAAgB,CAAC,iBAAe,cAAc;QACnG,6BAAK,SAAS,EAAC,UAAU,IACnB,KAAK,CAAC,GAAG,CAAC,UAAA,OAAO,IAAI,OAAA,CACnB,6BAAK,GAAG,EAAG,OAAO,CAAC,IAAI,EACnB,SAAS,EAAG,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC,EAC3D,OAAO,EAAG,UAAA,KAAK,IAAI,OAAA,UAAU,CAAC,KAAK,EAAE,OAAO,CAAC,EAA1B,CAA0B,iBACjC,kBAAkB,eAClB,OAAO,CAAC,IAAI,IAEtB,OAAO,CAAC,KAAK,CACb,CACT,EATsB,CAStB,CAAC,CACA;QACN,6BAAK,SAAS,EAAC,iBAAiB,IAC1B,QAAQ,CACR,CACA,CACb,CAAA;CAAA,CAAC;AAEF,SAAS,CAAC,SAAS,GAAG;IAClB,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC;QACrC,IAAI,EAAE,SAAS,CAAC,MAAM;QACtB,KAAK,EAAE,SAAS,CAAC,IAAI;KACxB,CAAC,CAAC;IACH,QAAQ,EAAE,SAAS,CAAC,IAAI;IACxB,UAAU,EAAE,SAAS,CAAC,MAAM;IAC5B,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,UAAU,EAAE,SAAS,CAAC,IAAI;CAC7B,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG;IACrB,KAAK,EAAE,EAAE;IACT,UAAU,EAAE,cAAM,OAAA,SAAS,EAAT,CAAS;CAC9B,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/esm/TabLayout/index.js

@@ -1,2 +1,3 @@
 export { default } from './TabLayout';
-export { default as TabLayout } from './TabLayout';
+export { default as TabLayout } from './TabLayout';
+//# sourceMappingURL=index.js.map

package/esm/TabLayout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/TabLayout/index.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC"}

package/esm/TabLayout/tab-layout.css

@@ -0,0 +1,14 @@
+.ins-tab-layout > .ins-tabs div {
+  display: inline-block;
+  margin-right: 30px;
+  text-align: center;
+  cursor: pointer;
+  color: var(--pf-global--link--Color);
+}
+.ins-tab-layout > .ins-tabs div.active {
+  border-bottom: 3px var(--pf-global--link--Color) solid;
+}
+.ins-tab-layout > .ins-tabs div:hover {
+  color: var(--pf-global--link--Color--hover);
+  border-bottom: 3px var(--pf-global--link--Color--hover) solid;
+}

package/esm/TabLayout/tab-layout.scss

@@ -0,0 +1,21 @@
+.ins-tab-layout {
+  > .ins-tabs {
+
+    div {
+      display: inline-block;
+      margin-right: 30px;
+      text-align: center;
+      cursor: pointer;
+      color: var(--pf-global--link--Color);
+
+      &.active {
+        border-bottom: 3px var(--pf-global--link--Color) solid;
+      }
+
+      &:hover {
+        color: var(--pf-global--link--Color--hover);
+        border-bottom: 3px var(--pf-global--link--Color--hover) solid;
+      }
+    }
+  }
+}

package/esm/TableToolbar/TableToolbar.css

@@ -0,0 +1,36 @@
+:root {
+  --ins-color--orange: #ec7a08;
+}
+
+:root {
+  --ins-c-table-toolbar--PaddingVertical: 16px;
+  --ins-c-table-toolbar--PaddingHorizontal: 32px;
+}
+
+.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);
+}
+
+.ins-c-table__toolbar.ins-m-footer {
+  border-top: 1px solid var(--pf-global--BorderColor--light-200);
+}
+
+.ins-c-table__toolbar-results {
+  color: var(--pf-global--Color--200);
+}
+
+.ins-c-table__toolbar-results-count + .ins-c-table__toolbar-results-selected {
+  margin-left: 15px;
+  margin-left: 0.9375rem;
+  padding-left: 15px;
+  padding-left: 0.9375rem;
+  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;
+  }
+}