@razorpay/blade 11.21.9 → 11.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/lib/native/components/ActionList/ActionListItem.js +12 -12
- package/build/lib/native/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseFooter.js +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseFooter.js.map +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseHeader.js +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/native/components/BaseMenu/BaseMenuContext.js +6 -0
- package/build/lib/native/components/BaseMenu/BaseMenuContext.js.map +1 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/BaseMenuItem.js +22 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/BaseMenuItem.js.map +1 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.native.js +12 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.native.js.map +1 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js +12 -0
- package/build/lib/native/components/BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js.map +1 -0
- package/build/lib/native/components/Button/BaseButton/BaseButton.js +1 -1
- package/build/lib/native/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/native/components/Button/Button/Button.js +1 -1
- package/build/lib/native/components/Button/Button/Button.js.map +1 -1
- package/build/lib/native/components/Link/BaseLink/BaseLink.js +1 -1
- package/build/lib/native/components/Link/BaseLink/BaseLink.js.map +1 -1
- package/build/lib/native/components/Link/Link/Link.js +1 -1
- package/build/lib/native/components/Link/Link/Link.js.map +1 -1
- package/build/lib/native/components/Menu/Menu.native.js +17 -0
- package/build/lib/native/components/Menu/Menu.native.js.map +1 -0
- package/build/lib/native/components/Menu/MenuItem.native.js +17 -0
- package/build/lib/native/components/Menu/MenuItem.native.js.map +1 -0
- package/build/lib/native/components/Menu/MenuOverlay.native.js +17 -0
- package/build/lib/native/components/Menu/MenuOverlay.native.js.map +1 -0
- package/build/lib/native/components/Menu/VisualSubComponents/MenuDivider.native.js +17 -0
- package/build/lib/native/components/Menu/VisualSubComponents/MenuDivider.native.js.map +1 -0
- package/build/lib/native/components/Menu/VisualSubComponents/MenuHeaderFooter.native.js +17 -0
- package/build/lib/native/components/Menu/VisualSubComponents/MenuHeaderFooter.native.js.map +1 -0
- package/build/lib/native/components/SideNav/tokens.js +12 -0
- package/build/lib/native/components/SideNav/tokens.js.map +1 -0
- package/build/lib/native/components/TopNav/TabNav/TabNav.native.js +17 -0
- package/build/lib/native/components/TopNav/TabNav/TabNav.native.js.map +1 -0
- package/build/lib/native/components/TopNav/TabNav/TabNavItem.native.js +17 -0
- package/build/lib/native/components/TopNav/TabNav/TabNavItem.native.js.map +1 -0
- package/build/lib/native/components/TopNav/TopNav.native.js +17 -0
- package/build/lib/native/components/TopNav/TopNav.native.js.map +1 -0
- package/build/lib/native/components/index.js +9 -0
- package/build/lib/native/components/index.js.map +1 -1
- package/build/lib/native/tokens/global/size.js +1 -1
- package/build/lib/native/tokens/global/size.js.map +1 -1
- package/build/lib/native/utils/metaAttribute/metaConstants.js +1 -1
- package/build/lib/native/utils/metaAttribute/metaConstants.js.map +1 -1
- package/build/lib/web/development/components/ActionList/ActionListItem.js +43 -118
- package/build/lib/web/development/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/web/development/components/Avatar/Avatar.web.js +29 -6
- package/build/lib/web/development/components/Avatar/Avatar.web.js.map +1 -1
- package/build/lib/web/development/components/Avatar/AvatarButton.js +25 -3
- package/build/lib/web/development/components/Avatar/AvatarButton.js.map +1 -1
- package/build/lib/web/development/components/BaseHeaderFooter/BaseFooter.js +2 -1
- package/build/lib/web/development/components/BaseHeaderFooter/BaseFooter.js.map +1 -1
- package/build/lib/web/development/components/BaseHeaderFooter/BaseHeader.js +4 -0
- package/build/lib/web/development/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/web/development/components/BaseMenu/BaseMenuContext.js +10 -0
- package/build/lib/web/development/components/BaseMenu/BaseMenuContext.js.map +1 -0
- package/build/lib/web/development/components/BaseMenu/BaseMenuItem/BaseMenuItem.js +124 -0
- package/build/lib/web/development/components/BaseMenu/BaseMenuItem/BaseMenuItem.js.map +1 -0
- package/build/lib/web/development/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.web.js +41 -0
- package/build/lib/web/development/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.web.js.map +1 -0
- package/build/lib/web/development/components/{ActionList/styles/getBaseActionListItemStyles.js → BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js} +10 -9
- package/build/lib/web/development/components/BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js.map +1 -0
- package/build/lib/web/development/components/BaseMenu/index.js +3 -0
- package/build/lib/web/development/components/BaseMenu/index.js.map +1 -0
- package/build/lib/web/development/components/BaseMenu/tokens.js +8 -0
- package/build/lib/web/development/components/BaseMenu/tokens.js.map +1 -0
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js +16 -7
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/development/components/Button/Button/Button.js +8 -2
- package/build/lib/web/development/components/Button/Button/Button.js.map +1 -1
- package/build/lib/web/development/components/DatePicker/QuickSelection/QuickSelectionItem.web.js +6 -27
- package/build/lib/web/development/components/DatePicker/QuickSelection/QuickSelectionItem.web.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/DropdownOverlay.web.js +3 -2
- package/build/lib/web/development/components/Dropdown/DropdownOverlay.web.js.map +1 -1
- package/build/lib/web/development/components/Link/BaseLink/BaseLink.js +5 -1
- package/build/lib/web/development/components/Link/BaseLink/BaseLink.js.map +1 -1
- package/build/lib/web/development/components/Link/Link/Link.js +6 -2
- package/build/lib/web/development/components/Link/Link/Link.js.map +1 -1
- package/build/lib/web/development/components/Menu/Menu.web.js +99 -0
- package/build/lib/web/development/components/Menu/Menu.web.js.map +1 -0
- package/build/lib/web/development/components/Menu/MenuItem.web.js +63 -0
- package/build/lib/web/development/components/Menu/MenuItem.web.js.map +1 -0
- package/build/lib/web/development/components/Menu/MenuOverlay.web.js +59 -0
- package/build/lib/web/development/components/Menu/MenuOverlay.web.js.map +1 -0
- package/build/lib/web/development/components/Menu/VisualSubComponents/MenuDivider.web.js +18 -0
- package/build/lib/web/development/components/Menu/VisualSubComponents/MenuDivider.web.js.map +1 -0
- package/build/lib/web/development/components/Menu/VisualSubComponents/MenuHeaderFooter.web.js +65 -0
- package/build/lib/web/development/components/Menu/VisualSubComponents/MenuHeaderFooter.web.js.map +1 -0
- package/build/lib/web/development/components/Menu/index.js +6 -0
- package/build/lib/web/development/components/Menu/index.js.map +1 -0
- package/build/lib/web/development/components/Menu/tokens.js +26 -0
- package/build/lib/web/development/components/Menu/tokens.js.map +1 -0
- package/build/lib/web/development/components/Menu/useMenu.js +178 -0
- package/build/lib/web/development/components/Menu/useMenu.js.map +1 -0
- package/build/lib/web/development/components/SideNav/SideNav.web.js +5 -2
- package/build/lib/web/development/components/SideNav/SideNav.web.js.map +1 -1
- package/build/lib/web/development/components/SideNav/index.js +1 -0
- package/build/lib/web/development/components/SideNav/index.js.map +1 -1
- package/build/lib/web/development/components/SideNav/tokens.js +3 -2
- package/build/lib/web/development/components/SideNav/tokens.js.map +1 -1
- package/build/lib/web/development/components/Tooltip/Tooltip.web.js +1 -3
- package/build/lib/web/development/components/Tooltip/Tooltip.web.js.map +1 -1
- package/build/lib/web/development/components/TopNav/TabNav/TabNav.web.js +172 -0
- package/build/lib/web/development/components/TopNav/TabNav/TabNav.web.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TabNav/TabNavContext.js +18 -0
- package/build/lib/web/development/components/TopNav/TabNav/TabNavContext.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TabNav/TabNavItem.web.js +198 -0
- package/build/lib/web/development/components/TopNav/TabNav/TabNavItem.web.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TabNav/index.js +4 -0
- package/build/lib/web/development/components/TopNav/TabNav/index.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TabNav/types.js +2 -0
- package/build/lib/web/development/components/TopNav/TabNav/types.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TabNav/utils.js +48 -0
- package/build/lib/web/development/components/TopNav/TabNav/utils.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TopNav.web.js +158 -0
- package/build/lib/web/development/components/TopNav/TopNav.web.js.map +1 -0
- package/build/lib/web/development/components/TopNav/TopNavContext.js +13 -0
- package/build/lib/web/development/components/TopNav/TopNavContext.js.map +1 -0
- package/build/lib/web/development/components/TopNav/index.js +3 -0
- package/build/lib/web/development/components/TopNav/index.js.map +1 -0
- package/build/lib/web/development/components/index.js +11 -0
- package/build/lib/web/development/components/index.js.map +1 -1
- package/build/lib/web/development/tokens/global/size.js +4 -0
- package/build/lib/web/development/tokens/global/size.js.map +1 -1
- package/build/lib/web/development/utils/metaAttribute/metaConstants.js +9 -0
- package/build/lib/web/development/utils/metaAttribute/metaConstants.js.map +1 -1
- package/build/lib/web/production/components/ActionList/ActionListItem.js +43 -118
- package/build/lib/web/production/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/web/production/components/Avatar/Avatar.web.js +29 -6
- package/build/lib/web/production/components/Avatar/Avatar.web.js.map +1 -1
- package/build/lib/web/production/components/Avatar/AvatarButton.js +25 -3
- package/build/lib/web/production/components/Avatar/AvatarButton.js.map +1 -1
- package/build/lib/web/production/components/BaseHeaderFooter/BaseFooter.js +2 -1
- package/build/lib/web/production/components/BaseHeaderFooter/BaseFooter.js.map +1 -1
- package/build/lib/web/production/components/BaseHeaderFooter/BaseHeader.js +4 -0
- package/build/lib/web/production/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/web/production/components/BaseMenu/BaseMenuContext.js +10 -0
- package/build/lib/web/production/components/BaseMenu/BaseMenuContext.js.map +1 -0
- package/build/lib/web/production/components/BaseMenu/BaseMenuItem/BaseMenuItem.js +124 -0
- package/build/lib/web/production/components/BaseMenu/BaseMenuItem/BaseMenuItem.js.map +1 -0
- package/build/lib/web/production/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.web.js +41 -0
- package/build/lib/web/production/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.web.js.map +1 -0
- package/build/lib/web/production/components/{ActionList/styles/getBaseActionListItemStyles.js → BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js} +10 -9
- package/build/lib/web/production/components/BaseMenu/BaseMenuItem/getBaseMenuItemStyles.js.map +1 -0
- package/build/lib/web/production/components/BaseMenu/index.js +3 -0
- package/build/lib/web/production/components/BaseMenu/index.js.map +1 -0
- package/build/lib/web/production/components/BaseMenu/tokens.js +8 -0
- package/build/lib/web/production/components/BaseMenu/tokens.js.map +1 -0
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js +16 -7
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/production/components/Button/Button/Button.js +8 -2
- package/build/lib/web/production/components/Button/Button/Button.js.map +1 -1
- package/build/lib/web/production/components/DatePicker/QuickSelection/QuickSelectionItem.web.js +6 -27
- package/build/lib/web/production/components/DatePicker/QuickSelection/QuickSelectionItem.web.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/DropdownOverlay.web.js +3 -2
- package/build/lib/web/production/components/Dropdown/DropdownOverlay.web.js.map +1 -1
- package/build/lib/web/production/components/Link/BaseLink/BaseLink.js +5 -1
- package/build/lib/web/production/components/Link/BaseLink/BaseLink.js.map +1 -1
- package/build/lib/web/production/components/Link/Link/Link.js +6 -2
- package/build/lib/web/production/components/Link/Link/Link.js.map +1 -1
- package/build/lib/web/production/components/Menu/Menu.web.js +99 -0
- package/build/lib/web/production/components/Menu/Menu.web.js.map +1 -0
- package/build/lib/web/production/components/Menu/MenuItem.web.js +63 -0
- package/build/lib/web/production/components/Menu/MenuItem.web.js.map +1 -0
- package/build/lib/web/production/components/Menu/MenuOverlay.web.js +59 -0
- package/build/lib/web/production/components/Menu/MenuOverlay.web.js.map +1 -0
- package/build/lib/web/production/components/Menu/VisualSubComponents/MenuDivider.web.js +18 -0
- package/build/lib/web/production/components/Menu/VisualSubComponents/MenuDivider.web.js.map +1 -0
- package/build/lib/web/production/components/Menu/VisualSubComponents/MenuHeaderFooter.web.js +65 -0
- package/build/lib/web/production/components/Menu/VisualSubComponents/MenuHeaderFooter.web.js.map +1 -0
- package/build/lib/web/production/components/Menu/index.js +6 -0
- package/build/lib/web/production/components/Menu/index.js.map +1 -0
- package/build/lib/web/production/components/Menu/tokens.js +26 -0
- package/build/lib/web/production/components/Menu/tokens.js.map +1 -0
- package/build/lib/web/production/components/Menu/useMenu.js +178 -0
- package/build/lib/web/production/components/Menu/useMenu.js.map +1 -0
- package/build/lib/web/production/components/SideNav/SideNav.web.js +5 -2
- package/build/lib/web/production/components/SideNav/SideNav.web.js.map +1 -1
- package/build/lib/web/production/components/SideNav/index.js +1 -0
- package/build/lib/web/production/components/SideNav/index.js.map +1 -1
- package/build/lib/web/production/components/SideNav/tokens.js +3 -2
- package/build/lib/web/production/components/SideNav/tokens.js.map +1 -1
- package/build/lib/web/production/components/Tooltip/Tooltip.web.js +1 -3
- package/build/lib/web/production/components/Tooltip/Tooltip.web.js.map +1 -1
- package/build/lib/web/production/components/TopNav/TabNav/TabNav.web.js +172 -0
- package/build/lib/web/production/components/TopNav/TabNav/TabNav.web.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TabNav/TabNavContext.js +18 -0
- package/build/lib/web/production/components/TopNav/TabNav/TabNavContext.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TabNav/TabNavItem.web.js +198 -0
- package/build/lib/web/production/components/TopNav/TabNav/TabNavItem.web.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TabNav/index.js +4 -0
- package/build/lib/web/production/components/TopNav/TabNav/index.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TabNav/types.js +2 -0
- package/build/lib/web/production/components/TopNav/TabNav/types.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TabNav/utils.js +48 -0
- package/build/lib/web/production/components/TopNav/TabNav/utils.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TopNav.web.js +158 -0
- package/build/lib/web/production/components/TopNav/TopNav.web.js.map +1 -0
- package/build/lib/web/production/components/TopNav/TopNavContext.js +13 -0
- package/build/lib/web/production/components/TopNav/TopNavContext.js.map +1 -0
- package/build/lib/web/production/components/TopNav/index.js +3 -0
- package/build/lib/web/production/components/TopNav/index.js.map +1 -0
- package/build/lib/web/production/components/index.js +11 -0
- package/build/lib/web/production/components/index.js.map +1 -1
- package/build/lib/web/production/tokens/global/size.js +4 -0
- package/build/lib/web/production/tokens/global/size.js.map +1 -1
- package/build/lib/web/production/utils/metaAttribute/metaConstants.js +9 -0
- package/build/lib/web/production/utils/metaAttribute/metaConstants.js.map +1 -1
- package/build/types/components/index.d.ts +883 -3
- package/build/types/components/index.native.d.ts +253 -2
- package/build/types/tokens/index.d.ts +4 -0
- package/build/types/tokens/index.native.d.ts +4 -0
- package/package.json +1 -1
- package/build/lib/native/components/ActionList/styles/StyledActionListItem.native.js +0 -8
- package/build/lib/native/components/ActionList/styles/StyledActionListItem.native.js.map +0 -1
- package/build/lib/native/components/ActionList/styles/getBaseActionListItemStyles.js +0 -11
- package/build/lib/native/components/ActionList/styles/getBaseActionListItemStyles.js.map +0 -1
- package/build/lib/web/development/components/ActionList/styles/StyledActionListItem.web.js +0 -33
- package/build/lib/web/development/components/ActionList/styles/StyledActionListItem.web.js.map +0 -1
- package/build/lib/web/development/components/ActionList/styles/getBaseActionListItemStyles.js.map +0 -1
- package/build/lib/web/production/components/ActionList/styles/StyledActionListItem.web.js +0 -33
- package/build/lib/web/production/components/ActionList/styles/StyledActionListItem.web.js.map +0 -1
- package/build/lib/web/production/components/ActionList/styles/getBaseActionListItemStyles.js.map +0 -1
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
import styled from 'styled-components/native';
|
|
3
|
-
import { StyledActionListItem } from './styles/StyledActionListItem.native.js';
|
|
4
3
|
import { componentIds } from './componentIds.js';
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
4
|
+
import { validateActionListItemProps, getNormalTextColor } from './actionListUtils.js';
|
|
5
|
+
import { getActionListItemRole, getActionListSectionRole } from './getA11yRoles.js';
|
|
7
6
|
import { Divider } from '../Divider/Divider.js';
|
|
8
7
|
import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
|
|
9
8
|
import { useDropdown } from '../Dropdown/useDropdown.js';
|
|
@@ -14,16 +13,22 @@ import '@babel/runtime/helpers/slicedToArray';
|
|
|
14
13
|
import 'react-native';
|
|
15
14
|
import '../../tokens/global/typography.js';
|
|
16
15
|
import '../../tokens/global/motion.js';
|
|
17
|
-
import { size } from '../../tokens/global/size.js';
|
|
18
16
|
import { isReactNative } from '../../utils/platform/isReactNative.js';
|
|
19
17
|
import { castWebType } from '../../utils/platform/castUtils.js';
|
|
20
18
|
import { makeSize } from '../../utils/makeSize/makeSize.js';
|
|
21
|
-
import
|
|
22
|
-
import {
|
|
19
|
+
import '../BladeProvider/useTheme.js';
|
|
20
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
23
21
|
import { Text } from '../Typography/Text/Text.js';
|
|
24
22
|
import '../Typography/Code/Code.js';
|
|
25
23
|
import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
|
|
26
24
|
import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
|
|
25
|
+
import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
|
|
26
|
+
import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.native.js';
|
|
27
|
+
import { Badge } from '../Badge/Badge.js';
|
|
28
|
+
import { Box } from '../Box/Box.js';
|
|
29
|
+
import { dropdownComponentIds } from '../Dropdown/dropdownComponentIds.js';
|
|
30
|
+
import { BaseMenuItem } from '../BaseMenu/BaseMenuItem/BaseMenuItem.js';
|
|
31
|
+
import { useBaseMenuItem } from '../BaseMenu/BaseMenuContext.js';
|
|
27
32
|
import { Checkbox } from '../Checkbox/Checkbox.js';
|
|
28
33
|
import '../Checkbox/CheckboxGroup/CheckboxGroupContext.js';
|
|
29
34
|
import '@gorhom/portal';
|
|
@@ -32,13 +37,8 @@ import '../BottomSheet/BottomSheetStack.js';
|
|
|
32
37
|
import 'react-native-svg';
|
|
33
38
|
import '../Icons/_Svg/Svg/Svg.native.js';
|
|
34
39
|
import '../VisuallyHidden/VisuallyHidden.native.js';
|
|
35
|
-
import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.native.js';
|
|
36
|
-
import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
|
|
37
|
-
import { Badge } from '../Badge/Badge.js';
|
|
38
|
-
import { Box } from '../Box/Box.js';
|
|
39
|
-
import { dropdownComponentIds } from '../Dropdown/dropdownComponentIds.js';
|
|
40
40
|
|
|
41
|
-
var
|
|
41
|
+
var StyledActionListSectionTitle=styled(BaseBox)(function(props){return {padding:makeSize(props.theme.spacing[3])};});var _ActionListSection=function _ActionListSection(_ref){var title=_ref.title,children=_ref.children,testID=_ref.testID,_hideDivider=_ref._hideDivider,_sectionChildValues=_ref._sectionChildValues;var _useDropdown=useDropdown(),hasAutoCompleteInBottomSheetHeader=_useDropdown.hasAutoCompleteInBottomSheetHeader,dropdownTriggerer=_useDropdown.dropdownTriggerer,filteredValues=_useDropdown.filteredValues;var hasAutoComplete=hasAutoCompleteInBottomSheetHeader||dropdownTriggerer===dropdownComponentIds.triggers.AutoComplete;var isSectionVisible=React__default.useMemo(function(){if(hasAutoComplete){var visibleActionListItemInSection=_sectionChildValues==null?void 0:_sectionChildValues.find(function(actionItemValue){return filteredValues.includes(actionItemValue);});return Boolean(visibleActionListItemInSection);}return true;},[_sectionChildValues,hasAutoComplete,filteredValues]);var showDividerInRN=!(_hideDivider&&isReactNative());var showDividerInAutoComplete=hasAutoComplete?isSectionVisible&&filteredValues.length>1:true;return jsxs(BaseBox,Object.assign({},makeAccessible({role:getActionListSectionRole(),label:title}),metaAttribute({name:MetaConstants.ActionListSection,testID:testID}),{children:[isSectionVisible?jsx(StyledActionListSectionTitle,Object.assign({},makeAccessible({hidden:true}),{children:jsx(Text,{color:"surface.text.gray.muted",size:"small",weight:"semibold",children:title})})):null,jsx(BaseBox,Object.assign({},makeAccessible({role:isReactNative()?undefined:'listbox'}),{children:children})),showDividerInAutoComplete&&showDividerInRN?jsx(Divider,{marginX:"spacing.3",marginY:"spacing.1"}):null]}));};var ActionListSection=assignWithoutSideEffects(_ActionListSection,{componentId:componentIds.ActionListSection});var _ActionListItemIcon=function _ActionListItemIcon(_ref2){var icon=_ref2.icon;var Icon=icon;var _useBaseMenuItem=useBaseMenuItem(),color=_useBaseMenuItem.color,isDisabled=_useBaseMenuItem.isDisabled;var iconState=isDisabled?'disabled':'muted';return jsx(Icon,{color:color==='negative'?'feedback.icon.negative.intense':`interactive.icon.gray.${iconState}`,size:"medium"});};var ActionListItemIcon=assignWithoutSideEffects(_ActionListItemIcon,{componentId:componentIds.ActionListItemIcon});var _ActionListItemBadgeGroup=function _ActionListItemBadgeGroup(_ref3){var children=_ref3.children;return jsx(Box,{display:"flex",alignItems:"center",flexDirection:"row",children:children});};var ActionListItemBadgeGroup=assignWithoutSideEffects(_ActionListItemBadgeGroup,{componentId:componentIds.ActionListItemBadgeGroup});var _ActionListItemBadge=function _ActionListItemBadge(props){return jsx(Badge,Object.assign({size:"medium",marginLeft:"spacing.3"},props));};var ActionListItemBadge=assignWithoutSideEffects(_ActionListItemBadge,{componentId:componentIds.ActionListItemBadge});var _ActionListItemText=function _ActionListItemText(_ref4){var children=_ref4.children;var _useBaseMenuItem2=useBaseMenuItem(),isDisabled=_useBaseMenuItem2.isDisabled;return jsx(Text,{variant:"caption",color:getNormalTextColor(isDisabled,{isMuted:true}),children:children});};var ActionListItemText=assignWithoutSideEffects(_ActionListItemText,{componentId:componentIds.ActionListItemText});var makeActionListItemClickable=function makeActionListItemClickable(clickHandler){if(isReactNative()){return {onPress:clickHandler};}return {onClick:clickHandler};};var _ActionListItem=function _ActionListItem(props){var _useDropdown2=useDropdown(),activeIndex=_useDropdown2.activeIndex,dropdownBaseId=_useDropdown2.dropdownBaseId,onOptionClick=_useDropdown2.onOptionClick,selectedIndices=_useDropdown2.selectedIndices,setShouldIgnoreBlurAnimation=_useDropdown2.setShouldIgnoreBlurAnimation,selectionType=_useDropdown2.selectionType,dropdownTriggerer=_useDropdown2.dropdownTriggerer,isKeydownPressed=_useDropdown2.isKeydownPressed,filteredValues=_useDropdown2.filteredValues,hasAutoCompleteInBottomSheetHeader=_useDropdown2.hasAutoCompleteInBottomSheetHeader;var hasAutoComplete=hasAutoCompleteInBottomSheetHeader||dropdownTriggerer===dropdownComponentIds.triggers.AutoComplete;var renderOnWebAs=props.href?'a':'button';var getIsSelected=function getIsSelected(){if(dropdownTriggerer===dropdownComponentIds.triggers.SelectInput||hasAutoComplete){if(typeof props._index==='number'){return selectedIndices.includes(props._index);}return undefined;}return props.isSelected;};var isSelected=getIsSelected();React__default.useEffect(function(){validateActionListItemProps({leading:props.leading,trailing:props.trailing,titleSuffix:props.titleSuffix});},[props.leading,props.trailing,props.titleSuffix]);React__default.useEffect(function(){if(__DEV__){if(dropdownTriggerer===dropdownComponentIds.triggers.SelectInput&&props.intent==='negative'){throwBladeError({message:'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',moduleName:'ActionListItem'});}}},[props.intent,dropdownTriggerer]);return jsx(BaseMenuItem,Object.assign({isVisible:hasAutoComplete&&filteredValues?filteredValues.includes(props.value):true,as:!isReactNative()?renderOnWebAs:undefined,id:`${dropdownBaseId}-${props._index}`,tabIndex:-1,title:props.title,description:props.description,leading:selectionType==='multiple'?jsx(BaseBox,Object.assign({pointerEvents:"none"},makeAccessible({hidden:true}),{children:jsx(Checkbox,{isChecked:isSelected,tabIndex:-1,isDisabled:props.isDisabled,children:null})})):props.leading,trailing:props.trailing,titleSuffix:props.titleSuffix,href:props.href,target:props.target,className:activeIndex===props._index?'active-focus':'',isSelected:isSelected,isDisabled:props.isDisabled,role:getActionListItemRole(dropdownTriggerer,props.href)},makeActionListItemClickable(function(e){if(typeof props._index==='number'){onOptionClick(e,props._index);props.onClick==null?void 0:props.onClick({name:props.value,value:isSelected,event:castWebType(e)});}}),metaAttribute({name:MetaConstants.ActionListItem,testID:props.testID}),{onMouseDown:function onMouseDown(){setShouldIgnoreBlurAnimation(true);},onMouseUp:function onMouseUp(){setShouldIgnoreBlurAnimation(false);},"data-value":props.value,"data-index":props._index,selectionType:selectionType,color:props.intent,isKeydownPressed:isKeydownPressed}));};var ActionListItem=assignWithoutSideEffects(React__default.memo(_ActionListItem),{componentId:componentIds.ActionListItem,displayName:componentIds.ActionListItem});
|
|
42
42
|
|
|
43
43
|
export { ActionListItem, ActionListItemBadge, ActionListItemBadgeGroup, ActionListItemIcon, ActionListItemText, ActionListSection };
|
|
44
44
|
//# sourceMappingURL=ActionListItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionListItem.js","sources":["../../../../../src/components/ActionList/ActionListItem.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { TouchableOpacity } from 'react-native';\nimport { StyledActionListItem } from './styles/StyledActionListItem';\nimport { componentIds } from './componentIds';\nimport type { StyledActionListItemProps } from './styles/getBaseActionListItemStyles';\nimport { validateActionListItemProps, getNormalTextColor } from './actionListUtils';\nimport { getActionListItemRole, getActionListSectionRole, isRoleMenu } from './getA11yRoles';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { IconComponent } from '~components/Icons';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { Text } from '~components/Typography';\nimport type { Platform } from '~utils';\nimport { castWebType, isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { Checkbox } from '~components/Checkbox';\nimport { size } from '~tokens/global';\nimport type { DropdownProps } from '~components/Dropdown';\nimport type { StringChildrenType, TestID } from '~utils/types';\nimport { useTheme } from '~components/BladeProvider';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\nimport type { BadgeProps } from '~components/Badge';\nimport { Badge } from '~components/Badge';\nimport { Box } from '~components/Box';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\n\ntype ActionListItemProps = {\n title: string;\n description?: string;\n onClick?: (clickProps: {\n name: string;\n value?: boolean;\n event: Platform.Select<{\n web: React.MouseEvent;\n native: React.TouchEvent<TouchableOpacity>;\n }>;\n }) => void;\n /**\n * value that you get from `onChange` event on SelectInput or in form submissions.\n */\n value: string;\n /**\n * Link to open when item is clicked.\n */\n href?: string;\n /**\n * HTML target of the link\n */\n target?: string;\n /**\n * Item that goes on left-side of item.\n *\n * Valid elements - `<ActionListItemIcon />`, `<ActionListItemAsset />`\n *\n * Will be overriden in multiselect\n */\n leading?: React.ReactNode;\n /**\n * Item that goes on right-side of item.\n *\n * Valid elements - `<ActionListItemText />`, `<ActionListItemIcon />`\n */\n trailing?: React.ReactNode;\n /**\n * Item that goes immediately next to the title.\n *\n * Valid elements - `<ActionListItemBadge />`, `<ActionListItemBadgeGroup />`\n *\n */\n titleSuffix?: React.ReactElement;\n isDisabled?: boolean;\n intent?: Extract<FeedbackColors, 'negative'>;\n /**\n * Can be used in combination of `onClick` to highlight item as selected in Button Triggers.\n *\n * When trigger is SelectInput, Use `value` prop on SelectInput instead to make dropdown controlled.\n */\n isSelected?: boolean;\n /**\n * Internally passed from ActionList. No need to pass it explicitly\n *\n * @private\n */\n _index?: number;\n} & TestID;\n\nconst ActionListItemContext = React.createContext<{\n intent?: ActionListItemProps['intent'];\n isDisabled?: ActionListItemProps['isDisabled'];\n}>({});\n\nconst StyledActionListSectionTitle = styled(BaseBox)((props) => ({\n // @TODO: replace this styled-component with new layout box when we have padding shorthand\n padding: makeSize(props.theme.spacing[3]),\n}));\n\ntype ActionListSectionProps = {\n title: string;\n children: React.ReactNode[] | React.ReactNode;\n /**\n * Internally used to hide the divider on final item in React Native.\n *\n * Should not be used by consumers (also won't work on web)\n *\n * @private\n */\n _hideDivider?: boolean;\n /**\n * Internally used to hide / show section in AutoComplete\n *\n * @private\n */\n _sectionChildValues?: string[];\n} & TestID;\nconst _ActionListSection = ({\n title,\n children,\n testID,\n _hideDivider,\n _sectionChildValues,\n}: ActionListSectionProps): React.ReactElement => {\n const { hasAutoCompleteInBottomSheetHeader, dropdownTriggerer, filteredValues } = useDropdown();\n const hasAutoComplete =\n hasAutoCompleteInBottomSheetHeader ||\n dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n const isSectionVisible = React.useMemo(() => {\n if (hasAutoComplete) {\n const visibleActionListItemInSection = _sectionChildValues?.find((actionItemValue) =>\n filteredValues.includes(actionItemValue),\n );\n\n return Boolean(visibleActionListItemInSection);\n }\n\n return true;\n }, [_sectionChildValues, hasAutoComplete, filteredValues]);\n\n const showDividerInRN = !(_hideDivider && isReactNative());\n const showDividerInAutoComplete = hasAutoComplete\n ? isSectionVisible && filteredValues.length > 1\n : true;\n\n return (\n <BaseBox\n {...makeAccessible({\n role: getActionListSectionRole(),\n label: title,\n })}\n {...metaAttribute({ name: MetaConstants.ActionListSection, testID })}\n >\n {/* We're announcing title as group label so we can hide this */}\n {isSectionVisible ? (\n <StyledActionListSectionTitle {...makeAccessible({ hidden: true })}>\n <Text color=\"surface.text.gray.muted\" size=\"small\" weight=\"semibold\">\n {title}\n </Text>\n </StyledActionListSectionTitle>\n ) : null}\n <BaseBox\n {...makeAccessible({\n // On web, we just wrap it in another listbox to announce item count properly for particular group.\n // On React Native, we ignore it since `menu` + `group` role will take care of accessibility\n role: isReactNative() ? undefined : 'listbox',\n })}\n >\n {children}\n </BaseBox>\n {showDividerInAutoComplete && showDividerInRN ? (\n <Divider marginX=\"spacing.3\" marginY=\"spacing.1\" />\n ) : null}\n </BaseBox>\n );\n};\n\nconst ActionListSection = assignWithoutSideEffects(_ActionListSection, {\n componentId: componentIds.ActionListSection,\n});\n\nconst _ActionListItemIcon = ({ icon }: { icon: IconComponent }): React.ReactElement => {\n const Icon = icon;\n const { intent, isDisabled } = React.useContext(ActionListItemContext);\n const iconState = isDisabled ? 'disabled' : 'muted';\n return (\n <Icon\n color={\n intent === 'negative'\n ? 'feedback.icon.negative.intense'\n : `interactive.icon.gray.${iconState}`\n }\n size=\"medium\"\n />\n );\n};\n\nconst ActionListItemIcon = assignWithoutSideEffects(_ActionListItemIcon, {\n componentId: componentIds.ActionListItemIcon,\n});\n\nconst _ActionListItemBadgeGroup = ({\n children,\n}: {\n children: React.ReactElement[] | React.ReactElement;\n}): React.ReactElement => {\n return (\n <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n {children}\n </Box>\n );\n};\n\nconst ActionListItemBadgeGroup = assignWithoutSideEffects(_ActionListItemBadgeGroup, {\n componentId: componentIds.ActionListItemBadgeGroup,\n});\n\nconst _ActionListItemBadge = (props: BadgeProps): React.ReactElement => {\n return <Badge size=\"medium\" marginLeft=\"spacing.3\" {...props} />;\n};\n\nconst ActionListItemBadge = assignWithoutSideEffects(_ActionListItemBadge, {\n componentId: componentIds.ActionListItemBadge,\n});\n\nconst _ActionListItemText = ({\n children,\n}: {\n children: StringChildrenType;\n}): React.ReactElement => {\n const { isDisabled } = React.useContext(ActionListItemContext);\n\n return (\n <Text variant=\"caption\" color={getNormalTextColor(isDisabled, { isMuted: true })}>\n {children}\n </Text>\n );\n};\n\nconst ActionListItemText = assignWithoutSideEffects(_ActionListItemText, {\n componentId: componentIds.ActionListItemText,\n});\n\ntype ClickHandlerType = (e: React.MouseEvent<HTMLButtonElement>) => void;\n\nconst makeActionListItemClickable = (\n clickHandler: ClickHandlerType,\n): { onPress?: StyledActionListItemProps['onPress']; onClick?: ClickHandlerType } => {\n if (isReactNative()) {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: ignoring ReactNative press type for the peace of mind\n return { onPress: clickHandler };\n }\n\n return {\n onClick: clickHandler,\n };\n};\n\nconst _ActionListItemBody = ({\n selectionType,\n intent,\n description,\n isDisabled,\n leading,\n trailing,\n title,\n titleSuffix,\n isSelected,\n}: Pick<\n ActionListItemProps,\n 'intent' | 'isDisabled' | 'description' | 'trailing' | 'leading' | 'title' | 'titleSuffix'\n> & {\n selectionType: DropdownProps['selectionType'];\n isSelected?: boolean;\n}): React.ReactElement => {\n return (\n <>\n <BaseBox\n display=\"flex\"\n justifyContent=\"center\"\n flexDirection=\"row\"\n alignItems=\"center\"\n maxHeight={isReactNative() ? undefined : makeSize(size[20])}\n >\n <BaseBox display=\"flex\" justifyContent=\"center\" alignItems=\"center\">\n {selectionType === 'multiple' ? (\n // Adding aria-hidden because the listbox item in multiselect in itself explains the behaviour so announcing checkbox is unneccesary and just a nice UI tweak for us\n <BaseBox\n pointerEvents=\"none\"\n paddingRight=\"spacing.2\"\n {...makeAccessible({\n hidden: true,\n })}\n >\n <Checkbox isChecked={isSelected} tabIndex={-1} isDisabled={isDisabled}>\n {/* \n Checkbox requires children. Didn't want to make it optional because its helpful for consumers\n But for this case in particular, we just want to use Text separately so that we can control spacing and color and keep it consistent with non-multiselect dropdowns\n */}\n {null}\n </Checkbox>\n </BaseBox>\n ) : (\n leading\n )}\n </BaseBox>\n <BaseBox\n paddingLeft={selectionType === 'multiple' || !leading ? 'spacing.0' : 'spacing.3'}\n paddingRight=\"spacing.3\"\n display=\"flex\"\n alignItems=\"center\"\n flexDirection=\"row\"\n >\n <Text\n truncateAfterLines={1}\n color={\n intent === 'negative'\n ? 'feedback.text.negative.intense'\n : getNormalTextColor(isDisabled)\n }\n >\n {title}\n </Text>\n {titleSuffix}\n </BaseBox>\n <BaseBox marginLeft=\"auto\">{trailing}</BaseBox>\n </BaseBox>\n <BaseBox paddingLeft={leading || selectionType === 'multiple' ? 'spacing.7' : undefined}>\n {description ? (\n <Text color={getNormalTextColor(isDisabled, { isMuted: true })} size=\"small\">\n {description}\n </Text>\n ) : null}\n </BaseBox>\n </>\n );\n};\n\nconst ActionListItemBody = React.memo(_ActionListItemBody);\n\n/**\n * ### ActionListItem\n *\n * Creates option inside `ActionList`.\n *\n * #### Usage\n *\n * ```jsx\n * <ActionList>\n * <ActionListItem\n * title=\"Home\"\n * value=\"home\"\n * leading={<ActionListItemIcon icon={HomeIcon} />}\n * trailing={<ActionListItemText>⌘ + S</ActionListItemText>}\n * />\n * </ActionList>\n * ```\n */\nconst _ActionListItem = (props: ActionListItemProps): React.ReactElement => {\n const {\n activeIndex,\n dropdownBaseId,\n onOptionClick,\n selectedIndices,\n setShouldIgnoreBlurAnimation,\n selectionType,\n dropdownTriggerer,\n isKeydownPressed,\n filteredValues,\n hasAutoCompleteInBottomSheetHeader,\n } = useDropdown();\n\n const { platform } = useTheme();\n const isMobile = platform === 'onMobile';\n const hasAutoComplete =\n hasAutoCompleteInBottomSheetHeader ||\n dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n const renderOnWebAs = props.href ? 'a' : 'button';\n\n /**\n * In SelectInput, returns the isSelected according to selected indexes in the state\n *\n * In Other Triggers (Menu Usecase), returns `props.isSelected` since passing the\n * isSelected prop explicitly is the only way to select item in menu\n */\n const getIsSelected = (): boolean | undefined => {\n if (dropdownTriggerer === dropdownComponentIds.triggers.SelectInput || hasAutoComplete) {\n if (typeof props._index === 'number') {\n return selectedIndices.includes(props._index);\n }\n\n return undefined;\n }\n\n return props.isSelected;\n };\n\n const isSelected = getIsSelected();\n\n React.useEffect(() => {\n validateActionListItemProps({\n leading: props.leading,\n trailing: props.trailing,\n titleSuffix: props.titleSuffix,\n });\n }, [props.leading, props.trailing, props.titleSuffix]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (\n dropdownTriggerer === dropdownComponentIds.triggers.SelectInput &&\n props.intent === 'negative'\n ) {\n throwBladeError({\n message:\n 'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',\n moduleName: 'ActionListItem',\n });\n }\n }\n }, [props.intent, dropdownTriggerer]);\n\n return (\n <ActionListItemContext.Provider value={{ intent: props.intent, isDisabled: props.isDisabled }}>\n <StyledActionListItem\n isVisible={hasAutoComplete && filteredValues ? filteredValues.includes(props.value) : true}\n as={!isReactNative() ? renderOnWebAs : undefined}\n id={`${dropdownBaseId}-${props._index}`}\n type=\"button\"\n tabIndex={-1}\n href={props.href}\n target={props.target}\n className={activeIndex === props._index ? 'active-focus' : ''}\n {...makeAccessible({\n selected: isSelected,\n current: isRoleMenu(dropdownTriggerer) ? isSelected : undefined,\n role: getActionListItemRole(dropdownTriggerer, props.href),\n disabled: props.isDisabled,\n })}\n {...makeActionListItemClickable((e: React.MouseEvent<HTMLButtonElement>): void => {\n if (typeof props._index === 'number') {\n onOptionClick(e, props._index);\n props.onClick?.({ name: props.value, value: isSelected, event: castWebType(e) });\n }\n })}\n {...metaAttribute({ name: MetaConstants.ActionListItem, testID: props.testID })}\n onMouseDown={() => {\n // We want to keep focus on Dropdown's trigger while option is being clicked\n // So We set this flag that ignores the blur animation to avoid the flicker between focus out + focus in\n setShouldIgnoreBlurAnimation(true);\n }}\n onMouseUp={() => {\n // (Contd from above comment...) We set this flag back to false since blur of SelectInput is done calling by this time\n setShouldIgnoreBlurAnimation(false);\n }}\n data-value={props.value}\n data-index={props._index}\n // Custom props for changes in styles\n selectionType={selectionType}\n hasDescription={Boolean(props.description)}\n intent={props.intent}\n isSelected={isSelected}\n isKeydownPressed={isKeydownPressed}\n isMobile={isMobile}\n >\n <ActionListItemBody\n selectionType={selectionType}\n intent={props.intent}\n description={props.description}\n isDisabled={props.isDisabled}\n leading={props.leading}\n trailing={props.trailing}\n title={props.title}\n titleSuffix={props.titleSuffix}\n isSelected={isSelected}\n />\n </StyledActionListItem>\n </ActionListItemContext.Provider>\n );\n};\n\nconst ActionListItem = assignWithoutSideEffects(React.memo(_ActionListItem), {\n componentId: componentIds.ActionListItem,\n displayName: componentIds.ActionListItem,\n});\n\nexport type { ActionListItemProps, ActionListSectionProps };\nexport {\n ActionListItem,\n ActionListItemIcon,\n ActionListItemText,\n ActionListItemBadge,\n ActionListItemBadgeGroup,\n ActionListSection,\n};\n"],"names":["ActionListItemContext","React","createContext","StyledActionListSectionTitle","styled","BaseBox","props","padding","makeSize","theme","spacing","_ActionListSection","_ref","title","children","testID","_hideDivider","_sectionChildValues","_useDropdown","useDropdown","hasAutoCompleteInBottomSheetHeader","dropdownTriggerer","filteredValues","hasAutoComplete","dropdownComponentIds","triggers","AutoComplete","isSectionVisible","useMemo","visibleActionListItemInSection","find","actionItemValue","includes","Boolean","showDividerInRN","isReactNative","showDividerInAutoComplete","length","_jsxs","Object","assign","makeAccessible","role","getActionListSectionRole","label","metaAttribute","name","MetaConstants","ActionListSection","_jsx","hidden","Text","color","size","weight","undefined","Divider","marginX","marginY","assignWithoutSideEffects","componentId","componentIds","_ActionListItemIcon","_ref2","icon","Icon","_React$useContext","useContext","intent","isDisabled","iconState","ActionListItemIcon","_ActionListItemBadgeGroup","_ref3","Box","display","alignItems","flexDirection","ActionListItemBadgeGroup","_ActionListItemBadge","Badge","marginLeft","ActionListItemBadge","_ActionListItemText","_ref4","_React$useContext2","variant","getNormalTextColor","isMuted","ActionListItemText","makeActionListItemClickable","clickHandler","onPress","onClick","_ActionListItemBody","_ref5","selectionType","description","leading","trailing","titleSuffix","isSelected","_Fragment","justifyContent","maxHeight","pointerEvents","paddingRight","Checkbox","isChecked","tabIndex","paddingLeft","truncateAfterLines","ActionListItemBody","memo","_ActionListItem","_useDropdown2","activeIndex","dropdownBaseId","onOptionClick","selectedIndices","setShouldIgnoreBlurAnimation","isKeydownPressed","_useTheme","useTheme","platform","isMobile","renderOnWebAs","href","getIsSelected","SelectInput","_index","useEffect","validateActionListItemProps","__DEV__","throwBladeError","message","moduleName","Provider","value","StyledActionListItem","isVisible","as","id","type","target","className","selected","current","isRoleMenu","getActionListItemRole","disabled","e","event","castWebType","ActionListItem","onMouseDown","onMouseUp","hasDescription","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ActionListItem.js","sources":["../../../../../src/components/ActionList/ActionListItem.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { TouchableOpacity } from 'react-native';\nimport { componentIds } from './componentIds';\nimport { validateActionListItemProps, getNormalTextColor } from './actionListUtils';\nimport { getActionListItemRole, getActionListSectionRole } from './getA11yRoles';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { IconComponent } from '~components/Icons';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { Text } from '~components/Typography';\nimport type { Platform } from '~utils';\nimport { castWebType, isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\nimport type { BadgeProps } from '~components/Badge';\nimport { Badge } from '~components/Badge';\nimport { Box } from '~components/Box';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { BaseMenuItem, useBaseMenuItem } from '~components/BaseMenu';\nimport { Checkbox } from '~components/Checkbox';\n\ntype ActionListItemProps = {\n title: string;\n description?: string;\n onClick?: (clickProps: {\n name: string;\n value?: boolean;\n event: Platform.Select<{\n web: React.MouseEvent;\n native: React.TouchEvent<TouchableOpacity>;\n }>;\n }) => void;\n /**\n * value that you get from `onChange` event on SelectInput or in form submissions.\n */\n value: string;\n /**\n * Link to open when item is clicked.\n */\n href?: string;\n /**\n * HTML target of the link\n */\n target?: string;\n /**\n * Item that goes on left-side of item.\n *\n * Valid elements - `<ActionListItemIcon />`, `<ActionListItemAsset />`\n *\n * Will be overriden in multiselect\n */\n leading?: React.ReactNode;\n /**\n * Item that goes on right-side of item.\n *\n * Valid elements - `<ActionListItemText />`, `<ActionListItemIcon />`\n */\n trailing?: React.ReactNode;\n /**\n * Item that goes immediately next to the title.\n *\n * Valid elements - `<ActionListItemBadge />`, `<ActionListItemBadgeGroup />`\n *\n */\n titleSuffix?: React.ReactElement;\n isDisabled?: boolean;\n intent?: Extract<FeedbackColors, 'negative'>;\n /**\n * Can be used in combination of `onClick` to highlight item as selected in Button Triggers.\n *\n * When trigger is SelectInput, Use `value` prop on SelectInput instead to make dropdown controlled.\n */\n isSelected?: boolean;\n /**\n * Internally passed from ActionList. No need to pass it explicitly\n *\n * @private\n */\n _index?: number;\n} & TestID;\n\nconst StyledActionListSectionTitle = styled(BaseBox)((props) => ({\n // @TODO: replace this styled-component with new layout box when we have padding shorthand\n padding: makeSize(props.theme.spacing[3]),\n}));\n\ntype ActionListSectionProps = {\n title: string;\n children: React.ReactNode[] | React.ReactNode;\n /**\n * Internally used to hide the divider on final item in React Native.\n *\n * Should not be used by consumers (also won't work on web)\n *\n * @private\n */\n _hideDivider?: boolean;\n /**\n * Internally used to hide / show section in AutoComplete\n *\n * @private\n */\n _sectionChildValues?: string[];\n} & TestID;\nconst _ActionListSection = ({\n title,\n children,\n testID,\n _hideDivider,\n _sectionChildValues,\n}: ActionListSectionProps): React.ReactElement => {\n const { hasAutoCompleteInBottomSheetHeader, dropdownTriggerer, filteredValues } = useDropdown();\n const hasAutoComplete =\n hasAutoCompleteInBottomSheetHeader ||\n dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n const isSectionVisible = React.useMemo(() => {\n if (hasAutoComplete) {\n const visibleActionListItemInSection = _sectionChildValues?.find((actionItemValue) =>\n filteredValues.includes(actionItemValue),\n );\n\n return Boolean(visibleActionListItemInSection);\n }\n\n return true;\n }, [_sectionChildValues, hasAutoComplete, filteredValues]);\n\n const showDividerInRN = !(_hideDivider && isReactNative());\n const showDividerInAutoComplete = hasAutoComplete\n ? isSectionVisible && filteredValues.length > 1\n : true;\n\n return (\n <BaseBox\n {...makeAccessible({\n role: getActionListSectionRole(),\n label: title,\n })}\n {...metaAttribute({ name: MetaConstants.ActionListSection, testID })}\n >\n {/* We're announcing title as group label so we can hide this */}\n {isSectionVisible ? (\n <StyledActionListSectionTitle {...makeAccessible({ hidden: true })}>\n <Text color=\"surface.text.gray.muted\" size=\"small\" weight=\"semibold\">\n {title}\n </Text>\n </StyledActionListSectionTitle>\n ) : null}\n <BaseBox\n {...makeAccessible({\n // On web, we just wrap it in another listbox to announce item count properly for particular group.\n // On React Native, we ignore it since `menu` + `group` role will take care of accessibility\n role: isReactNative() ? undefined : 'listbox',\n })}\n >\n {children}\n </BaseBox>\n {showDividerInAutoComplete && showDividerInRN ? (\n <Divider marginX=\"spacing.3\" marginY=\"spacing.1\" />\n ) : null}\n </BaseBox>\n );\n};\n\nconst ActionListSection = assignWithoutSideEffects(_ActionListSection, {\n componentId: componentIds.ActionListSection,\n});\n\nconst _ActionListItemIcon = ({ icon }: { icon: IconComponent }): React.ReactElement => {\n const Icon = icon;\n const { color, isDisabled } = useBaseMenuItem();\n const iconState = isDisabled ? 'disabled' : 'muted';\n return (\n <Icon\n color={\n color === 'negative'\n ? 'feedback.icon.negative.intense'\n : `interactive.icon.gray.${iconState}`\n }\n size=\"medium\"\n />\n );\n};\n\nconst ActionListItemIcon = assignWithoutSideEffects(_ActionListItemIcon, {\n componentId: componentIds.ActionListItemIcon,\n});\n\nconst _ActionListItemBadgeGroup = ({\n children,\n}: {\n children: React.ReactElement[] | React.ReactElement;\n}): React.ReactElement => {\n return (\n <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n {children}\n </Box>\n );\n};\n\nconst ActionListItemBadgeGroup = assignWithoutSideEffects(_ActionListItemBadgeGroup, {\n componentId: componentIds.ActionListItemBadgeGroup,\n});\n\nconst _ActionListItemBadge = (props: BadgeProps): React.ReactElement => {\n return <Badge size=\"medium\" marginLeft=\"spacing.3\" {...props} />;\n};\n\nconst ActionListItemBadge = assignWithoutSideEffects(_ActionListItemBadge, {\n componentId: componentIds.ActionListItemBadge,\n});\n\nconst _ActionListItemText = ({\n children,\n}: {\n children: StringChildrenType;\n}): React.ReactElement => {\n const { isDisabled } = useBaseMenuItem();\n\n return (\n <Text variant=\"caption\" color={getNormalTextColor(isDisabled, { isMuted: true })}>\n {children}\n </Text>\n );\n};\n\nconst ActionListItemText = assignWithoutSideEffects(_ActionListItemText, {\n componentId: componentIds.ActionListItemText,\n});\n\ntype ClickHandlerType = (e: React.MouseEvent<HTMLButtonElement>) => void;\n\nconst makeActionListItemClickable = (\n clickHandler: ClickHandlerType,\n): { onPress?: (e: React.TouchEvent<TouchableOpacity>) => void; onClick?: ClickHandlerType } => {\n if (isReactNative()) {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: ignoring ReactNative press type for the peace of mind\n return { onPress: clickHandler };\n }\n\n return {\n onClick: clickHandler,\n };\n};\n\n/**\n * ### ActionListItem\n *\n * Creates option inside `ActionList`.\n *\n * #### Usage\n *\n * ```jsx\n * <ActionList>\n * <ActionListItem\n * title=\"Home\"\n * value=\"home\"\n * leading={<ActionListItemIcon icon={HomeIcon} />}\n * trailing={<ActionListItemText>⌘ + S</ActionListItemText>}\n * />\n * </ActionList>\n * ```\n */\nconst _ActionListItem = (props: ActionListItemProps): React.ReactElement => {\n const {\n activeIndex,\n dropdownBaseId,\n onOptionClick,\n selectedIndices,\n setShouldIgnoreBlurAnimation,\n selectionType,\n dropdownTriggerer,\n isKeydownPressed,\n filteredValues,\n hasAutoCompleteInBottomSheetHeader,\n } = useDropdown();\n\n const hasAutoComplete =\n hasAutoCompleteInBottomSheetHeader ||\n dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n const renderOnWebAs = props.href ? 'a' : 'button';\n\n /**\n * In SelectInput, returns the isSelected according to selected indexes in the state\n *\n * In Other Triggers (Menu Usecase), returns `props.isSelected` since passing the\n * isSelected prop explicitly is the only way to select item in menu\n */\n const getIsSelected = (): boolean | undefined => {\n if (dropdownTriggerer === dropdownComponentIds.triggers.SelectInput || hasAutoComplete) {\n if (typeof props._index === 'number') {\n return selectedIndices.includes(props._index);\n }\n\n return undefined;\n }\n\n return props.isSelected;\n };\n\n const isSelected = getIsSelected();\n\n React.useEffect(() => {\n validateActionListItemProps({\n leading: props.leading,\n trailing: props.trailing,\n titleSuffix: props.titleSuffix,\n });\n }, [props.leading, props.trailing, props.titleSuffix]);\n\n React.useEffect(() => {\n if (__DEV__) {\n if (\n dropdownTriggerer === dropdownComponentIds.triggers.SelectInput &&\n props.intent === 'negative'\n ) {\n throwBladeError({\n message:\n 'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',\n moduleName: 'ActionListItem',\n });\n }\n }\n }, [props.intent, dropdownTriggerer]);\n\n return (\n // We use this context to change the color of subcomponents like ActionListItemIcon, ActionListItemText, etc\n <BaseMenuItem\n isVisible={hasAutoComplete && filteredValues ? filteredValues.includes(props.value) : true}\n as={!isReactNative() ? renderOnWebAs : undefined}\n id={`${dropdownBaseId}-${props._index}`}\n tabIndex={-1}\n title={props.title}\n description={props.description}\n leading={\n selectionType === 'multiple' ? (\n <BaseBox\n pointerEvents=\"none\"\n // Adding aria-hidden because the listbox item in multiselect in itself explains the behaviour so announcing checkbox is unneccesary and just a nice UI tweak for us\n {...makeAccessible({\n hidden: true,\n })}\n >\n <Checkbox isChecked={isSelected} tabIndex={-1} isDisabled={props.isDisabled}>\n {/* \n Checkbox requires children. Didn't want to make it optional because its helpful for consumers\n But for this case in particular, we just want to use Text separately so that we can control spacing and color and keep it consistent with non-multiselect dropdowns\n */}\n {null}\n </Checkbox>\n </BaseBox>\n ) : (\n props.leading\n )\n }\n trailing={props.trailing}\n titleSuffix={props.titleSuffix}\n href={props.href}\n target={props.target}\n className={activeIndex === props._index ? 'active-focus' : ''}\n isSelected={isSelected}\n isDisabled={props.isDisabled}\n role={getActionListItemRole(dropdownTriggerer, props.href)}\n {...makeActionListItemClickable((e: React.MouseEvent<HTMLButtonElement>): void => {\n if (typeof props._index === 'number') {\n onOptionClick(e, props._index);\n props.onClick?.({ name: props.value, value: isSelected, event: castWebType(e) });\n }\n })}\n {...metaAttribute({ name: MetaConstants.ActionListItem, testID: props.testID })}\n onMouseDown={() => {\n // We want to keep focus on Dropdown's trigger while option is being clicked\n // So We set this flag that ignores the blur animation to avoid the flicker between focus out + focus in\n setShouldIgnoreBlurAnimation(true);\n }}\n onMouseUp={() => {\n // (Contd from above comment...) We set this flag back to false since blur of SelectInput is done calling by this time\n setShouldIgnoreBlurAnimation(false);\n }}\n data-value={props.value}\n data-index={props._index}\n selectionType={selectionType}\n color={props.intent}\n isKeydownPressed={isKeydownPressed}\n />\n );\n};\n\nconst ActionListItem = assignWithoutSideEffects(React.memo(_ActionListItem), {\n componentId: componentIds.ActionListItem,\n displayName: componentIds.ActionListItem,\n});\n\nexport type { ActionListItemProps, ActionListSectionProps };\nexport {\n ActionListItem,\n ActionListItemIcon,\n ActionListItemText,\n ActionListItemBadge,\n ActionListItemBadgeGroup,\n ActionListSection,\n};\n"],"names":["StyledActionListSectionTitle","styled","BaseBox","props","padding","makeSize","theme","spacing","_ActionListSection","_ref","title","children","testID","_hideDivider","_sectionChildValues","_useDropdown","useDropdown","hasAutoCompleteInBottomSheetHeader","dropdownTriggerer","filteredValues","hasAutoComplete","dropdownComponentIds","triggers","AutoComplete","isSectionVisible","React","useMemo","visibleActionListItemInSection","find","actionItemValue","includes","Boolean","showDividerInRN","isReactNative","showDividerInAutoComplete","length","_jsxs","Object","assign","makeAccessible","role","getActionListSectionRole","label","metaAttribute","name","MetaConstants","ActionListSection","_jsx","hidden","Text","color","size","weight","undefined","Divider","marginX","marginY","assignWithoutSideEffects","componentId","componentIds","_ActionListItemIcon","_ref2","icon","Icon","_useBaseMenuItem","useBaseMenuItem","isDisabled","iconState","ActionListItemIcon","_ActionListItemBadgeGroup","_ref3","Box","display","alignItems","flexDirection","ActionListItemBadgeGroup","_ActionListItemBadge","Badge","marginLeft","ActionListItemBadge","_ActionListItemText","_ref4","_useBaseMenuItem2","variant","getNormalTextColor","isMuted","ActionListItemText","makeActionListItemClickable","clickHandler","onPress","onClick","_ActionListItem","_useDropdown2","activeIndex","dropdownBaseId","onOptionClick","selectedIndices","setShouldIgnoreBlurAnimation","selectionType","isKeydownPressed","renderOnWebAs","href","getIsSelected","SelectInput","_index","isSelected","useEffect","validateActionListItemProps","leading","trailing","titleSuffix","__DEV__","intent","throwBladeError","message","moduleName","BaseMenuItem","isVisible","value","as","id","tabIndex","description","pointerEvents","Checkbox","isChecked","target","className","getActionListItemRole","e","event","castWebType","ActionListItem","onMouseDown","onMouseUp","memo","displayName"],"mappings":"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"}
|
|
@@ -5,7 +5,7 @@ import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/a
|
|
|
5
5
|
import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.native.js';
|
|
6
6
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
7
7
|
|
|
8
|
-
var _BaseFooter=function _BaseFooter(_ref){var children=_ref.children,_ref$showDivider=_ref.showDivider,showDivider=_ref$showDivider===void 0?true:_ref$showDivider,metaComponentName=_ref.metaComponentName,testID=_ref.testID;return jsxs(Fragment,{children:[showDivider&&jsx(Divider,{}),jsx(BaseBox,Object.assign({},metaAttribute({name:metaComponentName,testID:testID}),{padding:{base:'spacing.5',m:'spacing.6'},children:children}))]});};var BaseFooter=assignWithoutSideEffects(_BaseFooter,{componentId:'BaseFooter'});
|
|
8
|
+
var _BaseFooter=function _BaseFooter(_ref){var children=_ref.children,_ref$showDivider=_ref.showDivider,showDivider=_ref$showDivider===void 0?true:_ref$showDivider,metaComponentName=_ref.metaComponentName,padding=_ref.padding,testID=_ref.testID;return jsxs(Fragment,{children:[showDivider&&jsx(Divider,{}),jsx(BaseBox,Object.assign({},metaAttribute({name:metaComponentName,testID:testID}),{padding:padding!=null?padding:{base:'spacing.5',m:'spacing.6'},children:children}))]});};var BaseFooter=assignWithoutSideEffects(_BaseFooter,{componentId:'BaseFooter'});
|
|
9
9
|
|
|
10
10
|
export { BaseFooter };
|
|
11
11
|
//# sourceMappingURL=BaseFooter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseFooter.js","sources":["../../../../../src/components/BaseHeaderFooter/BaseFooter.tsx"],"sourcesContent":["import React from 'react';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport type { TestID } from '~utils/types';\n\ntype BaseFooterProps = {\n children: React.ReactNode;\n metaComponentName?: string;\n showDivider?: boolean;\n} & TestID;\n\nconst _BaseFooter = ({\n children,\n showDivider = true,\n metaComponentName,\n testID,\n}: BaseFooterProps): React.ReactElement => {\n return (\n <>\n {showDivider && <Divider />}\n <BaseBox\n {...metaAttribute({ name: metaComponentName, testID })}\n padding={{ base: 'spacing.5', m: 'spacing.6' }}\n >\n {children}\n </BaseBox>\n </>\n );\n};\n\nconst BaseFooter = assignWithoutSideEffects(_BaseFooter, {\n componentId: 'BaseFooter',\n});\n\nexport type { BaseFooterProps };\nexport { BaseFooter };\n"],"names":["_BaseFooter","_ref","children","_ref$showDivider","showDivider","metaComponentName","testID","_jsxs","_Fragment","_jsx","Divider","BaseBox","Object","assign","metaAttribute","name","
|
|
1
|
+
{"version":3,"file":"BaseFooter.js","sources":["../../../../../src/components/BaseHeaderFooter/BaseFooter.tsx"],"sourcesContent":["import React from 'react';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport type { TestID } from '~utils/types';\nimport type { BoxProps } from '~components/Box';\n\ntype BaseFooterProps = {\n children: React.ReactNode;\n metaComponentName?: string;\n showDivider?: boolean;\n padding?: BoxProps['padding'];\n} & TestID;\n\nconst _BaseFooter = ({\n children,\n showDivider = true,\n metaComponentName,\n padding,\n testID,\n}: BaseFooterProps): React.ReactElement => {\n return (\n <>\n {showDivider && <Divider />}\n <BaseBox\n {...metaAttribute({ name: metaComponentName, testID })}\n padding={padding ?? { base: 'spacing.5', m: 'spacing.6' }}\n >\n {children}\n </BaseBox>\n </>\n );\n};\n\nconst BaseFooter = assignWithoutSideEffects(_BaseFooter, {\n componentId: 'BaseFooter',\n});\n\nexport type { BaseFooterProps };\nexport { BaseFooter };\n"],"names":["_BaseFooter","_ref","children","_ref$showDivider","showDivider","metaComponentName","padding","testID","_jsxs","_Fragment","_jsx","Divider","BaseBox","Object","assign","metaAttribute","name","base","m","BaseFooter","assignWithoutSideEffects","componentId"],"mappings":";;;;;;;AAeA,IAAMA,WAAW,CAAG,SAAdA,WAAWA,CAAAC,IAAA,CAM0B,KALzCC,QAAQ,CAAAD,IAAA,CAARC,QAAQ,CAAAC,gBAAA,CAAAF,IAAA,CACRG,WAAW,CAAXA,WAAW,CAAAD,gBAAA,GAAA,KAAA,CAAA,CAAG,IAAI,CAAAA,gBAAA,CAClBE,iBAAiB,CAAAJ,IAAA,CAAjBI,iBAAiB,CACjBC,OAAO,CAAAL,IAAA,CAAPK,OAAO,CACPC,MAAM,CAAAN,IAAA,CAANM,MAAM,CAEN,OACEC,IAAA,CAAAC,QAAA,CAAA,CAAAP,QAAA,CACGE,CAAAA,WAAW,EAAIM,GAAA,CAACC,OAAO,CAAA,EAAE,CAAC,CAC3BD,GAAA,CAACE,OAAO,CAAAC,MAAA,CAAAC,MAAA,CAAA,EAAA,CACFC,aAAa,CAAC,CAAEC,IAAI,CAAEX,iBAAiB,CAAEE,MAAM,CAANA,MAAO,CAAC,CAAC,CAAA,CACtDD,OAAO,CAAEA,OAAO,EAAPA,IAAAA,CAAAA,OAAO,CAAI,CAAEW,IAAI,CAAE,WAAW,CAAEC,CAAC,CAAE,WAAY,CAAE,CAAAhB,QAAA,CAEzDA,QAAQ,CAAA,CACF,CAAC,CACV,CAAA,CAAC,CAEP,CAAC,CAEK,IAAAiB,UAAU,CAAGC,wBAAwB,CAACpB,WAAW,CAAE,CACvDqB,WAAW,CAAE,YACf,CAAC;;;;"}
|
|
@@ -29,7 +29,7 @@ import { Box } from '../Box/Box.js';
|
|
|
29
29
|
import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
|
|
30
30
|
import { getComponentId } from '../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
|
|
31
31
|
|
|
32
|
-
var commonCenterBoxProps={display:'flex',alignItems:'center',justifyContent:'center'};var centerBoxProps={large:Object.assign({},commonCenterBoxProps,{height:'28px'}),medium:Object.assign({},commonCenterBoxProps,{height:'20px'})};var sizeTokensMapping={large:{title:'large'},medium:{title:'medium'}};var propRestrictionMap={large:{Button:{size:'xsmall',variant:'tertiary'},Badge:{size:'medium'},Link:{size:'medium'},Text:{size:'medium',variant:'body'},Amount:{type:'body',size:'medium'}},medium:{Button:{size:'xsmall',variant:'tertiary'},Badge:{size:'small'},Link:{size:'small'},Text:{size:'small',variant:'body'},Amount:{type:'body',size:'small'}}};var useTrailingRestriction=function useTrailingRestriction(_ref){var trailing=_ref.trailing,size=_ref.size;var _React$useState=React__default.useState(null),_React$useState2=_slicedToArray(_React$useState,2),validatedTrailingComponent=_React$useState2[0],setValidatedTrailingComponent=_React$useState2[1];React__default.useEffect(function(){if(React__default.isValidElement(trailing)){var trailingComponentType=getComponentId(trailing);var restrictedProps=propRestrictionMap[size][trailingComponentType];var allowedComponents=Object.keys(propRestrictionMap[size]);if(__DEV__){if(!restrictedProps){throwBladeError({message:`Only one of \`${allowedComponents.join(', ')}\` component is accepted as trailing`,moduleName:'Header'});}}var restrictedPropKeys=Object.keys(propRestrictionMap[size][trailingComponentType]);for(var prop of restrictedPropKeys){var _trailing$props;if(trailing!=null&&(_trailing$props=trailing.props)!=null&&_trailing$props.hasOwnProperty(prop)){logger({message:`Do not pass "${prop}" to "${trailingComponentType}" while inside Header trailing, because we override it.`,moduleName:'Header',type:'warn'});}}setValidatedTrailingComponent(React__default.cloneElement(trailing,restrictedProps));}},[trailing,size]);return validatedTrailingComponent;};var _BaseHeader=function _BaseHeader(_ref2){var title=_ref2.title,subtitle=_ref2.subtitle,leading=_ref2.leading,titleSuffix=_ref2.titleSuffix,trailing=_ref2.trailing,_ref2$showDivider=_ref2.showDivider,showDivider=_ref2$showDivider===void 0?true:_ref2$showDivider,_ref2$showBackButton=_ref2.showBackButton,showBackButton=_ref2$showBackButton===void 0?false:_ref2$showBackButton,_ref2$showCloseButton=_ref2.showCloseButton,showCloseButton=_ref2$showCloseButton===void 0?true:_ref2$showCloseButton,onBackButtonClick=_ref2.onBackButtonClick,onCloseButtonClick=_ref2.onCloseButtonClick,closeButtonRef=_ref2.closeButtonRef,backButtonRef=_ref2.backButtonRef,testID=_ref2.testID,onClickCapture=_ref2.onClickCapture,onKeyDown=_ref2.onKeyDown,onKeyUp=_ref2.onKeyUp,onLostPointerCapture=_ref2.onLostPointerCapture,onPointerCancel=_ref2.onPointerCancel,onPointerDown=_ref2.onPointerDown,onPointerMove=_ref2.onPointerMove,onPointerUp=_ref2.onPointerUp,metaComponentName=_ref2.metaComponentName,paddingX=_ref2.paddingX,marginY=_ref2.marginY,_ref2$size=_ref2.size,size$1=_ref2$size===void 0?'large':_ref2$size,isDisabled=_ref2.isDisabled,children=_ref2.children,trailingInteractionElement=_ref2.trailingInteractionElement;var validatedTrailingComponent=useTrailingRestriction({trailing:trailing,size:size$1});var shouldWrapTitle=titleSuffix&&trailing&&showBackButton&&showCloseButton;var webOnlyEventHandlers=isReactNative()?{}:{onClickCapture:onClickCapture,onKeyDown:onKeyDown,onKeyUp:onKeyUp,onLostPointerCapture:onLostPointerCapture,onPointerCancel:onPointerCancel,onPointerDown:onPointerDown,onPointerMove:onPointerMove,onPointerUp:onPointerUp};return jsxs(BaseBox,Object.assign({},metaAttribute({name:metaComponentName,testID:testID}),{children:[jsxs(BaseBox,Object.assign({marginY:marginY!=null?marginY:{base:'spacing.5',m:'spacing.6'},paddingX:paddingX!=null?paddingX:{base:'spacing.5',m:'spacing.6'},touchAction:"none"},webOnlyEventHandlers,{children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",userSelect:"none",children:[showBackButton?jsx(BaseBox,{overflow:"visible",marginRight:"spacing.5",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:jsx(IconButton,{ref:backButtonRef,size:"large",icon:ChevronLeftIcon,onClick:function onClick(){return onBackButtonClick==null?void 0:onBackButtonClick();},accessibilityLabel:"Back"})}))}):null,jsxs(BaseBox,{paddingRight:"spacing.5",marginRight:"auto",flex:"auto",display:"flex",flexDirection:"row",alignItems:"flex-start",children:[leading?jsx(BaseBox,Object.assign({marginRight:"spacing.3"},centerBoxProps[size$1],{children:leading})):null,jsxs(BaseBox,{flex:"auto",children:[jsxs(BaseBox,{maxWidth:isReactNative()&&shouldWrapTitle?'100px':undefined,flexShrink:0,display:"flex",flexDirection:"row",children:[title?jsx(Text,{size:sizeTokensMapping[size$1].title,marginTop:makeSize(size['1']),weight:"semibold",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.normal',children:title}):null,titleSuffix&&jsx(BaseBox,{marginLeft:"spacing.3",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:titleSuffix}))})]}),subtitle?jsx(Text,{variant:"body",size:"small",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.muted',children:subtitle}):null]})]}),validatedTrailingComponent?jsx(BaseBox,{marginRight:"spacing.5",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:validatedTrailingComponent}))}):null,showCloseButton?jsx(Box,Object.assign({},centerBoxProps[size$1],{children:jsx(IconButton,{ref:closeButtonRef,size:"large",icon:CloseIcon,accessibilityLabel:"Close",onClick:function onClick(){return onCloseButtonClick==null?void 0:onCloseButtonClick();}})})):null,trailingInteractionElement&&!children?jsx(Box,Object.assign({},centerBoxProps[size$1],{children:trailingInteractionElement})):null]}),jsxs(BaseBox,{display:"flex",width:"100%",flexDirection:"row",alignItems:"center",justifyContent:"space-between",children:[jsx(Box,{children:children}),trailingInteractionElement&&children?jsx(Box,Object.assign({alignSelf:"flex-start"},centerBoxProps[size$1],{children:trailingInteractionElement})):null]})]})),showDivider?jsx(Divider,{}):null]}));};var BaseHeader=assignWithoutSideEffects(_BaseHeader,{componentId:'BaseHeader'});
|
|
32
|
+
var commonCenterBoxProps={display:'flex',alignItems:'center',justifyContent:'center'};var centerBoxProps={large:Object.assign({},commonCenterBoxProps,{height:'28px'}),medium:Object.assign({},commonCenterBoxProps,{height:'20px'})};var sizeTokensMapping={large:{title:'large'},medium:{title:'medium'}};var propRestrictionMap={large:{Button:{size:'xsmall',variant:'tertiary'},Badge:{size:'medium'},Link:{size:'medium'},Text:{size:'medium',variant:'body'},Amount:{type:'body',size:'medium'}},medium:{Button:{size:'xsmall',variant:'tertiary'},Badge:{size:'small'},Link:{size:'small'},Text:{size:'small',variant:'body'},Amount:{type:'body',size:'small'}}};var useTrailingRestriction=function useTrailingRestriction(_ref){var trailing=_ref.trailing,size=_ref.size;var _React$useState=React__default.useState(null),_React$useState2=_slicedToArray(_React$useState,2),validatedTrailingComponent=_React$useState2[0],setValidatedTrailingComponent=_React$useState2[1];React__default.useEffect(function(){if(React__default.isValidElement(trailing)){var trailingComponentType=getComponentId(trailing);var restrictedProps=propRestrictionMap[size][trailingComponentType];var allowedComponents=Object.keys(propRestrictionMap[size]);if(__DEV__){if(!restrictedProps){throwBladeError({message:`Only one of \`${allowedComponents.join(', ')}\` component is accepted as trailing`,moduleName:'Header'});}}var restrictedPropKeys=Object.keys(propRestrictionMap[size][trailingComponentType]);for(var prop of restrictedPropKeys){var _trailing$props;if(trailing!=null&&(_trailing$props=trailing.props)!=null&&_trailing$props.hasOwnProperty(prop)){logger({message:`Do not pass "${prop}" to "${trailingComponentType}" while inside Header trailing, because we override it.`,moduleName:'Header',type:'warn'});}}setValidatedTrailingComponent(React__default.cloneElement(trailing,restrictedProps));}},[trailing,size]);return validatedTrailingComponent;};var _BaseHeader=function _BaseHeader(_ref2){var title=_ref2.title,subtitle=_ref2.subtitle,leading=_ref2.leading,titleSuffix=_ref2.titleSuffix,trailing=_ref2.trailing,_ref2$showDivider=_ref2.showDivider,showDivider=_ref2$showDivider===void 0?true:_ref2$showDivider,_ref2$showBackButton=_ref2.showBackButton,showBackButton=_ref2$showBackButton===void 0?false:_ref2$showBackButton,_ref2$showCloseButton=_ref2.showCloseButton,showCloseButton=_ref2$showCloseButton===void 0?true:_ref2$showCloseButton,onBackButtonClick=_ref2.onBackButtonClick,onCloseButtonClick=_ref2.onCloseButtonClick,closeButtonRef=_ref2.closeButtonRef,backButtonRef=_ref2.backButtonRef,testID=_ref2.testID,onClickCapture=_ref2.onClickCapture,onKeyDown=_ref2.onKeyDown,onKeyUp=_ref2.onKeyUp,onLostPointerCapture=_ref2.onLostPointerCapture,onPointerCancel=_ref2.onPointerCancel,onPointerDown=_ref2.onPointerDown,onPointerMove=_ref2.onPointerMove,onPointerUp=_ref2.onPointerUp,metaComponentName=_ref2.metaComponentName,paddingX=_ref2.paddingX,marginY=_ref2.marginY,marginBottom=_ref2.marginBottom,marginTop=_ref2.marginTop,_ref2$size=_ref2.size,size$1=_ref2$size===void 0?'large':_ref2$size,isDisabled=_ref2.isDisabled,children=_ref2.children,trailingInteractionElement=_ref2.trailingInteractionElement;var validatedTrailingComponent=useTrailingRestriction({trailing:trailing,size:size$1});var shouldWrapTitle=titleSuffix&&trailing&&showBackButton&&showCloseButton;var webOnlyEventHandlers=isReactNative()?{}:{onClickCapture:onClickCapture,onKeyDown:onKeyDown,onKeyUp:onKeyUp,onLostPointerCapture:onLostPointerCapture,onPointerCancel:onPointerCancel,onPointerDown:onPointerDown,onPointerMove:onPointerMove,onPointerUp:onPointerUp};return jsxs(BaseBox,Object.assign({},metaAttribute({name:metaComponentName,testID:testID}),{children:[jsxs(BaseBox,Object.assign({marginY:marginY!=null?marginY:{base:'spacing.5',m:'spacing.6'},paddingX:paddingX!=null?paddingX:{base:'spacing.5',m:'spacing.6'},marginTop:marginTop,marginBottom:marginBottom,touchAction:"none"},webOnlyEventHandlers,{children:[jsxs(BaseBox,{display:"flex",flexDirection:"row",userSelect:"none",children:[showBackButton?jsx(BaseBox,{overflow:"visible",marginRight:"spacing.5",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:jsx(IconButton,{ref:backButtonRef,size:"large",icon:ChevronLeftIcon,onClick:function onClick(){return onBackButtonClick==null?void 0:onBackButtonClick();},accessibilityLabel:"Back"})}))}):null,jsxs(BaseBox,{paddingRight:"spacing.5",marginRight:"auto",flex:"auto",display:"flex",flexDirection:"row",alignItems:"flex-start",children:[leading?jsx(BaseBox,Object.assign({marginRight:"spacing.3"},centerBoxProps[size$1],{children:leading})):null,jsxs(BaseBox,{flex:"auto",children:[jsxs(BaseBox,{maxWidth:isReactNative()&&shouldWrapTitle?'100px':undefined,flexShrink:0,display:"flex",flexDirection:"row",children:[title?jsx(Text,{size:sizeTokensMapping[size$1].title,marginTop:makeSize(size['1']),weight:"semibold",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.normal',children:title}):null,titleSuffix&&jsx(BaseBox,{marginLeft:"spacing.3",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:titleSuffix}))})]}),subtitle?jsx(Text,{variant:"body",size:"small",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.muted',children:subtitle}):null]})]}),validatedTrailingComponent?jsx(BaseBox,{marginRight:"spacing.5",children:jsx(Box,Object.assign({},centerBoxProps[size$1],{children:validatedTrailingComponent}))}):null,showCloseButton?jsx(Box,Object.assign({},centerBoxProps[size$1],{children:jsx(IconButton,{ref:closeButtonRef,size:"large",icon:CloseIcon,accessibilityLabel:"Close",onClick:function onClick(){return onCloseButtonClick==null?void 0:onCloseButtonClick();}})})):null,trailingInteractionElement&&!children?jsx(Box,Object.assign({},centerBoxProps[size$1],{children:trailingInteractionElement})):null]}),jsxs(BaseBox,{display:"flex",width:"100%",flexDirection:"row",alignItems:"center",justifyContent:"space-between",children:[jsx(Box,{children:children}),trailingInteractionElement&&children?jsx(Box,Object.assign({alignSelf:"flex-start"},centerBoxProps[size$1],{children:trailingInteractionElement})):null]})]})),showDivider?jsx(Divider,{}):null]}));};var BaseHeader=assignWithoutSideEffects(_BaseHeader,{componentId:'BaseHeader'});
|
|
33
33
|
|
|
34
34
|
export { BaseHeader };
|
|
35
35
|
//# sourceMappingURL=BaseHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseHeader.js","sources":["../../../../../src/components/BaseHeaderFooter/BaseHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport type { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport { IconButton } from '~components/Button/IconButton';\nimport { ChevronLeftIcon, CloseIcon } from '~components/Icons';\nimport type { TestID } from '~utils/types';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { isReactNative, makeSize } from '~utils';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport { logger, throwBladeError } from '~utils/logger';\nimport { size as sizeToken } from '~tokens/global';\n\ntype BaseHeaderProps = {\n title?: string;\n subtitle?: string;\n /**\n * Leading part of the header placed at the left most side of the header\n */\n leading?: React.ReactNode;\n /**\n * Trailing part of the header placed at the right most side of the header\n */\n trailing?: React.ReactNode;\n /**\n * Placed adjacent to the title text\n */\n titleSuffix?: React.ReactNode;\n /**\n * @default true\n */\n showDivider?: boolean;\n /**\n * @default false\n */\n showBackButton?: boolean;\n\n /**\n * Slot for rendering any trailing interaction element into BaseHeader.\n *\n * E.g. Used in accordion to render CollapsibleChevronIcon\n */\n trailingInteractionElement?: React.ReactNode;\n\n /**\n * Decides size of the Header\n */\n size?: 'large' | 'medium';\n /**\n * @default true\n */\n showCloseButton?: boolean;\n\n /**\n * Disabled state of BaseHeader\n *\n * @default false\n */\n isDisabled?: boolean;\n\n paddingX?: BoxProps['paddingX'];\n marginY?: BoxProps['marginY'];\n onCloseButtonClick?: () => void;\n onBackButtonClick?: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n backButtonRef?: React.MutableRefObject<any>;\n metaComponentName?: string;\n /**\n * inner child of BottomSheetHeader. Meant to be used for AutoComplete only\n */\n children?: React.ReactElement | React.ReactElement[];\n} & Pick<\n ReactDOMAttributes,\n | 'onClickCapture'\n | 'onKeyDown'\n | 'onKeyUp'\n | 'onLostPointerCapture'\n | 'onPointerCancel'\n | 'onPointerDown'\n | 'onPointerMove'\n | 'onPointerUp'\n> &\n TestID;\n\ntype TrailingComponents = 'Button' | 'Badge' | 'Link' | 'Text' | 'Amount';\n\nconst commonCenterBoxProps: BoxProps = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n};\n\nconst centerBoxProps: { large: BoxProps; medium: BoxProps } = {\n large: {\n ...commonCenterBoxProps,\n // We want to align title, icon, titleSuffix, trailing, closeButton to baseline\n // But we also want to keep them center aligned to each other\n // So we add a virtual Box around these slots with 28px and center align them to that box\n // We have done similar thing in figma as well (which is where this 28px comes from)\n height: '28px',\n },\n medium: {\n ...commonCenterBoxProps,\n height: '20px',\n },\n};\n\nconst sizeTokensMapping = {\n large: {\n title: 'large',\n },\n medium: {\n title: 'medium',\n },\n} as const;\n\n// prop restriction map for corresponding sub components\nconst propRestrictionMap = {\n large: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n medium: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n Badge: {\n size: 'small',\n },\n Link: {\n size: 'small',\n },\n Text: {\n size: 'small',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'small',\n },\n },\n} as const;\n\nconst useTrailingRestriction = ({\n trailing,\n size,\n}: {\n size: NonNullable<BaseHeaderProps['size']>;\n trailing: BaseHeaderProps['trailing'];\n}): React.ReactNode => {\n const [\n validatedTrailingComponent,\n setValidatedTrailingComponent,\n ] = React.useState<React.ReactElement | null>(null);\n\n // validate and restrict sub component props in trailing prop\n React.useEffect(() => {\n if (React.isValidElement(trailing)) {\n const trailingComponentType = getComponentId(trailing) as TrailingComponents;\n const restrictedProps = propRestrictionMap[size][trailingComponentType];\n const allowedComponents = Object.keys(propRestrictionMap[size]);\n if (__DEV__) {\n if (!restrictedProps) {\n throwBladeError({\n message: `Only one of \\`${allowedComponents.join(\n ', ',\n )}\\` component is accepted as trailing`,\n moduleName: 'Header',\n });\n }\n }\n\n const restrictedPropKeys = Object.keys(propRestrictionMap[size][trailingComponentType]);\n for (const prop of restrictedPropKeys) {\n if (trailing?.props?.hasOwnProperty(prop)) {\n logger({\n message: `Do not pass \"${prop}\" to \"${trailingComponentType}\" while inside Header trailing, because we override it.`,\n moduleName: 'Header',\n type: 'warn',\n });\n }\n }\n setValidatedTrailingComponent(\n React.cloneElement(trailing as React.ReactElement, restrictedProps),\n );\n }\n }, [trailing, size]);\n\n return validatedTrailingComponent;\n};\n\nconst _BaseHeader = ({\n title,\n subtitle,\n leading,\n titleSuffix,\n trailing,\n showDivider = true,\n showBackButton = false,\n showCloseButton = true,\n onBackButtonClick,\n onCloseButtonClick,\n closeButtonRef,\n backButtonRef,\n testID,\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n metaComponentName,\n paddingX,\n marginY,\n size = 'large',\n isDisabled,\n children,\n trailingInteractionElement,\n}: BaseHeaderProps): React.ReactElement => {\n const validatedTrailingComponent = useTrailingRestriction({ trailing, size });\n const shouldWrapTitle = titleSuffix && trailing && showBackButton && showCloseButton;\n\n const webOnlyEventHandlers: Record<string, any> = isReactNative()\n ? {}\n : {\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n };\n\n return (\n <BaseBox {...metaAttribute({ name: metaComponentName, testID })}>\n <BaseBox\n marginY={marginY ?? { base: 'spacing.5', m: 'spacing.6' }}\n paddingX={paddingX ?? { base: 'spacing.5', m: 'spacing.6' }}\n touchAction=\"none\"\n {...webOnlyEventHandlers}\n >\n <BaseBox display=\"flex\" flexDirection=\"row\" userSelect=\"none\">\n {showBackButton ? (\n <BaseBox overflow=\"visible\" marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={backButtonRef}\n size=\"large\"\n icon={ChevronLeftIcon}\n onClick={() => onBackButtonClick?.()}\n accessibilityLabel=\"Back\"\n />\n </Box>\n </BaseBox>\n ) : null}\n <BaseBox\n paddingRight=\"spacing.5\"\n marginRight=\"auto\"\n flex=\"auto\"\n display=\"flex\"\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n >\n {leading ? (\n <BaseBox marginRight=\"spacing.3\" {...centerBoxProps[size]}>\n {leading}\n </BaseBox>\n ) : null}\n <BaseBox flex=\"auto\">\n <BaseBox\n // Explicitly setting maxWidth in React Native because text is not being wrapped properly when multiple fix width components are rendered in header\n // In web, flex containers seem to work a expected\n // @todo: resolve this if we figure out some better solution later\n maxWidth={isReactNative() && shouldWrapTitle ? '100px' : undefined}\n flexShrink={0}\n display=\"flex\"\n flexDirection=\"row\"\n >\n {title ? (\n <Text\n size={sizeTokensMapping[size].title}\n marginTop={makeSize(sizeToken['1'])}\n weight=\"semibold\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'}\n >\n {title}\n </Text>\n ) : null}\n {titleSuffix && (\n <BaseBox marginLeft=\"spacing.3\">\n <Box {...centerBoxProps[size]}>{titleSuffix}</Box>\n </BaseBox>\n )}\n </BaseBox>\n {subtitle ? (\n <Text\n variant=\"body\"\n size=\"small\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {subtitle}\n </Text>\n ) : null}\n </BaseBox>\n </BaseBox>\n {validatedTrailingComponent ? (\n <BaseBox marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n ) : null}\n {showCloseButton ? (\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={closeButtonRef}\n size=\"large\"\n icon={CloseIcon}\n accessibilityLabel=\"Close\"\n onClick={() => onCloseButtonClick?.()}\n />\n </Box>\n ) : null}\n {trailingInteractionElement && !children ? (\n <Box {...centerBoxProps[size]}>{trailingInteractionElement}</Box>\n ) : null}\n </BaseBox>\n <BaseBox\n display=\"flex\"\n width=\"100%\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Box>{children}</Box>\n {trailingInteractionElement && children ? (\n <Box alignSelf=\"flex-start\" {...centerBoxProps[size]}>\n {trailingInteractionElement}\n </Box>\n ) : null}\n </BaseBox>\n </BaseBox>\n {showDivider ? <Divider /> : null}\n </BaseBox>\n );\n};\n\nconst BaseHeader = assignWithoutSideEffects(_BaseHeader, {\n componentId: 'BaseHeader',\n});\n\nexport type { BaseHeaderProps };\nexport { BaseHeader };\n"],"names":["commonCenterBoxProps","display","alignItems","justifyContent","centerBoxProps","large","Object","assign","height","medium","sizeTokensMapping","title","propRestrictionMap","Button","size","variant","Badge","Link","Text","Amount","type","useTrailingRestriction","_ref","trailing","_React$useState","React","useState","_React$useState2","_slicedToArray","validatedTrailingComponent","setValidatedTrailingComponent","useEffect","isValidElement","trailingComponentType","getComponentId","restrictedProps","allowedComponents","keys","__DEV__","throwBladeError","message","join","moduleName","restrictedPropKeys","prop","_trailing$props","props","hasOwnProperty","logger","cloneElement","_BaseHeader","_ref2","subtitle","leading","titleSuffix","_ref2$showDivider","showDivider","_ref2$showBackButton","showBackButton","_ref2$showCloseButton","showCloseButton","onBackButtonClick","onCloseButtonClick","closeButtonRef","backButtonRef","testID","onClickCapture","onKeyDown","onKeyUp","onLostPointerCapture","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","metaComponentName","paddingX","marginY","_ref2$size","isDisabled","children","trailingInteractionElement","shouldWrapTitle","webOnlyEventHandlers","isReactNative","_jsxs","BaseBox","metaAttribute","name","base","m","touchAction","flexDirection","userSelect","_jsx","overflow","marginRight","Box","IconButton","ref","icon","ChevronLeftIcon","onClick","accessibilityLabel","paddingRight","flex","maxWidth","undefined","flexShrink","marginTop","makeSize","sizeToken","weight","color","marginLeft","CloseIcon","width","alignSelf","Divider","BaseHeader","assignWithoutSideEffects","componentId"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseHeader.js","sources":["../../../../../src/components/BaseHeaderFooter/BaseHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\nimport type { ReactDOMAttributes } from '@use-gesture/react/dist/declarations/src/types';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Text } from '~components/Typography';\nimport { IconButton } from '~components/Button/IconButton';\nimport { ChevronLeftIcon, CloseIcon } from '~components/Icons';\nimport type { TestID } from '~utils/types';\nimport type { BoxProps } from '~components/Box';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { isReactNative, makeSize } from '~utils';\nimport { metaAttribute } from '~utils/metaAttribute';\nimport { logger, throwBladeError } from '~utils/logger';\nimport { size as sizeToken } from '~tokens/global';\n\ntype BaseHeaderProps = {\n title?: string;\n subtitle?: string;\n /**\n * Leading part of the header placed at the left most side of the header\n */\n leading?: React.ReactNode;\n /**\n * Trailing part of the header placed at the right most side of the header\n */\n trailing?: React.ReactNode;\n /**\n * Placed adjacent to the title text\n */\n titleSuffix?: React.ReactNode;\n /**\n * @default true\n */\n showDivider?: boolean;\n /**\n * @default false\n */\n showBackButton?: boolean;\n\n /**\n * Slot for rendering any trailing interaction element into BaseHeader.\n *\n * E.g. Used in accordion to render CollapsibleChevronIcon\n */\n trailingInteractionElement?: React.ReactNode;\n\n /**\n * Decides size of the Header\n */\n size?: 'large' | 'medium';\n /**\n * @default true\n */\n showCloseButton?: boolean;\n\n /**\n * Disabled state of BaseHeader\n *\n * @default false\n */\n isDisabled?: boolean;\n\n paddingX?: BoxProps['paddingX'];\n marginY?: BoxProps['marginY'];\n marginTop?: BoxProps['marginTop'];\n marginBottom?: BoxProps['marginBottom'];\n onCloseButtonClick?: () => void;\n onBackButtonClick?: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n backButtonRef?: React.MutableRefObject<any>;\n metaComponentName?: string;\n /**\n * inner child of BottomSheetHeader. Meant to be used for AutoComplete only\n */\n children?: React.ReactElement | React.ReactElement[];\n} & Pick<\n ReactDOMAttributes,\n | 'onClickCapture'\n | 'onKeyDown'\n | 'onKeyUp'\n | 'onLostPointerCapture'\n | 'onPointerCancel'\n | 'onPointerDown'\n | 'onPointerMove'\n | 'onPointerUp'\n> &\n TestID;\n\ntype TrailingComponents = 'Button' | 'Badge' | 'Link' | 'Text' | 'Amount';\n\nconst commonCenterBoxProps: BoxProps = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n};\n\nconst centerBoxProps: { large: BoxProps; medium: BoxProps } = {\n large: {\n ...commonCenterBoxProps,\n // We want to align title, icon, titleSuffix, trailing, closeButton to baseline\n // But we also want to keep them center aligned to each other\n // So we add a virtual Box around these slots with 28px and center align them to that box\n // We have done similar thing in figma as well (which is where this 28px comes from)\n height: '28px',\n },\n medium: {\n ...commonCenterBoxProps,\n height: '20px',\n },\n};\n\nconst sizeTokensMapping = {\n large: {\n title: 'large',\n },\n medium: {\n title: 'medium',\n },\n} as const;\n\n// prop restriction map for corresponding sub components\nconst propRestrictionMap = {\n large: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n Badge: {\n size: 'medium',\n },\n Link: {\n size: 'medium',\n },\n Text: {\n size: 'medium',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'medium',\n },\n },\n medium: {\n Button: {\n size: 'xsmall',\n variant: 'tertiary',\n },\n Badge: {\n size: 'small',\n },\n Link: {\n size: 'small',\n },\n Text: {\n size: 'small',\n variant: 'body',\n },\n Amount: {\n type: 'body',\n size: 'small',\n },\n },\n} as const;\n\nconst useTrailingRestriction = ({\n trailing,\n size,\n}: {\n size: NonNullable<BaseHeaderProps['size']>;\n trailing: BaseHeaderProps['trailing'];\n}): React.ReactNode => {\n const [\n validatedTrailingComponent,\n setValidatedTrailingComponent,\n ] = React.useState<React.ReactElement | null>(null);\n\n // validate and restrict sub component props in trailing prop\n React.useEffect(() => {\n if (React.isValidElement(trailing)) {\n const trailingComponentType = getComponentId(trailing) as TrailingComponents;\n const restrictedProps = propRestrictionMap[size][trailingComponentType];\n const allowedComponents = Object.keys(propRestrictionMap[size]);\n if (__DEV__) {\n if (!restrictedProps) {\n throwBladeError({\n message: `Only one of \\`${allowedComponents.join(\n ', ',\n )}\\` component is accepted as trailing`,\n moduleName: 'Header',\n });\n }\n }\n\n const restrictedPropKeys = Object.keys(propRestrictionMap[size][trailingComponentType]);\n for (const prop of restrictedPropKeys) {\n if (trailing?.props?.hasOwnProperty(prop)) {\n logger({\n message: `Do not pass \"${prop}\" to \"${trailingComponentType}\" while inside Header trailing, because we override it.`,\n moduleName: 'Header',\n type: 'warn',\n });\n }\n }\n setValidatedTrailingComponent(\n React.cloneElement(trailing as React.ReactElement, restrictedProps),\n );\n }\n }, [trailing, size]);\n\n return validatedTrailingComponent;\n};\n\nconst _BaseHeader = ({\n title,\n subtitle,\n leading,\n titleSuffix,\n trailing,\n showDivider = true,\n showBackButton = false,\n showCloseButton = true,\n onBackButtonClick,\n onCloseButtonClick,\n closeButtonRef,\n backButtonRef,\n testID,\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n metaComponentName,\n paddingX,\n marginY,\n marginBottom,\n marginTop,\n size = 'large',\n isDisabled,\n children,\n trailingInteractionElement,\n}: BaseHeaderProps): React.ReactElement => {\n const validatedTrailingComponent = useTrailingRestriction({ trailing, size });\n const shouldWrapTitle = titleSuffix && trailing && showBackButton && showCloseButton;\n\n const webOnlyEventHandlers: Record<string, any> = isReactNative()\n ? {}\n : {\n onClickCapture,\n onKeyDown,\n onKeyUp,\n onLostPointerCapture,\n onPointerCancel,\n onPointerDown,\n onPointerMove,\n onPointerUp,\n };\n\n return (\n <BaseBox {...metaAttribute({ name: metaComponentName, testID })}>\n <BaseBox\n marginY={marginY ?? { base: 'spacing.5', m: 'spacing.6' }}\n paddingX={paddingX ?? { base: 'spacing.5', m: 'spacing.6' }}\n marginTop={marginTop}\n marginBottom={marginBottom}\n touchAction=\"none\"\n {...webOnlyEventHandlers}\n >\n <BaseBox display=\"flex\" flexDirection=\"row\" userSelect=\"none\">\n {showBackButton ? (\n <BaseBox overflow=\"visible\" marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={backButtonRef}\n size=\"large\"\n icon={ChevronLeftIcon}\n onClick={() => onBackButtonClick?.()}\n accessibilityLabel=\"Back\"\n />\n </Box>\n </BaseBox>\n ) : null}\n <BaseBox\n paddingRight=\"spacing.5\"\n marginRight=\"auto\"\n flex=\"auto\"\n display=\"flex\"\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n >\n {leading ? (\n <BaseBox marginRight=\"spacing.3\" {...centerBoxProps[size]}>\n {leading}\n </BaseBox>\n ) : null}\n <BaseBox flex=\"auto\">\n <BaseBox\n // Explicitly setting maxWidth in React Native because text is not being wrapped properly when multiple fix width components are rendered in header\n // In web, flex containers seem to work a expected\n // @todo: resolve this if we figure out some better solution later\n maxWidth={isReactNative() && shouldWrapTitle ? '100px' : undefined}\n flexShrink={0}\n display=\"flex\"\n flexDirection=\"row\"\n >\n {title ? (\n <Text\n size={sizeTokensMapping[size].title}\n marginTop={makeSize(sizeToken['1'])}\n weight=\"semibold\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'}\n >\n {title}\n </Text>\n ) : null}\n {titleSuffix && (\n <BaseBox marginLeft=\"spacing.3\">\n <Box {...centerBoxProps[size]}>{titleSuffix}</Box>\n </BaseBox>\n )}\n </BaseBox>\n {subtitle ? (\n <Text\n variant=\"body\"\n size=\"small\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n >\n {subtitle}\n </Text>\n ) : null}\n </BaseBox>\n </BaseBox>\n {validatedTrailingComponent ? (\n <BaseBox marginRight=\"spacing.5\">\n <Box {...centerBoxProps[size]}>{validatedTrailingComponent}</Box>\n </BaseBox>\n ) : null}\n {showCloseButton ? (\n <Box {...centerBoxProps[size]}>\n <IconButton\n ref={closeButtonRef}\n size=\"large\"\n icon={CloseIcon}\n accessibilityLabel=\"Close\"\n onClick={() => onCloseButtonClick?.()}\n />\n </Box>\n ) : null}\n {trailingInteractionElement && !children ? (\n <Box {...centerBoxProps[size]}>{trailingInteractionElement}</Box>\n ) : null}\n </BaseBox>\n <BaseBox\n display=\"flex\"\n width=\"100%\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n >\n <Box>{children}</Box>\n {trailingInteractionElement && children ? (\n <Box alignSelf=\"flex-start\" {...centerBoxProps[size]}>\n {trailingInteractionElement}\n </Box>\n ) : null}\n </BaseBox>\n </BaseBox>\n {showDivider ? <Divider /> : null}\n </BaseBox>\n );\n};\n\nconst BaseHeader = assignWithoutSideEffects(_BaseHeader, {\n componentId: 'BaseHeader',\n});\n\nexport type { BaseHeaderProps };\nexport { BaseHeader };\n"],"names":["commonCenterBoxProps","display","alignItems","justifyContent","centerBoxProps","large","Object","assign","height","medium","sizeTokensMapping","title","propRestrictionMap","Button","size","variant","Badge","Link","Text","Amount","type","useTrailingRestriction","_ref","trailing","_React$useState","React","useState","_React$useState2","_slicedToArray","validatedTrailingComponent","setValidatedTrailingComponent","useEffect","isValidElement","trailingComponentType","getComponentId","restrictedProps","allowedComponents","keys","__DEV__","throwBladeError","message","join","moduleName","restrictedPropKeys","prop","_trailing$props","props","hasOwnProperty","logger","cloneElement","_BaseHeader","_ref2","subtitle","leading","titleSuffix","_ref2$showDivider","showDivider","_ref2$showBackButton","showBackButton","_ref2$showCloseButton","showCloseButton","onBackButtonClick","onCloseButtonClick","closeButtonRef","backButtonRef","testID","onClickCapture","onKeyDown","onKeyUp","onLostPointerCapture","onPointerCancel","onPointerDown","onPointerMove","onPointerUp","metaComponentName","paddingX","marginY","marginBottom","marginTop","_ref2$size","isDisabled","children","trailingInteractionElement","shouldWrapTitle","webOnlyEventHandlers","isReactNative","_jsxs","BaseBox","metaAttribute","name","base","m","touchAction","flexDirection","userSelect","_jsx","overflow","marginRight","Box","IconButton","ref","icon","ChevronLeftIcon","onClick","accessibilityLabel","paddingRight","flex","maxWidth","undefined","flexShrink","makeSize","sizeToken","weight","color","marginLeft","CloseIcon","width","alignSelf","Divider","BaseHeader","assignWithoutSideEffects","componentId"],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
|
|
3
|
+
var BaseMenuItemContext=React__default.createContext({});var useBaseMenuItem=function useBaseMenuItem(){var menuItemValue=React__default.useContext(BaseMenuItemContext);return menuItemValue;};
|
|
4
|
+
|
|
5
|
+
export { BaseMenuItemContext, useBaseMenuItem };
|
|
6
|
+
//# sourceMappingURL=BaseMenuContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseMenuContext.js","sources":["../../../../../src/components/BaseMenu/BaseMenuContext.ts"],"sourcesContent":["import React from 'react';\nimport type { BaseMenuItemContextType } from './types';\n\nconst BaseMenuItemContext = React.createContext<BaseMenuItemContextType>({});\n\nconst useBaseMenuItem = (): BaseMenuItemContextType => {\n const menuItemValue = React.useContext(BaseMenuItemContext);\n return menuItemValue;\n};\n\nexport { useBaseMenuItem, BaseMenuItemContext };\n"],"names":["BaseMenuItemContext","React","createContext","useBaseMenuItem","menuItemValue","useContext"],"mappings":";;AAGM,IAAAA,mBAAmB,CAAGC,cAAK,CAACC,aAAa,CAA0B,EAAE,EAErE,IAAAC,eAAe,CAAG,SAAlBA,eAAeA,EAAkC,CACrD,IAAMC,aAAa,CAAGH,cAAK,CAACI,UAAU,CAACL,mBAAmB,CAAC,CAC3D,OAAOI,aAAa,CACtB;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
2
|
+
import React__default from 'react';
|
|
3
|
+
import { BaseMenuItemContext } from '../BaseMenuContext.js';
|
|
4
|
+
import { StyledMenuItemContainer } from './StyledMenuItemContainer.native.js';
|
|
5
|
+
import { Box } from '../../Box/Box.js';
|
|
6
|
+
import '../../Typography/BaseText/BaseText.native.js';
|
|
7
|
+
import '@babel/runtime/helpers/slicedToArray';
|
|
8
|
+
import 'react-native';
|
|
9
|
+
import '../../../tokens/global/typography.js';
|
|
10
|
+
import '../../../tokens/global/motion.js';
|
|
11
|
+
import { size } from '../../../tokens/global/size.js';
|
|
12
|
+
import { makeSize } from '../../../utils/makeSize/makeSize.js';
|
|
13
|
+
import '../../BladeProvider/useTheme.js';
|
|
14
|
+
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
15
|
+
import { Text } from '../../Typography/Text/Text.js';
|
|
16
|
+
import '../../Typography/Code/Code.js';
|
|
17
|
+
import { makeAccessible } from '../../../utils/makeAccessible/makeAccessible.native.js';
|
|
18
|
+
|
|
19
|
+
var _excluded=["title","description","as","leading","trailing","titleSuffix","isDisabled","selectionType","isSelected","isVisible","color","role","children"];var menuItemTitleColor={negative:{default:'feedback.text.negative.intense',disabled:'interactive.text.gray.disabled'},normal:{default:'interactive.text.gray.normal',disabled:'interactive.text.gray.disabled'}};var menuItemDescriptionColor={default:'interactive.text.gray.muted',disabled:'interactive.text.gray.disabled'};var itemFirstRowHeight=makeSize(size[20]);var _BaseMenuItem=function _BaseMenuItem(_ref,ref){var title=_ref.title,description=_ref.description,as=_ref.as,leading=_ref.leading,trailing=_ref.trailing,titleSuffix=_ref.titleSuffix,isDisabled=_ref.isDisabled,_ref$selectionType=_ref.selectionType,selectionType=_ref$selectionType===void 0?'single':_ref$selectionType,isSelected=_ref.isSelected,_ref$isVisible=_ref.isVisible,isVisible=_ref$isVisible===void 0?true:_ref$isVisible,color=_ref.color,_ref$role=_ref.role,role=_ref$role===void 0?'menuitem':_ref$role,children=_ref.children,props=_objectWithoutProperties(_ref,_excluded);return jsx(BaseMenuItemContext.Provider,{value:{color:color,isDisabled:isDisabled},children:jsx(StyledMenuItemContainer,Object.assign({ref:ref,as:as,type:"button",disabled:isDisabled},makeAccessible({role:role,current:role==='menuitem'||role==='menuitemcheckbox'?isSelected:undefined,disabled:isDisabled,selected:isSelected}),{color:color,isVisible:isVisible,isSelected:isSelected,isDisabled:isDisabled,selectionType:selectionType},props,{children:children?children:jsx(Fragment,{children:jsxs(Box,{display:"flex",alignItems:"flex-start",width:"100%",justifyContent:"center",children:[jsx(Box,{display:"flex",justifyContent:"center",alignItems:"center",height:itemFirstRowHeight,children:leading}),jsxs(Box,{paddingLeft:leading?'spacing.3':'spacing.0',paddingRight:"spacing.3",display:"flex",flexDirection:"column",children:[jsxs(Box,{display:"flex",alignItems:"center",flexDirection:"row",height:itemFirstRowHeight,children:[jsx(Text,{truncateAfterLines:1,color:menuItemTitleColor[color==='negative'?'negative':'normal'][isDisabled?'disabled':'default'],children:title}),titleSuffix]}),jsx(Box,{children:description?jsx(Text,{color:menuItemDescriptionColor[isDisabled?'disabled':'default'],size:"small",children:description}):null})]}),jsx(Box,{marginLeft:"auto",children:trailing})]})})}))});};var BaseMenuItem=React__default.forwardRef(_BaseMenuItem);
|
|
20
|
+
|
|
21
|
+
export { BaseMenuItem };
|
|
22
|
+
//# sourceMappingURL=BaseMenuItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseMenuItem.js","sources":["../../../../../../src/components/BaseMenu/BaseMenuItem/BaseMenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport type { BaseMenuItemProps } from '../types';\nimport { BaseMenuItemContext } from '../BaseMenuContext';\nimport { StyledMenuItemContainer } from './StyledMenuItemContainer';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { size } from '~tokens/global';\nimport { makeSize } from '~utils';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport type { BladeElementRef } from '~utils/types';\n\nconst menuItemTitleColor = {\n negative: {\n default: 'feedback.text.negative.intense',\n disabled: 'interactive.text.gray.disabled',\n },\n normal: { default: 'interactive.text.gray.normal', disabled: 'interactive.text.gray.disabled' },\n} as const;\n\nconst menuItemDescriptionColor = {\n default: 'interactive.text.gray.muted',\n disabled: 'interactive.text.gray.disabled',\n} as const;\n\n// This is the height of item excluding the description to make sure description comes at the bottom and other first row items are center aligned\nconst itemFirstRowHeight = makeSize(size[20]);\n\nconst _BaseMenuItem: React.ForwardRefRenderFunction<BladeElementRef, BaseMenuItemProps> = (\n {\n title,\n description,\n as,\n leading,\n trailing,\n titleSuffix,\n isDisabled,\n selectionType = 'single',\n isSelected,\n isVisible = true,\n color,\n role = 'menuitem',\n children,\n ...props\n },\n ref,\n): React.ReactElement => {\n return (\n <BaseMenuItemContext.Provider value={{ color, isDisabled }}>\n <StyledMenuItemContainer\n ref={ref as never}\n as={as}\n type=\"button\"\n disabled={isDisabled}\n {...makeAccessible({\n role,\n current: role === 'menuitem' || role === 'menuitemcheckbox' ? isSelected : undefined,\n disabled: isDisabled,\n selected: isSelected,\n })}\n color={color}\n isVisible={isVisible}\n isSelected={isSelected}\n isDisabled={isDisabled}\n selectionType={selectionType}\n {...props}\n >\n {children ? (\n children\n ) : (\n <>\n <Box display=\"flex\" alignItems=\"flex-start\" width=\"100%\" justifyContent=\"center\">\n <Box\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n height={itemFirstRowHeight}\n >\n {leading}\n </Box>\n <Box\n paddingLeft={leading ? 'spacing.3' : 'spacing.0'}\n paddingRight=\"spacing.3\"\n display=\"flex\"\n flexDirection=\"column\"\n >\n <Box\n display=\"flex\"\n alignItems=\"center\"\n flexDirection=\"row\"\n height={itemFirstRowHeight}\n >\n <Text\n truncateAfterLines={1}\n color={\n menuItemTitleColor[color === 'negative' ? 'negative' : 'normal'][\n isDisabled ? 'disabled' : 'default'\n ]\n }\n >\n {title}\n </Text>\n {titleSuffix}\n </Box>\n <Box>\n {description ? (\n <Text\n color={menuItemDescriptionColor[isDisabled ? 'disabled' : 'default']}\n size=\"small\"\n >\n {description}\n </Text>\n ) : null}\n </Box>\n </Box>\n <Box marginLeft=\"auto\">{trailing}</Box>\n </Box>\n </>\n )}\n </StyledMenuItemContainer>\n </BaseMenuItemContext.Provider>\n );\n};\n\nconst BaseMenuItem = React.forwardRef(_BaseMenuItem);\n\nexport { BaseMenuItem };\n"],"names":["menuItemTitleColor","negative","default","disabled","normal","menuItemDescriptionColor","itemFirstRowHeight","makeSize","size","_BaseMenuItem","_ref","ref","title","description","as","leading","trailing","titleSuffix","isDisabled","_ref$selectionType","selectionType","isSelected","_ref$isVisible","isVisible","color","_ref$role","role","children","props","_objectWithoutProperties","_excluded","_jsx","BaseMenuItemContext","Provider","value","StyledMenuItemContainer","Object","assign","type","makeAccessible","current","undefined","selected","_Fragment","_jsxs","Box","display","alignItems","width","justifyContent","height","paddingLeft","paddingRight","flexDirection","Text","truncateAfterLines","marginLeft","BaseMenuItem","React","forwardRef"],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import styled from 'styled-components/native';
|
|
2
|
+
import { TouchableOpacity } from 'react-native';
|
|
3
|
+
import { getBaseMenuItemStyles } from './getBaseMenuItemStyles.js';
|
|
4
|
+
import '@babel/runtime/helpers/slicedToArray';
|
|
5
|
+
import 'react';
|
|
6
|
+
import { makeSize } from '../../../utils/makeSize/makeSize.js';
|
|
7
|
+
import '../../BladeProvider/useTheme.js';
|
|
8
|
+
|
|
9
|
+
var StyledMenuItemContainer=styled(TouchableOpacity)(function(props){return Object.assign({},getBaseMenuItemStyles({theme:props.theme}),{padding:makeSize(props.theme.spacing[3]),display:props.isVisible?'flex':'none',backgroundColor:props.isSelected&&props.selectionType==='single'?props.theme.colors.interactive.background.primary.faded:undefined});});
|
|
10
|
+
|
|
11
|
+
export { StyledMenuItemContainer };
|
|
12
|
+
//# sourceMappingURL=StyledMenuItemContainer.native.js.map
|
package/build/lib/native/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.native.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StyledMenuItemContainer.native.js","sources":["../../../../../../src/components/BaseMenu/BaseMenuItem/StyledMenuItemContainer.native.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { TouchableOpacity } from 'react-native';\nimport type { StyledBaseMenuItemContainerProps } from '../types';\nimport { getBaseMenuItemStyles } from './getBaseMenuItemStyles';\nimport { makeSize } from '~utils';\n\nconst StyledMenuItemContainer = styled(TouchableOpacity)<StyledBaseMenuItemContainerProps>(\n (props) => {\n return {\n ...getBaseMenuItemStyles({ theme: props.theme }),\n padding: makeSize(props.theme.spacing[3]),\n display: props.isVisible ? 'flex' : 'none',\n // React Native specific styles\n backgroundColor:\n props.isSelected && props.selectionType === 'single'\n ? props.theme.colors.interactive.background.primary.faded\n : undefined,\n };\n },\n);\n\nexport { StyledMenuItemContainer };\n"],"names":["StyledMenuItemContainer","styled","TouchableOpacity","props","Object","assign","getBaseMenuItemStyles","theme","padding","makeSize","spacing","display","isVisible","backgroundColor","isSelected","selectionType","colors","interactive","background","primary","faded","undefined"],"mappings":";;;;;;;;AAMM,IAAAA,uBAAuB,CAAGC,MAAM,CAACC,gBAAgB,CAAC,CACtD,SAACC,KAAK,CAAK,CACT,OAAAC,MAAA,CAAAC,MAAA,CAAA,EAAA,CACKC,qBAAqB,CAAC,CAAEC,KAAK,CAAEJ,KAAK,CAACI,KAAM,CAAC,CAAC,EAChDC,OAAO,CAAEC,QAAQ,CAACN,KAAK,CAACI,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC,CAAC,CACzCC,OAAO,CAAER,KAAK,CAACS,SAAS,CAAG,MAAM,CAAG,MAAM,CAE1CC,eAAe,CACbV,KAAK,CAACW,UAAU,EAAIX,KAAK,CAACY,aAAa,GAAK,QAAQ,CAChDZ,KAAK,CAACI,KAAK,CAACS,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,OAAO,CAACC,KAAK,CACvDC,SAAS,GAEnB,CACF;;;;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import 'react-native';
|
|
2
|
+
import '@babel/runtime/helpers/slicedToArray';
|
|
3
|
+
import 'react';
|
|
4
|
+
import { isReactNative } from '../../../utils/platform/isReactNative.js';
|
|
5
|
+
import { makeBorderSize } from '../../../utils/makeBorderSize/makeBorderSize.js';
|
|
6
|
+
import { makeSize } from '../../../utils/makeSize/makeSize.js';
|
|
7
|
+
import '../../BladeProvider/useTheme.js';
|
|
8
|
+
|
|
9
|
+
var getBaseMenuItemStyles=function getBaseMenuItemStyles(props){return {borderWidth:makeBorderSize(props.theme.border.width.none),display:'flex',flexDirection:'column',textAlign:isReactNative()?undefined:'left',backgroundColor:'transparent',borderRadius:makeSize(props.theme.border.radius.medium),marginTop:makeSize(props.theme.spacing[1]),marginBottom:makeSize(props.theme.spacing[1]),textDecoration:'none',cursor:'pointer',width:'100%'};};
|
|
10
|
+
|
|
11
|
+
export { getBaseMenuItemStyles };
|
|
12
|
+
//# sourceMappingURL=getBaseMenuItemStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getBaseMenuItemStyles.js","sources":["../../../../../../src/components/BaseMenu/BaseMenuItem/getBaseMenuItemStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { Theme } from '~components/BladeProvider';\nimport { isReactNative, makeBorderSize } from '~utils';\nimport { makeSize } from '~utils/makeSize';\n\nconst getBaseMenuItemStyles = (props: { theme: Theme }): CSSObject => {\n return {\n borderWidth: makeBorderSize(props.theme.border.width.none),\n display: 'flex',\n flexDirection: 'column',\n textAlign: isReactNative() ? undefined : 'left',\n backgroundColor: 'transparent',\n borderRadius: makeSize(props.theme.border.radius.medium),\n marginTop: makeSize(props.theme.spacing[1]),\n marginBottom: makeSize(props.theme.spacing[1]),\n textDecoration: 'none',\n cursor: 'pointer',\n width: '100%',\n };\n};\n\nexport { getBaseMenuItemStyles };\n"],"names":["getBaseMenuItemStyles","props","borderWidth","makeBorderSize","theme","border","width","none","display","flexDirection","textAlign","isReactNative","undefined","backgroundColor","borderRadius","makeSize","radius","medium","marginTop","spacing","marginBottom","textDecoration","cursor"],"mappings":";;;;;;;;AAKM,IAAAA,qBAAqB,CAAG,SAAxBA,qBAAqBA,CAAIC,KAAuB,CAAgB,CACpE,OAAO,CACLC,WAAW,CAAEC,cAAc,CAACF,KAAK,CAACG,KAAK,CAACC,MAAM,CAACC,KAAK,CAACC,IAAI,CAAC,CAC1DC,OAAO,CAAE,MAAM,CACfC,aAAa,CAAE,QAAQ,CACvBC,SAAS,CAAEC,aAAa,EAAE,CAAGC,SAAS,CAAG,MAAM,CAC/CC,eAAe,CAAE,aAAa,CAC9BC,YAAY,CAAEC,QAAQ,CAACd,KAAK,CAACG,KAAK,CAACC,MAAM,CAACW,MAAM,CAACC,MAAM,CAAC,CACxDC,SAAS,CAAEH,QAAQ,CAACd,KAAK,CAACG,KAAK,CAACe,OAAO,CAAC,CAAC,CAAC,CAAC,CAC3CC,YAAY,CAAEL,QAAQ,CAACd,KAAK,CAACG,KAAK,CAACe,OAAO,CAAC,CAAC,CAAC,CAAC,CAC9CE,cAAc,CAAE,MAAM,CACtBC,MAAM,CAAE,SAAS,CACjBhB,KAAK,CAAE,MACT,CAAC,CACH;;;;"}
|