@telus-uds/components-base 3.29.0 → 3.30.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/CHANGELOG.md +26 -1
- package/jest.config.cjs +1 -0
- package/lib/cjs/ActionCard/ActionCard.js +4 -4
- package/lib/cjs/ActivityIndicator/Dots.native.js +1 -2
- package/lib/cjs/ActivityIndicator/Spinner.native.js +1 -2
- package/lib/cjs/Box/Box.js +1 -2
- package/lib/cjs/Button/Button.js +1 -2
- package/lib/cjs/Button/ButtonBase.js +8 -8
- package/lib/cjs/Button/ButtonDropdown.js +1 -2
- package/lib/cjs/Button/ButtonGroup.js +1 -2
- package/lib/cjs/Button/ButtonLink.js +1 -2
- package/lib/cjs/Card/Card.js +1 -2
- package/lib/cjs/Card/PressableCardBase.js +1 -2
- package/lib/cjs/Card/index.js +1 -2
- package/lib/cjs/CardGroup/CardGroup.js +1 -2
- package/lib/cjs/Carousel/Carousel.js +12 -7
- package/lib/cjs/Carousel/CarouselThumbnail.js +123 -31
- package/lib/cjs/Carousel/CarouselThumbnailNavigation.js +8 -1
- package/lib/cjs/CheckboxCard/CheckboxCard.js +1 -2
- package/lib/cjs/CheckboxCardGroup/CheckboxCardGroup.js +1 -2
- package/lib/cjs/Footnote/FootnoteLink.js +18 -17
- package/lib/cjs/HorizontalScroll/index.js +1 -2
- package/lib/cjs/Icon/IconText.js +1 -2
- package/lib/cjs/Icon/index.js +1 -2
- package/lib/cjs/InputSupports/InputSupports.js +1 -2
- package/lib/cjs/InputSupports/useInputSupports.js +1 -3
- package/lib/cjs/Link/MobileIconTextContent.js +1 -2
- package/lib/cjs/Listbox/Listbox.js +1 -2
- package/lib/cjs/Modal/Modal.js +1 -1
- package/lib/cjs/Pagination/PageButton.js +1 -2
- package/lib/cjs/Pagination/Pagination.js +1 -2
- package/lib/cjs/Progress/Progress.js +30 -5
- package/lib/cjs/QuickLinks/QuickLinks.js +7 -0
- package/lib/cjs/Radio/Radio.js +1 -2
- package/lib/cjs/RadioCard/RadioCard.js +1 -2
- package/lib/cjs/RadioCard/RadioCardGroup.js +1 -2
- package/lib/cjs/Scroll/Scroll.js +466 -0
- package/lib/cjs/Scroll/ScrollContext.js +55 -0
- package/lib/cjs/Scroll/ScrollItem.js +103 -0
- package/lib/cjs/Scroll/ScrollProgress.js +99 -0
- package/lib/cjs/Scroll/dictionary.js +18 -0
- package/lib/cjs/Scroll/index.js +29 -0
- package/lib/cjs/Shortcuts/Shortcuts.js +1 -2
- package/lib/cjs/SideNav/SideNav.js +1 -2
- package/lib/cjs/StackView/StackWrapBox.js +9 -1
- package/lib/cjs/StackView/StackWrapGap.js +3 -1
- package/lib/cjs/StackView/getStackedContent.js +21 -12
- package/lib/cjs/Tabs/Tabs.js +1 -2
- package/lib/cjs/Tooltip/Tooltip.native.js +2 -2
- package/lib/cjs/index.js +16 -2
- package/lib/cjs/utils/animation/index.js +7 -0
- package/lib/cjs/utils/animation/useAnimatedValue.js +46 -0
- package/lib/cjs/utils/children.js +2 -1
- package/lib/cjs/utils/index.js +1 -2
- package/lib/esm/ActionCard/ActionCard.js +4 -4
- package/lib/esm/Button/ButtonBase.js +8 -8
- package/lib/esm/Carousel/Carousel.js +12 -7
- package/lib/esm/Carousel/CarouselThumbnail.js +124 -32
- package/lib/esm/Carousel/CarouselThumbnailNavigation.js +8 -1
- package/lib/esm/Footnote/FootnoteLink.js +18 -17
- package/lib/esm/InputSupports/InputSupports.js +1 -2
- package/lib/esm/InputSupports/useInputSupports.js +1 -3
- package/lib/esm/Modal/Modal.js +1 -1
- package/lib/esm/Progress/Progress.js +30 -5
- package/lib/esm/QuickLinks/QuickLinks.js +7 -0
- package/lib/esm/Scroll/Scroll.js +459 -0
- package/lib/esm/Scroll/ScrollContext.js +47 -0
- package/lib/esm/Scroll/ScrollItem.js +96 -0
- package/lib/esm/Scroll/ScrollProgress.js +92 -0
- package/lib/esm/Scroll/dictionary.js +12 -0
- package/lib/esm/Scroll/index.js +4 -0
- package/lib/esm/StackView/StackWrapBox.js +9 -1
- package/lib/esm/StackView/StackWrapGap.js +3 -1
- package/lib/esm/StackView/getStackedContent.js +20 -10
- package/lib/esm/Tooltip/Tooltip.native.js +2 -2
- package/lib/esm/index.js +1 -0
- package/lib/esm/utils/animation/index.js +1 -1
- package/lib/esm/utils/animation/useAnimatedValue.js +39 -0
- package/lib/esm/utils/children.js +2 -1
- package/lib/package.json +2 -2
- package/package.json +2 -2
- package/src/Carousel/Carousel.jsx +6 -1
- package/src/Carousel/CarouselThumbnail.jsx +153 -64
- package/src/Carousel/CarouselThumbnailNavigation.jsx +8 -2
- package/src/Footnote/FootnoteLink.jsx +17 -12
- package/src/InputSupports/InputSupports.jsx +1 -6
- package/src/InputSupports/useInputSupports.js +1 -1
- package/src/Modal/Modal.jsx +1 -1
- package/src/Progress/Progress.jsx +22 -3
- package/src/QuickLinks/QuickLinks.jsx +8 -0
- package/src/Scroll/Scroll.jsx +488 -0
- package/src/Scroll/ScrollContext.jsx +41 -0
- package/src/Scroll/ScrollItem.jsx +89 -0
- package/src/Scroll/ScrollProgress.jsx +75 -0
- package/src/Scroll/dictionary.js +12 -0
- package/src/Scroll/index.js +5 -0
- package/src/StackView/StackWrapBox.jsx +13 -1
- package/src/StackView/StackWrapGap.jsx +2 -1
- package/src/StackView/getStackedContent.jsx +22 -8
- package/src/index.js +1 -0
- package/src/utils/animation/index.js +1 -1
- package/src/utils/animation/useAnimatedValue.js +37 -0
- package/src/utils/children.jsx +4 -1
- package/types/Scroll.d.ts +66 -0
- package/types/index.d.ts +9 -0
|
@@ -16,28 +16,28 @@ var _ThemeProvider = require("../ThemeProvider");
|
|
|
16
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
17
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
18
18
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.htmlAttrs, _utils.viewProps]);
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
const HALF_FONT_SIZE = 2;
|
|
20
|
+
const QUARTER_FONT_SIZE = 4;
|
|
21
|
+
const DEFAULT_LINE_HEIGHT = 1;
|
|
22
|
+
const LINE_HEIGHT_MULTIPLIER = 2;
|
|
21
23
|
const selectTextStyle = _ref => {
|
|
22
24
|
let {
|
|
23
25
|
fontSize,
|
|
24
26
|
lineHeight
|
|
25
27
|
} = _ref;
|
|
26
|
-
return {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
})
|
|
40
|
-
};
|
|
28
|
+
return _Platform.default.select({
|
|
29
|
+
native: {
|
|
30
|
+
fontSize: fontSize / HALF_FONT_SIZE,
|
|
31
|
+
lineHeight: fontSize,
|
|
32
|
+
position: 'relative',
|
|
33
|
+
top: -(fontSize * lineHeight) / HALF_FONT_SIZE
|
|
34
|
+
},
|
|
35
|
+
web: {
|
|
36
|
+
fontSize,
|
|
37
|
+
lineHeight: lineHeight !== DEFAULT_LINE_HEIGHT ? lineHeight : fontSize * LINE_HEIGHT_MULTIPLIER,
|
|
38
|
+
top: -fontSize / QUARTER_FONT_SIZE
|
|
39
|
+
}
|
|
40
|
+
});
|
|
41
41
|
};
|
|
42
42
|
const FootnoteLink = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
|
|
43
43
|
let {
|
|
@@ -81,6 +81,7 @@ const FootnoteLink = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
|
|
|
81
81
|
});
|
|
82
82
|
});
|
|
83
83
|
FootnoteLink.displayName = 'FootnoteLink';
|
|
84
|
+
FootnoteLink.__UDS_COMPONENT_NAME__ = 'FootnoteLink';
|
|
84
85
|
const copyShape = _propTypes.default.shape({
|
|
85
86
|
a11yLabel: _propTypes.default.string.isRequired
|
|
86
87
|
});
|
|
@@ -14,8 +14,7 @@ var _HorizontalScroll = _interopRequireWildcard(require("./HorizontalScroll"));
|
|
|
14
14
|
var _itemPositions = require("./itemPositions");
|
|
15
15
|
var _HorizontalScrollButton = _interopRequireDefault(require("./HorizontalScrollButton"));
|
|
16
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
17
|
-
function
|
|
18
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
17
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
19
18
|
var _default = exports.default = _HorizontalScroll.default;
|
|
20
19
|
const horizontalScrollUtils = exports.horizontalScrollUtils = {
|
|
21
20
|
selectHorizontalScrollTokens: _HorizontalScroll.selectHorizontalScrollTokens,
|
package/lib/cjs/Icon/IconText.js
CHANGED
|
@@ -14,8 +14,7 @@ var _Icon = _interopRequireWildcard(require("./Icon"));
|
|
|
14
14
|
var _StackView = require("../StackView");
|
|
15
15
|
var _utils = require("../utils");
|
|
16
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
-
function
|
|
18
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
17
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
19
18
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
20
19
|
/**
|
|
21
20
|
* Returns an icon and some text with a sized gap between them. This is a utility component
|
package/lib/cjs/Icon/index.js
CHANGED
|
@@ -19,6 +19,5 @@ Object.defineProperty(exports, "iconComponentPropTypes", {
|
|
|
19
19
|
var _Icon = _interopRequireWildcard(require("./Icon"));
|
|
20
20
|
var _IconText = _interopRequireDefault(require("./IconText"));
|
|
21
21
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
22
|
-
function
|
|
23
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
22
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
24
23
|
var _default = exports.default = _Icon.default;
|
|
@@ -72,8 +72,7 @@ const InputSupports = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
|
|
|
72
72
|
}), typeof children === 'function' ? children({
|
|
73
73
|
inputId,
|
|
74
74
|
...a11yProps,
|
|
75
|
-
validation: feedbackValidation
|
|
76
|
-
accessibilityDescribedBy: feedbackId
|
|
75
|
+
validation: feedbackValidation
|
|
77
76
|
}) : children, feedback || maxCharsReachedErrorMessage ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Feedback.default, {
|
|
78
77
|
id: feedbackId,
|
|
79
78
|
title: feedback || maxCharsReachedErrorMessage,
|
|
@@ -32,9 +32,7 @@ const useInputSupports = _ref => {
|
|
|
32
32
|
accessibilityLabel: label,
|
|
33
33
|
accessibilityHint: joinDefined([!hasValidationError && feedback, hint, maxCharacterAllowed ? getCopy('maxCharacters').replace(/%\{charCount\}/g, maxCharacterAllowed) : undefined]),
|
|
34
34
|
// native only -> replaced with describedBy on web
|
|
35
|
-
accessibilityDescribedBy: joinDefined([
|
|
36
|
-
// feedback receives a11yRole=alert on error, so there's no need to include it here
|
|
37
|
-
hint && hintId, charactersCount ? getCopy('charactersRemaining').replace(/%\{charCount\}/g, charactersCount) : undefined]),
|
|
35
|
+
accessibilityDescribedBy: joinDefined([hint && hintId, feedback && feedbackId || undefined, charactersCount ? getCopy('charactersRemaining').replace(/%\{charCount\}/g, charactersCount) : undefined]),
|
|
38
36
|
accessibilityInvalid: hasValidationError
|
|
39
37
|
};
|
|
40
38
|
return {
|
|
@@ -12,8 +12,7 @@ var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/expo
|
|
|
12
12
|
var _Icon = _interopRequireWildcard(require("../Icon/Icon"));
|
|
13
13
|
var _utils = require("../utils");
|
|
14
14
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
function
|
|
16
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
18
17
|
const MobileIconTextContent = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
|
|
19
18
|
let {
|
|
@@ -19,8 +19,7 @@ var _ListboxOverlay = _interopRequireDefault(require("./ListboxOverlay"));
|
|
|
19
19
|
var _dictionary = _interopRequireDefault(require("./dictionary"));
|
|
20
20
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
21
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
22
|
-
function
|
|
23
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
22
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
24
23
|
const styles = _StyleSheet.default.create({
|
|
25
24
|
container: {
|
|
26
25
|
padding: 0,
|
package/lib/cjs/Modal/Modal.js
CHANGED
|
@@ -246,7 +246,7 @@ const Modal = /*#__PURE__*/_react.default.forwardRef((_ref5, ref) => {
|
|
|
246
246
|
})]
|
|
247
247
|
})
|
|
248
248
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TouchableWithoutFeedback.default, {
|
|
249
|
-
onPress: isBackdropClickable
|
|
249
|
+
onPress: isBackdropClickable ? handleClose : undefined,
|
|
250
250
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
251
251
|
style: [staticStyles.backdrop, selectBackdropStyles(themeTokens)]
|
|
252
252
|
})
|
|
@@ -12,8 +12,7 @@ var _utils = require("../utils");
|
|
|
12
12
|
var _useCopy = _interopRequireDefault(require("../utils/useCopy"));
|
|
13
13
|
var _dictionary = _interopRequireDefault(require("./dictionary"));
|
|
14
14
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
|
-
function
|
|
16
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
17
16
|
const PageButton = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
|
|
18
17
|
let {
|
|
19
18
|
label,
|
|
@@ -18,8 +18,7 @@ var _PageButton = _interopRequireDefault(require("./PageButton"));
|
|
|
18
18
|
var _SideButton = _interopRequireDefault(require("./SideButton"));
|
|
19
19
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
20
20
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
21
|
-
function
|
|
22
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
21
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
23
22
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
|
|
24
23
|
const selectTextStyles = (_ref, themeOptions) => {
|
|
25
24
|
let {
|
|
@@ -14,6 +14,8 @@ var _ProgressContext = _interopRequireDefault(require("./ProgressContext"));
|
|
|
14
14
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
15
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
16
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
|
|
17
|
+
const BORDER_SIDES = 2;
|
|
18
|
+
const CENTER_DIVISOR = 2;
|
|
17
19
|
const selectProgressStyles = _ref => {
|
|
18
20
|
let {
|
|
19
21
|
backgroundColor,
|
|
@@ -32,6 +34,21 @@ const selectProgressStyles = _ref => {
|
|
|
32
34
|
...(0, _ThemeProvider.applyShadowToken)(shadow)
|
|
33
35
|
};
|
|
34
36
|
};
|
|
37
|
+
const selectBarWrapperStyles = _ref2 => {
|
|
38
|
+
let {
|
|
39
|
+
barHeight,
|
|
40
|
+
borderRadius,
|
|
41
|
+
borderWidth,
|
|
42
|
+
height
|
|
43
|
+
} = _ref2;
|
|
44
|
+
return {
|
|
45
|
+
height: barHeight,
|
|
46
|
+
width: '100%',
|
|
47
|
+
position: 'absolute',
|
|
48
|
+
top: (height - borderWidth * BORDER_SIDES - barHeight) / CENTER_DIVISOR,
|
|
49
|
+
borderRadius
|
|
50
|
+
};
|
|
51
|
+
};
|
|
35
52
|
|
|
36
53
|
/**
|
|
37
54
|
* The `Progress` is a container for displaying one or several `ProgressBar`s.
|
|
@@ -45,10 +62,11 @@ const selectProgressStyles = _ref => {
|
|
|
45
62
|
*
|
|
46
63
|
* - Use the following tokens to customize the appearance:
|
|
47
64
|
* - `backgroundColor` for the background color of the progress container,
|
|
65
|
+
* - `barHeight` to control the height of the progress bars displayed within the container,
|
|
48
66
|
* - `borderColor` to control the color of the border,
|
|
49
67
|
* - `borderRadius` for the rounded corners,
|
|
50
68
|
* - `borderWidth` to change the border width.
|
|
51
|
-
* - `height` to control the height of the progress
|
|
69
|
+
* - `height` to control the height of the progress bar container.
|
|
52
70
|
* - `shadow` to apply a box shadow to the progress bar container.
|
|
53
71
|
*
|
|
54
72
|
* ## Variants
|
|
@@ -69,16 +87,23 @@ const selectProgressStyles = _ref => {
|
|
|
69
87
|
* role.
|
|
70
88
|
*
|
|
71
89
|
*/
|
|
72
|
-
const Progress = /*#__PURE__*/_react.default.forwardRef((
|
|
90
|
+
const Progress = /*#__PURE__*/_react.default.forwardRef((_ref3, ref) => {
|
|
73
91
|
let {
|
|
74
92
|
children,
|
|
75
93
|
tokens,
|
|
76
94
|
variant,
|
|
77
95
|
...rest
|
|
78
|
-
} =
|
|
96
|
+
} = _ref3;
|
|
79
97
|
const themeTokens = (0, _ThemeProvider.useThemeTokens)('Progress', tokens, variant);
|
|
80
|
-
// Default to false (vertical layout) to preserve existing behavior and avoid breaking changes
|
|
81
98
|
const layers = variant?.layers ?? false;
|
|
99
|
+
const {
|
|
100
|
+
barHeight,
|
|
101
|
+
height
|
|
102
|
+
} = themeTokens;
|
|
103
|
+
const content = barHeight && barHeight !== height ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
|
|
104
|
+
style: selectBarWrapperStyles(themeTokens),
|
|
105
|
+
children: children
|
|
106
|
+
}) : children;
|
|
82
107
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressContext.default.Provider, {
|
|
83
108
|
value: {
|
|
84
109
|
layers
|
|
@@ -87,7 +112,7 @@ const Progress = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
|
|
|
87
112
|
ref: ref,
|
|
88
113
|
style: [staticStyles.progressContainer, selectProgressStyles(themeTokens)],
|
|
89
114
|
...selectProps(rest),
|
|
90
|
-
children:
|
|
115
|
+
children: content
|
|
91
116
|
})
|
|
92
117
|
});
|
|
93
118
|
});
|
|
@@ -6,9 +6,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
|
|
9
10
|
var _ThemeProvider = require("../ThemeProvider");
|
|
10
11
|
var _ViewportProvider = require("../ViewportProvider");
|
|
11
12
|
var _utils = require("../utils");
|
|
13
|
+
var _semantics = require("../utils/a11y/semantics");
|
|
12
14
|
var _List = _interopRequireDefault(require("../List"));
|
|
13
15
|
var _StackWrap = _interopRequireDefault(require("../StackView/StackWrap"));
|
|
14
16
|
var _QuickLinksCard = _interopRequireDefault(require("./QuickLinksCard"));
|
|
@@ -40,6 +42,10 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
|
|
|
40
42
|
} = (0, _ThemeProvider.useThemeTokens)('QuickLinks', tokens, variant, {
|
|
41
43
|
viewport
|
|
42
44
|
});
|
|
45
|
+
const itemAccessibilityRole = _Platform.default.select({
|
|
46
|
+
web: ['ul', 'ol'].includes(tag) ? _semantics.tagsToRoles.li : undefined,
|
|
47
|
+
default: undefined
|
|
48
|
+
});
|
|
43
49
|
const content = list && /*#__PURE__*/(0, _jsxRuntime.jsx)(_List.default, {
|
|
44
50
|
ref: ref,
|
|
45
51
|
tokens: listTokens,
|
|
@@ -54,6 +60,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
|
|
|
54
60
|
justifyContent: stackJustify
|
|
55
61
|
},
|
|
56
62
|
tag: tag,
|
|
63
|
+
itemAccessibilityRole: itemAccessibilityRole,
|
|
57
64
|
...rest,
|
|
58
65
|
children: children
|
|
59
66
|
});
|
package/lib/cjs/Radio/Radio.js
CHANGED
|
@@ -16,8 +16,7 @@ var _ThemeProvider = require("../ThemeProvider");
|
|
|
16
16
|
var _utils = require("../utils");
|
|
17
17
|
var _StackView = _interopRequireDefault(require("../StackView"));
|
|
18
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
-
function
|
|
20
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
21
20
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
22
21
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.focusHandlerProps, _utils.viewProps]);
|
|
23
22
|
const selectContainerStyles = _ref => {
|
|
@@ -15,8 +15,7 @@ var _Card = require("../Card");
|
|
|
15
15
|
var _StackView = _interopRequireDefault(require("../StackView"));
|
|
16
16
|
var _RadioButton = _interopRequireWildcard(require("../Radio/RadioButton"));
|
|
17
17
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
-
function
|
|
19
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
18
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
20
19
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
21
20
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.focusHandlerProps, _utils.viewProps]);
|
|
22
21
|
|
|
@@ -13,8 +13,7 @@ var _StackView = _interopRequireWildcard(require("../StackView"));
|
|
|
13
13
|
var _RadioCard = _interopRequireDefault(require("./RadioCard"));
|
|
14
14
|
var _Fieldset = _interopRequireDefault(require("../Fieldset"));
|
|
15
15
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
|
-
function
|
|
17
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
16
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
18
17
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
18
|
const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
|
|
20
19
|
const [selectItemProps, selectedItemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.focusHandlerProps, _utils.viewProps]);
|