kiban-design-system 1.0.240-alpha.0 → 1.0.242-alpha.0

package/dist/index.js

@@ -1032,6 +1032,17 @@ const isComponentTypeOf = (childComponent, parentComponent) => {
     return Components.some((Component) => typeof type !== 'string' && type === Component);
 };
 
+function formatFileSize(bytes) {
+    const units = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
+    let unitIndex = 0;
+    let size = bytes;
+    while (size >= 1024 && unitIndex < units.length - 1) {
+        size /= 1024;
+        unitIndex += 1;
+    }
+    return `${size.toFixed(2)} ${units[unitIndex]}`;
+}
+
 const cssClassName = (mainClass, ...classes) => {
     const filteredClasses = classes
         .filter(Boolean)
@@ -23633,7 +23644,7 @@ var pako = {
  * @returns {symbol} - Element FileItem
  * @param {string} InputTextProps.ariaLabel - Label to use in automatic tests
  */
-const FileItem = ({ ariaLabel, name, addon, onDelete, size = 0, }) => (jsxs("div", Object.assign({ className: 'File' }, { children: [jsxs("div", Object.assign({ className: 'File__content__left' }, { children: [jsx(Icon, { name: 'Paperclip' }, void 0), jsx("p", Object.assign({ className: ' File__content__nameFile' }, { children: name }), void 0)] }), void 0), jsxs("div", Object.assign({ className: 'File__content__right' }, { children: [jsxs("button", Object.assign({ "aria-label": `${ariaLabel}-delete`, className: 'ButtonDeleteFile', onClick: onDelete }, { children: [jsx(Fragment, { children: addon }, void 0), jsx(Icon, { name: 'Close' }, void 0)] }), void 0), jsxs("p", Object.assign({ className: 'File__content__fileSize' }, { children: [(size / 1048576).toFixed(4), " M"] }), void 0)] }), void 0)] }), void 0));
+const FileItem = ({ ariaLabel, name, addon, onDelete, size = 0, }) => (jsxs("div", Object.assign({ className: 'File' }, { children: [jsxs("div", Object.assign({ className: 'File__content__left' }, { children: [jsx(Icon, { name: 'Paperclip' }, void 0), jsx("p", Object.assign({ className: ' File__content__nameFile' }, { children: name }), void 0)] }), void 0), jsxs("div", Object.assign({ className: 'File__content__right' }, { children: [jsxs("button", Object.assign({ "aria-label": `${ariaLabel}-delete`, className: 'ButtonDeleteFile', onClick: onDelete }, { children: [jsx(Fragment, { children: addon }, void 0), jsx(Icon, { name: 'Close' }, void 0)] }), void 0), jsx("p", Object.assign({ className: 'File__content__fileSize' }, { children: formatFileSize(size) }), void 0)] }), void 0)] }), void 0));
 
 /**
  * FileDrop is a component to upload files in any project
@@ -30551,7 +30562,7 @@ 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]);
+    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]);
     return (jsxs("div", Object.assign({ className: `${COMPONENT_NAME}__Wrapper` }, { children: [labelMarkup, popoverMarkup] }), void 0));
 };
 
@@ -30567,5 +30578,5 @@ const AlphaSegmentedControl = ({ children, title, segments, selected, onSelected
     return (jsxs("div", Object.assign({ className: `${MAINCLASS}__Container` }, { children: [headerMarkup, contentMarkup] }), void 0));
 };
 
-export { ActionList, Alert, AlertProvider, AlphaAttributeInput, AlphaBadge, AlphaButton, AlphaChip, AlphaFilterControl, AlphaGraphicCard, AlphaIcon, AlphaInlineError, AlphaInputDate, InputTag$1 as AlphaInputTag, AlphaInputText, AlphaLabel, AlphaLabelledField, AlphaMultiSelectionPicker, AlphaSegmentedControl, AlphaSpinner, AlphaStepper, AlphaTag, AlphaTile, AlphaTooltip, Totalizer as AlphaTotalizer, AlphaZipCodeInput, AnnotatedSection, Avatar, Badge, Banner, Button, CalendarPicker, Card, Checkbox, ChoiceList, Collapsible, Connector, Container, Cover, DataTable, DatePicker, DeletableSection, Divider, DynamicForm, EmptyState, ErrorIcon, FileDownloader, Filedrop, FilterControl, Filters, Footer, Form, FormField, FormLayout, Frame, Grid, GridItem, Header$1 as Header, Icon, IconButton, IndexList, InlineEdit, InputPhoneNumber, InputTag, InputText, JsonViewer, Label, Link, ListInfo, Loader, Logo, Media, Modal, ModalHeader, Nip, OptionList, Page, PageActions, Pagination, Pane, Panel, PanelFooter, PanelHeader, PendingIcon, Popover$1 as Popover, Progress, RadioButton, SectionForm, Select, SideMenu, SkeletonInput, SkeletonMedia, SkeletonTabs, SkeletonText, SkeletonTitle, SortableList, Spinner, Stack, StepDefault, SuccessIcon, Table, Tabs, Tag, ThemeProvider, ThreadItem, Thumbnail, Tile, TimeSelector, Title, Toggle, Tooltip, WarningIcon, capitalize, cssClassName, formatDate, isComponentTypeOf, isValidIcon, themeClassConverter, useShowAlert, useTheme };
+export { ActionList, Alert, AlertProvider, AlphaAttributeInput, AlphaBadge, AlphaButton, AlphaChip, AlphaFilterControl, AlphaGraphicCard, AlphaIcon, AlphaInlineError, AlphaInputDate, InputTag$1 as AlphaInputTag, AlphaInputText, AlphaLabel, AlphaLabelledField, AlphaMultiSelectionPicker, AlphaSegmentedControl, AlphaSpinner, AlphaStepper, AlphaTag, AlphaTile, AlphaTooltip, Totalizer as AlphaTotalizer, AlphaZipCodeInput, AnnotatedSection, Avatar, Badge, Banner, Button, CalendarPicker, Card, Checkbox, ChoiceList, Collapsible, Connector, Container, Cover, DataTable, DatePicker, DeletableSection, Divider, DynamicForm, EmptyState, ErrorIcon, FileDownloader, Filedrop, FilterControl, Filters, Footer, Form, FormField, FormLayout, Frame, Grid, GridItem, Header$1 as Header, Icon, IconButton, IndexList, InlineEdit, InputPhoneNumber, InputTag, InputText, JsonViewer, Label, Link, ListInfo, Loader, Logo, Media, Modal, ModalHeader, Nip, OptionList, Page, PageActions, Pagination, Pane, Panel, PanelFooter, PanelHeader, PendingIcon, Popover$1 as Popover, Progress, RadioButton, SectionForm, Select, SideMenu, SkeletonInput, SkeletonMedia, SkeletonTabs, SkeletonText, SkeletonTitle, SortableList, Spinner, Stack, StepDefault, SuccessIcon, Table, Tabs, Tag, ThemeProvider, ThreadItem, Thumbnail, Tile, TimeSelector, Title, Toggle, Tooltip, WarningIcon, capitalize, cssClassName, formatDate, formatFileSize, isComponentTypeOf, isValidIcon, themeClassConverter, useShowAlert, useTheme };
 //# sourceMappingURL=index.js.map