oolib 2.168.1 → 2.168.2

package/dist/stories/v2/components/TabBar.stories.js

@@ -80,8 +80,8 @@ exports.default = {
 };
 var TabBar_ = function (args) {
     var options = [
-        { display: "display 1", value: "value1" },
-        { display: "display 2", value: "value2" },
+        { display: "display 1", value: "value1", icon: 'Funnel' },
+        { display: "display 2", value: "value2", icon: 'ListDashes' },
         { display: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.", value: "value3" },
         { display: "display 3", value: "value4" },
         { display: "display 4", value: "value5" },

package/dist/v2/components/TabBar/index.js

@@ -25,6 +25,7 @@ var mixins_1 = require("../../../themes/mixins");
 var Typo2_1 = require("../Typo2");
 var phosphor_react_1 = require("phosphor-react");
 var colors_1 = require("../../themes/colors");
+var icons_1 = require("../../../icons");
 var Base = function (_a) {
     var id = _a.id, options = _a.options, valueProp = _a.value, onChange = _a.onChange, style = _a.style, errorTabs = _a.errorTabs, disabledTabs = _a.disabledTabs, _b = _a.tabBarStyle, tabBarStyle = _b === void 0 ? '1' : _b, saveValueAsString = _a.saveValueAsString, _c = _a.black, black = _c === void 0 ? false : _c, M = _a.M, S = _a.S, _size = _a.size //use any one of these 3
     ;
@@ -34,6 +35,13 @@ var Base = function (_a) {
     var handleClick = function (v) {
         onChange && onChange(id, saveValueAsString ? v.value : v);
     };
+    var genIconInTab = function (iconName) {
+        var IconComp = icons_1.icons[iconName];
+        if (!IconComp)
+            return null;
+        //else
+        return react_1.default.createElement(IconComp, { weight: 'bold', size: 16 });
+    };
     return (react_1.default.createElement(index_styled_1.TabBarStyled, { size: size, style: style },
         react_1.default.createElement(index_styled_1.TabBarContainerStyled, { id: id },
             !scrollIsAtStart && (react_1.default.createElement(index_styled_1.StyledDirectionButtons, { left: true },
@@ -45,7 +53,9 @@ var Base = function (_a) {
                     var tabIsActive = value && op.value === value.value;
                     return (react_1.default.createElement(index_styled_1.TabBarTabWrapper, { tabBarStyle: tabBarStyle, key: op.value, active: tabIsActive, error: tabHasError, disabled: tabIsDisabled, black: black },
                         react_1.default.createElement(index_styled_1.TabBarTabStyled, { size: size, active: tabIsActive, error: tabHasError, disabled: tabIsDisabled, tabBarStyle: tabBarStyle, onClick: function () { return handleClick(op); }, black: black },
-                            react_1.default.createElement(index_styled_1.STYLED_TYPO, { capitalize: true }, op.display),
+                            react_1.default.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: '0.4rem' } },
+                                op.icon && genIconInTab(op.icon),
+                                op.display && react_1.default.createElement(index_styled_1.STYLED_TYPO, { capitalize: true }, op.display)),
                             tabHasError && react_1.default.createElement(index_styled_1.StyledDot, { active: tabIsActive, error: tabHasError, tabBarStyle: tabBarStyle }))));
                 }))),
             !scrollIsAtEnd && (react_1.default.createElement(index_styled_1.StyledDirectionButtons, { right: true },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "2.168.1",
+  "version": "2.168.2",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -71,11 +71,11 @@
     "typescript": "^5.4.3"
   },
   "peerDependencies": {
+    "date-fns": "^2.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-router-dom": "^6.28.0",
-    "styled-components": "^5.3.3",
-    "date-fns": "^2.0.0"
+    "styled-components": "^5.3.3"
   },
   "config": {
     "commitizen": {