@box/metadata-view 2.3.0 → 2.3.2

package/dist/chunks/header.js

@@ -1 +1 @@
-import{Case,SwitchCase}from"../esm/lib/components/switch-case/switch-case.js";import messages from"../esm/lib/components/header/messages.js";import{IconButton,PageHeader,Status,Text}from"@box/blueprint-web";import{XMark}from"@box/blueprint-web-assets/icons/Fill";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/header.css';var header_module_default={titleBar:`_titleBar_1t4pt_1`,clearSelectionButton:`_clearSelectionButton_1t4pt_7`,headerContainer:`_headerContainer_1t4pt_12`,rightSlot:`_rightSlot_1t4pt_19`};function Header({title,itemCount,isItemCountVisible=!0,onClearSelection,selectionCount=0,isSelectionCountVisible=!0,selectedItemName,rightSlot}){let{formatMessage}=useIntl(),shouldShowSelectionBar=isSelectionCountVisible&&selectionCount>0,shouldShowItemCountStatus=isItemCountVisible&&itemCount!=null;if(!(title||shouldShowSelectionBar||rightSlot))return null;let[selectionMessageDescriptor,selectionMessageValues]=selectedItemName?[messages.singleItemSelected,{name:selectedItemName}]:[messages.itemsSelected,{count:selectionCount}],selectionMessage=formatMessage(selectionMessageDescriptor,{...selectionMessageValues,b:chunks=>jsx(Text,{color:`textOnLightDefault`,variant:`bodyLargeBold`,as:`span`,children:chunks})});return jsxs(`div`,{className:header_module_default.headerContainer,children:[jsx(PageHeader.Root,{variant:`inline`,sticky:!1,children:jsxs(SwitchCase,{children:[jsxs(Case,{condition:shouldShowSelectionBar,children:[jsx(PageHeader.Corner,{children:jsx(IconButton,{"aria-label":formatMessage(messages.clearSelectionAriaLabel),icon:XMark,onClick:onClearSelection,size:`small`,variant:`small-utility`,className:header_module_default.clearSelectionButton})}),jsx(PageHeader.StartElements,{children:jsx(Text,{as:`span`,color:`textOnLightSecondary`,variant:`bodyLarge`,children:selectionMessage})})]}),jsx(Case,{condition:!!title,children:jsxs(`div`,{className:header_module_default.titleBar,children:[title,shouldShowItemCountStatus&&jsx(Status,{className:header_module_default.itemCount,colorIndex:0,text:String(itemCount)})]})})]})}),rightSlot&&jsx(`div`,{className:header_module_default.rightSlot,children:rightSlot})]})}export{Header as t};
+import{Case,SwitchCase}from"../esm/lib/components/switch-case/switch-case.js";import messages from"../esm/lib/components/header/messages.js";import{IconButton,PageHeader,Status,Text}from"@box/blueprint-web";import{XMark}from"@box/blueprint-web-assets/icons/Fill";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/header.css';var header_module_default={titleBar:`_titleBar_1t4pt_1`,clearSelectionButton:`_clearSelectionButton_1t4pt_7`,headerContainer:`_headerContainer_1t4pt_12`,rightSlot:`_rightSlot_1t4pt_19`};function Header({title,itemCount,isItemCountVisible=!0,onClearSelection,selectionCount=0,isSelectionCountVisible=!0,selectedItemName,rightSlot}){let{formatMessage}=useIntl(),shouldShowSelectionBar=isSelectionCountVisible&&selectionCount>0,shouldShowItemCountStatus=isItemCountVisible&&itemCount!=null;if(!(title||shouldShowSelectionBar||rightSlot))return null;let[selectionMessageDescriptor,selectionMessageValues]=selectedItemName?[messages.singleItemSelected,{name:selectedItemName}]:[messages.itemsSelected,{count:selectionCount}],selectionMessage=formatMessage(selectionMessageDescriptor,{...selectionMessageValues,b:chunks=>jsx(Text,{color:`textOnLightDefault`,variant:`bodyLargeBold`,as:`span`,children:chunks})});return jsxs(`div`,{className:header_module_default.headerContainer,children:[jsx(PageHeader.Root,{variant:`inline`,sticky:!1,children:jsxs(SwitchCase,{children:[jsxs(Case,{condition:shouldShowSelectionBar,children:[jsx(PageHeader.Corner,{children:jsx(IconButton,{"aria-label":formatMessage(messages.clearSelectionAriaLabel),icon:XMark,onClick:onClearSelection,size:`small`,variant:`small-utility`,className:header_module_default.clearSelectionButton})}),jsx(PageHeader.StartElements,{children:jsx(Text,{as:`span`,color:`textOnLightSecondary`,variant:`bodyLarge`,children:selectionMessage})})]}),jsx(Case,{condition:!!title,children:jsxs(`div`,{className:header_module_default.titleBar,children:[title,shouldShowItemCountStatus&&jsx(Status,{colorIndex:0,text:String(itemCount)})]})})]})}),rightSlot&&jsx(`div`,{className:header_module_default.rightSlot,children:rightSlot})]})}export{Header as t};

