@mmb-digital/ds-lilly 0.4.3 → 0.5.0

package/dist/ds-lilly.js

@@ -84446,11 +84446,11 @@ Select2Context.displayName = 'Select2Context';
 
 // CONCATENATED MODULE: ./src/contexts/TabsContext.tsx
 
-var TabsContext_noop = function () { return null; };
+
 var TabsContext = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["createContext"])({
     activeItem: 0,
     identification: '',
-    setActiveItem: TabsContext_noop,
+    setActiveItem: noop,
     tabsLimit: 0,
     tabs: []
 });
@@ -87142,10 +87142,10 @@ var Avatar = function (_a) {
 
 
 var Badge = function (_a) {
-    var ariaLabel = _a.ariaLabel, children = _a.children, _b = _a.count, count = _b === void 0 ? 0 : _b, _c = _a.isDotVisible, isDotVisible = _c === void 0 ? false : _c, _d = _a.maxCount, maxCount = _d === void 0 ? 99 : _d, testId = _a.testId, theme = _a.theme;
-    return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { "aria-label": ariaLabel, className: classBinder_cx('c-badge', theme), "data-testid": testId },
+    var ariaLabel = _a.ariaLabel, children = _a.children, count = _a.count, _b = _a.hasNotification, hasNotification = _b === void 0 ? false : _b, _c = _a.isDotVisible, isDotVisible = _c === void 0 ? false : _c, _d = _a.maxCount, maxCount = _d === void 0 ? 99 : _d, testId = _a.testId, theme = _a.theme;
+    return hasNotification || isDotVisible || children || count ? (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { "aria-label": ariaLabel, className: classBinder_cx('c-badge', theme), "data-testid": testId },
         children,
-        (isDotVisible || count > 0) && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { className: classBinder_cx('c-badge__point', { 'c-badge__point--relative': !children }, { 'c-badge__point--dot': isDotVisible }) }, count > 0 && !isDotVisible ? (count > maxCount ? maxCount + "+" : count) : null))));
+        (isDotVisible || hasNotification || count) && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { className: classBinder_cx('c-badge__point', { 'c-badge__point--relative': !children }, { 'c-badge__point--dot': isDotVisible || hasNotification }) }, count && (!isDotVisible || !hasNotification) ? (count > maxCount ? maxCount + "+" : count) : null)))) : null;
 };
 
 // CONCATENATED MODULE: ./src/components/Components/Badge/index.ts
@@ -97057,31 +97057,35 @@ var useModal = function (disableCloseByOutsideClick, onHide, onShow) {
 
 
 
+
 var Pills = function (_a) {
     var ariaLabel = _a.ariaLabel, _b = _a.initialPill, initialPill = _b === void 0 ? '' : _b, onChange = _a.onChange, pills = _a.pills, _c = _a.testId, testId = _c === void 0 ? 'Pills' : _c, theme = _a.theme;
     var _d = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useState"])(''), activePill = _d[0], setActivePill = _d[1];
-    var updateActivePill = function (pill) {
-        if (onChange)
+    var updateActivePill = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useCallback"])(function (pill) {
+        if (onChange) {
             onChange(pill);
+        }
         setActivePill(pill);
-    };
-    var handleOnClick = function (pill, isDisabled) { return function (event) {
+    }, [onChange]);
+    var handleOnClick = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useCallback"])(function (pill, isDisabled) { return function (event) {
         if (isDisabled) {
             event.preventDefault();
         }
         updateActivePill(pill);
-    }; };
+    }; }, [updateActivePill]);
     Object(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_["useEffect"])(function () {
         setActivePill(initialPill);
     }, [initialPill]);
     return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("ul", { "aria-label": ariaLabel, className: classBinder_cx('c-pills__list', theme), "data-testid": testId }, pills.map(function (_a) {
         var _b;
-        var disabledTooltip = _a.disabledTooltip, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, label = _a.label, value = _a.value;
+        var disabledTooltip = _a.disabledTooltip, _c = _a.hasNotification, hasNotification = _c === void 0 ? false : _c, _d = _a.isDisabled, isDisabled = _d === void 0 ? false : _d, label = _a.label, notificationCount = _a.notificationCount, notificationMaxCount = _a.notificationMaxCount, value = _a.value;
         return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("li", { key: "pills-" + cuid_default()() + "-" + value, className: classBinder_cx('c-pills__listItem', (_b = {},
-                _b["c-pills__listItem--disabled"] = isDisabled,
-                _b["c-pills__listItem--selected"] = activePill === value,
+                _b['c-pills__listItem--disabled'] = isDisabled,
+                _b['c-pills__listItem--selected'] = activePill === value,
                 _b)) },
-            external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Button, { disabledTooltip: disabledTooltip, isDisabled: isDisabled, theme: classBinder_cx('c-pills__listButton'), type: "transparent", onClick: handleOnClick(value, isDisabled) }, label)));
+            external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Button, { disabledTooltip: disabledTooltip, isDisabled: isDisabled, theme: classBinder_cx('c-pills__listButton'), type: "transparent", onClick: handleOnClick(value, isDisabled) },
+                external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Badge, { count: notificationCount, hasNotification: hasNotification, maxCount: notificationMaxCount, theme: "u-mr--xxSmall" }),
+                label)));
     })));
 };
 
@@ -113280,15 +113284,11 @@ var Stepper = function (_a) {
 // CONCATENATED MODULE: ./src/components/Navigation/Tabs/_elements_/TabListItem.tsx
 
 
+
 var TabListItem = function (_a) {
-    var _b;
-    var _c = _a.countLimit, countLimit = _c === void 0 ? 99 : _c, hasNotification = _a.hasNotification, notificationCount = _a.notificationCount, value = _a.value;
+    var _b = _a.countLimit, countLimit = _b === void 0 ? 99 : _b, hasNotification = _a.hasNotification, notificationCount = _a.notificationCount, notificationMaxCount = _a.notificationMaxCount, value = _a.value;
     return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Flex, { alignItems: hasNotification ? 'center' : 'baseline' },
-        (hasNotification || notificationCount) && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("div", { className: classBinder_cx('c-tabs__badge', (_b = {}, _b['c-tabs__badge--pulsing'] = hasNotification, _b)) }, notificationCount && !hasNotification
-            ? notificationCount > countLimit
-                ? countLimit + "+"
-                : notificationCount
-            : null)),
+        external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Badge, { count: notificationCount, hasNotification: hasNotification, maxCount: notificationMaxCount || countLimit, theme: "u-mr--xxSmall" }),
         external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("div", { className: classBinder_cx('c-tabs__text') }, value)));
 };