box-ui-elements 23.4.0-beta.16 → 23.4.0-beta.18

package/es/elements/content-sidebar/versions/VersionsSidebar.js.flow

@@ -6,6 +6,7 @@
 
 import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
+import { Route } from 'react-router-dom';
 import type { MessageDescriptor } from 'react-intl';
 import InlineError from '../../../components/inline-error';
 import messages from './messages';
@@ -36,47 +37,55 @@ const VersionsSidebar = ({ error, isLoading, parentName, versions, ...rest }: Pr
     const showError = !!error;
 
     return (
-        <SidebarContent
-            className="bcs-Versions"
-            data-resin-component="preview"
-            data-resin-feature="versions"
-            title={
-                <>
-                    <BackButton data-resin-target="back" to={`/${parentName}`} />
-                    <FormattedMessage {...messages.versionsTitle} />
-                </>
-            }
-        >
-            <LoadingIndicatorWrapper className="bcs-Versions-content" crawlerPosition="top" isLoading={isLoading}>
-                {showError && (
-                    <InlineError title={<FormattedMessage {...messages.versionServerError} />}>
-                        <FormattedMessage {...error} />
-                    </InlineError>
-                )}
+        <Route>
+            {({ history }) => (
+                <SidebarContent
+                    className="bcs-Versions"
+                    data-resin-component="preview"
+                    data-resin-feature="versions"
+                    title={
+                        <>
+                            <BackButton data-resin-target="back" onClick={() => history.push(`/${parentName}`)} />
+                            <FormattedMessage {...messages.versionsTitle} />
+                        </>
+                    }
+                >
+                    <LoadingIndicatorWrapper
+                        className="bcs-Versions-content"
+                        crawlerPosition="top"
+                        isLoading={isLoading}
+                    >
+                        {showError && (
+                            <InlineError title={<FormattedMessage {...messages.versionServerError} />}>
+                                <FormattedMessage {...error} />
+                            </InlineError>
+                        )}
 
-                {showEmpty && (
-                    <div className="bcs-Versions-empty">
-                        <FormattedMessage {...messages.versionsEmpty} />
-                    </div>
-                )}
+                        {showEmpty && (
+                            <div className="bcs-Versions-empty">
+                                <FormattedMessage {...messages.versionsEmpty} />
+                            </div>
+                        )}
 
-                {showVersions && (
-                    <div className="bcs-Versions-menu" data-testid="bcs-Versions-menu">
-                        <VersionsMenu versions={versions} {...rest} />
-                    </div>
-                )}
-                {showLimit && (
-                    <div className="bcs-Versions-maxEntries" data-testid="max-versions">
-                        <FormattedMessage
-                            {...messages.versionMaxEntries}
-                            values={{
-                                maxVersions: MAX_VERSIONS,
-                            }}
-                        />
-                    </div>
-                )}
-            </LoadingIndicatorWrapper>
-        </SidebarContent>
+                        {showVersions && (
+                            <div className="bcs-Versions-menu" data-testid="bcs-Versions-menu">
+                                <VersionsMenu versions={versions} {...rest} />
+                            </div>
+                        )}
+                        {showLimit && (
+                            <div className="bcs-Versions-maxEntries" data-testid="max-versions">
+                                <FormattedMessage
+                                    {...messages.versionMaxEntries}
+                                    values={{
+                                        maxVersions: MAX_VERSIONS,
+                                    }}
+                                />
+                            </div>
+                        )}
+                    </LoadingIndicatorWrapper>
+                </SidebarContent>
+            )}
+        </Route>
     );
 };
 