package/dist/chunks/metadata-view.js

@@ -1 +1 @@
-import{r as ViewMode,t as IconColumnVariant}from"./types.js";import{t as ActionBar}from"./action-bar.js";import{t as MetadataGrid}from"./metadata-grid.js";import{MetadataTable}from"../esm/lib/components/metadata-table/metadata-table.js";import{Pagination}from"../esm/lib/components/pagination/pagination.js";import{Case,SwitchCase}from"../esm/lib/components/switch-case/switch-case.js";import{t as Header}from"./header.js";import{t as EmptyStateComponent}from"./empty-state.js";import{t as ErrorState}from"./error-state.js";import{useHeader}from"../esm/lib/hooks/use-header.js";import{TooltipProvider}from"@box/blueprint-web";import{useCallback,useRef,useState}from"react";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import '../styles/metadata-view.css';var metadata_view_module_default={container:`_container_1o9go_5`,contentContainer:`_contentContainer_1o9go_15`};function MetadataView({actionBarProps,columns,dataTargetPrefix,tableProps,hasError,headerProps,onRefresh,onSelectionChange,onViewModeChange,selectedKeys,initialViewMode=ViewMode.LIST,paginationProps,isLoading,isSelectAllEnabled=!0,isSelectionEnabled,areSelectionCheckboxesDisabled,...rest}){let[viewMode,setViewMode]=useState(initialViewMode),[sortDescriptor,setSortDescriptor]=useState(void 0),[zoomLevel,setZoomLevel]=useState(0),containerRef=useRef(null),{headerSelectionProps,handleSelectionChange,selectionResetKey}=useHeader({headerProps,items:rest.items,selectedKeys,isSelectionEnabled,onSelectionChange}),handleViewModeChange=()=>{setViewMode(currentMode=>{let nextViewMode=currentMode===ViewMode.LIST?ViewMode.GRID:ViewMode.LIST;return onViewModeChange?.(nextViewMode),nextViewMode})},isMetadataTableEmpty=!isLoading&&rest.items.length===0,sortableColumns=actionBarProps&&actionBarProps.sortDropdownProps&&columns.filter(column=>column.type!==`multiSelect`&&column.type!==`enum`&&column.allowsSorting===!0),{iconColumnVariant}=tableProps||{},isIconColumnEnabled=iconColumnVariant&&iconColumnVariant===IconColumnVariant.COLUMN,externalOnSortChange=tableProps?.onSortChange,handleSortChange=useCallback(({column,direction})=>{setSortDescriptor({column,direction}),externalOnSortChange?.({column,direction})},[externalOnSortChange]),mergedTableProps={...tableProps,sortDescriptor,onSortChange:handleSortChange};return jsx(TooltipProvider,{children:jsx(`div`,{ref:containerRef,className:metadata_view_module_default.container,children:hasError?jsx(ErrorState,{onRefresh}):jsxs(Fragment,{children:[headerProps&&jsx(Header,{...headerProps,...headerSelectionProps}),jsx(ActionBar,{...actionBarProps,containerRef,dataTargetPrefix,isIconColumnEnabled,onSortDescriptorChange:setSortDescriptor,onViewModeClick:handleViewModeChange,onZoomLevelChange:setZoomLevel,sortableColumns,sortDescriptor,viewMode,zoomLevel}),jsx(`div`,{className:metadata_view_module_default.contentContainer,children:jsxs(SwitchCase,{children:[jsx(Case,{condition:isMetadataTableEmpty,children:jsx(EmptyStateComponent,{})}),jsx(Case,{condition:viewMode===ViewMode.LIST,children:jsx(MetadataTable,{areSelectionCheckboxesDisabled,columns,isLoading,isSelectAllEnabled,onSelectionChange:handleSelectionChange,selectedKeys,selectionMode:isSelectionEnabled?`multiple`:`none`,zoomLevel,...rest,...mergedTableProps,dataTargetPrefix},selectionResetKey)}),jsx(Case,{condition:viewMode===ViewMode.GRID,children:jsx(MetadataGrid,{areSelectionCheckboxesDisabled,onSelectionChange:handleSelectionChange,selectedKeys,selectionMode:isSelectionEnabled?`multiple`:`none`,zoomLevel,...rest},selectionResetKey)})]})}),paginationProps&&jsx(Pagination,{...paginationProps})]})})})}export{MetadataView as t};
+import{r as ViewMode,t as IconColumnVariant}from"./types.js";import{t as ActionBar}from"./action-bar.js";import{t as MetadataGrid}from"./metadata-grid.js";import{MetadataTable}from"../esm/lib/components/metadata-table/metadata-table.js";import{Pagination}from"../esm/lib/components/pagination/pagination.js";import{Case,SwitchCase}from"../esm/lib/components/switch-case/switch-case.js";import{t as Header}from"./header.js";import{t as EmptyStateComponent}from"./empty-state.js";import{t as ErrorState}from"./error-state.js";import{useHeader}from"../esm/lib/hooks/use-header.js";import{TooltipProvider}from"@box/blueprint-web";import{useCallback,useRef,useState}from"react";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import '../styles/metadata-view.css';var metadata_view_module_default={container:`_container_1p0ee_1`,contentContainer:`_contentContainer_1p0ee_8`};function MetadataView({actionBarProps,columns,dataTargetPrefix,tableProps,hasError,headerProps,onRefresh,onSelectionChange,onViewModeChange,selectedKeys,initialViewMode=ViewMode.LIST,paginationProps,isLoading,isSelectAllEnabled=!0,isSelectionEnabled,areSelectionCheckboxesDisabled,...rest}){let[viewMode,setViewMode]=useState(initialViewMode),[sortDescriptor,setSortDescriptor]=useState(void 0),[zoomLevel,setZoomLevel]=useState(0),containerRef=useRef(null),{headerSelectionProps,handleSelectionChange,selectionResetKey}=useHeader({headerProps,items:rest.items,selectedKeys,isSelectionEnabled,onSelectionChange}),handleViewModeChange=()=>{setViewMode(currentMode=>{let nextViewMode=currentMode===ViewMode.LIST?ViewMode.GRID:ViewMode.LIST;return onViewModeChange?.(nextViewMode),nextViewMode})},isMetadataTableEmpty=!isLoading&&rest.items.length===0,sortableColumns=actionBarProps&&actionBarProps.sortDropdownProps&&columns.filter(column=>column.type!==`multiSelect`&&column.type!==`enum`&&column.allowsSorting===!0),{iconColumnVariant}=tableProps||{},isIconColumnEnabled=iconColumnVariant&&iconColumnVariant===IconColumnVariant.COLUMN,externalOnSortChange=tableProps?.onSortChange,handleSortChange=useCallback(({column,direction})=>{setSortDescriptor({column,direction}),externalOnSortChange?.({column,direction})},[externalOnSortChange]),mergedTableProps={...tableProps,sortDescriptor,onSortChange:handleSortChange};return jsx(TooltipProvider,{children:jsx(`div`,{ref:containerRef,className:metadata_view_module_default.container,children:hasError?jsx(ErrorState,{onRefresh}):jsxs(Fragment,{children:[headerProps&&jsx(Header,{...headerProps,...headerSelectionProps}),jsx(ActionBar,{...actionBarProps,containerRef,dataTargetPrefix,isIconColumnEnabled,onSortDescriptorChange:setSortDescriptor,onViewModeClick:handleViewModeChange,onZoomLevelChange:setZoomLevel,sortableColumns,sortDescriptor,viewMode,zoomLevel}),jsx(`div`,{className:metadata_view_module_default.contentContainer,children:jsxs(SwitchCase,{children:[jsx(Case,{condition:isMetadataTableEmpty,children:jsx(EmptyStateComponent,{})}),jsx(Case,{condition:viewMode===ViewMode.LIST,children:jsx(MetadataTable,{areSelectionCheckboxesDisabled,columns,isLoading,isSelectAllEnabled,onSelectionChange:handleSelectionChange,selectedKeys,selectionMode:isSelectionEnabled?`multiple`:`none`,zoomLevel,...rest,...mergedTableProps,dataTargetPrefix},selectionResetKey)}),jsx(Case,{condition:viewMode===ViewMode.GRID,children:jsx(MetadataGrid,{areSelectionCheckboxesDisabled,onSelectionChange:handleSelectionChange,selectedKeys,selectionMode:isSelectionEnabled?`multiple`:`none`,zoomLevel,...rest},selectionResetKey)})]})}),paginationProps&&jsx(Pagination,{...paginationProps})]})})})}export{MetadataView as t};

