kiban-design-system 1.0.270-alpha.0 → 1.0.272-alpha.0

package/dist/index.js

@@ -9995,7 +9995,7 @@ const AlphaInputText = ({ isDisabled, label }) => {
 const SideMenuContext = createContext({});
 
 const COMPONENT_NAME$p = 'AlphaSideMenu__Item';
-const Item$3 = ({ label, isDisabled, icon, onClick, isActive: isActiveProp, subNavigationItems, truncateText, anchorProps, isCollapsed: isCollapsedProp, isSubNavigation, isExternal, isExact, url, }) => {
+const Item$3 = ({ label, isDisabled, icon, onClick, isActive: isActiveProp, subNavigationItems, truncateText, anchorProps, isCollapsed: isCollapsedProp, isSubNavigation, isExternal, isExact, url, isVisible, }) => {
     const { anchorComponent, collapsed, setCurrentTierItems, location } = useContext(SideMenuContext);
     const isCollapsed = isCollapsedProp !== undefined ? isCollapsedProp : collapsed;
     const AnchorComponent = !isExternal ? anchorComponent || 'a' : 'a';
@@ -10012,20 +10012,9 @@ const Item$3 = ({ label, isDisabled, icon, onClick, isActive: isActiveProp, subN
             setCurrentTierItems === null || setCurrentTierItems === void 0 ? void 0 : setCurrentTierItems(subNavigationItems || [], label);
         }
     }, [isActive]);
-    const labelMarkup = label ? (jsx("span", Object.assign({ 
-        // layout
-        // animate={{
-        //   opacity: isCollapsed ? 0 : 1,
-        // }}
-        // transition={{
-        //   duration: 0.3,
-        //   ease: [0.4, 0, 0.2, 1],
-        // }}
-        className: `${COMPONENT_NAME$p}__Label` }, { children: label }), void 0)) : null;
+    const labelMarkup = label ? (jsx("span", Object.assign({ className: `${COMPONENT_NAME$p}__Label` }, { children: label }), void 0)) : null;
     const iconSource = icon && isValidIcon(icon === null || icon === void 0 ? void 0 : icon.icon) ? (jsx(AlphaIcon, { source: icon === null || icon === void 0 ? void 0 : icon.icon, outlined: icon === null || icon === void 0 ? void 0 : icon.outlined }, void 0)) : (jsx(Fragment, { children: icon }, void 0));
-    const iconMarkup = icon ? (jsx("div", Object.assign({ 
-        // layout
-        className: `${COMPONENT_NAME$p}__IconWrapper` }, { children: iconSource }), void 0)) : null;
+    const iconMarkup = icon ? (jsx("div", Object.assign({ className: `${COMPONENT_NAME$p}__IconWrapper` }, { children: iconSource }), void 0)) : null;
     const handleClick = () => {
         if (!isDisabled) {
             onClick === null || onClick === void 0 ? void 0 : onClick();
@@ -10037,9 +10026,19 @@ const Item$3 = ({ label, isDisabled, icon, onClick, isActive: isActiveProp, subN
     const anchorMarkup = (jsxs(AnchorComponent, Object.assign({}, anchorProps, { target: isExternal ? '_blank' : undefined, onClick: handleClick }, { children: [iconMarkup, labelMarkup] }), void 0));
     const tooltipAnchorMarkup = isCollapsed ? (jsx(AlphaTooltip, Object.assign({ content: label, position: 'right' }, { children: anchorMarkup }), void 0)) : null;
     const classNames = cssClassName(COMPONENT_NAME$p, isDisabled && 'isDisabled', isActive && 'isActive', truncateText && 'isTruncated', (isCollapsed !== undefined ? isCollapsed : collapsed) && 'isCollapsed');
-    return (jsx("li", Object.assign({ 
-        // layout
-        className: classNames }, { children: tooltipAnchorMarkup || anchorMarkup }), void 0));
+    if (isVisible &&
+        !isVisible(location, {
+            label,
+            url,
+            isDisabled,
+            isActive: isActiveProp,
+            subNavigationItems: subNavigationItems || [],
+            truncateText,
+            anchorProps,
+        })) {
+        return null;
+    }
+    return jsx("li", Object.assign({ className: classNames }, { children: tooltipAnchorMarkup || anchorMarkup }), void 0);
 };
 
 const COMPONENT_NAME$o = 'AlphaSideMenu__Section';
@@ -28413,8 +28412,8 @@ const Header$1 = ({ leftContent, rightContent, actions, userMenu, logo, extraAct
     const { theme } = useTheme();
     const renderAction = (item, index) => (jsx("div", Object.assign({ className: 'User-menu__secondary-action', onClick: item.onClick }, { children: jsx(Icon, { name: item.icon }, void 0) }), index || ''));
     const renderActionWithTooltip = (item, index) => {
-        var _a, _b;
-        return (jsx(Tooltip, Object.assign({ position: (_a = item.tooltip) === null || _a === void 0 ? void 0 : _a.position, text: (item.tooltip && item.tooltip.text) || '', id: (item.tooltip && item.tooltip.id) || '', toggleType: (_b = item.tooltip) === null || _b === void 0 ? void 0 : _b.toogleType }, { children: renderAction(item) }), index));
+        var _a;
+        return (jsx(AlphaTooltip, Object.assign({ position: (_a = item.tooltip) === null || _a === void 0 ? void 0 : _a.position, content: (item.tooltip && item.tooltip.text) || '', appearance: 'default', theme: 'cloud' }, { children: renderAction(item) }), index));
     };
     return (jsxs(Fragment, { children: [jsxs("div", Object.assign({ className: `Header__${theme} Header__container` }, { children: [jsxs("div", Object.assign({ className: 'Header__container-logo' }, { children: [extraAction && (extraAction === null || extraAction === void 0 ? void 0 : extraAction.icon) && (jsx("div", Object.assign({ className: 'Header__container-logo__extra-action' }, { children: jsx(IconButton, { onClick: extraAction === null || extraAction === void 0 ? void 0 : extraAction.onClick, icon: extraAction.icon, isRound: true, size: 'small', appearance: 'tertiary' }, void 0) }), void 0)), logo && jsx(Logo, { name: logo, size: 'small' }, void 0), leftContent && (jsx("div", Object.assign({ className: 'Header__container-content-left' }, { children: leftContent }), void 0))] }), void 0), jsxs("div", Object.assign({ className: 'Header__right-container' }, { children: [rightContent && (jsx("div", Object.assign({ className: 'Header__right-content' }, { children: rightContent }), void 0)), jsxs("div", Object.assign({ className: 'Header__menus-container' }, { children: [jsx("hr", { className: 'User-menu__divider-left' }, void 0), actions === null || actions === void 0 ? void 0 : actions.map((item, i) => item.tooltip
                                         ? renderActionWithTooltip(item, i)