box-ui-elements 23.4.0-beta.17 → 23.4.0-beta.19

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

@@ -1,23 +1,148 @@
 import * as React from 'react';
-import { shallow } from 'enzyme/build';
+import { MemoryRouter, Route } from 'react-router-dom';
+import { render, screen } from '../../../../test-utils/testing-library';
 import VersionsList from '../VersionsList';
 
+jest.mock('../VersionsItem', () => {
+    const MockVersionsItem = jest.fn(({ isCurrent, isSelected, version, fileId, versionCount, versionLimit }) => (
+        <div data-testid={`versions-item-${version.id}`}>
+            <span>Version {version.id}</span>
+            {isCurrent && <span>Current</span>}
+            {isSelected && <span>Selected</span>}
+            {fileId && <span>FileID: {fileId}</span>}
+            {versionCount && <span>VersionCount: {versionCount}</span>}
+            {versionLimit && <span>VersionLimit: {versionLimit}</span>}
+        </div>
+    ));
+    return MockVersionsItem;
+});
+
 describe('elements/content-sidebar/versions/VersionsList', () => {
-    const getWrapper = (props = {}) => shallow(<VersionsList {...props} />);
+    beforeEach(() => {
+        jest.clearAllMocks();
+    });
+
+    const renderComponent = (props = {}, routePath = '/activity/versions/12345') => {
+        if (props.routerDisabled) {
+            return render(<VersionsList {...props} />);
+        }
+
+        return render(
+            <MemoryRouter initialEntries={[routePath]}>
+                <Route path="/:sidebar(activity|details)/versions/:versionId?">
+                    <VersionsList {...props} />
+                </Route>
+            </MemoryRouter>,
+        );
+    };
 
     describe('render', () => {
-        test.each`
-            versions
-            ${[]}
-            ${[{ id: '12345' }]}
-            ${[{ id: '12345' }, { id: '45678' }]}
-        `('should match its snapshot', ({ versions }) => {
-            const match = {
-                params: { versionId: '12345' },
-                path: '/versions/:versionId',
+        test('should render empty list when no versions provided', () => {
+            renderComponent({ versions: [] });
+            const list = screen.getByRole('list');
+            const listItems = screen.queryAllByRole('listitem');
+
+            expect(list).toBeInTheDocument();
+            expect(listItems).toHaveLength(0);
+        });
+
+        test('should render single version item', () => {
+            const versions = [{ id: '12345' }];
+            renderComponent({ versions });
+            const list = screen.getByRole('list');
+            const listItems = screen.getAllByRole('listitem');
+
+            expect(list).toBeInTheDocument();
+            expect(listItems).toHaveLength(1);
+            expect(screen.getByText('Version 12345')).toBeInTheDocument();
+        });
+
+        test('should render multiple version items', () => {
+            const versions = [{ id: '12345' }, { id: '45678' }];
+            renderComponent({ versions });
+            const list = screen.getByRole('list');
+            const listItems = screen.getAllByRole('listitem');
+
+            expect(list).toBeInTheDocument();
+            expect(listItems).toHaveLength(2);
+            expect(screen.getByText('Version 12345')).toBeInTheDocument();
+            expect(screen.getByText('Version 45678')).toBeInTheDocument();
+        });
+
+        test('should pass correct isCurrent prop based on currentId', () => {
+            const versions = [{ id: '12345' }, { id: '67890' }];
+            const currentId = '12345';
+            renderComponent({ versions, currentId, routerDisabled: true });
+
+            // Version 12345 should be marked as current
+            const version12345Container = screen.getByTestId('versions-item-12345');
+            expect(version12345Container).toBeInTheDocument();
+            expect(screen.getByText('Current')).toBeInTheDocument();
+
+            // Only one "Current" text should exist
+            expect(screen.getAllByText('Current')).toHaveLength(1);
+        });
+
+        test('should use router selection when routerDisabled is false', () => {
+            const versions = [{ id: '12345' }, { id: '67890' }];
+            renderComponent({ versions, routerDisabled: false }, '/activity/versions/12345');
+
+            // Version 12345 should be marked as selected based on route
+            const version12345Container = screen.getByTestId('versions-item-12345');
+            expect(version12345Container).toBeInTheDocument();
+            expect(version12345Container).toHaveTextContent('Selected');
+            expect(screen.getAllByText('Selected')).toHaveLength(1);
+        });
+
+        test('should use internalSidebarNavigation selection when routerDisabled is true', () => {
+            const versions = [{ id: '12345' }, { id: '67890' }];
+            const internalSidebarNavigation = { versionId: '67890', open: true };
+
+            renderComponent({
+                versions,
+                routerDisabled: true,
+                internalSidebarNavigation,
+            });
+
+            // Version 67890 should be marked as selected based on internal navigation
+            const version67890Container = screen.getByTestId('versions-item-67890');
+            expect(version67890Container).toBeInTheDocument();
+            expect(version67890Container).toHaveTextContent('Selected');
+            expect(screen.getAllByText('Selected')).toHaveLength(1);
+        });
+
+        test('should handle no selection when internalSidebarNavigation is not provided', () => {
+            const versions = [{ id: '12345' }, { id: '67890' }];
+
+            renderComponent({ versions, routerDisabled: true });
+
+            // No version should be selected
+            expect(screen.queryByText('Selected')).not.toBeInTheDocument();
+        });
+
+        test('should render items with correct version IDs', () => {
+            const versions = [{ id: 'version-abc' }, { id: 'version-xyz' }];
+
+            renderComponent({ versions, routerDisabled: true });
+
+            expect(screen.getByText('Version version-abc')).toBeInTheDocument();
+            expect(screen.getByText('Version version-xyz')).toBeInTheDocument();
+        });
+
+        test('should pass down other props to VersionsItem', () => {
+            const versions = [{ id: '12345' }];
+            const props = {
+                versions,
+                fileId: 'f_123',
+                versionCount: 10,
+                versionLimit: 100,
+                routerDisabled: true,
             };
-            const wrapper = getWrapper({ match, versions });
-            expect(wrapper).toMatchSnapshot();
+            renderComponent(props);
+
+            expect(screen.getByText('FileID: f_123')).toBeInTheDocument();
+            expect(screen.getByText('VersionCount: 10')).toBeInTheDocument();
+            expect(screen.getByText('VersionLimit: 100')).toBeInTheDocument();
         });
     });
 });

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

@@ -1,10 +1,35 @@
 import * as React from 'react';
-import { IntlProvider } from 'react-intl';
-import messages from '../messages';
-import VersionsGroup from '../VersionsGroup';
+import { render, screen } from '../../../../test-utils/testing-library';
 import VersionsMenu from '../VersionsMenu';
 
-jest.unmock('react-intl');
+jest.mock('../VersionsGroup', () => {
+    const MockVersionsGroup = jest.fn(
+        ({
+            heading,
+            versions,
+            fileId,
+            versionCount,
+            versionLimit,
+            currentId,
+            routerDisabled,
+            internalSidebarNavigation,
+        }) => (
+            <div>
+                <h1>{heading}</h1>
+                <span>{versions.length} versions</span>
+                {fileId && <span data-testid="fileId">{fileId}</span>}
+                {versionCount !== undefined && <span data-testid="versionCount">{versionCount}</span>}
+                {versionLimit !== undefined && <span data-testid="versionLimit">{versionLimit}</span>}
+                {currentId && <span data-testid="currentId">{currentId}</span>}
+                {routerDisabled !== undefined && <span data-testid="routerDisabled">{String(routerDisabled)}</span>}
+                {internalSidebarNavigation && (
+                    <span data-testid="internalSidebarNavigation">{JSON.stringify(internalSidebarNavigation)}</span>
+                )}
+            </div>
+        ),
+    );
+    return MockVersionsGroup;
+});
 
 describe('elements/content-sidebar/versions/VersionsMenu', () => {
     const defaultDate = '2019-06-20T20:00:00.000Z';
@@ -17,15 +42,11 @@ describe('elements/content-sidebar/versions/VersionsMenu', () => {
         modified_by: { name: 'Test User', id: '098765' },
     };
     const getVersion = (overrides = {}) => ({ ...defaultVersion, ...overrides });
-    const getWrapper = (props = {}) =>
-        shallow(<VersionsMenu {...props} />, {
-            wrappingComponent: wrapperProps => <IntlProvider locale="en" messages={messages} {...wrapperProps} />,
-        })
-            .shallow() // <Memo .../>
-            .dive(); // <ul .../>
+    const renderComponent = (props = {}) => render(<VersionsMenu {...props} />);
     const GlobalDate = Date;
 
     beforeEach(() => {
+        jest.clearAllMocks();
         global.Date = jest.fn(date => new GlobalDate(date || defaultDate));
         global.Date.now = () => defaultDateMs;
     });
@@ -48,20 +69,51 @@ describe('elements/content-sidebar/versions/VersionsMenu', () => {
                 getVersion({ created_at: '2019-02-01T20:00:00.000Z', id: '2' }),
                 getVersion({ created_at: '2018-05-01T20:00:00.000Z', id: '1' }),
             ];
-            const wrapper = getWrapper({ versions });
-            const groups = wrapper.find(VersionsGroup);
+            renderComponent({ versions });
+            const headings = [
+                'Today',
+                'Yesterday',
+                'Tuesday',
+                'Monday',
+                'Last Week',
+                'This Month',
+                'May',
+                'February',
+                '2018',
+            ];
+            const versionCounts = [2, 1, 1, 1, 1, 1, 1, 1, 1];
+
+            expect(screen.getAllByRole('heading', { level: 1 })).toHaveLength(9);
+
+            headings.forEach((heading, index) => {
+                const headingElement = screen.getByText(heading);
+                const groupContainer = headingElement.parentElement;
+
+                expect(groupContainer).toHaveTextContent(`${versionCounts[index]} versions`);
+            });
+        });
+
+        test('should pass down other props to VersionsGroup', () => {
+            const versions = [getVersion({ id: '10' })];
+            const props = {
+                versions,
+                fileId: 'f_123',
+                versionCount: 10,
+                versionLimit: 100,
+                currentId: '10',
+                routerDisabled: false,
+                internalSidebarNavigation: { open: false, sidebar: 'activity' },
+            };
+            renderComponent(props);
 
-            expect(groups.length).toBe(9);
-            expect(groups.at(0).prop('versions').length).toBe(2); // Multiple versions collapse into a group
-            expect(groups.at(0).prop('heading')).toBe('Today');
-            expect(groups.at(1).prop('heading')).toBe('Yesterday');
-            expect(groups.at(2).prop('heading')).toBe('Tuesday');
-            expect(groups.at(3).prop('heading')).toBe('Monday');
-            expect(groups.at(4).prop('heading')).toBe('Last Week');
-            expect(groups.at(5).prop('heading')).toBe('This Month');
-            expect(groups.at(6).prop('heading')).toBe('May');
-            expect(groups.at(7).prop('heading')).toBe('February');
-            expect(groups.at(8).prop('heading')).toBe('2018');
+            expect(screen.getByTestId('fileId')).toHaveTextContent('f_123');
+            expect(screen.getByTestId('versionCount')).toHaveTextContent('10');
+            expect(screen.getByTestId('versionLimit')).toHaveTextContent('100');
+            expect(screen.getByTestId('currentId')).toHaveTextContent('10');
+            expect(screen.getByTestId('routerDisabled')).toHaveTextContent('false');
+            expect(screen.getByTestId('internalSidebarNavigation')).toHaveTextContent(
+                JSON.stringify(props.internalSidebarNavigation),
+            );
         });
     });
 });

package/src/elements/content-sidebar/versions/__tests__/VersionsSidebar.test.js

@@ -4,13 +4,11 @@ import { render, screen, userEvent } from '../../../../test-utils/testing-librar
 import messages from '../messages';
 import VersionsSidebar from '../VersionsSidebar';
 
-jest.mock('../../../common/nav-button', () => ({
-    BackButton: ({ onClick, 'data-resin-target': dataResinTarget }) => (
-        <button type="button" onClick={onClick} data-resin-target={dataResinTarget} data-testid="back-button">
-            Back
-        </button>
-    ),
-}));
+jest.mock('../../../common/back-button', () => ({ onClick, 'data-resin-target': dataResinTarget }) => (
+    <button type="button" onClick={onClick} data-resin-target={dataResinTarget} data-testid="back-button">
+        Back
+    </button>
+));
 
 jest.mock('../VersionsMenu', () => ({ versions, fileId, versionCount, versionLimit }) => (
     <div data-testid="versions-menu">

package/es/elements/common/nav-button/BackButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BackButton.js","names":["React","classNames","FormattedMessage","IconNavigateLeft","messages","PlainButton","BackButton","_ref","className","onClick","rest","_objectWithoutProperties","_excluded","createElement","_extends","type","height","width","back"],"sources":["../../../../src/elements/common/nav-button/BackButton.js"],"sourcesContent":["/**\n * @flow\n * @file Back Button component\n * @author Box\n */\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { FormattedMessage } from 'react-intl';\nimport IconNavigateLeft from '../../../icons/general/IconNavigateLeft';\nimport messages from '../messages';\nimport PlainButton from '../../../components/plain-button';\nimport './BackButton.scss';\n\ntype Props = {\n    className?: string,\n    onClick: () => void,\n};\n\nconst BackButton = ({ className, onClick, ...rest }: Props) => (\n    <PlainButton className={classNames('bdl-BackButton', className)} onClick={onClick} type=\"button\" {...rest}>\n        <IconNavigateLeft height={24} width={24} />\n        <span className=\"accessibility-hidden\">\n            <FormattedMessage {...messages.back} />\n        </span>\n    </PlainButton>\n);\n\nexport default BackButton;\n"],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA;;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,gBAAgB,QAAQ,YAAY;AAC7C,OAAOC,gBAAgB,MAAM,yCAAyC;AACtE,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,WAAW,MAAM,kCAAkC;AAC1D,OAAO,mBAAmB;AAO1B,MAAMC,UAAU,GAAGC,IAAA;EAAA,IAAC;MAAEC,SAAS;MAAEC;IAAwB,CAAC,GAAAF,IAAA;IAAbG,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAAA,oBAC7CZ,KAAA,CAAAa,aAAA,CAACR,WAAW,EAAAS,QAAA;IAACN,SAAS,EAAEP,UAAU,CAAC,gBAAgB,EAAEO,SAAS,CAAE;IAACC,OAAO,EAAEA,OAAQ;IAACM,IAAI,EAAC;EAAQ,GAAKL,IAAI,gBACrGV,KAAA,CAAAa,aAAA,CAACV,gBAAgB;IAACa,MAAM,EAAE,EAAG;IAACC,KAAK,EAAE;EAAG,CAAE,CAAC,eAC3CjB,KAAA,CAAAa,aAAA;IAAML,SAAS,EAAC;EAAsB,gBAClCR,KAAA,CAAAa,aAAA,CAACX,gBAAgB,EAAKE,QAAQ,CAACc,IAAO,CACpC,CACG,CAAC;AAAA,CACjB;AAED,eAAeZ,UAAU","ignoreList":[]}

package/es/elements/common/nav-button/NavButton.js

@@ -1,63 +0,0 @@
-const _excluded = ["activeClassName", "children", "className", "component", "exact", "isActive", "isDisabled", "onClick", "replace", "strict", "to"];
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
-/**
- * 
- * @file Nav Button component intended to mimic React Router's NavLink component for non-anchor elements
- * @author Box
- */
-
-import * as React from 'react';
-import classNames from 'classnames';
-import { Route } from 'react-router-dom';
-import PlainButton from '../../../components/plain-button';
-import { isLeftClick } from '../../../utils/dom';
-const NavButton = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const {
-      activeClassName = 'bdl-is-active',
-      children,
-      className = 'bdl-NavButton',
-      component: Component = PlainButton,
-      exact,
-      isActive,
-      isDisabled,
-      onClick,
-      replace,
-      strict,
-      to
-    } = props,
-    rest = _objectWithoutProperties(props, _excluded);
-  const path = typeof to === 'object' ? to.pathname : to;
-  const disabledClassName = 'bdl-is-disabled';
-  return /*#__PURE__*/React.createElement(Route, {
-    exact: exact,
-    path: path,
-    strict: strict
-  }, ({
-    history,
-    location,
-    match
-  }) => {
-    const isActiveValue = !!(isActive ? isActive(match, location) : match);
-    return /*#__PURE__*/React.createElement(Component, _extends({
-      className: classNames(className, {
-        [activeClassName]: isActiveValue,
-        [disabledClassName]: isDisabled
-      }),
-      isDisabled: isDisabled,
-      onClick: event => {
-        if (onClick) {
-          onClick(event);
-        }
-        if (!event.defaultPrevented && isLeftClick(event)) {
-          const method = replace ? history.replace : history.push;
-          method(to);
-        }
-      },
-      ref: ref
-    }, rest), children);
-  });
-});
-export default NavButton;
-//# sourceMappingURL=NavButton.js.map

package/es/elements/common/nav-button/NavButton.js.flow

@@ -1,80 +0,0 @@
-/**
- * @flow
- * @file Nav Button component intended to mimic React Router's NavLink component for non-anchor elements
- * @author Box
- */
-
-import * as React from 'react';
-import classNames from 'classnames';
-import { Route } from 'react-router-dom';
-import type { Match, Location } from 'react-router-dom';
-import PlainButton from '../../../components/plain-button';
-import { isLeftClick } from '../../../utils/dom';
-
-type Props = {
-    activeClassName?: string,
-    children: React.Node,
-    className?: string,
-    component?: React.ComponentType<any>,
-    exact?: boolean,
-    isActive?: (match: Match, location: Location) => ?boolean,
-    isDisabled?: boolean,
-    onClick?: (event: SyntheticEvent<>) => void,
-    replace?: boolean,
-    strict?: boolean,
-    to: string | Location,
-};
-
-const NavButton = React.forwardRef<Props, React.Ref<any>>((props: Props, ref: React.Ref<any>) => {
-    const {
-        activeClassName = 'bdl-is-active',
-        children,
-        className = 'bdl-NavButton',
-        component: Component = PlainButton,
-        exact,
-        isActive,
-        isDisabled,
-        onClick,
-        replace,
-        strict,
-        to,
-        ...rest
-    } = props;
-    const path = typeof to === 'object' ? to.pathname : to;
-
-    const disabledClassName = 'bdl-is-disabled';
-
-    return (
-        <Route exact={exact} path={path} strict={strict}>
-            {({ history, location, match }) => {
-                const isActiveValue = !!(isActive ? isActive(match, location) : match);
-
-                return (
-                    <Component
-                        className={classNames(className, {
-                            [activeClassName]: isActiveValue,
-                            [disabledClassName]: isDisabled,
-                        })}
-                        isDisabled={isDisabled}
-                        onClick={event => {
-                            if (onClick) {
-                                onClick(event);
-                            }
-
-                            if (!event.defaultPrevented && isLeftClick(event)) {
-                                const method = replace ? history.replace : history.push;
-                                method(to);
-                            }
-                        }}
-                        ref={ref}
-                        {...rest}
-                    >
-                        {children}
-                    </Component>
-                );
-            }}
-        </Route>
-    );
-});
-
-export default NavButton;

package/es/elements/common/nav-button/NavButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NavButton.js","names":["React","classNames","Route","PlainButton","isLeftClick","NavButton","forwardRef","props","ref","activeClassName","children","className","component","Component","exact","isActive","isDisabled","onClick","replace","strict","to","rest","_objectWithoutProperties","_excluded","path","pathname","disabledClassName","createElement","history","location","match","isActiveValue","_extends","event","defaultPrevented","method","push"],"sources":["../../../../src/elements/common/nav-button/NavButton.js"],"sourcesContent":["/**\n * @flow\n * @file Nav Button component intended to mimic React Router's NavLink component for non-anchor elements\n * @author Box\n */\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Route } from 'react-router-dom';\nimport type { Match, Location } from 'react-router-dom';\nimport PlainButton from '../../../components/plain-button';\nimport { isLeftClick } from '../../../utils/dom';\n\ntype Props = {\n    activeClassName?: string,\n    children: React.Node,\n    className?: string,\n    component?: React.ComponentType<any>,\n    exact?: boolean,\n    isActive?: (match: Match, location: Location) => ?boolean,\n    isDisabled?: boolean,\n    onClick?: (event: SyntheticEvent<>) => void,\n    replace?: boolean,\n    strict?: boolean,\n    to: string | Location,\n};\n\nconst NavButton = React.forwardRef<Props, React.Ref<any>>((props: Props, ref: React.Ref<any>) => {\n    const {\n        activeClassName = 'bdl-is-active',\n        children,\n        className = 'bdl-NavButton',\n        component: Component = PlainButton,\n        exact,\n        isActive,\n        isDisabled,\n        onClick,\n        replace,\n        strict,\n        to,\n        ...rest\n    } = props;\n    const path = typeof to === 'object' ? to.pathname : to;\n\n    const disabledClassName = 'bdl-is-disabled';\n\n    return (\n        <Route exact={exact} path={path} strict={strict}>\n            {({ history, location, match }) => {\n                const isActiveValue = !!(isActive ? isActive(match, location) : match);\n\n                return (\n                    <Component\n                        className={classNames(className, {\n                            [activeClassName]: isActiveValue,\n                            [disabledClassName]: isDisabled,\n                        })}\n                        isDisabled={isDisabled}\n                        onClick={event => {\n                            if (onClick) {\n                                onClick(event);\n                            }\n\n                            if (!event.defaultPrevented && isLeftClick(event)) {\n                                const method = replace ? history.replace : history.push;\n                                method(to);\n                            }\n                        }}\n                        ref={ref}\n                        {...rest}\n                    >\n                        {children}\n                    </Component>\n                );\n            }}\n        </Route>\n    );\n});\n\nexport default NavButton;\n"],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA;;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,KAAK,QAAQ,kBAAkB;AAExC,OAAOC,WAAW,MAAM,kCAAkC;AAC1D,SAASC,WAAW,QAAQ,oBAAoB;AAgBhD,MAAMC,SAAS,gBAAGL,KAAK,CAACM,UAAU,CAAwB,CAACC,KAAY,EAAEC,GAAmB,KAAK;EAC7F,MAAM;MACFC,eAAe,GAAG,eAAe;MACjCC,QAAQ;MACRC,SAAS,GAAG,eAAe;MAC3BC,SAAS,EAAEC,SAAS,GAAGV,WAAW;MAClCW,KAAK;MACLC,QAAQ;MACRC,UAAU;MACVC,OAAO;MACPC,OAAO;MACPC,MAAM;MACNC;IAEJ,CAAC,GAAGb,KAAK;IADFc,IAAI,GAAAC,wBAAA,CACPf,KAAK,EAAAgB,SAAA;EACT,MAAMC,IAAI,GAAG,OAAOJ,EAAE,KAAK,QAAQ,GAAGA,EAAE,CAACK,QAAQ,GAAGL,EAAE;EAEtD,MAAMM,iBAAiB,GAAG,iBAAiB;EAE3C,oBACI1B,KAAA,CAAA2B,aAAA,CAACzB,KAAK;IAACY,KAAK,EAAEA,KAAM;IAACU,IAAI,EAAEA,IAAK;IAACL,MAAM,EAAEA;EAAO,GAC3C,CAAC;IAAES,OAAO;IAAEC,QAAQ;IAAEC;EAAM,CAAC,KAAK;IAC/B,MAAMC,aAAa,GAAG,CAAC,EAAEhB,QAAQ,GAAGA,QAAQ,CAACe,KAAK,EAAED,QAAQ,CAAC,GAAGC,KAAK,CAAC;IAEtE,oBACI9B,KAAA,CAAA2B,aAAA,CAACd,SAAS,EAAAmB,QAAA;MACNrB,SAAS,EAAEV,UAAU,CAACU,SAAS,EAAE;QAC7B,CAACF,eAAe,GAAGsB,aAAa;QAChC,CAACL,iBAAiB,GAAGV;MACzB,CAAC,CAAE;MACHA,UAAU,EAAEA,UAAW;MACvBC,OAAO,EAAEgB,KAAK,IAAI;QACd,IAAIhB,OAAO,EAAE;UACTA,OAAO,CAACgB,KAAK,CAAC;QAClB;QAEA,IAAI,CAACA,KAAK,CAACC,gBAAgB,IAAI9B,WAAW,CAAC6B,KAAK,CAAC,EAAE;UAC/C,MAAME,MAAM,GAAGjB,OAAO,GAAGU,OAAO,CAACV,OAAO,GAAGU,OAAO,CAACQ,IAAI;UACvDD,MAAM,CAACf,EAAE,CAAC;QACd;MACJ,CAAE;MACFZ,GAAG,EAAEA;IAAI,GACLa,IAAI,GAEPX,QACM,CAAC;EAEpB,CACG,CAAC;AAEhB,CAAC,CAAC;AAEF,eAAeL,SAAS","ignoreList":[]}