package/dist/chunks/pagination-controls.js

@@ -1 +1 @@
-import messages from"../esm/lib/components/pagination/messages.js";import{Button}from"@box/blueprint-web";import{FormattedMessage,useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/pagination-controls.css';var pagination_controls_module_default={pagination:`_pagination_1ozaq_1`,paginationButtonContainer:`_paginationButtonContainer_1ozaq_9`},PaginationControls=({handleNextClick,handlePreviousClick,hasNextPage,hasPageEntryStatus,hasPreviousPage,offset=0,pageSize=0,totalCount=0})=>{let{formatMessage}=useIntl(),startEntryIndex=offset+1,endEntryIndex=Math.min(offset+pageSize,totalCount);return jsxs(`div`,{"aria-label":formatMessage(messages.paginationAriaLabel),"aria-live":`polite`,className:pagination_controls_module_default.pagination,children:[hasPageEntryStatus&&jsx(`div`,{className:pagination_controls_module_default.paginationText,children:jsx(FormattedMessage,{...messages.pageEntryStatus,values:{startEntryIndex,endEntryIndex,totalCount}})}),jsxs(`div`,{className:pagination_controls_module_default.paginationButtonContainer,children:[jsx(Button,{disabled:!hasPreviousPage,onClick:handlePreviousClick,variant:`secondary`,children:formatMessage(messages.previousPageButton)}),jsx(Button,{disabled:!hasNextPage,onClick:handleNextClick,variant:`secondary`,children:formatMessage(messages.nextPageButton)})]})]})};export{PaginationControls as t};
+import messages from"../esm/lib/components/pagination/messages.js";import{Button}from"@box/blueprint-web";import{FormattedMessage,useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/pagination-controls.css';var pagination_controls_module_default={pagination:`_pagination_1ozaq_1`,paginationButtonContainer:`_paginationButtonContainer_1ozaq_9`},PaginationControls=({handleNextClick,handlePreviousClick,hasNextPage,hasPageEntryStatus,hasPreviousPage,offset=0,pageSize=0,totalCount=0})=>{let{formatMessage}=useIntl(),startEntryIndex=offset+1,endEntryIndex=Math.min(offset+pageSize,totalCount);return jsxs(`div`,{"aria-label":formatMessage(messages.paginationAriaLabel),"aria-live":`polite`,className:pagination_controls_module_default.pagination,children:[hasPageEntryStatus&&jsx(`div`,{children:jsx(FormattedMessage,{...messages.pageEntryStatus,values:{startEntryIndex,endEntryIndex,totalCount}})}),jsxs(`div`,{className:pagination_controls_module_default.paginationButtonContainer,children:[jsx(Button,{disabled:!hasPreviousPage,onClick:handlePreviousClick,variant:`secondary`,children:formatMessage(messages.previousPageButton)}),jsx(Button,{disabled:!hasNextPage,onClick:handleNextClick,variant:`secondary`,children:formatMessage(messages.nextPageButton)})]})]})};export{PaginationControls as t};

package/dist/styles/metadata-view.css

@@ -1 +1 @@
-._container_1o9go_5{flex-direction:column;height:100%;display:flex;overflow:hidden}._contentContainer_1o9go_15{overflow:auto}
+._container_1p0ee_1{flex-direction:column;height:100%;display:flex;overflow:hidden}._contentContainer_1p0ee_8{overflow:auto}

package/package.json

@@ -1,14 +1,14 @@
 {
     "name": "@box/metadata-view",
-    "version": "2.3.0",
+    "version": "2.3.2",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
-        "@box/blueprint-web": "^16.14.0",
-        "@box/blueprint-web-assets": "^5.6.0",
-        "@box/box-item-type-selector": "^2.2.0",
-        "@box/content-field": "^2.2.0",
-        "@box/item-icon": "^3.3.0",
-        "@box/metadata-filter": "^2.3.0",
+        "@box/blueprint-web": "^16.14.2",
+        "@box/blueprint-web-assets": "^5.6.2",
+        "@box/box-item-type-selector": "^2.2.2",
+        "@box/content-field": "^2.2.2",
+        "@box/item-icon": "^3.3.2",
+        "@box/metadata-filter": "^2.3.2",
         "@box/types": "^3.2.0",
         "@tanstack/react-virtual": "^3.10.8",
         "formik": "^2.4.5",
@@ -19,14 +19,14 @@
         "react-intl": "^6.4.2"
     },
     "devDependencies": {
-        "@box/blueprint-web": "^16.14.0",
-        "@box/blueprint-web-assets": "^5.6.0",
-        "@box/box-item-type-selector": "^2.2.0",
-        "@box/content-field": "^2.2.0",
+        "@box/blueprint-web": "^16.14.2",
+        "@box/blueprint-web-assets": "^5.6.2",
+        "@box/box-item-type-selector": "^2.2.2",
+        "@box/content-field": "^2.2.2",
         "@box/eslint-plugin-blueprint": "2.2.0",
-        "@box/item-icon": "^3.3.0",
-        "@box/metadata-filter": "^2.3.0",
-        "@box/storybook-utils": "1.2.0",
+        "@box/item-icon": "^3.3.2",
+        "@box/metadata-filter": "^2.3.2",
+        "@box/storybook-utils": "1.2.2",
         "@box/types": "^3.2.0",
         "@tanstack/react-virtual": "^3.10.8",
         "react-intl": "^6.4.2"