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

package/dist/index.js

@@ -921,7 +921,9 @@ function formatFileSize(bytes) {
         unitIndex += 1;
     }
     return `${size.toFixed(2)} ${units[unitIndex]}`;
-}
+}
+// eslint-disable-next-line
+// code end
 
 const cssClassName = (mainClass, ...classes) => {
     const filteredClasses = classes
@@ -10026,7 +10028,7 @@ 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');
-    if (isVisible &&
+    if (isVisible !== undefined &&
         !isVisible(location, {
             label,
             url,
@@ -10050,8 +10052,8 @@ const Section$1 = ({ items, fill, title, isCollapsed: isCollapsedProp, areSubNav
         // layout
         className: titleClassNames }, { children: jsx("span", { children: title }, void 0) }), void 0)) : null;
     const renderItem = (item, index) => {
-        const { label, isDisabled, icon, onClick, isActive, subNavigationItems, truncateText, anchorProps, url, isExact, isExternal, } = item;
-        return (jsx(Item$3, { label: label, isDisabled: isDisabled, icon: icon, onClick: onClick, isActive: isActive, subNavigationItems: subNavigationItems, truncateText: truncateText, anchorProps: anchorProps, isCollapsed: isCollapsed, isSubNavigation: areSubNavigationItems, url: url, isExact: isExact, isExternal: isExternal }, `alpha-side-menu-item-${index}`));
+        const { label, isDisabled, icon, onClick, isActive, subNavigationItems, truncateText, anchorProps, url, isExact, isExternal, isVisible, } = item;
+        return (jsx(Item$3, { label: label, isDisabled: isDisabled, icon: icon, onClick: onClick, isActive: isActive, subNavigationItems: subNavigationItems, truncateText: truncateText, anchorProps: anchorProps, isCollapsed: isCollapsed, isSubNavigation: areSubNavigationItems, url: url, isExact: isExact, isExternal: isExternal, isVisible: isVisible }, `alpha-side-menu-item-${index}`));
     };
     const itemsMarkup = items && items.length > 0 ? (jsx("ul", Object.assign({ className: `${COMPONENT_NAME$o}__Items` }, { children: items.map(renderItem) }), void 0)) : null;
     const classNames = cssClassName(COMPONENT_NAME$o, fill && 'isFill');
@@ -30664,6 +30666,7 @@ const AlphaZipCodeInput = ({ label, isRequired, items, onBlur, onFocus, onChange
     const [isFocusActive, setIsFocusActive] = useState(false);
     const [showPopover, setShowPopover] = useState(false);
     const handleOnBlur = () => {
+        setShowPopover(false);
         setIsFocusActive(false);
         if (onBlur)
             onBlur();
@@ -30674,6 +30677,7 @@ const AlphaZipCodeInput = ({ label, isRequired, items, onBlur, onFocus, onChange
         if (onFocus)
             onFocus();
     };
+    // eslint-disable-next-line max-len
     const handleOnChange = (event) => {
         const isValid = /^[0-9]+$/i.test(event.target.value) || event.target.value === '';
         if (isValid && onChange) {
@@ -30696,7 +30700,20 @@ const AlphaZipCodeInput = ({ label, isRequired, items, onBlur, onFocus, onChange
     }));
     const optionListMarkup = items.length > 0 ? (jsx(OptionList, { items: itemsOptions, selected: [''], onChange: handleOnSelectItem }, void 0)) : null;
     const emptyItemsMarkup = items.length === 0 ? (jsx("div", Object.assign({ className: `${COMPONENT_NAME}__EmptyItems` }, { children: labelEmpty }), void 0)) : null;
-    const popoverMarkup = useMemo(() => (jsx(Popover$1, Object.assign({ activator: inputMarkup, isActive: showPopover, isFullWidth: true, onClose: () => setShowPopover(false), isFixed: true }, { children: jsxs(Popover$1.Pane, { children: [optionListMarkup, emptyItemsMarkup] }, void 0) }), void 0)), [items, value, showPopover, isFocusActive]);
+    const popoverMarkup = useMemo(() => (jsx(Popover$1, Object.assign({ activator: inputMarkup, isActive: showPopover, isFullWidth: true, onClose: () => setShowPopover(false), isFixed: true }, { children: jsxs(Popover$1.Pane, { children: [optionListMarkup, emptyItemsMarkup] }, void 0) }), items.length)), [
+        items,
+        value,
+        showPopover,
+        emptyItemsMarkup,
+        optionListMarkup,
+        isFocusActive,
+    ]);
+    useEffect(() => {
+        if (showPopover) {
+            setShowPopover(false);
+            requestAnimationFrame(() => setShowPopover(true));
+        }
+    }, [items]);
     return (jsxs("div", Object.assign({ className: `${COMPONENT_NAME}__Wrapper` }, { children: [labelMarkup, popoverMarkup] }), void 0));
 };