package/es/elements/common/nav-button/index.js

@@ -1,3 +0,0 @@
-export { default as BackButton } from './BackButton';
-export { default } from './NavButton';
-//# sourceMappingURL=index.js.map

package/es/elements/common/nav-button/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["default","BackButton"],"sources":["../../../../src/elements/common/nav-button/index.js"],"sourcesContent":["export { default as BackButton } from './BackButton';\nexport { default } from './NavButton';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,UAAU,QAAQ,cAAc;AACpD,SAASD,OAAO,QAAQ,aAAa","ignoreList":[]}

package/es/elements/common/types/SidebarNavigation.flow.js

@@ -1,14 +0,0 @@
-export const ViewType = Object.freeze({
-  BOXAI: 'boxai',
-  SKILLS: 'skills',
-  ACTIVITY: 'activity',
-  DETAILS: 'details',
-  METADATA: 'metadata',
-  DOCGEN: 'docgen'
-});
-export const FeedEntryType = Object.freeze({
-  ANNOTATIONS: 'annotations',
-  COMMENTS: 'comments',
-  TASKS: 'tasks'
-});
-//# sourceMappingURL=SidebarNavigation.flow.js.map

package/es/elements/common/types/SidebarNavigation.flow.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidebarNavigation.flow.js","names":["ViewType","Object","freeze","BOXAI","SKILLS","ACTIVITY","DETAILS","METADATA","DOCGEN","FeedEntryType","ANNOTATIONS","COMMENTS","TASKS"],"sources":["../../../../src/elements/common/types/SidebarNavigation.flow.js"],"sourcesContent":["/* @flow */\n\nexport const ViewType = Object.freeze({\n    BOXAI: 'boxai',\n    SKILLS: 'skills',\n    ACTIVITY: 'activity',\n    DETAILS: 'details',\n    METADATA: 'metadata',\n    DOCGEN: 'docgen',\n});\n\nexport const FeedEntryType = Object.freeze({\n    ANNOTATIONS: 'annotations',\n    COMMENTS: 'comments',\n    TASKS: 'tasks',\n});\n\nexport type ViewTypeValues = $Values<typeof ViewType>;\nexport type FeedEntryTypeValues = $Values<typeof FeedEntryType>;\n\ntype VersionSidebarView = {\n    sidebar: 'activity' | 'details',\n    versionId: string,\n};\n\nexport type ActivityAnnotationsSidebarView = {\n    sidebar: 'activity',\n    activeFeedEntryType: 'annotations',\n    fileVersionId: string,\n    activeFeedEntryId: string,\n};\ntype ActivityCommentsSidebarView = {\n    sidebar: 'activity',\n    activeFeedEntryType: 'comments' | 'tasks',\n    activeFeedEntryId: string,\n};\n\nexport type SidebarNavigation =\n    | {|\n          sidebar: ViewTypeValues,\n      |}\n    | VersionSidebarView\n    | ActivityCommentsSidebarView\n    | ActivityAnnotationsSidebarView;\n\nexport type InternalSidebarNavigation = SidebarNavigation & {\n    open: boolean,\n};\n\nexport type SidebarNavigationHandler = (sidebar: SidebarNavigation, replace?: boolean) => void;\n\nexport type InternalSidebarNavigationHandler = (sidebar: InternalSidebarNavigation, replace?: boolean) => void;\n"],"mappings":"AAEA,OAAO,MAAMA,QAAQ,GAAGC,MAAM,CAACC,MAAM,CAAC;EAClCC,KAAK,EAAE,OAAO;EACdC,MAAM,EAAE,QAAQ;EAChBC,QAAQ,EAAE,UAAU;EACpBC,OAAO,EAAE,SAAS;EAClBC,QAAQ,EAAE,UAAU;EACpBC,MAAM,EAAE;AACZ,CAAC,CAAC;AAEF,OAAO,MAAMC,aAAa,GAAGR,MAAM,CAACC,MAAM,CAAC;EACvCQ,WAAW,EAAE,aAAa;EAC1BC,QAAQ,EAAE,UAAU;EACpBC,KAAK,EAAE;AACX,CAAC,CAAC","ignoreList":[]}

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