package/es/elements/content-sidebar/versions/VersionsSidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"VersionsSidebar.js","names":["React","FormattedMessage","InlineError","messages","SidebarContent","VersionsMenu","BackButton","DEFAULT_FETCH_END","LoadingIndicatorWrapper","MAX_VERSIONS","VersionsSidebar","_ref","error","isLoading","parentName","versions","rest","_objectWithoutProperties","_excluded","showLimit","length","showVersions","showEmpty","showError","createElement","className","title","Fragment","to","versionsTitle","crawlerPosition","versionServerError","versionsEmpty","_extends","versionMaxEntries","values","maxVersions"],"sources":["../../../../src/elements/content-sidebar/versions/VersionsSidebar.js"],"sourcesContent":["/**\n * @flow\n * @file Versions Sidebar component\n * @author Box\n */\n\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\nimport type { MessageDescriptor } from 'react-intl';\nimport InlineError from '../../../components/inline-error';\nimport messages from './messages';\nimport SidebarContent from '../SidebarContent';\nimport VersionsMenu from './VersionsMenu';\nimport { BackButton } from '../../common/nav-button';\nimport { DEFAULT_FETCH_END } from '../../../constants';\nimport { LoadingIndicatorWrapper } from '../../../components/loading-indicator';\nimport type { BoxItemVersion } from '../../../common/types/core';\nimport './VersionsSidebar.scss';\n\nconst MAX_VERSIONS = DEFAULT_FETCH_END;\n\ntype Props = {\n    error?: MessageDescriptor,\n    fileId: string,\n    isLoading: boolean,\n    parentName: string,\n    versionCount: number,\n    versionLimit: number,\n    versions: Array<BoxItemVersion>,\n};\n\nconst VersionsSidebar = ({ error, isLoading, parentName, versions, ...rest }: Props) => {\n    const showLimit = versions.length >= MAX_VERSIONS;\n    const showVersions = !!versions.length;\n    const showEmpty = !isLoading && !showVersions;\n    const showError = !!error;\n\n    return (\n        <SidebarContent\n            className=\"bcs-Versions\"\n            data-resin-component=\"preview\"\n            data-resin-feature=\"versions\"\n            title={\n                <>\n                    <BackButton data-resin-target=\"back\" to={`/${parentName}`} />\n                    <FormattedMessage {...messages.versionsTitle} />\n                </>\n            }\n        >\n            <LoadingIndicatorWrapper className=\"bcs-Versions-content\" crawlerPosition=\"top\" isLoading={isLoading}>\n                {showError && (\n                    <InlineError title={<FormattedMessage {...messages.versionServerError} />}>\n                        <FormattedMessage {...error} />\n                    </InlineError>\n                )}\n\n                {showEmpty && (\n                    <div className=\"bcs-Versions-empty\">\n                        <FormattedMessage {...messages.versionsEmpty} />\n                    </div>\n                )}\n\n                {showVersions && (\n                    <div className=\"bcs-Versions-menu\" data-testid=\"bcs-Versions-menu\">\n                        <VersionsMenu versions={versions} {...rest} />\n                    </div>\n                )}\n                {showLimit && (\n                    <div className=\"bcs-Versions-maxEntries\" data-testid=\"max-versions\">\n                        <FormattedMessage\n                            {...messages.versionMaxEntries}\n                            values={{\n                                maxVersions: MAX_VERSIONS,\n                            }}\n                        />\n                    </div>\n                )}\n            </LoadingIndicatorWrapper>\n        </SidebarContent>\n    );\n};\n\nexport default VersionsSidebar;\n"],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA;;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,YAAY;AAE7C,OAAOC,WAAW,MAAM,kCAAkC;AAC1D,OAAOC,QAAQ,MAAM,YAAY;AACjC,OAAOC,cAAc,MAAM,mBAAmB;AAC9C,OAAOC,YAAY,MAAM,gBAAgB;AACzC,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAASC,iBAAiB,QAAQ,oBAAoB;AACtD,SAASC,uBAAuB,QAAQ,uCAAuC;AAE/E,OAAO,wBAAwB;AAE/B,MAAMC,YAAY,GAAGF,iBAAiB;AAYtC,MAAMG,eAAe,GAAGC,IAAA,IAAgE;EAAA,IAA/D;MAAEC,KAAK;MAAEC,SAAS;MAAEC,UAAU;MAAEC;IAAyB,CAAC,GAAAJ,IAAA;IAAbK,IAAI,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EACtE,MAAMC,SAAS,GAAGJ,QAAQ,CAACK,MAAM,IAAIX,YAAY;EACjD,MAAMY,YAAY,GAAG,CAAC,CAACN,QAAQ,CAACK,MAAM;EACtC,MAAME,SAAS,GAAG,CAACT,SAAS,IAAI,CAACQ,YAAY;EAC7C,MAAME,SAAS,GAAG,CAAC,CAACX,KAAK;EAEzB,oBACIZ,KAAA,CAAAwB,aAAA,CAACpB,cAAc;IACXqB,SAAS,EAAC,cAAc;IACxB,wBAAqB,SAAS;IAC9B,sBAAmB,UAAU;IAC7BC,KAAK,eACD1B,KAAA,CAAAwB,aAAA,CAAAxB,KAAA,CAAA2B,QAAA,qBACI3B,KAAA,CAAAwB,aAAA,CAAClB,UAAU;MAAC,qBAAkB,MAAM;MAACsB,EAAE,EAAE,IAAId,UAAU;IAAG,CAAE,CAAC,eAC7Dd,KAAA,CAAAwB,aAAA,CAACvB,gBAAgB,EAAKE,QAAQ,CAAC0B,aAAgB,CACjD;EACL,gBAED7B,KAAA,CAAAwB,aAAA,CAAChB,uBAAuB;IAACiB,SAAS,EAAC,sBAAsB;IAACK,eAAe,EAAC,KAAK;IAACjB,SAAS,EAAEA;EAAU,GAChGU,SAAS,iBACNvB,KAAA,CAAAwB,aAAA,CAACtB,WAAW;IAACwB,KAAK,eAAE1B,KAAA,CAAAwB,aAAA,CAACvB,gBAAgB,EAAKE,QAAQ,CAAC4B,kBAAqB;EAAE,gBACtE/B,KAAA,CAAAwB,aAAA,CAACvB,gBAAgB,EAAKW,KAAQ,CACrB,CAChB,EAEAU,SAAS,iBACNtB,KAAA,CAAAwB,aAAA;IAAKC,SAAS,EAAC;EAAoB,gBAC/BzB,KAAA,CAAAwB,aAAA,CAACvB,gBAAgB,EAAKE,QAAQ,CAAC6B,aAAgB,CAC9C,CACR,EAEAX,YAAY,iBACTrB,KAAA,CAAAwB,aAAA;IAAKC,SAAS,EAAC,mBAAmB;IAAC,eAAY;EAAmB,gBAC9DzB,KAAA,CAAAwB,aAAA,CAACnB,YAAY,EAAA4B,QAAA;IAAClB,QAAQ,EAAEA;EAAS,GAAKC,IAAI,CAAG,CAC5C,CACR,EACAG,SAAS,iBACNnB,KAAA,CAAAwB,aAAA;IAAKC,SAAS,EAAC,yBAAyB;IAAC,eAAY;EAAc,gBAC/DzB,KAAA,CAAAwB,aAAA,CAACvB,gBAAgB,EAAAgC,QAAA,KACT9B,QAAQ,CAAC+B,iBAAiB;IAC9BC,MAAM,EAAE;MACJC,WAAW,EAAE3B;IACjB;EAAE,EACL,CACA,CAEY,CACb,CAAC;AAEzB,CAAC;AAED,eAAeC,eAAe","ignoreList":[]}
+{"version":3,"file":"VersionsSidebar.js","names":["React","FormattedMessage","Route","InlineError","messages","SidebarContent","VersionsMenu","BackButton","DEFAULT_FETCH_END","LoadingIndicatorWrapper","MAX_VERSIONS","VersionsSidebar","_ref","error","isLoading","parentName","versions","rest","_objectWithoutProperties","_excluded","showLimit","length","showVersions","showEmpty","showError","createElement","history","className","title","Fragment","onClick","push","versionsTitle","crawlerPosition","versionServerError","versionsEmpty","_extends","versionMaxEntries","values","maxVersions"],"sources":["../../../../src/elements/content-sidebar/versions/VersionsSidebar.js"],"sourcesContent":["/**\n * @flow\n * @file Versions Sidebar component\n * @author Box\n */\n\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\nimport { Route } from 'react-router-dom';\nimport type { MessageDescriptor } from 'react-intl';\nimport InlineError from '../../../components/inline-error';\nimport messages from './messages';\nimport SidebarContent from '../SidebarContent';\nimport VersionsMenu from './VersionsMenu';\nimport { BackButton } from '../../common/nav-button';\nimport { DEFAULT_FETCH_END } from '../../../constants';\nimport { LoadingIndicatorWrapper } from '../../../components/loading-indicator';\nimport type { BoxItemVersion } from '../../../common/types/core';\nimport './VersionsSidebar.scss';\n\nconst MAX_VERSIONS = DEFAULT_FETCH_END;\n\ntype Props = {\n    error?: MessageDescriptor,\n    fileId: string,\n    isLoading: boolean,\n    parentName: string,\n    versionCount: number,\n    versionLimit: number,\n    versions: Array<BoxItemVersion>,\n};\n\nconst VersionsSidebar = ({ error, isLoading, parentName, versions, ...rest }: Props) => {\n    const showLimit = versions.length >= MAX_VERSIONS;\n    const showVersions = !!versions.length;\n    const showEmpty = !isLoading && !showVersions;\n    const showError = !!error;\n\n    return (\n        <Route>\n            {({ history }) => (\n                <SidebarContent\n                    className=\"bcs-Versions\"\n                    data-resin-component=\"preview\"\n                    data-resin-feature=\"versions\"\n                    title={\n                        <>\n                            <BackButton data-resin-target=\"back\" onClick={() => history.push(`/${parentName}`)} />\n                            <FormattedMessage {...messages.versionsTitle} />\n                        </>\n                    }\n                >\n                    <LoadingIndicatorWrapper\n                        className=\"bcs-Versions-content\"\n                        crawlerPosition=\"top\"\n                        isLoading={isLoading}\n                    >\n                        {showError && (\n                            <InlineError title={<FormattedMessage {...messages.versionServerError} />}>\n                                <FormattedMessage {...error} />\n                            </InlineError>\n                        )}\n\n                        {showEmpty && (\n                            <div className=\"bcs-Versions-empty\">\n                                <FormattedMessage {...messages.versionsEmpty} />\n                            </div>\n                        )}\n\n                        {showVersions && (\n                            <div className=\"bcs-Versions-menu\" data-testid=\"bcs-Versions-menu\">\n                                <VersionsMenu versions={versions} {...rest} />\n                            </div>\n                        )}\n                        {showLimit && (\n                            <div className=\"bcs-Versions-maxEntries\" data-testid=\"max-versions\">\n                                <FormattedMessage\n                                    {...messages.versionMaxEntries}\n                                    values={{\n                                        maxVersions: MAX_VERSIONS,\n                                    }}\n                                />\n                            </div>\n                        )}\n                    </LoadingIndicatorWrapper>\n                </SidebarContent>\n            )}\n        </Route>\n    );\n};\n\nexport default VersionsSidebar;\n"],"mappings":"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","ignoreList":[]}

