box-ui-elements 16.1.0-beta.9 → 17.0.0

package/es/elements/content-sidebar/SidebarContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarContent.js"],"names":["React","classNames","SidebarContent","actions","children","className","title","elementId","sidebarView","rest","label","id","defaultProps"],"mappings":";;;;;;AAAA;;;;;AAMA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAO,uBAAP;;AAUA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,OAAqF;AAAA,MAAlFC,OAAkF,QAAlFA,OAAkF;AAAA,MAAzEC,QAAyE,QAAzEA,QAAyE;AAAA,MAA/DC,SAA+D,QAA/DA,SAA+D;AAAA,MAApDC,KAAoD,QAApDA,KAAoD;AAAA,MAA7CC,SAA6C,QAA7CA,SAA6C;AAAA,MAAlCC,WAAkC,QAAlCA,WAAkC;AAAA,MAAlBC,IAAkB;;AACxG,MAAMC,KAAK,aAAMH,SAAN,SAAkBA,SAAS,KAAK,EAAd,GAAmB,EAAnB,GAAwB,GAA1C,SAAgDC,WAAhD,CAAX;AACA,MAAMG,EAAE,aAAMD,KAAN,aAAR;AAEA,SACI;AACI,uBAAiBA,KADrB;AAEI,IAAA,SAAS,EAAET,UAAU,CAAC,aAAD,EAAgBI,SAAhB,CAFzB;AAGI,mBAAY,aAHhB;AAII,IAAA,EAAE,EAAEM,EAJR;AAKI,IAAA,IAAI,EAAC;AALT,KAMQF,IANR,GAQI;AAAK,IAAA,SAAS,EAAC;AAAf,KACKH,KAAK,IAAI;AAAI,IAAA,SAAS,EAAC;AAAd,KAA2BA,KAA3B,CADd,EAEKH,OAFL,CARJ,EAYI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCC,QAArC,CADJ,CAZJ,CADJ;AAkBH,CAtBD;;AAwBAF,cAAc,CAACU,YAAf,GAA8B;AAC1BL,EAAAA,SAAS,EAAE,EADe;AAE1BC,EAAAA,WAAW,EAAE;AAFa,CAA9B;AAKA,eAAeN,cAAf","sourcesContent":["/**\n * @flow\n * @file Preview sidebar content component\n * @author Box\n */\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport './SidebarContent.scss';\n\ntype Props = {\n    actions?: React.Node,\n    children: any,\n    className?: string,\n    elementId: string,\n    sidebarView: string,\n    title?: React.Node,\n};\nconst SidebarContent = ({ actions, children, className, title, elementId, sidebarView, ...rest }: Props) => {\n    const label = `${elementId}${elementId === '' ? '' : '_'}${sidebarView}`;\n    const id = `${label}-content`;\n\n    return (\n        <div\n            aria-labelledby={label}\n            className={classNames('bcs-content', className)}\n            data-testid=\"bcs-content\"\n            id={id}\n            role=\"tabpanel\"\n            {...rest}\n        >\n            <div className=\"bcs-content-header\">\n                {title && <h3 className=\"bcs-title\">{title}</h3>}\n                {actions}\n            </div>\n            <div className=\"bcs-scroll-content-wrapper\">\n                <div className=\"bcs-scroll-content\">{children}</div>\n            </div>\n        </div>\n    );\n};\n\nSidebarContent.defaultProps = {\n    elementId: '',\n    sidebarView: '',\n};\n\nexport default SidebarContent;\n"],"file":"SidebarContent.js"}
+{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarContent.js"],"names":["React","classNames","SidebarContent","actions","children","className","elementId","sidebarView","title","rest","label","id","defaultProps"],"mappings":";;;;;;AAAA;;;;;AAMA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAO,uBAAP;;AAUA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,OAAqF;AAAA,MAAlFC,OAAkF,QAAlFA,OAAkF;AAAA,MAAzEC,QAAyE,QAAzEA,QAAyE;AAAA,MAA/DC,SAA+D,QAA/DA,SAA+D;AAAA,MAApDC,SAAoD,QAApDA,SAAoD;AAAA,MAAzCC,WAAyC,QAAzCA,WAAyC;AAAA,MAA5BC,KAA4B,QAA5BA,KAA4B;AAAA,MAAlBC,IAAkB;;AACxG,MAAMC,KAAK,aAAMJ,SAAN,SAAkBA,SAAS,KAAK,EAAd,GAAmB,EAAnB,GAAwB,GAA1C,SAAgDC,WAAhD,CAAX;AACA,MAAMI,EAAE,aAAMD,KAAN,aAAR;AAEA,SACI;AACI,uBAAiBA,KADrB;AAEI,IAAA,SAAS,EAAET,UAAU,CAAC,aAAD,EAAgBI,SAAhB,CAFzB;AAGI,mBAAY,aAHhB;AAII,IAAA,EAAE,EAAEM,EAJR;AAKI,IAAA,IAAI,EAAC;AALT,KAMQF,IANR,GAQI;AAAK,IAAA,SAAS,EAAC;AAAf,KACKD,KAAK,IAAI;AAAI,IAAA,SAAS,EAAC;AAAd,KAA2BA,KAA3B,CADd,EAEKL,OAFL,CARJ,EAYI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI;AAAK,IAAA,SAAS,EAAC;AAAf,KAAqCC,QAArC,CADJ,CAZJ,CADJ;AAkBH,CAtBD;;AAwBAF,cAAc,CAACU,YAAf,GAA8B;AAC1BN,EAAAA,SAAS,EAAE,EADe;AAE1BC,EAAAA,WAAW,EAAE;AAFa,CAA9B;AAKA,eAAeL,cAAf","sourcesContent":["/**\n * @flow\n * @file Preview sidebar content component\n * @author Box\n */\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport './SidebarContent.scss';\n\ntype Props = {\n    actions?: React.Node,\n    children: any,\n    className?: string,\n    elementId: string,\n    sidebarView: string,\n    title?: React.Node,\n};\nconst SidebarContent = ({ actions, children, className, elementId, sidebarView, title, ...rest }: Props) => {\n    const label = `${elementId}${elementId === '' ? '' : '_'}${sidebarView}`;\n    const id = `${label}-content`;\n\n    return (\n        <div\n            aria-labelledby={label}\n            className={classNames('bcs-content', className)}\n            data-testid=\"bcs-content\"\n            id={id}\n            role=\"tabpanel\"\n            {...rest}\n        >\n            <div className=\"bcs-content-header\">\n                {title && <h3 className=\"bcs-title\">{title}</h3>}\n                {actions}\n            </div>\n            <div className=\"bcs-scroll-content-wrapper\">\n                <div className=\"bcs-scroll-content\">{children}</div>\n            </div>\n        </div>\n    );\n};\n\nSidebarContent.defaultProps = {\n    elementId: '',\n    sidebarView: '',\n};\n\nexport default SidebarContent;\n"],"file":"SidebarContent.js"}

package/es/elements/content-sidebar/SidebarContent.scss

@@ -10,8 +10,8 @@
         display: flex;
         align-items: center;
         justify-content: space-between;
-        height: 60px;
-        margin: 0 25px;
+        height: $sidebarHeaderHeight;
+        margin: 0 $sidebarActivityFeedSpacingHorizontal;
         padding: 0;
         border-bottom: 1px solid $bdl-gray-10;
 
@@ -26,7 +26,7 @@
 
     .bcs-scroll-content-wrapper {
         position: absolute; // Prevents non-sidebar parts from re-painting
-        top: 60px; // Same as title above
+        top: $sidebarHeaderHeight; // Same as title above
         right: 0;
         bottom: 0;
         left: 0;

package/es/elements/content-sidebar/SidebarNav.js

@@ -34,11 +34,7 @@ var SidebarNav = function SidebarNav(_ref) {
       onNavigate = _ref.onNavigate;
 
   var _useFeatureConfig = useFeatureConfig('boxSign'),
-      boxSignBlockedReason = _useFeatureConfig.blockedReason,
-      hasBoxSign = _useFeatureConfig.enabled,
-      onBoxSignClick = _useFeatureConfig.onClick,
-      boxSignStatus = _useFeatureConfig.status,
-      boxSignTargetingApi = _useFeatureConfig.targetingApi;
+      hasBoxSign = _useFeatureConfig.enabled;
 
   return React.createElement("div", {
     className: "bcs-SidebarNav",
@@ -69,19 +65,9 @@ var SidebarNav = function SidebarNav(_ref) {
     "data-testid": "sidebarmetadata",
     sidebarView: SIDEBAR_VIEW_METADATA,
     tooltip: intl.formatMessage(messages.sidebarMetadataTitle)
-  }, React.createElement(IconMetadataThick, null))), hasBoxSign && onBoxSignClick && React.createElement("div", {
+  }, React.createElement(IconMetadataThick, null))), hasBoxSign && React.createElement("div", {
     className: "bcs-SidebarNav-secondary"
-  }, React.createElement(SidebarNavSign, {
-    blockedReason: boxSignBlockedReason,
-    "data-resin-target": SIDEBAR_NAV_TARGETS.SIGN,
-    onClick: function onClick() {
-      return onBoxSignClick({
-        fileId: fileId
-      });
-    },
-    status: boxSignStatus,
-    targetingApi: boxSignTargetingApi
-  })), hasAdditionalTabs && React.createElement("div", {
+  }, React.createElement(SidebarNavSign, null)), hasAdditionalTabs && React.createElement("div", {
     className: "bcs-SidebarNav-overflow"
   }, React.createElement(AdditionalTabs, {
     key: fileId,

package/es/elements/content-sidebar/SidebarNav.js.flow

@@ -54,13 +54,7 @@ const SidebarNav = ({
     isOpen,
     onNavigate,
 }: Props) => {
-    const {
-        blockedReason: boxSignBlockedReason,
-        enabled: hasBoxSign,
-        onClick: onBoxSignClick,
-        status: boxSignStatus,
-        targetingApi: boxSignTargetingApi,
-    } = useFeatureConfig('boxSign');
+    const { enabled: hasBoxSign } = useFeatureConfig('boxSign');
 
     return (
         <div className="bcs-SidebarNav" aria-label={intl.formatMessage(messages.sidebarNavLabel)}>
@@ -108,15 +102,9 @@ const SidebarNav = ({
                     )}
                 </SidebarNavTablist>
 
-                {hasBoxSign && onBoxSignClick && (
+                {hasBoxSign && (
                     <div className="bcs-SidebarNav-secondary">
-                        <SidebarNavSign
-                            blockedReason={boxSignBlockedReason}
-                            data-resin-target={SIDEBAR_NAV_TARGETS.SIGN}
-                            onClick={() => onBoxSignClick({ fileId })}
-                            status={boxSignStatus}
-                            targetingApi={boxSignTargetingApi}
-                        />
+                        <SidebarNavSign />
                     </div>
                 )}
 

package/es/elements/content-sidebar/SidebarNav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarNav.js"],"names":["React","injectIntl","AdditionalTabs","IconChatRound","IconDocInfo","IconMagicWand","IconMetadataThick","SidebarNavButton","SidebarNavSign","SidebarNavTablist","SidebarToggle","messages","SIDEBAR_NAV_TARGETS","SIDEBAR_VIEW_SKILLS","SIDEBAR_VIEW_ACTIVITY","SIDEBAR_VIEW_DETAILS","SIDEBAR_VIEW_METADATA","useFeatureConfig","SidebarNav","additionalTabs","elementId","fileId","hasActivity","hasAdditionalTabs","hasDetails","hasMetadata","hasSkills","intl","isOpen","onNavigate","boxSignBlockedReason","blockedReason","hasBoxSign","enabled","onBoxSignClick","onClick","boxSignStatus","status","boxSignTargetingApi","targetingApi","formatMessage","sidebarNavLabel","ACTIVITY","sidebarActivityTitle","DETAILS","sidebarDetailsTitle","SKILLS","sidebarSkillsTitle","METADATA","sidebarMetadataTitle","SIGN"],"mappings":"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","sourcesContent":["/**\n * @flow\n * @file Preview sidebar nav component\n * @author Box\n */\n\nimport * as React from 'react';\nimport { injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport AdditionalTabs from './additional-tabs';\nimport IconChatRound from '../../icons/general/IconChatRound';\nimport IconDocInfo from '../../icons/general/IconDocInfo';\nimport IconMagicWand from '../../icons/general/IconMagicWand';\nimport IconMetadataThick from '../../icons/general/IconMetadataThick';\nimport SidebarNavButton from './SidebarNavButton';\nimport SidebarNavSign from './SidebarNavSign';\nimport SidebarNavTablist from './SidebarNavTablist';\nimport SidebarToggle from './SidebarToggle';\nimport messages from '../common/messages';\nimport { SIDEBAR_NAV_TARGETS } from '../common/interactionTargets';\nimport {\n    SIDEBAR_VIEW_SKILLS,\n    SIDEBAR_VIEW_ACTIVITY,\n    SIDEBAR_VIEW_DETAILS,\n    SIDEBAR_VIEW_METADATA,\n} from '../../constants';\nimport { useFeatureConfig } from '../common/feature-checking';\nimport type { NavigateOptions, AdditionalSidebarTab } from './flowTypes';\nimport './SidebarNav.scss';\n\ntype Props = {\n    additionalTabs?: Array<AdditionalSidebarTab>,\n    elementId: string,\n    fileId: string,\n    hasActivity: boolean,\n    hasAdditionalTabs: boolean,\n    hasDetails: boolean,\n    hasMetadata: boolean,\n    hasSkills: boolean,\n    isOpen?: boolean,\n    onNavigate?: (SyntheticEvent<>, NavigateOptions) => void,\n} & InjectIntlProvidedProps;\n\nconst SidebarNav = ({\n    additionalTabs,\n    elementId,\n    fileId,\n    hasActivity,\n    hasAdditionalTabs,\n    hasDetails,\n    hasMetadata,\n    hasSkills,\n    intl,\n    isOpen,\n    onNavigate,\n}: Props) => {\n    const {\n        blockedReason: boxSignBlockedReason,\n        enabled: hasBoxSign,\n        onClick: onBoxSignClick,\n        status: boxSignStatus,\n        targetingApi: boxSignTargetingApi,\n    } = useFeatureConfig('boxSign');\n\n    return (\n        <div className=\"bcs-SidebarNav\" aria-label={intl.formatMessage(messages.sidebarNavLabel)}>\n            <div className=\"bcs-SidebarNav-tabs\">\n                <SidebarNavTablist elementId={elementId} isOpen={isOpen} onNavigate={onNavigate}>\n                    {hasActivity && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.ACTIVITY}\n                            data-testid=\"sidebaractivity\"\n                            sidebarView={SIDEBAR_VIEW_ACTIVITY}\n                            tooltip={intl.formatMessage(messages.sidebarActivityTitle)}\n                        >\n                            <IconChatRound />\n                        </SidebarNavButton>\n                    )}\n                    {hasDetails && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.DETAILS}\n                            data-testid=\"sidebardetails\"\n                            sidebarView={SIDEBAR_VIEW_DETAILS}\n                            tooltip={intl.formatMessage(messages.sidebarDetailsTitle)}\n                        >\n                            <IconDocInfo />\n                        </SidebarNavButton>\n                    )}\n                    {hasSkills && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.SKILLS}\n                            data-testid=\"sidebarskills\"\n                            sidebarView={SIDEBAR_VIEW_SKILLS}\n                            tooltip={intl.formatMessage(messages.sidebarSkillsTitle)}\n                        >\n                            <IconMagicWand />\n                        </SidebarNavButton>\n                    )}\n                    {hasMetadata && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.METADATA}\n                            data-testid=\"sidebarmetadata\"\n                            sidebarView={SIDEBAR_VIEW_METADATA}\n                            tooltip={intl.formatMessage(messages.sidebarMetadataTitle)}\n                        >\n                            <IconMetadataThick />\n                        </SidebarNavButton>\n                    )}\n                </SidebarNavTablist>\n\n                {hasBoxSign && onBoxSignClick && (\n                    <div className=\"bcs-SidebarNav-secondary\">\n                        <SidebarNavSign\n                            blockedReason={boxSignBlockedReason}\n                            data-resin-target={SIDEBAR_NAV_TARGETS.SIGN}\n                            onClick={() => onBoxSignClick({ fileId })}\n                            status={boxSignStatus}\n                            targetingApi={boxSignTargetingApi}\n                        />\n                    </div>\n                )}\n\n                {hasAdditionalTabs && (\n                    <div className=\"bcs-SidebarNav-overflow\">\n                        <AdditionalTabs key={fileId} tabs={additionalTabs} />\n                    </div>\n                )}\n            </div>\n            <div className=\"bcs-SidebarNav-footer\">\n                <SidebarToggle isOpen={isOpen} />\n            </div>\n        </div>\n    );\n};\nexport default injectIntl(SidebarNav);\n"],"file":"SidebarNav.js"}
+{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarNav.js"],"names":["React","injectIntl","AdditionalTabs","IconChatRound","IconDocInfo","IconMagicWand","IconMetadataThick","SidebarNavButton","SidebarNavSign","SidebarNavTablist","SidebarToggle","messages","SIDEBAR_NAV_TARGETS","SIDEBAR_VIEW_SKILLS","SIDEBAR_VIEW_ACTIVITY","SIDEBAR_VIEW_DETAILS","SIDEBAR_VIEW_METADATA","useFeatureConfig","SidebarNav","additionalTabs","elementId","fileId","hasActivity","hasAdditionalTabs","hasDetails","hasMetadata","hasSkills","intl","isOpen","onNavigate","hasBoxSign","enabled","formatMessage","sidebarNavLabel","ACTIVITY","sidebarActivityTitle","DETAILS","sidebarDetailsTitle","SKILLS","sidebarSkillsTitle","METADATA","sidebarMetadataTitle"],"mappings":"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","sourcesContent":["/**\n * @flow\n * @file Preview sidebar nav component\n * @author Box\n */\n\nimport * as React from 'react';\nimport { injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport AdditionalTabs from './additional-tabs';\nimport IconChatRound from '../../icons/general/IconChatRound';\nimport IconDocInfo from '../../icons/general/IconDocInfo';\nimport IconMagicWand from '../../icons/general/IconMagicWand';\nimport IconMetadataThick from '../../icons/general/IconMetadataThick';\nimport SidebarNavButton from './SidebarNavButton';\nimport SidebarNavSign from './SidebarNavSign';\nimport SidebarNavTablist from './SidebarNavTablist';\nimport SidebarToggle from './SidebarToggle';\nimport messages from '../common/messages';\nimport { SIDEBAR_NAV_TARGETS } from '../common/interactionTargets';\nimport {\n    SIDEBAR_VIEW_SKILLS,\n    SIDEBAR_VIEW_ACTIVITY,\n    SIDEBAR_VIEW_DETAILS,\n    SIDEBAR_VIEW_METADATA,\n} from '../../constants';\nimport { useFeatureConfig } from '../common/feature-checking';\nimport type { NavigateOptions, AdditionalSidebarTab } from './flowTypes';\nimport './SidebarNav.scss';\n\ntype Props = {\n    additionalTabs?: Array<AdditionalSidebarTab>,\n    elementId: string,\n    fileId: string,\n    hasActivity: boolean,\n    hasAdditionalTabs: boolean,\n    hasDetails: boolean,\n    hasMetadata: boolean,\n    hasSkills: boolean,\n    isOpen?: boolean,\n    onNavigate?: (SyntheticEvent<>, NavigateOptions) => void,\n} & InjectIntlProvidedProps;\n\nconst SidebarNav = ({\n    additionalTabs,\n    elementId,\n    fileId,\n    hasActivity,\n    hasAdditionalTabs,\n    hasDetails,\n    hasMetadata,\n    hasSkills,\n    intl,\n    isOpen,\n    onNavigate,\n}: Props) => {\n    const { enabled: hasBoxSign } = useFeatureConfig('boxSign');\n\n    return (\n        <div className=\"bcs-SidebarNav\" aria-label={intl.formatMessage(messages.sidebarNavLabel)}>\n            <div className=\"bcs-SidebarNav-tabs\">\n                <SidebarNavTablist elementId={elementId} isOpen={isOpen} onNavigate={onNavigate}>\n                    {hasActivity && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.ACTIVITY}\n                            data-testid=\"sidebaractivity\"\n                            sidebarView={SIDEBAR_VIEW_ACTIVITY}\n                            tooltip={intl.formatMessage(messages.sidebarActivityTitle)}\n                        >\n                            <IconChatRound />\n                        </SidebarNavButton>\n                    )}\n                    {hasDetails && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.DETAILS}\n                            data-testid=\"sidebardetails\"\n                            sidebarView={SIDEBAR_VIEW_DETAILS}\n                            tooltip={intl.formatMessage(messages.sidebarDetailsTitle)}\n                        >\n                            <IconDocInfo />\n                        </SidebarNavButton>\n                    )}\n                    {hasSkills && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.SKILLS}\n                            data-testid=\"sidebarskills\"\n                            sidebarView={SIDEBAR_VIEW_SKILLS}\n                            tooltip={intl.formatMessage(messages.sidebarSkillsTitle)}\n                        >\n                            <IconMagicWand />\n                        </SidebarNavButton>\n                    )}\n                    {hasMetadata && (\n                        <SidebarNavButton\n                            data-resin-target={SIDEBAR_NAV_TARGETS.METADATA}\n                            data-testid=\"sidebarmetadata\"\n                            sidebarView={SIDEBAR_VIEW_METADATA}\n                            tooltip={intl.formatMessage(messages.sidebarMetadataTitle)}\n                        >\n                            <IconMetadataThick />\n                        </SidebarNavButton>\n                    )}\n                </SidebarNavTablist>\n\n                {hasBoxSign && (\n                    <div className=\"bcs-SidebarNav-secondary\">\n                        <SidebarNavSign />\n                    </div>\n                )}\n\n                {hasAdditionalTabs && (\n                    <div className=\"bcs-SidebarNav-overflow\">\n                        <AdditionalTabs key={fileId} tabs={additionalTabs} />\n                    </div>\n                )}\n            </div>\n            <div className=\"bcs-SidebarNav-footer\">\n                <SidebarToggle isOpen={isOpen} />\n            </div>\n        </div>\n    );\n};\nexport default injectIntl(SidebarNav);\n"],"file":"SidebarNav.js"}

package/es/elements/content-sidebar/SidebarNavSign.js

@@ -1,78 +1,57 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+import React from 'react';
+import { FormattedMessage } from 'react-intl'; // @ts-ignore Module is written in Flow
 
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useFeatureConfig } from '../common/feature-checking'; // @ts-ignore Module is written in Flow
 
-import React from 'react';
-import classnames from 'classnames';
-import { injectIntl } from 'react-intl';
-import BoxSign28 from '../../icon/logo/BoxSign28';
-import Sign16 from '../../icon/fill/Sign16';
-import PlainButton from '../../components/plain-button'; // @ts-ignore Module is written in Flow
+import { SIDEBAR_NAV_TARGETS } from '../common/interactionTargets'; // @ts-ignore Module is written in Flow
 
-import TargetedClickThroughGuideTooltip from '../../features/targeting/TargetedClickThroughGuideTooltip';
-import Tooltip, { TooltipPosition } from '../../components/tooltip'; // @ts-ignore Module is written in Flow
+import DropdownMenu from '../../components/dropdown-menu';
+import SidebarNavSignButton from './SidebarNavSignButton';
+import SignMe32 from '../../icon/fill/SignMe32';
+import SignMeOthers32 from '../../icon/fill/SignMeOthers32';
+import { Menu, MenuItem } from '../../components/menu'; // @ts-ignore Module is written in Flow
 
 import messages from './messages';
 import './SidebarNavSign.scss';
-export var PlaceholderTooltip = function PlaceholderTooltip(_ref) {
-  var children = _ref.children;
-  return children;
-};
-export function SidebarNavSign(_ref2) {
-  var blockedReason = _ref2.blockedReason,
-      intl = _ref2.intl,
-      status = _ref2.status,
-      targetingApi = _ref2.targetingApi,
-      rest = _objectWithoutProperties(_ref2, ["blockedReason", "intl", "status", "targetingApi"]);
-
-  var isSignDisabled = !!blockedReason;
-  var isTargeted = targetingApi && targetingApi.canShow;
-  var FtuxTooltip = !isSignDisabled && isTargeted ? TargetedClickThroughGuideTooltip : PlaceholderTooltip;
-  var label = intl.formatMessage(status === 'active' ? messages.boxSignSignature : messages.boxSignRequest);
-  var buttonClassName = classnames('bcs-SidebarNavSign', {
-    'bdl-is-disabled': isSignDisabled
-  });
-  var tooltipMessage = label;
-
-  switch (blockedReason) {
-    case 'shield-download':
-    case 'shared-link':
-    case 'shield-sign':
-      tooltipMessage = intl.formatMessage(messages.boxSignSecurityBlockedTooltip);
-      break;
-
-    case 'watermark':
-      tooltipMessage = intl.formatMessage(messages.boxSignWatermarkBlockedTooltip);
-      break;
-
-    default:
-  }
-
-  return React.createElement(FtuxTooltip, {
-    body: intl.formatMessage(messages.boxSignFtuxBody),
-    position: TooltipPosition.MIDDLE_LEFT,
-    shouldTarget: isTargeted,
-    title: intl.formatMessage(messages.boxSignFtuxTitle),
-    useTargetingApi: function useTargetingApi() {
-      return targetingApi;
-    }
-  }, React.createElement(Tooltip, {
-    isDisabled: isTargeted,
-    position: TooltipPosition.MIDDLE_LEFT,
-    text: tooltipMessage
-  }, React.createElement(PlainButton, _extends({
-    "aria-label": label,
-    className: buttonClassName,
-    isDisabled: isSignDisabled
-  }, rest), React.createElement(BoxSign28, {
+export function SidebarNavSign() {
+  var _useFeatureConfig = useFeatureConfig('boxSign'),
+      boxSignBlockedReason = _useFeatureConfig.blockedReason,
+      onBoxClickRequestSignature = _useFeatureConfig.onClick,
+      onBoxClickSignMyself = _useFeatureConfig.onClickSignMyself,
+      boxSignStatus = _useFeatureConfig.status,
+      boxSignTargetingApi = _useFeatureConfig.targetingApi,
+      isSignRemoveInterstitialEnabled = _useFeatureConfig.isSignRemoveInterstitialEnabled;
+
+  return React.createElement(React.Fragment, null, isSignRemoveInterstitialEnabled ? React.createElement(DropdownMenu, {
+    isResponsive: true,
+    constrainToWindow: true,
+    isRightAligned: true
+  }, React.createElement(SidebarNavSignButton, {
+    blockedReason: boxSignBlockedReason,
+    status: boxSignStatus,
+    targetingApi: boxSignTargetingApi,
+    "data-resin-target": SIDEBAR_NAV_TARGETS.SIGN
+  }), React.createElement(Menu, null, React.createElement(MenuItem, {
+    "data-testid": "sign-request-signature-button",
+    onClick: onBoxClickRequestSignature
+  }, React.createElement(SignMeOthers32, {
+    width: 16,
+    height: 16,
+    className: "bcs-SidebarNavSign-icon"
+  }), React.createElement(FormattedMessage, messages.boxSignRequestSignature)), React.createElement(MenuItem, {
+    "data-testid": "sign-sign-myself-button",
+    onClick: onBoxClickSignMyself
+  }, React.createElement(SignMe32, {
+    width: 16,
+    height: 16,
     className: "bcs-SidebarNavSign-icon"
-  }), React.createElement(Sign16, {
-    width: 20,
-    height: 20,
-    className: "bcs-SidebarNavSign-icon--grayscale"
-  }))));
+  }), React.createElement(FormattedMessage, messages.boxSignSignMyself)))) : React.createElement(SidebarNavSignButton, {
+    blockedReason: boxSignBlockedReason,
+    "data-resin-target": SIDEBAR_NAV_TARGETS.SIGN,
+    onClick: onBoxClickRequestSignature,
+    status: boxSignStatus,
+    targetingApi: boxSignTargetingApi
+  }));
 }
-export default injectIntl(SidebarNavSign);
+export default SidebarNavSign;
 //# sourceMappingURL=SidebarNavSign.js.map

package/es/elements/content-sidebar/SidebarNavSign.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarNavSign.tsx"],"names":["React","classnames","injectIntl","BoxSign28","Sign16","PlainButton","TargetedClickThroughGuideTooltip","Tooltip","TooltipPosition","messages","PlaceholderTooltip","children","SidebarNavSign","blockedReason","intl","status","targetingApi","rest","isSignDisabled","isTargeted","canShow","FtuxTooltip","label","formatMessage","boxSignSignature","boxSignRequest","buttonClassName","tooltipMessage","boxSignSecurityBlockedTooltip","boxSignWatermarkBlockedTooltip","boxSignFtuxBody","MIDDLE_LEFT","boxSignFtuxTitle"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,UAAT,QAAsC,YAAtC;AACA,OAAOC,SAAP,MAAsB,2BAAtB;AACA,OAAOC,MAAP,MAAmB,wBAAnB;AACA,OAAOC,WAAP,MAA8C,+BAA9C,C,CACA;;AACA,OAAOC,gCAAP,MAA6C,2DAA7C;AACA,OAAOC,OAAP,IAAkBC,eAAlB,QAAyC,0BAAzC,C,CACA;;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,OAAO,uBAAP;AAcA,OAAO,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,SAAiDA,QAAjD;AAAA,CAA3B;AAEP,OAAO,SAASC,cAAT,QAAuF;AAAA,MAA7DC,aAA6D,SAA7DA,aAA6D;AAAA,MAA9CC,IAA8C,SAA9CA,IAA8C;AAAA,MAAxCC,MAAwC,SAAxCA,MAAwC;AAAA,MAAhCC,YAAgC,SAAhCA,YAAgC;AAAA,MAAfC,IAAe;;AAC1F,MAAMC,cAAc,GAAG,CAAC,CAACL,aAAzB;AACA,MAAMM,UAAU,GAAGH,YAAY,IAAIA,YAAY,CAACI,OAAhD;AACA,MAAMC,WAAW,GAAG,CAACH,cAAD,IAAmBC,UAAnB,GAAgCb,gCAAhC,GAAmEI,kBAAvF;AACA,MAAMY,KAAK,GAAGR,IAAI,CAACS,aAAL,CAAmBR,MAAM,KAAK,QAAX,GAAsBN,QAAQ,CAACe,gBAA/B,GAAkDf,QAAQ,CAACgB,cAA9E,CAAd;AACA,MAAMC,eAAe,GAAGzB,UAAU,CAAC,oBAAD,EAAuB;AAAE,uBAAmBiB;AAArB,GAAvB,CAAlC;AAEA,MAAIS,cAAc,GAAGL,KAArB;;AAEA,UAAQT,aAAR;AACI,SAAK,iBAAL;AACA,SAAK,aAAL;AACA,SAAK,aAAL;AACIc,MAAAA,cAAc,GAAGb,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACmB,6BAA5B,CAAjB;AACA;;AACJ,SAAK,WAAL;AACID,MAAAA,cAAc,GAAGb,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACoB,8BAA5B,CAAjB;AACA;;AACJ;AATJ;;AAYA,SACI,oBAAC,WAAD;AACI,IAAA,IAAI,EAAEf,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACqB,eAA5B,CADV;AAEI,IAAA,QAAQ,EAAEtB,eAAe,CAACuB,WAF9B;AAGI,IAAA,YAAY,EAAEZ,UAHlB;AAII,IAAA,KAAK,EAAEL,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACuB,gBAA5B,CAJX;AAKI,IAAA,eAAe,EAAE;AAAA,aAAMhB,YAAN;AAAA;AALrB,KAOI,oBAAC,OAAD;AAAS,IAAA,UAAU,EAAEG,UAArB;AAAiC,IAAA,QAAQ,EAAEX,eAAe,CAACuB,WAA3D;AAAwE,IAAA,IAAI,EAAEJ;AAA9E,KACI,oBAAC,WAAD;AAAa,kBAAYL,KAAzB;AAAgC,IAAA,SAAS,EAAEI,eAA3C;AAA4D,IAAA,UAAU,EAAER;AAAxE,KAA4FD,IAA5F,GACI,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAC;AAArB,IADJ,EAEI,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE,EAAf;AAAmB,IAAA,MAAM,EAAE,EAA3B;AAA+B,IAAA,SAAS,EAAC;AAAzC,IAFJ,CADJ,CAPJ,CADJ;AAgBH;AAED,eAAef,UAAU,CAACU,cAAD,CAAzB","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { injectIntl, IntlShape } from 'react-intl';\nimport BoxSign28 from '../../icon/logo/BoxSign28';\nimport Sign16 from '../../icon/fill/Sign16';\nimport PlainButton, { PlainButtonProps } from '../../components/plain-button';\n// @ts-ignore Module is written in Flow\nimport TargetedClickThroughGuideTooltip from '../../features/targeting/TargetedClickThroughGuideTooltip';\nimport Tooltip, { TooltipPosition } from '../../components/tooltip';\n// @ts-ignore Module is written in Flow\nimport messages from './messages';\nimport './SidebarNavSign.scss';\n\nexport type Props = PlainButtonProps & {\n    blockedReason?: string;\n    intl: IntlShape;\n    status?: string;\n    targetingApi?: {\n        canShow: boolean;\n        onClose: () => void;\n        onComplete: () => void;\n        onShow: () => void;\n    };\n};\n\nexport const PlaceholderTooltip = ({ children }: { children: React.ReactNode }) => children;\n\nexport function SidebarNavSign({ blockedReason, intl, status, targetingApi, ...rest }: Props) {\n    const isSignDisabled = !!blockedReason;\n    const isTargeted = targetingApi && targetingApi.canShow;\n    const FtuxTooltip = !isSignDisabled && isTargeted ? TargetedClickThroughGuideTooltip : PlaceholderTooltip;\n    const label = intl.formatMessage(status === 'active' ? messages.boxSignSignature : messages.boxSignRequest);\n    const buttonClassName = classnames('bcs-SidebarNavSign', { 'bdl-is-disabled': isSignDisabled });\n\n    let tooltipMessage = label;\n\n    switch (blockedReason) {\n        case 'shield-download':\n        case 'shared-link':\n        case 'shield-sign':\n            tooltipMessage = intl.formatMessage(messages.boxSignSecurityBlockedTooltip);\n            break;\n        case 'watermark':\n            tooltipMessage = intl.formatMessage(messages.boxSignWatermarkBlockedTooltip);\n            break;\n        default:\n    }\n\n    return (\n        <FtuxTooltip\n            body={intl.formatMessage(messages.boxSignFtuxBody)}\n            position={TooltipPosition.MIDDLE_LEFT}\n            shouldTarget={isTargeted}\n            title={intl.formatMessage(messages.boxSignFtuxTitle)}\n            useTargetingApi={() => targetingApi}\n        >\n            <Tooltip isDisabled={isTargeted} position={TooltipPosition.MIDDLE_LEFT} text={tooltipMessage}>\n                <PlainButton aria-label={label} className={buttonClassName} isDisabled={isSignDisabled} {...rest}>\n                    <BoxSign28 className=\"bcs-SidebarNavSign-icon\" />\n                    <Sign16 width={20} height={20} className=\"bcs-SidebarNavSign-icon--grayscale\" />\n                </PlainButton>\n            </Tooltip>\n        </FtuxTooltip>\n    );\n}\n\nexport default injectIntl(SidebarNavSign);\n"],"file":"SidebarNavSign.js"}
+{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarNavSign.tsx"],"names":["React","FormattedMessage","useFeatureConfig","SIDEBAR_NAV_TARGETS","DropdownMenu","SidebarNavSignButton","SignMe32","SignMeOthers32","Menu","MenuItem","messages","SidebarNavSign","boxSignBlockedReason","blockedReason","onBoxClickRequestSignature","onClick","onBoxClickSignMyself","onClickSignMyself","boxSignStatus","status","boxSignTargetingApi","targetingApi","isSignRemoveInterstitialEnabled","SIGN","boxSignRequestSignature","boxSignSignMyself"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,gBAAT,QAAiC,YAAjC,C,CAEA;;AACA,SAASC,gBAAT,QAAiC,4BAAjC,C,CACA;;AACA,SAASC,mBAAT,QAAoC,8BAApC,C,CAEA;;AACA,OAAOC,YAAP,MAAyB,gCAAzB;AACA,OAAOC,oBAAP,MAAiC,wBAAjC;AACA,OAAOC,QAAP,MAAqB,0BAArB;AACA,OAAOC,cAAP,MAA2B,gCAA3B;AACA,SAASC,IAAT,EAAeC,QAAf,QAA+B,uBAA/B,C,CAEA;;AACA,OAAOC,QAAP,MAAqB,YAArB;AAEA,OAAO,uBAAP;AAEA,OAAO,SAASC,cAAT,GAA0B;AAAA,0BAQzBT,gBAAgB,CAAC,SAAD,CARS;AAAA,MAEVU,oBAFU,qBAEzBC,aAFyB;AAAA,MAGhBC,0BAHgB,qBAGzBC,OAHyB;AAAA,MAINC,oBAJM,qBAIzBC,iBAJyB;AAAA,MAKjBC,aALiB,qBAKzBC,MALyB;AAAA,MAMXC,mBANW,qBAMzBC,YANyB;AAAA,MAOzBC,+BAPyB,qBAOzBA,+BAPyB;;AAU7B,SACI,0CACKA,+BAA+B,GAC5B,oBAAC,YAAD;AAAc,IAAA,YAAY,MAA1B;AAA2B,IAAA,iBAAiB,MAA5C;AAA6C,IAAA,cAAc;AAA3D,KACI,oBAAC,oBAAD;AACI,IAAA,aAAa,EAAEV,oBADnB;AAEI,IAAA,MAAM,EAAEM,aAFZ;AAGI,IAAA,YAAY,EAAEE,mBAHlB;AAII,yBAAmBjB,mBAAmB,CAACoB;AAJ3C,IADJ,EAOI,oBAAC,IAAD,QACI,oBAAC,QAAD;AAAU,mBAAY,+BAAtB;AAAsD,IAAA,OAAO,EAAET;AAA/D,KACI,oBAAC,cAAD;AAAgB,IAAA,KAAK,EAAE,EAAvB;AAA2B,IAAA,MAAM,EAAE,EAAnC;AAAuC,IAAA,SAAS,EAAC;AAAjD,IADJ,EAEI,oBAAC,gBAAD,EAAsBJ,QAAQ,CAACc,uBAA/B,CAFJ,CADJ,EAKI,oBAAC,QAAD;AAAU,mBAAY,yBAAtB;AAAgD,IAAA,OAAO,EAAER;AAAzD,KACI,oBAAC,QAAD;AAAU,IAAA,KAAK,EAAE,EAAjB;AAAqB,IAAA,MAAM,EAAE,EAA7B;AAAiC,IAAA,SAAS,EAAC;AAA3C,IADJ,EAEI,oBAAC,gBAAD,EAAsBN,QAAQ,CAACe,iBAA/B,CAFJ,CALJ,CAPJ,CAD4B,GAoB5B,oBAAC,oBAAD;AACI,IAAA,aAAa,EAAEb,oBADnB;AAEI,yBAAmBT,mBAAmB,CAACoB,IAF3C;AAGI,IAAA,OAAO,EAAET,0BAHb;AAII,IAAA,MAAM,EAAEI,aAJZ;AAKI,IAAA,YAAY,EAAEE;AALlB,IArBR,CADJ;AAgCH;AAED,eAAeT,cAAf","sourcesContent":["import React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\n// @ts-ignore Module is written in Flow\nimport { useFeatureConfig } from '../common/feature-checking';\n// @ts-ignore Module is written in Flow\nimport { SIDEBAR_NAV_TARGETS } from '../common/interactionTargets';\n\n// @ts-ignore Module is written in Flow\nimport DropdownMenu from '../../components/dropdown-menu';\nimport SidebarNavSignButton from './SidebarNavSignButton';\nimport SignMe32 from '../../icon/fill/SignMe32';\nimport SignMeOthers32 from '../../icon/fill/SignMeOthers32';\nimport { Menu, MenuItem } from '../../components/menu';\n\n// @ts-ignore Module is written in Flow\nimport messages from './messages';\n\nimport './SidebarNavSign.scss';\n\nexport function SidebarNavSign() {\n    const {\n        blockedReason: boxSignBlockedReason,\n        onClick: onBoxClickRequestSignature,\n        onClickSignMyself: onBoxClickSignMyself,\n        status: boxSignStatus,\n        targetingApi: boxSignTargetingApi,\n        isSignRemoveInterstitialEnabled,\n    } = useFeatureConfig('boxSign');\n\n    return (\n        <>\n            {isSignRemoveInterstitialEnabled ? (\n                <DropdownMenu isResponsive constrainToWindow isRightAligned>\n                    <SidebarNavSignButton\n                        blockedReason={boxSignBlockedReason}\n                        status={boxSignStatus}\n                        targetingApi={boxSignTargetingApi}\n                        data-resin-target={SIDEBAR_NAV_TARGETS.SIGN}\n                    />\n                    <Menu>\n                        <MenuItem data-testid=\"sign-request-signature-button\" onClick={onBoxClickRequestSignature}>\n                            <SignMeOthers32 width={16} height={16} className=\"bcs-SidebarNavSign-icon\" />\n                            <FormattedMessage {...messages.boxSignRequestSignature} />\n                        </MenuItem>\n                        <MenuItem data-testid=\"sign-sign-myself-button\" onClick={onBoxClickSignMyself}>\n                            <SignMe32 width={16} height={16} className=\"bcs-SidebarNavSign-icon\" />\n                            <FormattedMessage {...messages.boxSignSignMyself} />\n                        </MenuItem>\n                    </Menu>\n                </DropdownMenu>\n            ) : (\n                <SidebarNavSignButton\n                    blockedReason={boxSignBlockedReason}\n                    data-resin-target={SIDEBAR_NAV_TARGETS.SIGN}\n                    onClick={onBoxClickRequestSignature}\n                    status={boxSignStatus}\n                    targetingApi={boxSignTargetingApi}\n                />\n            )}\n        </>\n    );\n}\n\nexport default SidebarNavSign;\n"],"file":"SidebarNavSign.js"}

package/es/elements/content-sidebar/SidebarNavSign.scss

@@ -1,27 +1,5 @@
-@import './mixins';
-@import '../common/variables';
+@import '../../styles/variables';
 
-.bcs-SidebarNavSign {
-    @include bdl-SidebarNavButton;
-}
-
-.bcs-SidebarNavSign-icon {
-    @include bdl-SidebarNavIcon;
-}
-
-.bcs-SidebarNavSign-icon--grayscale {
-    display: none;
-    margin-top: 2px; //for visual alignment
-}
-
-.is-responsive-web {
-    @include breakpoint($medium-screen) {
-        .bcs-SidebarNavSign-icon {
-            display: none;
-        }
-
-        .bcs-SidebarNavSign-icon--grayscale {
-            display: inline;
-        }
-    }
+.bcs-SidebarNavSign-icon path {
+    fill: $bdl-gray;
 }

package/es/elements/content-sidebar/SidebarNavSignButton.js

@@ -0,0 +1,79 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import classnames from 'classnames';
+import { injectIntl } from 'react-intl';
+import BoxSign28 from '../../icon/logo/BoxSign28';
+import Sign16 from '../../icon/fill/Sign16';
+import PlainButton from '../../components/plain-button'; // @ts-ignore Module is written in Flow
+
+import TargetedClickThroughGuideTooltip from '../../features/targeting/TargetedClickThroughGuideTooltip';
+import Tooltip, { TooltipPosition } from '../../components/tooltip'; // @ts-ignore Module is written in Flow
+
+import messages from './messages';
+import './SidebarNavSignButton.scss';
+export var PlaceholderTooltip = function PlaceholderTooltip(_ref) {
+  var children = _ref.children;
+  return children;
+};
+export function SidebarNavSignButton(_ref2) {
+  var blockedReason = _ref2.blockedReason,
+      intl = _ref2.intl,
+      status = _ref2.status,
+      targetingApi = _ref2.targetingApi,
+      rest = _objectWithoutProperties(_ref2, ["blockedReason", "intl", "status", "targetingApi"]);
+
+  var isSignDisabled = !!blockedReason;
+  var isTargeted = targetingApi && targetingApi.canShow;
+  var FtuxTooltip = !isSignDisabled && isTargeted ? TargetedClickThroughGuideTooltip : PlaceholderTooltip;
+  var label = intl.formatMessage(status === 'active' ? messages.boxSignSignature : messages.boxSignRequest);
+  var buttonClassName = classnames('bcs-SidebarNavSignButton', {
+    'bdl-is-disabled': isSignDisabled
+  });
+  var tooltipMessage = label;
+
+  switch (blockedReason) {
+    case 'shield-download':
+    case 'shared-link':
+    case 'shield-sign':
+      tooltipMessage = intl.formatMessage(messages.boxSignSecurityBlockedTooltip);
+      break;
+
+    case 'watermark':
+      tooltipMessage = intl.formatMessage(messages.boxSignWatermarkBlockedTooltip);
+      break;
+
+    default:
+  }
+
+  return React.createElement(FtuxTooltip, {
+    body: intl.formatMessage(messages.boxSignFtuxBody),
+    position: TooltipPosition.MIDDLE_LEFT,
+    shouldTarget: isTargeted,
+    title: intl.formatMessage(messages.boxSignFtuxTitle),
+    useTargetingApi: function useTargetingApi() {
+      return targetingApi;
+    }
+  }, React.createElement(Tooltip, {
+    isDisabled: isTargeted,
+    position: TooltipPosition.MIDDLE_LEFT,
+    text: tooltipMessage
+  }, React.createElement(PlainButton, _extends({
+    "aria-label": label,
+    className: buttonClassName,
+    "data-testid": "sign-button",
+    isDisabled: isSignDisabled
+  }, rest), React.createElement(BoxSign28, {
+    className: "bcs-SidebarNavSignButton-icon"
+  }), React.createElement(Sign16, {
+    width: 20,
+    height: 20,
+    className: "bcs-SidebarNavSignButton-icon--grayscale"
+  }))));
+}
+export default injectIntl(SidebarNavSignButton);
+//# sourceMappingURL=SidebarNavSignButton.js.map

package/es/elements/content-sidebar/SidebarNavSignButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/elements/content-sidebar/SidebarNavSignButton.tsx"],"names":["React","classnames","injectIntl","BoxSign28","Sign16","PlainButton","TargetedClickThroughGuideTooltip","Tooltip","TooltipPosition","messages","PlaceholderTooltip","children","SidebarNavSignButton","blockedReason","intl","status","targetingApi","rest","isSignDisabled","isTargeted","canShow","FtuxTooltip","label","formatMessage","boxSignSignature","boxSignRequest","buttonClassName","tooltipMessage","boxSignSecurityBlockedTooltip","boxSignWatermarkBlockedTooltip","boxSignFtuxBody","MIDDLE_LEFT","boxSignFtuxTitle"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,UAAT,QAAsC,YAAtC;AACA,OAAOC,SAAP,MAAsB,2BAAtB;AACA,OAAOC,MAAP,MAAmB,wBAAnB;AACA,OAAOC,WAAP,MAA8C,+BAA9C,C,CACA;;AACA,OAAOC,gCAAP,MAA6C,2DAA7C;AACA,OAAOC,OAAP,IAAkBC,eAAlB,QAAyC,0BAAzC,C,CACA;;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,OAAO,6BAAP;AAcA,OAAO,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB;AAAA,MAAGC,QAAH,QAAGA,QAAH;AAAA,SAAiDA,QAAjD;AAAA,CAA3B;AAEP,OAAO,SAASC,oBAAT,QAA6F;AAAA,MAA7DC,aAA6D,SAA7DA,aAA6D;AAAA,MAA9CC,IAA8C,SAA9CA,IAA8C;AAAA,MAAxCC,MAAwC,SAAxCA,MAAwC;AAAA,MAAhCC,YAAgC,SAAhCA,YAAgC;AAAA,MAAfC,IAAe;;AAChG,MAAMC,cAAc,GAAG,CAAC,CAACL,aAAzB;AACA,MAAMM,UAAU,GAAGH,YAAY,IAAIA,YAAY,CAACI,OAAhD;AACA,MAAMC,WAAW,GAAG,CAACH,cAAD,IAAmBC,UAAnB,GAAgCb,gCAAhC,GAAmEI,kBAAvF;AACA,MAAMY,KAAK,GAAGR,IAAI,CAACS,aAAL,CAAmBR,MAAM,KAAK,QAAX,GAAsBN,QAAQ,CAACe,gBAA/B,GAAkDf,QAAQ,CAACgB,cAA9E,CAAd;AACA,MAAMC,eAAe,GAAGzB,UAAU,CAAC,0BAAD,EAA6B;AAAE,uBAAmBiB;AAArB,GAA7B,CAAlC;AAEA,MAAIS,cAAc,GAAGL,KAArB;;AAEA,UAAQT,aAAR;AACI,SAAK,iBAAL;AACA,SAAK,aAAL;AACA,SAAK,aAAL;AACIc,MAAAA,cAAc,GAAGb,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACmB,6BAA5B,CAAjB;AACA;;AACJ,SAAK,WAAL;AACID,MAAAA,cAAc,GAAGb,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACoB,8BAA5B,CAAjB;AACA;;AACJ;AATJ;;AAYA,SACI,oBAAC,WAAD;AACI,IAAA,IAAI,EAAEf,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACqB,eAA5B,CADV;AAEI,IAAA,QAAQ,EAAEtB,eAAe,CAACuB,WAF9B;AAGI,IAAA,YAAY,EAAEZ,UAHlB;AAII,IAAA,KAAK,EAAEL,IAAI,CAACS,aAAL,CAAmBd,QAAQ,CAACuB,gBAA5B,CAJX;AAKI,IAAA,eAAe,EAAE;AAAA,aAAMhB,YAAN;AAAA;AALrB,KAOI,oBAAC,OAAD;AAAS,IAAA,UAAU,EAAEG,UAArB;AAAiC,IAAA,QAAQ,EAAEX,eAAe,CAACuB,WAA3D;AAAwE,IAAA,IAAI,EAAEJ;AAA9E,KACI,oBAAC,WAAD;AACI,kBAAYL,KADhB;AAEI,IAAA,SAAS,EAAEI,eAFf;AAGI,mBAAY,aAHhB;AAII,IAAA,UAAU,EAAER;AAJhB,KAKQD,IALR,GAOI,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAC;AAArB,IAPJ,EAQI,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE,EAAf;AAAmB,IAAA,MAAM,EAAE,EAA3B;AAA+B,IAAA,SAAS,EAAC;AAAzC,IARJ,CADJ,CAPJ,CADJ;AAsBH;AAED,eAAef,UAAU,CAACU,oBAAD,CAAzB","sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { injectIntl, IntlShape } from 'react-intl';\nimport BoxSign28 from '../../icon/logo/BoxSign28';\nimport Sign16 from '../../icon/fill/Sign16';\nimport PlainButton, { PlainButtonProps } from '../../components/plain-button';\n// @ts-ignore Module is written in Flow\nimport TargetedClickThroughGuideTooltip from '../../features/targeting/TargetedClickThroughGuideTooltip';\nimport Tooltip, { TooltipPosition } from '../../components/tooltip';\n// @ts-ignore Module is written in Flow\nimport messages from './messages';\nimport './SidebarNavSignButton.scss';\n\nexport type Props = PlainButtonProps & {\n    blockedReason?: string;\n    intl: IntlShape;\n    status?: string;\n    targetingApi?: {\n        canShow: boolean;\n        onClose: () => void;\n        onComplete: () => void;\n        onShow: () => void;\n    };\n};\n\nexport const PlaceholderTooltip = ({ children }: { children: React.ReactNode }) => children;\n\nexport function SidebarNavSignButton({ blockedReason, intl, status, targetingApi, ...rest }: Props) {\n    const isSignDisabled = !!blockedReason;\n    const isTargeted = targetingApi && targetingApi.canShow;\n    const FtuxTooltip = !isSignDisabled && isTargeted ? TargetedClickThroughGuideTooltip : PlaceholderTooltip;\n    const label = intl.formatMessage(status === 'active' ? messages.boxSignSignature : messages.boxSignRequest);\n    const buttonClassName = classnames('bcs-SidebarNavSignButton', { 'bdl-is-disabled': isSignDisabled });\n\n    let tooltipMessage = label;\n\n    switch (blockedReason) {\n        case 'shield-download':\n        case 'shared-link':\n        case 'shield-sign':\n            tooltipMessage = intl.formatMessage(messages.boxSignSecurityBlockedTooltip);\n            break;\n        case 'watermark':\n            tooltipMessage = intl.formatMessage(messages.boxSignWatermarkBlockedTooltip);\n            break;\n        default:\n    }\n\n    return (\n        <FtuxTooltip\n            body={intl.formatMessage(messages.boxSignFtuxBody)}\n            position={TooltipPosition.MIDDLE_LEFT}\n            shouldTarget={isTargeted}\n            title={intl.formatMessage(messages.boxSignFtuxTitle)}\n            useTargetingApi={() => targetingApi}\n        >\n            <Tooltip isDisabled={isTargeted} position={TooltipPosition.MIDDLE_LEFT} text={tooltipMessage}>\n                <PlainButton\n                    aria-label={label}\n                    className={buttonClassName}\n                    data-testid=\"sign-button\"\n                    isDisabled={isSignDisabled}\n                    {...rest}\n                >\n                    <BoxSign28 className=\"bcs-SidebarNavSignButton-icon\" />\n                    <Sign16 width={20} height={20} className=\"bcs-SidebarNavSignButton-icon--grayscale\" />\n                </PlainButton>\n            </Tooltip>\n        </FtuxTooltip>\n    );\n}\n\nexport default injectIntl(SidebarNavSignButton);\n"],"file":"SidebarNavSignButton.js"}

package/es/elements/content-sidebar/SidebarNavSignButton.scss

@@ -0,0 +1,27 @@
+@import './mixins';
+@import '../common/variables';
+
+.bcs-SidebarNavSignButton {
+    @include bdl-SidebarNavButton;
+}
+
+.bcs-SidebarNavSignButton-icon {
+    @include bdl-SidebarNavIcon;
+}
+
+.bcs-SidebarNavSignButton-icon--grayscale {
+    display: none;
+    margin-top: 2px; //for visual alignment
+}
+
+.is-responsive-web {
+    @include breakpoint($medium-screen) {
+        .bcs-SidebarNavSignButton-icon {
+            display: none;
+        }
+
+        .bcs-SidebarNavSignButton-icon--grayscale {
+            display: inline;
+        }
+    }
+}

package/es/elements/content-sidebar/activity-feed/Avatar.js

@@ -95,13 +95,15 @@ function (_React$PureComponent) {
     key: "render",
     value: function render() {
       var _this$props2 = this.props,
-          user = _this$props2.user,
-          className = _this$props2.className;
+          badgeIcon = _this$props2.badgeIcon,
+          className = _this$props2.className,
+          user = _this$props2.user;
       var avatarUrl = this.state.avatarUrl;
       var id = user.id,
           name = user.name;
       return React.createElement(AvatarComponent, {
         avatarUrl: avatarUrl,
+        badgeIcon: badgeIcon,
         className: className,
         id: id,
         name: name

package/es/elements/content-sidebar/activity-feed/Avatar.js.flow

@@ -9,6 +9,7 @@ import type { GetAvatarUrlCallback } from '../../common/flowTypes';
 import type { User } from '../../../common/types/core';
 
 type Props = {
+    badgeIcon?: React.Element<any>,
     className?: string,
     getAvatarUrl?: GetAvatarUrlCallback,
     user: User,
@@ -61,11 +62,13 @@ class Avatar extends React.PureComponent<Props, State> {
     }
 
     render() {
-        const { user, className }: Props = this.props;
+        const { badgeIcon, className, user }: Props = this.props;
         const { avatarUrl }: State = this.state;
         const { id, name } = user;
 
-        return <AvatarComponent avatarUrl={avatarUrl} className={className} id={id} name={name} />;
+        return (
+            <AvatarComponent avatarUrl={avatarUrl} badgeIcon={badgeIcon} className={className} id={id} name={name} />
+        );
     }
 }
 

package/es/elements/content-sidebar/activity-feed/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/content-sidebar/activity-feed/Avatar.js"],"names":["React","AvatarComponent","Avatar","avatarUrl","isMounted","setState","props","user","getAvatarUrl","avatar_url","id","avatarPromise","Promise","resolve","then","getAvatarUrlHandler","className","state","name","PureComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;;AAKA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,eAAP,MAA4B,4BAA5B;;IAcMC,M;;;;;;;;;;;;;;;;;;4DACM;AACJC,MAAAA,SAAS,EAAE;AADP,K;;gEAIa,K;;0EAOC,UAACA,SAAD,EAAwB;AAC1C,UAAI,MAAKC,SAAT,EAAoB;AAChB,cAAKC,QAAL,CAAc;AACVF,UAAAA,SAAS,EAATA;AADU,SAAd;AAGH;AACJ,K;;;;;;;;AAED;;;;;mCAKiC;AAAA,wBACc,KAAKG,KADnB;AAAA,yCACrBC,IADqB;AAAA,UACrBA,IADqB,iCACd,EADc;AAAA,UACVC,YADU,eACVA,YADU;AAAA,6BAEKD,IAFL,CAErBE,UAFqB;AAAA,UAErBA,UAFqB,iCAER,IAFQ;AAAA,UAEFC,EAFE,GAEKH,IAFL,CAEFG,EAFE;AAI7B,UAAMC,aAAa,GAAGD,EAAE,IAAIF,YAAN,GAAqBA,YAAY,WAAIE,EAAJ,EAAjC,GAA6CE,OAAO,CAACC,OAAR,CAAgBJ,UAAhB,CAAnE;AACA,aAAOE,aAAa,CAACG,IAAd,CAAmB,KAAKC,mBAAxB,CAAP;AACH;;;wCAEmB;AAChB,WAAKX,SAAL,GAAiB,IAAjB;AACA,WAAKI,YAAL;AACH;;;2CAEsB;AACnB,WAAKJ,SAAL,GAAiB,KAAjB;AACH;;;6BAEQ;AAAA,yBAC8B,KAAKE,KADnC;AAAA,UACGC,IADH,gBACGA,IADH;AAAA,UACSS,SADT,gBACSA,SADT;AAAA,UAEGb,SAFH,GAEwB,KAAKc,KAF7B,CAEGd,SAFH;AAAA,UAGGO,EAHH,GAGgBH,IAHhB,CAGGG,EAHH;AAAA,UAGOQ,IAHP,GAGgBX,IAHhB,CAGOW,IAHP;AAKL,aAAO,oBAAC,eAAD;AAAiB,QAAA,SAAS,EAAEf,SAA5B;AAAuC,QAAA,SAAS,EAAEa,SAAlD;AAA6D,QAAA,EAAE,EAAEN,EAAjE;AAAqE,QAAA,IAAI,EAAEQ;AAA3E,QAAP;AACH;;;;EAhDgBlB,KAAK,CAACmB,a;;AAmD3B,eAAejB,MAAf","sourcesContent":["/**\n * @flow\n * @file avatar component\n * @author Box\n */\nimport * as React from 'react';\nimport AvatarComponent from '../../../components/avatar';\nimport type { GetAvatarUrlCallback } from '../../common/flowTypes';\nimport type { User } from '../../../common/types/core';\n\ntype Props = {\n    className?: string,\n    getAvatarUrl?: GetAvatarUrlCallback,\n    user: User,\n};\n\ntype State = {\n    avatarUrl?: ?string,\n};\n\nclass Avatar extends React.PureComponent<Props, State> {\n    state = {\n        avatarUrl: null,\n    };\n\n    isMounted: boolean = false;\n\n    /**\n     * Success handler for getting avatar url\n     *\n     * @param {string} avatarUrl the user avatar url\n     */\n    getAvatarUrlHandler = (avatarUrl: ?string) => {\n        if (this.isMounted) {\n            this.setState({\n                avatarUrl,\n            });\n        }\n    };\n\n    /**\n     * Gets the avatar URL for the user from the getAvatarUrl prop\n     *\n     * @return {Promise<?string>} Promise which resolve with the avatar url string\n     */\n    getAvatarUrl(): Promise<?string> {\n        const { user = {}, getAvatarUrl }: Props = this.props;\n        const { avatar_url = null, id } = user;\n\n        const avatarPromise = id && getAvatarUrl ? getAvatarUrl(`${id}`) : Promise.resolve(avatar_url);\n        return avatarPromise.then(this.getAvatarUrlHandler);\n    }\n\n    componentDidMount() {\n        this.isMounted = true;\n        this.getAvatarUrl();\n    }\n\n    componentWillUnmount() {\n        this.isMounted = false;\n    }\n\n    render() {\n        const { user, className }: Props = this.props;\n        const { avatarUrl }: State = this.state;\n        const { id, name } = user;\n\n        return <AvatarComponent avatarUrl={avatarUrl} className={className} id={id} name={name} />;\n    }\n}\n\nexport default Avatar;\n"],"file":"Avatar.js"}
+{"version":3,"sources":["../../../../src/elements/content-sidebar/activity-feed/Avatar.js"],"names":["React","AvatarComponent","Avatar","avatarUrl","isMounted","setState","props","user","getAvatarUrl","avatar_url","id","avatarPromise","Promise","resolve","then","getAvatarUrlHandler","badgeIcon","className","state","name","PureComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;;AAKA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,eAAP,MAA4B,4BAA5B;;IAeMC,M;;;;;;;;;;;;;;;;;;4DACM;AACJC,MAAAA,SAAS,EAAE;AADP,K;;gEAIa,K;;0EAOC,UAACA,SAAD,EAAwB;AAC1C,UAAI,MAAKC,SAAT,EAAoB;AAChB,cAAKC,QAAL,CAAc;AACVF,UAAAA,SAAS,EAATA;AADU,SAAd;AAGH;AACJ,K;;;;;;;;AAED;;;;;mCAKiC;AAAA,wBACc,KAAKG,KADnB;AAAA,yCACrBC,IADqB;AAAA,UACrBA,IADqB,iCACd,EADc;AAAA,UACVC,YADU,eACVA,YADU;AAAA,6BAEKD,IAFL,CAErBE,UAFqB;AAAA,UAErBA,UAFqB,iCAER,IAFQ;AAAA,UAEFC,EAFE,GAEKH,IAFL,CAEFG,EAFE;AAI7B,UAAMC,aAAa,GAAGD,EAAE,IAAIF,YAAN,GAAqBA,YAAY,WAAIE,EAAJ,EAAjC,GAA6CE,OAAO,CAACC,OAAR,CAAgBJ,UAAhB,CAAnE;AACA,aAAOE,aAAa,CAACG,IAAd,CAAmB,KAAKC,mBAAxB,CAAP;AACH;;;wCAEmB;AAChB,WAAKX,SAAL,GAAiB,IAAjB;AACA,WAAKI,YAAL;AACH;;;2CAEsB;AACnB,WAAKJ,SAAL,GAAiB,KAAjB;AACH;;;6BAEQ;AAAA,yBACyC,KAAKE,KAD9C;AAAA,UACGU,SADH,gBACGA,SADH;AAAA,UACcC,SADd,gBACcA,SADd;AAAA,UACyBV,IADzB,gBACyBA,IADzB;AAAA,UAEGJ,SAFH,GAEwB,KAAKe,KAF7B,CAEGf,SAFH;AAAA,UAGGO,EAHH,GAGgBH,IAHhB,CAGGG,EAHH;AAAA,UAGOS,IAHP,GAGgBZ,IAHhB,CAGOY,IAHP;AAKL,aACI,oBAAC,eAAD;AAAiB,QAAA,SAAS,EAAEhB,SAA5B;AAAuC,QAAA,SAAS,EAAEa,SAAlD;AAA6D,QAAA,SAAS,EAAEC,SAAxE;AAAmF,QAAA,EAAE,EAAEP,EAAvF;AAA2F,QAAA,IAAI,EAAES;AAAjG,QADJ;AAGH;;;;EAlDgBnB,KAAK,CAACoB,a;;AAqD3B,eAAelB,MAAf","sourcesContent":["/**\n * @flow\n * @file avatar component\n * @author Box\n */\nimport * as React from 'react';\nimport AvatarComponent from '../../../components/avatar';\nimport type { GetAvatarUrlCallback } from '../../common/flowTypes';\nimport type { User } from '../../../common/types/core';\n\ntype Props = {\n    badgeIcon?: React.Element<any>,\n    className?: string,\n    getAvatarUrl?: GetAvatarUrlCallback,\n    user: User,\n};\n\ntype State = {\n    avatarUrl?: ?string,\n};\n\nclass Avatar extends React.PureComponent<Props, State> {\n    state = {\n        avatarUrl: null,\n    };\n\n    isMounted: boolean = false;\n\n    /**\n     * Success handler for getting avatar url\n     *\n     * @param {string} avatarUrl the user avatar url\n     */\n    getAvatarUrlHandler = (avatarUrl: ?string) => {\n        if (this.isMounted) {\n            this.setState({\n                avatarUrl,\n            });\n        }\n    };\n\n    /**\n     * Gets the avatar URL for the user from the getAvatarUrl prop\n     *\n     * @return {Promise<?string>} Promise which resolve with the avatar url string\n     */\n    getAvatarUrl(): Promise<?string> {\n        const { user = {}, getAvatarUrl }: Props = this.props;\n        const { avatar_url = null, id } = user;\n\n        const avatarPromise = id && getAvatarUrl ? getAvatarUrl(`${id}`) : Promise.resolve(avatar_url);\n        return avatarPromise.then(this.getAvatarUrlHandler);\n    }\n\n    componentDidMount() {\n        this.isMounted = true;\n        this.getAvatarUrl();\n    }\n\n    componentWillUnmount() {\n        this.isMounted = false;\n    }\n\n    render() {\n        const { badgeIcon, className, user }: Props = this.props;\n        const { avatarUrl }: State = this.state;\n        const { id, name } = user;\n\n        return (\n            <AvatarComponent avatarUrl={avatarUrl} badgeIcon={badgeIcon} className={className} id={id} name={name} />\n        );\n    }\n}\n\nexport default Avatar;\n"],"file":"Avatar.js"}