@@ -1,80 +0,0 @@
-/**
- * @flow
- * @file Nav Button component intended to mimic React Router's NavLink component for non-anchor elements
- * @author Box
- */
-
-import * as React from 'react';
-import classNames from 'classnames';
-import { Route } from 'react-router-dom';
-import type { Match, Location } from 'react-router-dom';
-import PlainButton from '../../../components/plain-button';
-import { isLeftClick } from '../../../utils/dom';
-
-type Props = {
-    activeClassName?: string,
-    children: React.Node,
-    className?: string,
-    component?: React.ComponentType<any>,
-    exact?: boolean,
-    isActive?: (match: Match, location: Location) => ?boolean,
-    isDisabled?: boolean,
-    onClick?: (event: SyntheticEvent<>) => void,
-    replace?: boolean,
-    strict?: boolean,
-    to: string | Location,
-};
-
-const NavButton = React.forwardRef<Props, React.Ref<any>>((props: Props, ref: React.Ref<any>) => {
-    const {
-        activeClassName = 'bdl-is-active',
-        children,
-        className = 'bdl-NavButton',
-        component: Component = PlainButton,
-        exact,
-        isActive,
-        isDisabled,
-        onClick,
-        replace,
-        strict,
-        to,
-        ...rest
-    } = props;
-    const path = typeof to === 'object' ? to.pathname : to;
-
-    const disabledClassName = 'bdl-is-disabled';
-
-    return (
-        <Route exact={exact} path={path} strict={strict}>
-            {({ history, location, match }) => {
-                const isActiveValue = !!(isActive ? isActive(match, location) : match);
-
-                return (
-                    <Component
-                        className={classNames(className, {
-                            [activeClassName]: isActiveValue,
-                            [disabledClassName]: isDisabled,
-                        })}
-                        isDisabled={isDisabled}
-                        onClick={event => {
-                            if (onClick) {
-                                onClick(event);
-                            }
-
-                            if (!event.defaultPrevented && isLeftClick(event)) {
-                                const method = replace ? history.replace : history.push;
-                                method(to);
-                            }
-                        }}
-                        ref={ref}
-                        {...rest}
-                    >
-                        {children}
-                    </Component>
-                );
-            }}
-        </Route>
-    );
-});
-
-export default NavButton;