package/es/src/test-utils/testing-library.d.ts

@@ -3,5 +3,6 @@ type RenderConnectedOptions = RenderOptions & {
     wrapperProps?: Record<string, unknown>;
 };
 declare const renderConnected: (element: any, options?: RenderConnectedOptions) => import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;
+declare const createUserEvent: () => import("@testing-library/user-event").UserEvent;
 export * from '@testing-library/react';
-export { renderConnected as render };
+export { renderConnected as render, createUserEvent as userEvent };

package/es/test-utils/testing-library.js

@@ -6,6 +6,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React from 'react';
 import { render } from '@testing-library/react';
+import userEventInit from '@testing-library/user-event';
 
 // Data Providers
 import { TooltipProvider } from '@box/blueprint-web';
@@ -23,6 +24,8 @@ const Wrapper = ({
 const renderConnected = (element, options = {}) => render(element, _objectSpread({
   wrapper: options.wrapper ? options.wrapper : props => /*#__PURE__*/React.createElement(Wrapper, _extends({}, props, options.wrapperProps))
 }, options));
+const createUserEvent = () => userEventInit.setup(); // factory function to create isolated userEvent instances
+
 export * from '@testing-library/react';
-export { renderConnected as render };
+export { renderConnected as render, createUserEvent as userEvent };
 //# sourceMappingURL=testing-library.js.map

package/es/test-utils/testing-library.js.map

@@ -1 +1 @@
-{"version":3,"file":"testing-library.js","names":["React","render","TooltipProvider","IntlProvider","FeatureProvider","jest","unmock","Wrapper","children","features","createElement","locale","renderConnected","element","options","_objectSpread","wrapper","props","_extends","wrapperProps"],"sources":["../../src/test-utils/testing-library.tsx"],"sourcesContent":["import React from 'react';\nimport { render, type RenderOptions } from '@testing-library/react';\n\n// Data Providers\nimport { TooltipProvider } from '@box/blueprint-web';\nimport { IntlProvider } from 'react-intl';\nimport { FeatureProvider } from '../elements/common/feature-checking';\n\njest.unmock('react-intl');\n\nconst Wrapper = ({ children, features = {} }) => (\n    <FeatureProvider features={features}>\n        <TooltipProvider>\n            <IntlProvider locale=\"en\">{children}</IntlProvider>\n        </TooltipProvider>\n    </FeatureProvider>\n);\n\ntype RenderConnectedOptions = RenderOptions & {\n    wrapperProps?: Record<string, unknown>;\n};\n\nconst renderConnected = (element, options: RenderConnectedOptions = {}) =>\n    render(element, {\n        wrapper: options.wrapper ? options.wrapper : props => <Wrapper {...props} {...options.wrapperProps} />,\n        ...options,\n    });\n\nexport * from '@testing-library/react';\nexport { renderConnected as render };\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,QAA4B,wBAAwB;;AAEnE;AACA,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,YAAY,QAAQ,YAAY;AACzC,SAASC,eAAe,QAAQ,qCAAqC;AAErEC,IAAI,CAACC,MAAM,CAAC,YAAY,CAAC;AAEzB,MAAMC,OAAO,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,QAAQ,GAAG,CAAC;AAAE,CAAC,kBACxCT,KAAA,CAAAU,aAAA,CAACN,eAAe;EAACK,QAAQ,EAAEA;AAAS,gBAChCT,KAAA,CAAAU,aAAA,CAACR,eAAe,qBACZF,KAAA,CAAAU,aAAA,CAACP,YAAY;EAACQ,MAAM,EAAC;AAAI,GAAEH,QAAuB,CACrC,CACJ,CACpB;AAMD,MAAMI,eAAe,GAAGA,CAACC,OAAO,EAAEC,OAA+B,GAAG,CAAC,CAAC,KAClEb,MAAM,CAACY,OAAO,EAAAE,aAAA;EACVC,OAAO,EAAEF,OAAO,CAACE,OAAO,GAAGF,OAAO,CAACE,OAAO,GAAGC,KAAK,iBAAIjB,KAAA,CAAAU,aAAA,CAACH,OAAO,EAAAW,QAAA,KAAKD,KAAK,EAAMH,OAAO,CAACK,YAAY,CAAG;AAAC,GACnGL,OAAO,CACb,CAAC;AAEN,cAAc,wBAAwB;AACtC,SAASF,eAAe,IAAIX,MAAM","ignoreList":[]}
+{"version":3,"file":"testing-library.js","names":["React","render","userEventInit","TooltipProvider","IntlProvider","FeatureProvider","jest","unmock","Wrapper","children","features","createElement","locale","renderConnected","element","options","_objectSpread","wrapper","props","_extends","wrapperProps","createUserEvent","setup","userEvent"],"sources":["../../src/test-utils/testing-library.tsx"],"sourcesContent":["import React from 'react';\nimport { render, type RenderOptions } from '@testing-library/react';\nimport userEventInit from '@testing-library/user-event';\n\n// Data Providers\nimport { TooltipProvider } from '@box/blueprint-web';\nimport { IntlProvider } from 'react-intl';\nimport { FeatureProvider } from '../elements/common/feature-checking';\n\njest.unmock('react-intl');\n\nconst Wrapper = ({ children, features = {} }) => (\n    <FeatureProvider features={features}>\n        <TooltipProvider>\n            <IntlProvider locale=\"en\">{children}</IntlProvider>\n        </TooltipProvider>\n    </FeatureProvider>\n);\n\ntype RenderConnectedOptions = RenderOptions & {\n    wrapperProps?: Record<string, unknown>;\n};\n\nconst renderConnected = (element, options: RenderConnectedOptions = {}) =>\n    render(element, {\n        wrapper: options.wrapper ? options.wrapper : props => <Wrapper {...props} {...options.wrapperProps} />,\n        ...options,\n    });\n\nconst createUserEvent = () => userEventInit.setup(); // factory function to create isolated userEvent instances\n\nexport * from '@testing-library/react';\nexport { renderConnected as render, createUserEvent as userEvent };\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,QAA4B,wBAAwB;AACnE,OAAOC,aAAa,MAAM,6BAA6B;;AAEvD;AACA,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,YAAY,QAAQ,YAAY;AACzC,SAASC,eAAe,QAAQ,qCAAqC;AAErEC,IAAI,CAACC,MAAM,CAAC,YAAY,CAAC;AAEzB,MAAMC,OAAO,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,QAAQ,GAAG,CAAC;AAAE,CAAC,kBACxCV,KAAA,CAAAW,aAAA,CAACN,eAAe;EAACK,QAAQ,EAAEA;AAAS,gBAChCV,KAAA,CAAAW,aAAA,CAACR,eAAe,qBACZH,KAAA,CAAAW,aAAA,CAACP,YAAY;EAACQ,MAAM,EAAC;AAAI,GAAEH,QAAuB,CACrC,CACJ,CACpB;AAMD,MAAMI,eAAe,GAAGA,CAACC,OAAO,EAAEC,OAA+B,GAAG,CAAC,CAAC,KAClEd,MAAM,CAACa,OAAO,EAAAE,aAAA;EACVC,OAAO,EAAEF,OAAO,CAACE,OAAO,GAAGF,OAAO,CAACE,OAAO,GAAGC,KAAK,iBAAIlB,KAAA,CAAAW,aAAA,CAACH,OAAO,EAAAW,QAAA,KAAKD,KAAK,EAAMH,OAAO,CAACK,YAAY,CAAG;AAAC,GACnGL,OAAO,CACb,CAAC;AAEN,MAAMM,eAAe,GAAGA,CAAA,KAAMnB,aAAa,CAACoB,KAAK,CAAC,CAAC,CAAC,CAAC;;AAErD,cAAc,wBAAwB;AACtC,SAAST,eAAe,IAAIZ,MAAM,EAAEoB,eAAe,IAAIE,SAAS","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "box-ui-elements",
-    "version": "23.4.0-beta.16",
+    "version": "23.4.0-beta.18",
     "description": "Box UI Elements",
     "author": "Box (https://www.box.com/)",
     "license": "SEE LICENSE IN LICENSE",
@@ -137,7 +137,7 @@
         "@box/frontend": "^11.0.1",
         "@box/item-icon": "^0.9.83",
         "@box/languages": "^1.0.0",
-        "@box/metadata-editor": "^0.112.0",
+        "@box/metadata-editor": "^0.115.0",
         "@box/react-virtualized": "9.22.3-rc-box.9",
         "@cfaester/enzyme-adapter-react-18": "^0.8.0",
         "@chromatic-com/storybook": "^1.6.1",
@@ -306,7 +306,7 @@
         "@box/cldr-data": ">=34.2.0",
         "@box/combobox-with-api": "^0.34.9",
         "@box/item-icon": "^0.9.83",
-        "@box/metadata-editor": "^0.112.0",
+        "@box/metadata-editor": "^0.115.0",
         "@box/react-virtualized": "9.22.3-rc-box.9",
         "@hapi/address": "^2.1.4",
         "axios": "^0.30.0",

package/src/elements/common/nav-button/BackButton.js

@@ -7,7 +7,6 @@
 import * as React from 'react';
 import classNames from 'classnames';
 import { FormattedMessage } from 'react-intl';
-import { Route, type Location } from 'react-router-dom';
 import IconNavigateLeft from '../../../icons/general/IconNavigateLeft';
 import messages from '../messages';
 import PlainButton from '../../../components/plain-button';
@@ -15,25 +14,16 @@ import './BackButton.scss';
 
 type Props = {
     className?: string,
-    to?: Location,
+    onClick: () => void,
 };
 
-const BackButton = ({ className, to, ...rest }: Props) => (
-    <Route>
-        {({ history }) => (
-            <PlainButton
-                className={classNames('bdl-BackButton', className)}
-                onClick={() => (to ? history.push(to) : history.goBack())}
-                type="button"
-                {...rest}
-            >
-                <IconNavigateLeft height={24} width={24} />
-                <span className="accessibility-hidden">
-                    <FormattedMessage {...messages.back} />
-                </span>
-            </PlainButton>
-        )}
-    </Route>
+const BackButton = ({ className, onClick, ...rest }: Props) => (
+    <PlainButton className={classNames('bdl-BackButton', className)} onClick={onClick} type="button" {...rest}>
+        <IconNavigateLeft height={24} width={24} />
+        <span className="accessibility-hidden">
+            <FormattedMessage {...messages.back} />
+        </span>
+    </PlainButton>
 );
 
 export default BackButton;

package/src/elements/common/nav-button/__tests__/BackButton.test.js

@@ -1,43 +1,52 @@
 import * as React from 'react';
-import { MemoryRouter, Router } from 'react-router-dom';
-import { mount } from 'enzyme';
+import { render, screen, userEvent } from '../../../../test-utils/testing-library';
 import { BackButton } from '..';
 
 describe('elements/common/nav-button/BackButton', () => {
-    const getWrapper = (props = {}) =>
-        mount(
-            <MemoryRouter initialEntries={['/start', '/test']}>
-                <BackButton {...props} />
-            </MemoryRouter>,
-        );
-    const getHistory = wrapper => wrapper.find(Router).prop('history');
-
-    test('should match its snapshot', () => {
-        const wrapper = getWrapper();
-        const button = wrapper.find(BackButton).first();
-
-        expect(button).toMatchSnapshot();
+    const mockOnClick = jest.fn();
+
+    beforeEach(() => {
+        mockOnClick.mockClear();
     });
 
-    test('should call history back on click if no path is defined', () => {
-        const wrapper = getWrapper();
-        const history = getHistory(wrapper);
+    test('should render back button with navigation icon and accessible text', () => {
+        render(<BackButton onClick={mockOnClick} />);
 
-        history.goBack = jest.fn();
+        const button = screen.getByRole('button');
+        expect(button).toBeInTheDocument();
+        expect(button).toHaveClass('bdl-BackButton');
 
-        wrapper.simulate('click');
+        expect(screen.getByText('Back')).toBeInTheDocument();
 
-        expect(history.goBack).toHaveBeenCalled();
+        const icon = button.querySelector('svg');
+        expect(icon).toBeInTheDocument();
+        expect(icon).toHaveClass('icon-navigate-left');
     });
 
-    test('should call history.push on click if a path is defined', () => {
-        const wrapper = getWrapper({ to: '/new' });
-        const history = getHistory(wrapper);
+    test('should call onClick handler when clicked', async () => {
+        const user = userEvent();
+
+        render(<BackButton onClick={mockOnClick} />);
 
-        history.push = jest.fn();
+        const button = screen.getByRole('button');
+        await user.click(button);
+
+        expect(mockOnClick).toHaveBeenCalledTimes(1);
+    });
+
+    test('should pass through additional props', () => {
+        render(<BackButton onClick={mockOnClick} data-testid="test-back-button" data-resin-target="back" />);
+
+        const button = screen.getByTestId('test-back-button');
+        expect(button).toBeInTheDocument();
+        expect(button).toHaveAttribute('data-resin-target', 'back');
+    });
 
-        wrapper.simulate('click');
+    test('should apply custom className alongside default class', () => {
+        render(<BackButton onClick={mockOnClick} className="custom-class" />);
 
-        expect(history.push).toHaveBeenCalledWith('/new');
+        const button = screen.getByRole('button');
+        expect(button).toHaveClass('bdl-BackButton');
+        expect(button).toHaveClass('custom-class');
     });
 });

package/{es/elements/common/types/SidebarNavigation.flow.js.flow → src/elements/common/types/SidebarNavigation.js.flow}

@@ -1,5 +1,8 @@
 /* @flow */
 
+// flow version is simplified compared to Type Script due to difficult to resolve problems with Union Types
+// Type Script works better with Union Types
+
 export const ViewType = Object.freeze({
     BOXAI: 'boxai',
     SKILLS: 'skills',
@@ -18,30 +21,13 @@ export const FeedEntryType = Object.freeze({
 export type ViewTypeValues = $Values<typeof ViewType>;
 export type FeedEntryTypeValues = $Values<typeof FeedEntryType>;
 
-type VersionSidebarView = {
-    sidebar: 'activity' | 'details',
-    versionId: string,
-};
-
-export type ActivityAnnotationsSidebarView = {
-    sidebar: 'activity',
-    activeFeedEntryType: 'annotations',
-    fileVersionId: string,
-    activeFeedEntryId: string,
+export type SidebarNavigation = {
+    sidebar: ViewTypeValues,
+    versionId?: string,
+    activeFeedEntryType?: FeedEntryTypeValues,
+    activeFeedEntryId?: string,
+    fileVersionId?: string,
 };
-type ActivityCommentsSidebarView = {
-    sidebar: 'activity',
-    activeFeedEntryType: 'comments' | 'tasks',
-    activeFeedEntryId: string,
-};
-
-export type SidebarNavigation =
-    | {|
-          sidebar: ViewTypeValues,
-      |}
-    | VersionSidebarView
-    | ActivityCommentsSidebarView
-    | ActivityAnnotationsSidebarView;
 
 export type InternalSidebarNavigation = SidebarNavigation & {
     open: boolean,

package/src/elements/content-sidebar/versions/StaticVersionSidebar.js

@@ -6,6 +6,7 @@
 
 import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
+import { Route } from 'react-router-dom';
 
 import BoxDrive140 from '../../../illustration/BoxDrive140';
 
@@ -45,51 +46,55 @@ const StaticVersionsSidebar = ({ isLoading, onUpgradeClick, parentName }: Props)
     });
 
     return (
-        <div
-            className="bcs-StaticVersionSidebar"
-            role="tabpanel"
-            data-resin-component="preview"
-            data-resin-feature="versions"
-        >
-            <div className="bcs-StaticVersionSidebar-header">
-                <h3 className="bcs-StaticVersionSidebar-title">
-                    <>
-                        <BackButton data-resin-target="back" to={`/${parentName}`} />
-                        <FormattedMessage {...messages.versionsTitle} />
-                    </>
-                </h3>
-            </div>
-
-            <div className="bcs-StaticVersionSidebar-content-wrapper">
-                <LoadingIndicatorWrapper
-                    className="bcs-StaticVersionSidebar-content"
-                    crawlerPosition="top"
-                    isLoading={isLoading}
+        <Route>
+            {({ history }) => (
+                <div
+                    className="bcs-StaticVersionSidebar"
+                    role="tabpanel"
+                    data-resin-component="preview"
+                    data-resin-feature="versions"
                 >
-                    <VersionsMenu versions={versions} fileId="1" versionCount={3} versionLimit={3} />
-                </LoadingIndicatorWrapper>
-            </div>
+                    <div className="bcs-StaticVersionSidebar-header">
+                        <h3 className="bcs-StaticVersionSidebar-title">
+                            <>
+                                <BackButton data-resin-target="back" onClick={() => history.push(`/${parentName}`)} />
+                                <FormattedMessage {...messages.versionsTitle} />
+                            </>
+                        </h3>
+                    </div>
+
+                    <div className="bcs-StaticVersionSidebar-content-wrapper">
+                        <LoadingIndicatorWrapper
+                            className="bcs-StaticVersionSidebar-content"
+                            crawlerPosition="top"
+                            isLoading={isLoading}
+                        >
+                            <VersionsMenu versions={versions} fileId="1" versionCount={3} versionLimit={3} />
+                        </LoadingIndicatorWrapper>
+                    </div>
 
-            <div className="bcs-StaticVersionSidebar-upsell-wrapper">
-                <div className="bcs-StaticVersionSidebar-upsell">
-                    <BoxDrive140 className="bcs-StaticVersionSidebar-upsell-icon" />
-                    <p className="bcs-StaticVersionSidebar-upsell-header">
-                        <FormattedMessage {...messages.versionUpgradeLink} />
-                    </p>
-                    <p>
-                        <FormattedMessage {...messages.versionUpsell} />
-                    </p>
-                    <PrimaryButton
-                        className="bcs-StaticVersionSidebar-upsell-button"
-                        data-resin-target="versioning_error_upgrade_cta"
-                        onClick={onUpgradeClick}
-                        type="button"
-                    >
-                        <FormattedMessage {...messages.upgradeButton} />
-                    </PrimaryButton>
+                    <div className="bcs-StaticVersionSidebar-upsell-wrapper">
+                        <div className="bcs-StaticVersionSidebar-upsell">
+                            <BoxDrive140 className="bcs-StaticVersionSidebar-upsell-icon" />
+                            <p className="bcs-StaticVersionSidebar-upsell-header">
+                                <FormattedMessage {...messages.versionUpgradeLink} />
+                            </p>
+                            <p>
+                                <FormattedMessage {...messages.versionUpsell} />
+                            </p>
+                            <PrimaryButton
+                                className="bcs-StaticVersionSidebar-upsell-button"
+                                data-resin-target="versioning_error_upgrade_cta"
+                                onClick={onUpgradeClick}
+                                type="button"
+                            >
+                                <FormattedMessage {...messages.upgradeButton} />
+                            </PrimaryButton>
+                        </div>
+                    </div>
                 </div>
-            </div>
-        </div>
+            )}
+        </Route>
     );
 };
 

package/src/elements/content-sidebar/versions/VersionsGroup.js

@@ -7,11 +7,14 @@
 import * as React from 'react';
 import VersionsList from './VersionsList';
 import type { BoxItemVersion } from '../../../common/types/core';
+import type { InternalSidebarNavigation } from '../../common/types/SidebarNavigation';
 import './VersionsGroup.scss';
 
 type Props = {
     fileId: string,
     heading: string,
+    internalSidebarNavigation?: InternalSidebarNavigation,
+    routerDisabled?: boolean,
     versionCount: number,
     versionLimit: number,
     versions: Array<BoxItemVersion>,

package/src/elements/content-sidebar/versions/VersionsList.js

@@ -8,33 +8,51 @@ import * as React from 'react';
 import { Route } from 'react-router-dom';
 import VersionsItem from './VersionsItem';
 import type { BoxItemVersion } from '../../../common/types/core';
+import type { InternalSidebarNavigation } from '../../common/types/SidebarNavigation';
 import './VersionsList.scss';
 
 type Props = {
     currentId?: string,
     fileId: string,
+    internalSidebarNavigation?: InternalSidebarNavigation,
+    routerDisabled?: boolean,
     versionCount: number,
     versionLimit: number,
     versions: Array<BoxItemVersion>,
 };
 
-const VersionsList = ({ currentId, versions, ...rest }: Props) => (
-    <ul className="bcs-VersionsList">
-        {versions.map(version => (
-            <li className="bcs-VersionsList-item" key={version.id}>
-                <Route
-                    render={({ match }) => (
-                        <VersionsItem
-                            isCurrent={currentId === version.id}
-                            isSelected={match.params.versionId === version.id}
-                            version={version}
-                            {...rest}
-                        />
-                    )}
+const VersionsList = ({ currentId, internalSidebarNavigation, routerDisabled = false, versions, ...rest }: Props) => {
+    const renderVersionItemWithoutRouter = (version: BoxItemVersion) => (
+        <VersionsItem
+            isCurrent={currentId === version.id}
+            isSelected={internalSidebarNavigation?.versionId === version.id}
+            version={version}
+            {...rest}
+        />
+    );
+
+    const renderVersionItemWithRouter = (version: BoxItemVersion) => (
+        <Route
+            render={({ match }) => (
+                <VersionsItem
+                    isCurrent={currentId === version.id}
+                    isSelected={match.params.versionId === version.id}
+                    version={version}
+                    {...rest}
                 />
-            </li>
-        ))}
-    </ul>
-);
+            )}
+        />
+    );
+
+    return (
+        <ul className="bcs-VersionsList">
+            {versions.map(version => (
+                <li className="bcs-VersionsList-item" key={version.id}>
+                    {routerDisabled ? renderVersionItemWithoutRouter(version) : renderVersionItemWithRouter(version)}
+                </li>
+            ))}
+        </ul>
+    );
+};
 
 export default VersionsList;

package/src/elements/content-sidebar/versions/VersionsMenu.js

@@ -11,11 +11,14 @@ import * as util from '../../../utils/datetime';
 import messages from './messages';
 import VersionsGroup from './VersionsGroup';
 import type { BoxItemVersion } from '../../../common/types/core';
+import type { InternalSidebarNavigation } from '../../common/types/SidebarNavigation';
 import './VersionsMenu.scss';
 
 type Props = {
     fileId: string,
     intl: any,
+    internalSidebarNavigation?: InternalSidebarNavigation,
+    routerDisabled?: boolean,
     versionCount: number,
     versionLimit: number,
     versions: Array<BoxItemVersion>,