@telus-uds/components-base 0.0.2-prerelease.7 → 0.0.2-prerelease.8
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/.ultra.cache.json +1 -1
- package/CHANGELOG.md +27 -0
- package/__fixtures__/Accessible.js +33 -0
- package/__fixtures__/Accessible.native.js +32 -0
- package/__fixtures__/testTheme.js +429 -29
- package/__tests__/ActivityIndicator/ActivityIndicator.test.jsx +1 -1
- package/__tests__/Button/ButtonGroup.test.jsx +2 -2
- package/__tests__/Checkbox/CheckboxGroup.test.jsx +247 -0
- package/__tests__/Icon/Icon.test.jsx +3 -3
- package/__tests__/Modal/Modal.test.jsx +47 -0
- package/__tests__/Notification/Notification.test.jsx +20 -0
- package/__tests__/Pagination/Pagination.test.jsx +2 -2
- package/__tests__/Progress/Progress.test.jsx +79 -0
- package/__tests__/Radio/RadioGroup.test.jsx +221 -0
- package/__tests__/RadioCard/RadioCard.test.jsx +87 -0
- package/__tests__/RadioCard/RadioCardGroup.test.jsx +247 -0
- package/__tests__/Search/Search.test.jsx +72 -0
- package/__tests__/Skeleton/Skeleton.test.jsx +1 -1
- package/__tests__/StepTracker/StepTracker.test.jsx +94 -0
- package/__tests__/Tabs/Tabs.test.jsx +200 -0
- package/__tests__/Tags/Tags.test.jsx +1 -1
- package/__tests__/utils/input.test.js +58 -0
- package/__tests__/utils/useCopy.test.js +14 -3
- package/babel.config.js +20 -0
- package/jest.config.js +1 -1
- package/lib/A11yInfoProvider/index.js +54 -26
- package/lib/A11yText/index.js +37 -14
- package/lib/ActivityIndicator/Spinner.js +78 -0
- package/lib/ActivityIndicator/Spinner.native.js +121 -87
- package/lib/ActivityIndicator/index.js +28 -12
- package/lib/ActivityIndicator/shared.js +27 -12
- package/lib/BaseProvider/index.js +34 -11
- package/lib/Box/Box.js +54 -31
- package/lib/Box/index.js +13 -2
- package/lib/Button/Button.js +32 -11
- package/lib/Button/ButtonBase.js +85 -78
- package/lib/Button/ButtonGroup.js +94 -70
- package/lib/Button/ButtonLink.js +38 -15
- package/lib/Button/index.js +31 -4
- package/lib/Button/propTypes.js +32 -9
- package/lib/Card/Card.js +36 -41
- package/lib/Card/CardBase.js +78 -0
- package/lib/Card/PressableCardBase.js +137 -0
- package/lib/Card/index.js +40 -2
- package/lib/Checkbox/Checkbox.js +139 -103
- package/lib/Checkbox/CheckboxGroup.js +231 -0
- package/lib/Checkbox/CheckboxInput.js +74 -0
- package/lib/Checkbox/CheckboxInput.native.js +9 -1
- package/lib/Checkbox/index.js +21 -2
- package/lib/Divider/Divider.js +50 -24
- package/lib/Divider/index.js +13 -2
- package/lib/ExpandCollapse/Accordion.js +20 -7
- package/lib/ExpandCollapse/Control.js +50 -27
- package/lib/ExpandCollapse/ExpandCollapse.js +41 -24
- package/lib/ExpandCollapse/Panel.js +75 -37
- package/lib/ExpandCollapse/index.js +25 -7
- package/lib/Feedback/Feedback.js +69 -40
- package/lib/Feedback/index.js +13 -2
- package/lib/Fieldset/Fieldset.js +160 -0
- package/lib/Fieldset/FieldsetContainer.js +41 -0
- package/lib/Fieldset/FieldsetContainer.native.js +33 -0
- package/lib/Fieldset/Legend.js +33 -0
- package/lib/Fieldset/Legend.native.js +43 -0
- package/lib/Fieldset/cssReset.js +21 -0
- package/lib/Fieldset/index.js +13 -0
- package/lib/FlexGrid/Col/Col.js +67 -38
- package/lib/FlexGrid/Col/index.js +13 -2
- package/lib/FlexGrid/FlexGrid.js +70 -45
- package/lib/FlexGrid/Row/Row.js +48 -27
- package/lib/FlexGrid/Row/index.js +13 -2
- package/lib/FlexGrid/helpers/index.js +9 -1
- package/lib/FlexGrid/index.js +13 -2
- package/lib/FlexGrid/providers/GutterContext.js +15 -3
- package/lib/Icon/Icon.js +46 -44
- package/lib/Icon/IconText.js +49 -21
- package/lib/Icon/index.js +31 -4
- package/lib/InputLabel/InputLabel.js +70 -36
- package/lib/InputLabel/LabelContent.js +31 -0
- package/lib/InputLabel/LabelContent.native.js +9 -1
- package/lib/InputLabel/index.js +13 -2
- package/lib/InputSupports/InputSupports.js +62 -48
- package/lib/InputSupports/index.js +13 -2
- package/lib/InputSupports/propTypes.js +19 -8
- package/lib/InputSupports/useInputSupports.js +41 -0
- package/lib/Link/ChevronLink.js +33 -16
- package/lib/Link/InlinePressable.js +50 -0
- package/lib/Link/InlinePressable.native.js +34 -11
- package/lib/Link/Link.js +25 -9
- package/lib/Link/LinkBase.js +87 -57
- package/lib/Link/TextButton.js +32 -13
- package/lib/Link/index.js +39 -5
- package/lib/List/List.js +51 -23
- package/lib/List/ListItem.js +70 -40
- package/lib/List/index.js +13 -2
- package/lib/Modal/Modal.js +226 -0
- package/lib/Modal/dictionary.js +16 -0
- package/lib/Modal/index.js +13 -0
- package/lib/Notification/Notification.js +200 -0
- package/lib/Notification/dictionary.js +15 -0
- package/lib/Notification/index.js +13 -0
- package/lib/Pagination/PageButton.js +47 -25
- package/lib/Pagination/Pagination.js +70 -40
- package/lib/Pagination/SideButton.js +63 -37
- package/lib/Pagination/dictionary.js +9 -2
- package/lib/Pagination/index.js +13 -2
- package/lib/Pagination/usePagination.js +12 -2
- package/lib/Progress/Progress.js +99 -0
- package/lib/Progress/ProgressBar.js +146 -0
- package/lib/Progress/ProgressBarBackground.js +57 -0
- package/lib/Progress/index.js +16 -0
- package/lib/Radio/Radio.js +110 -109
- package/lib/Radio/RadioButton.js +141 -0
- package/lib/Radio/RadioGroup.js +233 -0
- package/lib/Radio/RadioInput.js +76 -0
- package/lib/Radio/RadioInput.native.js +9 -1
- package/lib/Radio/index.js +21 -2
- package/lib/RadioCard/RadioCard.js +240 -0
- package/lib/RadioCard/RadioCardGroup.js +251 -0
- package/lib/RadioCard/index.js +21 -0
- package/lib/Search/Search.js +243 -0
- package/lib/Search/dictionary.js +19 -0
- package/lib/Search/index.js +13 -0
- package/lib/Select/Group.js +33 -0
- package/lib/Select/Group.native.js +16 -5
- package/lib/Select/Item.js +29 -0
- package/lib/Select/Item.native.js +14 -4
- package/lib/Select/Picker.js +79 -0
- package/lib/Select/Picker.native.js +52 -24
- package/lib/Select/Select.js +110 -82
- package/lib/Select/index.js +19 -6
- package/lib/SideNav/Item.js +54 -33
- package/lib/SideNav/ItemContent.js +41 -15
- package/lib/SideNav/ItemsGroup.js +46 -27
- package/lib/SideNav/SideNav.js +92 -69
- package/lib/SideNav/index.js +15 -1
- package/lib/Skeleton/Skeleton.js +55 -37
- package/lib/Skeleton/index.js +13 -2
- package/lib/Skeleton/skeleton.constant.js +12 -0
- package/lib/Skeleton/skeletonWebAnimation.js +27 -0
- package/lib/Skeleton/useSkeletonNativeAnimation.js +37 -0
- package/lib/Spacer/Spacer.js +31 -12
- package/lib/Spacer/index.js +13 -2
- package/lib/StackView/StackView.js +49 -27
- package/lib/StackView/StackWrap.js +33 -10
- package/lib/StackView/StackWrap.native.js +13 -2
- package/lib/StackView/StackWrapBox.js +46 -24
- package/lib/StackView/StackWrapGap.js +43 -22
- package/lib/StackView/common.js +19 -4
- package/lib/StackView/getStackedContent.js +49 -19
- package/lib/StackView/index.js +29 -5
- package/lib/StepTracker/Step.js +245 -0
- package/lib/StepTracker/StepTracker.js +197 -0
- package/lib/StepTracker/dictionary.js +17 -0
- package/lib/StepTracker/index.js +13 -0
- package/lib/Tabs/HorizontalScroll.js +199 -0
- package/lib/Tabs/ScrollViewEnd.js +66 -0
- package/lib/Tabs/ScrollViewEnd.native.js +41 -0
- package/lib/Tabs/Tabs.js +117 -0
- package/lib/Tabs/TabsItem.js +234 -0
- package/lib/Tabs/TabsScrollButton.js +121 -0
- package/lib/Tabs/dictionary.js +18 -0
- package/lib/Tabs/index.js +13 -0
- package/lib/Tabs/itemPositions.js +128 -0
- package/lib/Tags/Tags.js +130 -97
- package/lib/Tags/index.js +13 -2
- package/lib/TextInput/TextArea.js +51 -24
- package/lib/TextInput/TextInput.js +40 -19
- package/lib/TextInput/TextInputBase.js +78 -55
- package/lib/TextInput/index.js +23 -3
- package/lib/TextInput/propTypes.js +18 -7
- package/lib/ThemeProvider/ThemeProvider.js +38 -14
- package/lib/ThemeProvider/index.js +61 -6
- package/lib/ThemeProvider/useSetTheme.js +14 -5
- package/lib/ThemeProvider/useTheme.js +13 -4
- package/lib/ThemeProvider/useThemeTokens.js +32 -16
- package/lib/ThemeProvider/utils/index.js +31 -2
- package/lib/ThemeProvider/utils/styles.js +52 -16
- package/lib/ThemeProvider/utils/theme-tokens.js +94 -16
- package/lib/ToggleSwitch/ToggleSwitch.js +75 -51
- package/lib/ToggleSwitch/index.js +13 -2
- package/lib/Tooltip/{Backdrop.web.js → Backdrop.js} +22 -18
- package/lib/Tooltip/Backdrop.native.js +39 -15
- package/lib/Tooltip/Tooltip.js +112 -70
- package/lib/Tooltip/dictionary.js +9 -2
- package/lib/Tooltip/getTooltipPosition.js +9 -1
- package/lib/Tooltip/index.js +13 -2
- package/lib/TooltipButton/TooltipButton.js +57 -38
- package/lib/TooltipButton/index.js +13 -2
- package/lib/Typography/Typography.js +57 -27
- package/lib/Typography/index.js +13 -2
- package/lib/ViewportProvider/ViewportProvider.js +34 -13
- package/lib/ViewportProvider/index.js +28 -3
- package/lib/ViewportProvider/useViewport.js +15 -3
- package/lib/ViewportProvider/useViewportListener.js +24 -10
- package/lib/index.js +509 -33
- package/lib/utils/a11y/index.js +18 -1
- package/lib/utils/a11y/textSize.js +23 -7
- package/lib/utils/animation/index.js +15 -2
- package/lib/utils/animation/useVerticalExpandAnimation.js +28 -11
- package/lib/utils/children.js +87 -0
- package/lib/utils/index.js +163 -10
- package/lib/utils/info/index.js +18 -6
- package/lib/utils/info/platform/index.js +19 -7
- package/lib/utils/info/platform/platform.android.js +8 -1
- package/lib/utils/info/platform/platform.ios.js +8 -1
- package/lib/utils/info/platform/platform.js +8 -0
- package/lib/utils/info/platform/platform.native.js +8 -1
- package/lib/utils/info/versions.js +15 -4
- package/lib/utils/input.js +51 -33
- package/lib/utils/pressability.js +38 -10
- package/lib/utils/propTypes.js +217 -125
- package/lib/utils/useCopy.js +40 -5
- package/lib/utils/useHash.js +48 -0
- package/lib/utils/useHash.native.js +15 -0
- package/lib/utils/useResponsiveProp.js +21 -9
- package/lib/utils/useSpacingScale.js +21 -9
- package/lib/utils/useUniqueId.js +13 -4
- package/package.json +7 -6
- package/release-context.json +4 -4
- package/src/ActivityIndicator/{Spinner.web.jsx → Spinner.jsx} +0 -0
- package/src/Box/Box.jsx +11 -4
- package/src/Button/Button.jsx +3 -2
- package/src/Button/ButtonBase.jsx +27 -36
- package/src/Button/ButtonGroup.jsx +2 -2
- package/src/Button/ButtonLink.jsx +3 -2
- package/src/Button/propTypes.js +12 -2
- package/src/Card/Card.jsx +4 -30
- package/src/Card/CardBase.jsx +57 -0
- package/src/Card/PressableCardBase.jsx +112 -0
- package/src/Card/index.js +3 -0
- package/src/Checkbox/Checkbox.jsx +10 -11
- package/src/Checkbox/CheckboxGroup.jsx +196 -0
- package/src/Checkbox/{CheckboxInput.web.jsx → CheckboxInput.jsx} +0 -0
- package/src/Checkbox/index.js +2 -0
- package/src/ExpandCollapse/Control.jsx +1 -1
- package/src/Feedback/Feedback.jsx +1 -1
- package/src/Fieldset/Fieldset.jsx +129 -0
- package/src/Fieldset/FieldsetContainer.jsx +22 -0
- package/src/Fieldset/FieldsetContainer.native.jsx +16 -0
- package/src/Fieldset/Legend.jsx +16 -0
- package/src/Fieldset/Legend.native.jsx +22 -0
- package/src/Fieldset/cssReset.js +14 -0
- package/src/Fieldset/index.js +3 -0
- package/src/Icon/Icon.jsx +14 -23
- package/src/Icon/IconText.jsx +2 -2
- package/src/Icon/index.js +2 -2
- package/src/InputLabel/InputLabel.jsx +9 -2
- package/src/InputLabel/{LabelContent.web.jsx → LabelContent.jsx} +0 -0
- package/src/InputSupports/InputSupports.jsx +7 -18
- package/src/InputSupports/useInputSupports.js +30 -0
- package/src/Link/{InlinePressable.web.jsx → InlinePressable.jsx} +0 -0
- package/src/Link/LinkBase.jsx +14 -12
- package/src/Modal/Modal.jsx +185 -0
- package/src/Modal/dictionary.js +9 -0
- package/src/Modal/index.js +3 -0
- package/src/Notification/Notification.jsx +149 -0
- package/src/Notification/dictionary.js +8 -0
- package/src/Notification/index.js +3 -0
- package/src/Progress/Progress.jsx +77 -0
- package/src/Progress/ProgressBar.jsx +110 -0
- package/src/Progress/ProgressBarBackground.jsx +34 -0
- package/src/Progress/index.js +6 -0
- package/src/Radio/Radio.jsx +19 -56
- package/src/Radio/RadioButton.jsx +131 -0
- package/src/Radio/RadioGroup.jsx +198 -0
- package/src/Radio/{RadioInput.web.jsx → RadioInput.jsx} +0 -0
- package/src/Radio/index.js +2 -0
- package/src/RadioCard/RadioCard.jsx +191 -0
- package/src/RadioCard/RadioCardGroup.jsx +211 -0
- package/src/RadioCard/index.js +5 -0
- package/src/Search/Search.jsx +204 -0
- package/src/Search/dictionary.js +12 -0
- package/src/Search/index.js +3 -0
- package/src/Select/{Group.web.jsx → Group.jsx} +0 -0
- package/src/Select/{Item.web.jsx → Item.jsx} +0 -0
- package/src/Select/{Picker.web.jsx → Picker.jsx} +0 -0
- package/src/Select/Select.jsx +12 -22
- package/src/SideNav/Item.jsx +2 -2
- package/src/Skeleton/Skeleton.jsx +17 -20
- package/src/Skeleton/skeleton.constant.js +3 -0
- package/src/Skeleton/skeletonWebAnimation.js +13 -0
- package/src/Skeleton/useSkeletonNativeAnimation.js +27 -0
- package/src/StackView/StackView.jsx +10 -3
- package/src/StackView/StackWrap.jsx +9 -1
- package/src/StackView/StackWrapBox.jsx +4 -3
- package/src/StackView/StackWrapGap.jsx +3 -3
- package/src/StackView/getStackedContent.jsx +8 -2
- package/src/StepTracker/Step.jsx +202 -0
- package/src/StepTracker/StepTracker.jsx +163 -0
- package/src/StepTracker/dictionary.js +10 -0
- package/src/StepTracker/index.js +3 -0
- package/src/Tabs/HorizontalScroll.jsx +165 -0
- package/src/Tabs/ScrollViewEnd.jsx +53 -0
- package/src/Tabs/ScrollViewEnd.native.jsx +24 -0
- package/src/Tabs/Tabs.jsx +89 -0
- package/src/Tabs/TabsItem.jsx +204 -0
- package/src/Tabs/TabsScrollButton.jsx +100 -0
- package/src/Tabs/dictionary.js +11 -0
- package/src/Tabs/index.js +3 -0
- package/src/Tabs/itemPositions.js +101 -0
- package/src/Tags/Tags.jsx +2 -1
- package/src/TextInput/TextInputBase.jsx +12 -22
- package/src/ThemeProvider/useThemeTokens.js +2 -2
- package/src/ThemeProvider/utils/styles.js +18 -5
- package/src/ThemeProvider/utils/theme-tokens.js +46 -5
- package/src/ToggleSwitch/ToggleSwitch.jsx +2 -3
- package/src/Tooltip/{Backdrop.web.jsx → Backdrop.jsx} +0 -0
- package/src/Tooltip/Tooltip.jsx +1 -1
- package/src/TooltipButton/TooltipButton.jsx +23 -27
- package/src/Typography/Typography.jsx +6 -5
- package/src/index.js +20 -2
- package/src/utils/children.jsx +66 -0
- package/src/utils/index.js +3 -0
- package/src/utils/info/platform/platform.js +1 -0
- package/src/utils/info/versions.js +2 -2
- package/src/utils/input.js +20 -12
- package/src/utils/pressability.js +4 -0
- package/src/utils/propTypes.js +98 -34
- package/src/utils/useCopy.js +30 -4
- package/src/utils/useHash.js +34 -0
- package/src/utils/useHash.native.js +6 -0
- package/stories/A11yText/A11yText.stories.jsx +4 -8
- package/stories/Checkbox/Checkbox.stories.jsx +24 -1
- package/stories/Icon/Icon.stories.jsx +6 -5
- package/stories/Modal/Modal.stories.jsx +29 -0
- package/stories/Notification/Notification.stories.jsx +82 -0
- package/stories/Progress/Progress.stories.jsx +93 -0
- package/stories/Radio/Radio.stories.jsx +23 -36
- package/stories/RadioCard/RadioCard.stories.jsx +98 -0
- package/stories/Search/Search.stories.jsx +16 -0
- package/stories/StepTracker/StepTracker.stories.jsx +71 -0
- package/stories/Tabs/Tabs.stories.jsx +97 -0
- package/stories/{platform-supports.web.jsx → platform-supports.jsx} +0 -0
- package/__fixtures__/accessible.icon.svg +0 -6
- package/babel.config.json +0 -8
- package/lib/ActivityIndicator/Spinner.web.js +0 -55
- package/lib/Checkbox/CheckboxInput.web.js +0 -57
- package/lib/InputLabel/LabelContent.web.js +0 -17
- package/lib/Link/InlinePressable.web.js +0 -32
- package/lib/Radio/RadioInput.web.js +0 -59
- package/lib/Select/Group.web.js +0 -18
- package/lib/Select/Item.web.js +0 -15
- package/lib/Select/Picker.web.js +0 -63
- package/lib/config/svgr-icons-web.js +0 -9
- package/lib/config/svgr-icons.js +0 -52
- package/lib/utils/info/platform/platform.web.js +0 -1
- package/src/config/svgr-icons-web.js +0 -11
- package/src/config/svgr-icons.js +0 -46
- package/src/utils/info/platform/platform.web.js +0 -1
package/lib/Checkbox/index.js
CHANGED
|
@@ -1,2 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "CheckboxGroup", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _CheckboxGroup.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
exports.default = void 0;
|
|
13
|
+
|
|
14
|
+
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
|
15
|
+
|
|
16
|
+
var _CheckboxGroup = _interopRequireDefault(require("./CheckboxGroup"));
|
|
17
|
+
|
|
18
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
+
|
|
20
|
+
var _default = _Checkbox.default;
|
|
21
|
+
exports.default = _default;
|
package/lib/Divider/Divider.js
CHANGED
|
@@ -1,9 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
+
|
|
12
|
+
var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
|
|
13
|
+
|
|
14
|
+
var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
|
|
15
|
+
|
|
16
|
+
var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
|
|
17
|
+
|
|
18
|
+
var _ThemeProvider = require("../ThemeProvider");
|
|
19
|
+
|
|
20
|
+
var _Spacer = _interopRequireDefault(require("../Spacer"));
|
|
21
|
+
|
|
22
|
+
var _utils = require("../utils");
|
|
23
|
+
|
|
24
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
25
|
+
|
|
26
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
|
+
|
|
7
28
|
/**
|
|
8
29
|
* @typedef {import('../utils/propTypes.js').SpacingIndex} SpacingIndex
|
|
9
30
|
* @typedef {import('../utils/propTypes.js').SpacingObject} SpacingObject
|
|
@@ -45,7 +66,6 @@ import { getTokensPropType, variantProp, spacingProps } from '../utils';
|
|
|
45
66
|
*
|
|
46
67
|
* For accessibility purposes a divider component will be described with ARIA attributes, i.e. `role="separator"` and `aria-orientation="vertical/horizontal"`.
|
|
47
68
|
*/
|
|
48
|
-
|
|
49
69
|
const Divider = ({
|
|
50
70
|
variant,
|
|
51
71
|
vertical = false,
|
|
@@ -56,7 +76,7 @@ const Divider = ({
|
|
|
56
76
|
const {
|
|
57
77
|
color,
|
|
58
78
|
width
|
|
59
|
-
} = useThemeTokens('Divider', tokens, variant);
|
|
79
|
+
} = (0, _ThemeProvider.useThemeTokens)('Divider', tokens, variant);
|
|
60
80
|
const borderStyles = vertical ? {
|
|
61
81
|
borderRightColor: color,
|
|
62
82
|
borderRightWidth: width
|
|
@@ -64,49 +84,55 @@ const Divider = ({
|
|
|
64
84
|
borderBottomColor: color,
|
|
65
85
|
borderBottomWidth: width
|
|
66
86
|
};
|
|
67
|
-
const a11y =
|
|
87
|
+
const a11y = _Platform.default.OS === 'web' ? // There are aria attributes for dividers on web
|
|
68
88
|
{
|
|
69
89
|
'aria-orientation': vertical ? 'vertical' : 'horizontal',
|
|
70
90
|
accessibilityRole: 'separator'
|
|
71
91
|
} : // There are no such equivalent attributes for native
|
|
72
92
|
{};
|
|
73
|
-
const divider = /*#__PURE__*/
|
|
93
|
+
const divider = /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
74
94
|
style: [styles.divider, borderStyles],
|
|
75
|
-
testID: testID
|
|
76
|
-
|
|
95
|
+
testID: testID,
|
|
96
|
+
...a11y
|
|
97
|
+
});
|
|
77
98
|
if (!space) return divider;
|
|
78
99
|
const spacerProps = {
|
|
79
100
|
space,
|
|
80
101
|
direction: vertical ? 'row' : 'column'
|
|
81
102
|
};
|
|
82
|
-
return /*#__PURE__*/
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
103
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
104
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Spacer.default, { ...spacerProps,
|
|
105
|
+
testID: testID ? "".concat(testID, "-Spacer-before") : undefined
|
|
106
|
+
}), divider, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spacer.default, { ...spacerProps,
|
|
107
|
+
testID: testID ? "".concat(testID, "-Spacer-after") : undefined
|
|
108
|
+
})]
|
|
109
|
+
});
|
|
87
110
|
};
|
|
88
111
|
|
|
89
112
|
Divider.propTypes = {
|
|
90
|
-
tokens: getTokensPropType('Divider'),
|
|
91
|
-
space: spacingProps.types.spacingValue,
|
|
92
|
-
variant: variantProp.propType,
|
|
113
|
+
tokens: (0, _utils.getTokensPropType)('Divider'),
|
|
114
|
+
space: _utils.spacingProps.types.spacingValue,
|
|
115
|
+
variant: _utils.variantProp.propType,
|
|
93
116
|
|
|
94
117
|
/**
|
|
95
118
|
* By default, the divider is a horizontal line the full width of its parent.
|
|
96
119
|
* With `vertical` prop and when inside a container with { flexDirection: row }, draws a full height vertical line.
|
|
97
120
|
*/
|
|
98
|
-
vertical:
|
|
121
|
+
vertical: _propTypes.default.bool,
|
|
99
122
|
|
|
100
123
|
/**
|
|
101
124
|
* @ignore
|
|
102
125
|
* In tests, the only way to select dividers is with testID prop and getByTestId, since they have no content,
|
|
103
126
|
* no accessibility role on native, and there is no equivalent of nextSibling in React Native Testing Library.
|
|
104
127
|
*/
|
|
105
|
-
testID:
|
|
128
|
+
testID: _propTypes.default.string
|
|
106
129
|
};
|
|
107
|
-
|
|
130
|
+
|
|
131
|
+
const styles = _StyleSheet.default.create({
|
|
108
132
|
divider: {
|
|
109
133
|
alignSelf: 'stretch'
|
|
110
134
|
}
|
|
111
135
|
});
|
|
112
|
-
|
|
136
|
+
|
|
137
|
+
var _default = Divider;
|
|
138
|
+
exports.default = _default;
|
package/lib/Divider/index.js
CHANGED
|
@@ -1,2 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _Divider = _interopRequireDefault(require("./Divider"));
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
+
|
|
12
|
+
var _default = _Divider.default;
|
|
13
|
+
exports.default = _default;
|
|
@@ -1,12 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _ExpandCollapse = _interopRequireDefault(require("./ExpandCollapse"));
|
|
11
|
+
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
|
|
3
16
|
/**
|
|
4
17
|
* 'Accordion' is a shorthand for an ExpandCollapse where only one item may be open at a time
|
|
5
18
|
*/
|
|
6
|
-
|
|
7
|
-
const Accordion = props => /*#__PURE__*/React.createElement(ExpandCollapse, Object.assign({}, props, {
|
|
19
|
+
const Accordion = props => /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandCollapse.default, { ...props,
|
|
8
20
|
maxOpen: 1
|
|
9
|
-
})
|
|
21
|
+
});
|
|
10
22
|
|
|
11
|
-
Accordion.propTypes =
|
|
12
|
-
|
|
23
|
+
Accordion.propTypes = _ExpandCollapse.default.propTypes;
|
|
24
|
+
var _default = Accordion;
|
|
25
|
+
exports.default = _default;
|
|
@@ -1,8 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _Pressable = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Pressable"));
|
|
11
|
+
|
|
12
|
+
var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
|
|
13
|
+
|
|
14
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
15
|
+
|
|
16
|
+
var _ThemeProvider = require("../ThemeProvider");
|
|
17
|
+
|
|
18
|
+
var _utils = require("../utils");
|
|
19
|
+
|
|
20
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
|
+
|
|
22
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
6
23
|
|
|
7
24
|
function selectContainerStyles({
|
|
8
25
|
backgroundColor,
|
|
@@ -27,7 +44,7 @@ function selectContainerStyles({
|
|
|
27
44
|
paddingTop,
|
|
28
45
|
paddingBottom,
|
|
29
46
|
justifyContent,
|
|
30
|
-
...verticalAlignRow(verticalAlign, iconPosition === 'right')
|
|
47
|
+
...(0, _ThemeProvider.verticalAlignRow)(verticalAlign, iconPosition === 'right')
|
|
31
48
|
};
|
|
32
49
|
} // TODO: use stack / spacer when available
|
|
33
50
|
|
|
@@ -58,10 +75,12 @@ const ExpandCollapseControl = ({
|
|
|
58
75
|
variant,
|
|
59
76
|
rest
|
|
60
77
|
}) => {
|
|
61
|
-
const getTokens = useThemeTokensCallback('ExpandCollapseControl', tokens, variant);
|
|
62
|
-
|
|
78
|
+
const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('ExpandCollapseControl', tokens, variant);
|
|
79
|
+
|
|
80
|
+
const a11y = _utils.a11yProps.select({ ...rest,
|
|
63
81
|
accessibilityRole
|
|
64
82
|
});
|
|
83
|
+
|
|
65
84
|
a11y.accessibilityState = { ...(a11y.accessibilityState || {}),
|
|
66
85
|
expanded: isExpanded
|
|
67
86
|
};
|
|
@@ -81,40 +100,44 @@ const ExpandCollapseControl = ({
|
|
|
81
100
|
|
|
82
101
|
const getPressableStyle = pressableState => selectContainerStyles(getControlTokens(pressableState));
|
|
83
102
|
|
|
84
|
-
return /*#__PURE__*/
|
|
103
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pressable.default, { ...a11y,
|
|
85
104
|
onPress: onPress,
|
|
86
|
-
style: getPressableStyle
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
105
|
+
style: getPressableStyle,
|
|
106
|
+
children: pressableState => {
|
|
107
|
+
const {
|
|
108
|
+
icon: IconComponent,
|
|
109
|
+
...themeTokens
|
|
110
|
+
} = getControlTokens(pressableState);
|
|
111
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
112
|
+
children: [IconComponent && /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
113
|
+
style: selectIconContainerStyles(themeTokens),
|
|
114
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, { ...selectIconTokens(themeTokens)
|
|
115
|
+
})
|
|
116
|
+
}), typeof children === 'function' ? children(getControlState(pressableState)) : children]
|
|
117
|
+
});
|
|
118
|
+
}
|
|
97
119
|
});
|
|
98
120
|
};
|
|
99
121
|
|
|
100
|
-
ExpandCollapseControl.propTypes = { ...a11yProps.propTypes,
|
|
101
|
-
tokens: getTokensPropType('ExpandCollapseControl'),
|
|
102
|
-
variant: variantProp.propType,
|
|
122
|
+
ExpandCollapseControl.propTypes = { ..._utils.a11yProps.propTypes,
|
|
123
|
+
tokens: (0, _utils.getTokensPropType)('ExpandCollapseControl'),
|
|
124
|
+
variant: _utils.variantProp.propType,
|
|
103
125
|
|
|
104
126
|
/**
|
|
105
127
|
* ExpandCollapseControl's children are the content within the button that opens or closes this panel. May
|
|
106
128
|
* accept a render function that recieves the control state: { pressed, hover, focus, expanded }
|
|
107
129
|
*/
|
|
108
|
-
children:
|
|
130
|
+
children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
109
131
|
|
|
110
132
|
/**
|
|
111
133
|
* Whether the linked ExpandCollapsePanel is opened or closed. Allows themes to set `expanded` styles.
|
|
112
134
|
*/
|
|
113
|
-
isExpanded:
|
|
135
|
+
isExpanded: _propTypes.default.bool,
|
|
114
136
|
|
|
115
137
|
/**
|
|
116
138
|
* Function called when the ExpandCollapse is pressed.
|
|
117
139
|
*/
|
|
118
|
-
onPress:
|
|
140
|
+
onPress: _propTypes.default.func.isRequired
|
|
119
141
|
};
|
|
120
|
-
|
|
142
|
+
var _default = ExpandCollapseControl;
|
|
143
|
+
exports.default = _default;
|
|
@@ -1,8 +1,23 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _ThemeProvider = require("../ThemeProvider");
|
|
15
|
+
|
|
16
|
+
var _utils = require("../utils");
|
|
17
|
+
|
|
18
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
6
21
|
|
|
7
22
|
function selectBorderStyles(tokens) {
|
|
8
23
|
return {
|
|
@@ -35,54 +50,56 @@ const ExpandCollapse = ({
|
|
|
35
50
|
resetValues,
|
|
36
51
|
setValues,
|
|
37
52
|
unsetValues
|
|
38
|
-
} = useMultipleInputValues({
|
|
53
|
+
} = (0, _utils.useMultipleInputValues)({
|
|
39
54
|
maxValues: maxOpen,
|
|
40
55
|
values: open,
|
|
41
56
|
initialValues: initialOpen,
|
|
42
57
|
onChange
|
|
43
58
|
});
|
|
44
|
-
const themeTokens = useThemeTokens('ExpandCollapse', tokens, variant);
|
|
45
|
-
return /*#__PURE__*/
|
|
46
|
-
style: selectBorderStyles(themeTokens)
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
59
|
+
const themeTokens = (0, _ThemeProvider.useThemeTokens)('ExpandCollapse', tokens, variant);
|
|
60
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
61
|
+
style: selectBorderStyles(themeTokens),
|
|
62
|
+
children: typeof children === 'function' ? children({
|
|
63
|
+
openIds,
|
|
64
|
+
onToggle,
|
|
65
|
+
resetValues,
|
|
66
|
+
setValues,
|
|
67
|
+
unsetValues
|
|
68
|
+
}) : children
|
|
69
|
+
});
|
|
54
70
|
};
|
|
55
71
|
|
|
56
72
|
ExpandCollapse.propTypes = {
|
|
57
|
-
variant: variantProp.propType,
|
|
58
|
-
tokens: getTokensPropType('ExpandCollapse'),
|
|
73
|
+
variant: _utils.variantProp.propType,
|
|
74
|
+
tokens: (0, _utils.getTokensPropType)('ExpandCollapse'),
|
|
59
75
|
|
|
60
76
|
/**
|
|
61
77
|
* ExpandCollapse usually takes a render function to which it passes an object with properties
|
|
62
78
|
* { openIds, onToggle, resetValues, setValues, unsetValues }. openIds (array of ids) and
|
|
63
79
|
* onToggle (function) will usually be passed to `<ExpandCollapse.Panel>`
|
|
64
80
|
*/
|
|
65
|
-
children:
|
|
81
|
+
children: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node]).isRequired,
|
|
66
82
|
|
|
67
83
|
/**
|
|
68
84
|
* If set, enforces a specific maximum number of open items, closing already-open items when new
|
|
69
85
|
* items are opened. By default, any number of items may be open at once.
|
|
70
86
|
*/
|
|
71
|
-
maxOpen:
|
|
87
|
+
maxOpen: _propTypes.default.number,
|
|
72
88
|
|
|
73
89
|
/**
|
|
74
90
|
* If passed, the item or items that are expanded will be controlled by a parent component
|
|
75
91
|
*/
|
|
76
|
-
open:
|
|
92
|
+
open: _propTypes.default.arrayOf(_propTypes.default.string),
|
|
77
93
|
|
|
78
94
|
/**
|
|
79
95
|
* Function called when which panels are currently open changes. Necessary if `open` is passed.
|
|
80
96
|
*/
|
|
81
|
-
onChange:
|
|
97
|
+
onChange: _propTypes.default.func,
|
|
82
98
|
|
|
83
99
|
/**
|
|
84
100
|
* Allows items with specified ids to be open by default on first load. Should not be used with `open`.
|
|
85
101
|
*/
|
|
86
|
-
initialOpen:
|
|
102
|
+
initialOpen: _propTypes.default.arrayOf(_propTypes.default.string)
|
|
87
103
|
};
|
|
88
|
-
|
|
104
|
+
var _default = ExpandCollapse;
|
|
105
|
+
exports.default = _default;
|
|
@@ -1,10 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
import { Animated, Platform, StyleSheet, View } from 'react-native';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import ExpandCollapseControl from './Control';
|
|
5
|
-
import { useThemeTokens } from '../ThemeProvider';
|
|
6
|
-
import { getTokensPropType, variantProp, useVerticalExpandAnimation, a11yProps } from '../utils'; // just void functions for now, since there are no style tokens for a panel or control at this point
|
|
1
|
+
"use strict";
|
|
7
2
|
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
|
|
10
|
+
var _Animated = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Animated"));
|
|
11
|
+
|
|
12
|
+
var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
|
|
13
|
+
|
|
14
|
+
var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
|
|
15
|
+
|
|
16
|
+
var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
|
|
17
|
+
|
|
18
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
19
|
+
|
|
20
|
+
var _Control = _interopRequireDefault(require("./Control"));
|
|
21
|
+
|
|
22
|
+
var _ThemeProvider = require("../ThemeProvider");
|
|
23
|
+
|
|
24
|
+
var _utils = require("../utils");
|
|
25
|
+
|
|
26
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
27
|
+
|
|
28
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
33
|
+
|
|
34
|
+
// just void functions for now, since there are no style tokens for a panel or control at this point
|
|
8
35
|
const selectGroupStyles = () => {};
|
|
9
36
|
|
|
10
37
|
const selectContainerStyles = ({
|
|
@@ -42,13 +69,15 @@ const ExpandCollapsePanel = ({
|
|
|
42
69
|
variant,
|
|
43
70
|
...rest
|
|
44
71
|
}) => {
|
|
45
|
-
const [containerHeight, setContainerHeight] = useState(null);
|
|
72
|
+
const [containerHeight, setContainerHeight] = (0, _react.useState)(null);
|
|
46
73
|
const isExpanded = openIds.includes(panelId);
|
|
47
|
-
|
|
74
|
+
|
|
75
|
+
const a11y = _utils.a11yProps.select(rest);
|
|
76
|
+
|
|
48
77
|
a11y.accessibilityState = { ...(a11y.accessibilityState || {}),
|
|
49
78
|
expanded: isExpanded
|
|
50
79
|
};
|
|
51
|
-
const themeTokens = useThemeTokens('ExpandCollapsePanel', tokens, variant, {
|
|
80
|
+
const themeTokens = (0, _ThemeProvider.useThemeTokens)('ExpandCollapsePanel', tokens, variant, {
|
|
52
81
|
expanded: isExpanded
|
|
53
82
|
});
|
|
54
83
|
|
|
@@ -68,78 +97,87 @@ const ExpandCollapsePanel = ({
|
|
|
68
97
|
}
|
|
69
98
|
};
|
|
70
99
|
|
|
71
|
-
const animatedStyles = useVerticalExpandAnimation({
|
|
100
|
+
const animatedStyles = (0, _utils.useVerticalExpandAnimation)({
|
|
72
101
|
containerHeight,
|
|
73
102
|
isExpanded,
|
|
74
103
|
tokens: themeTokens
|
|
75
104
|
}); // on web we can hide the contents until we have the container measured and avoid occasional jitter
|
|
76
105
|
// this won't work on native platforms
|
|
77
106
|
|
|
78
|
-
const overflowContainerStyles = containerHeight === null &&
|
|
107
|
+
const overflowContainerStyles = containerHeight === null && _Platform.default.OS === 'web' ? {
|
|
79
108
|
height: 0,
|
|
80
109
|
visibility: 'hidden'
|
|
81
110
|
} : undefined;
|
|
82
|
-
const focusabilityProps = isExpanded ? {} : a11yProps.nonFocusableProps;
|
|
83
|
-
return /*#__PURE__*/
|
|
84
|
-
style: selectGroupStyles(themeTokens)
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
111
|
+
const focusabilityProps = isExpanded ? {} : _utils.a11yProps.nonFocusableProps;
|
|
112
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
|
|
113
|
+
style: selectGroupStyles(themeTokens),
|
|
114
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Control.default, { ...a11y,
|
|
115
|
+
isExpanded: isExpanded,
|
|
116
|
+
tokens: controlTokens,
|
|
117
|
+
onPress: handleControlPress,
|
|
118
|
+
children: control
|
|
119
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
120
|
+
style: overflowContainerStyles,
|
|
121
|
+
...focusabilityProps,
|
|
122
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
|
|
123
|
+
onLayout: onContainerLayout,
|
|
124
|
+
style: [staticStyles.itemsContainer, animatedStyles],
|
|
125
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
126
|
+
style: selectContainerStyles(themeTokens),
|
|
127
|
+
children: children
|
|
128
|
+
})
|
|
129
|
+
})
|
|
130
|
+
})]
|
|
131
|
+
});
|
|
97
132
|
};
|
|
98
133
|
|
|
99
134
|
ExpandCollapsePanel.propTypes = {
|
|
100
|
-
variant: variantProp.propType,
|
|
101
|
-
tokens: getTokensPropType('ExpandCollapsePanel'),
|
|
135
|
+
variant: _utils.variantProp.propType,
|
|
136
|
+
tokens: (0, _utils.getTokensPropType)('ExpandCollapsePanel'),
|
|
102
137
|
|
|
103
138
|
/**
|
|
104
139
|
* Array of the ids of currently open groups
|
|
105
140
|
*/
|
|
106
|
-
openIds:
|
|
141
|
+
openIds: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string])),
|
|
107
142
|
|
|
108
143
|
/**
|
|
109
144
|
* Unique name by which the ExpandCollapse controls this element.
|
|
110
145
|
*/
|
|
111
|
-
panelId:
|
|
146
|
+
panelId: _propTypes.default.string.isRequired,
|
|
112
147
|
|
|
113
148
|
/**
|
|
114
149
|
* Function to call on pressing the panel's control, which should open or close the panel.
|
|
115
150
|
* If Panel is a direct child of `ExpandCollapse`, this prop will be provided by the ExpandCollapse parent.
|
|
116
151
|
*/
|
|
117
|
-
onToggle:
|
|
152
|
+
onToggle: _propTypes.default.func.isRequired,
|
|
118
153
|
|
|
119
154
|
/**
|
|
120
155
|
* Optional function to call on pressing the panel's control, in addition to opening or closing the panel.
|
|
121
156
|
*/
|
|
122
|
-
onPress:
|
|
157
|
+
onPress: _propTypes.default.func,
|
|
123
158
|
|
|
124
159
|
/**
|
|
125
160
|
* ExpandCollapsePanel's children are the content that is hidden or revealed on open or close, and may be any
|
|
126
161
|
* single React element or a render function which takes this group's isExpanded state, onToggle function and panelId
|
|
127
162
|
*/
|
|
128
|
-
children:
|
|
163
|
+
children: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node]),
|
|
129
164
|
|
|
130
165
|
/**
|
|
131
166
|
* The content inside the always-visible control element that opens and closes the ExpandCollapse when pressed.
|
|
132
167
|
*/
|
|
133
|
-
control:
|
|
168
|
+
control: _Control.default.propTypes.children.isRequired,
|
|
134
169
|
|
|
135
170
|
/**
|
|
136
171
|
* Optional theme token overrides that may be passed to the ExpandCollapseControl element.
|
|
137
172
|
*/
|
|
138
|
-
controlTokens: getTokensPropType('ExpandCollapseControl')
|
|
173
|
+
controlTokens: (0, _utils.getTokensPropType)('ExpandCollapseControl')
|
|
139
174
|
};
|
|
140
|
-
|
|
175
|
+
|
|
176
|
+
const staticStyles = _StyleSheet.default.create({
|
|
141
177
|
itemsContainer: {
|
|
142
178
|
overflow: 'hidden'
|
|
143
179
|
}
|
|
144
180
|
});
|
|
145
|
-
|
|
181
|
+
|
|
182
|
+
var _default = ExpandCollapsePanel;
|
|
183
|
+
exports.default = _default;
|
|
@@ -1,7 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "Accordion", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _Accordion.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
exports.default = void 0;
|
|
13
|
+
|
|
14
|
+
var _ExpandCollapse = _interopRequireDefault(require("./ExpandCollapse"));
|
|
15
|
+
|
|
16
|
+
var _Accordion = _interopRequireDefault(require("./Accordion"));
|
|
17
|
+
|
|
18
|
+
var _Panel = _interopRequireDefault(require("./Panel"));
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
+
|
|
22
|
+
_ExpandCollapse.default.Panel = _Panel.default;
|
|
23
|
+
_Accordion.default.Panel = _Panel.default;
|
|
24
|
+
var _default = _ExpandCollapse.default;
|
|
25
|
+
exports.default = _default;
|