@carbon/ibm-products 2.71.1 → 2.72.0-rc.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/css/carbon.css +50 -0
- package/css/carbon.css.map +1 -1
- package/css/index-full-carbon.css +560 -185
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +132 -1
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +570 -245
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +358 -33
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/{BigNumbers/BigNumbers.d.ts → BigNumber/BigNumber.d.ts} +5 -5
- package/es/components/{BigNumbers/BigNumbers.js → BigNumber/BigNumber.js} +12 -12
- package/es/components/BigNumber/BigNumberSkeleton.d.ts +17 -0
- package/es/components/{BigNumbers/BigNumbersSkeleton.js → BigNumber/BigNumberSkeleton.js} +16 -16
- package/es/components/{BigNumbers → BigNumber}/constants.d.ts +3 -3
- package/es/components/{BigNumbers → BigNumber}/constants.js +6 -6
- package/es/components/{BigNumbers → BigNumber}/index.d.ts +2 -2
- package/es/components/Coachmark/next/Coachmark/Coachmark.d.ts +72 -0
- package/es/components/Coachmark/next/Coachmark/Coachmark.js +185 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBeacon/CoachmarkBeacon.d.ts +44 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBeacon/index.d.ts +8 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubble.d.ts +38 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubble.js +125 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubbleHeader.d.ts +24 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubbleHeader.js +25 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkBubble/index.d.ts +10 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts +34 -0
- package/es/components/Coachmark/next/Coachmark/CoachmarkContent.js +118 -0
- package/es/components/Coachmark/next/Coachmark/ContentBody.d.ts +23 -0
- package/es/components/Coachmark/next/Coachmark/ContentBody.js +37 -0
- package/es/components/Coachmark/next/Coachmark/ContentHeader.d.ts +21 -0
- package/es/components/Coachmark/next/Coachmark/ContentHeader.js +89 -0
- package/{lib/components/BigNumbers → es/components/Coachmark/next/Coachmark}/index.d.ts +2 -2
- package/es/components/CoachmarkBeacon/CoachmarkBeacon.js +0 -1
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +2 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +11 -5
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +11 -4
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +1 -1
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +42 -3
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +3 -1
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +5 -3
- package/es/components/ConditionBuilder/utils/useTranslations.js +1 -1
- package/es/components/EditInPlace/EditInPlace.js +0 -3
- package/es/components/EmptyStates/EmptyState.d.ts +2 -2
- package/es/components/EmptyStates/EmptyState.js +2 -8
- package/es/components/FilterPanel/FilterPanelGroup/index.d.ts +1 -0
- package/es/components/InterstitialScreen/InterstitialScreen.d.ts +1 -25
- package/es/components/InterstitialScreen/InterstitialScreen.js +3 -19
- package/es/components/InterstitialScreen/InterstitialScreenBody.d.ts +1 -1
- package/es/components/InterstitialScreen/InterstitialScreenBody.js +1 -1
- package/es/components/InterstitialScreen/InterstitialScreenFooter.d.ts +1 -1
- package/es/components/InterstitialScreen/InterstitialScreenFooter.js +1 -1
- package/es/components/InterstitialScreen/InterstitialScreenHeader.d.ts +6 -0
- package/es/components/InterstitialScreen/InterstitialScreenHeader.js +1 -1
- package/es/components/InterstitialScreen/_story-assets/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +1 -1
- package/es/components/InterstitialScreen/context.d.ts +31 -0
- package/es/components/InterstitialScreen/context.js +18 -0
- package/es/components/InterstitialScreen/index.d.ts +3 -2
- package/es/components/NotificationsPanel/NotificationsPanel.js +36 -13
- package/es/components/PageHeader/PageHeader.d.ts +2 -1
- package/es/components/PageHeader/PageHeader.js +2 -1
- package/es/components/PageHeader/next/PageHeader.d.ts +18 -3
- package/es/components/PageHeader/next/PageHeader.js +260 -12
- package/es/components/PageHeader/next/context.d.ts +25 -0
- package/es/components/PageHeader/next/context.js +30 -0
- package/es/components/PageHeader/next/index.d.ts +3 -3
- package/es/components/PageHeader/next/overflowHandler.d.ts +95 -0
- package/es/components/PageHeader/next/overflowHandler.js +162 -0
- package/es/components/PageHeader/next/utils.d.ts +19 -0
- package/es/components/PageHeader/next/utils.js +68 -0
- package/es/components/ProductiveCard/ProductiveCard.js +2 -1
- package/es/components/ScrollGradient/ScrollGradient.js +1 -2
- package/es/components/SidePanel/SidePanel.d.ts +4 -0
- package/es/components/SidePanel/SidePanel.js +8 -2
- package/es/components/Tearsheet/TearsheetShell.js +8 -5
- package/es/components/TruncatedText/TruncatedText.d.ts +48 -0
- package/es/components/TruncatedText/TruncatedText.js +86 -0
- package/es/components/TruncatedText/index.d.ts +7 -0
- package/es/components/TruncatedText/useTruncatedText.d.ts +16 -0
- package/es/components/TruncatedText/useTruncatedText.js +41 -0
- package/es/components/index.d.ts +3 -1
- package/es/global/js/hooks/useOverflowString.d.ts +2 -2
- package/es/global/js/hooks/useResizeObserver.d.ts +1 -1
- package/es/global/js/package-settings.d.ts +2 -1
- package/es/global/js/package-settings.js +3 -2
- package/es/global/js/utils/checkForOverflow.js +21 -0
- package/es/global/js/utils/makeDraggable/index.d.ts +1 -0
- package/es/global/js/utils/makeDraggable/makeDraggable.d.ts +19 -0
- package/es/global/js/utils/makeDraggable/makeDraggable.js +91 -0
- package/es/global/js/utils/makeDraggable/makeDraggable.stories.d.ts +22 -0
- package/es/index.js +3 -1
- package/es/node_modules/@floating-ui/core/dist/floating-ui.core.js +592 -0
- package/es/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +713 -0
- package/es/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +95 -0
- package/es/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +161 -0
- package/es/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +142 -0
- package/es/settings.d.ts +2 -1
- package/lib/components/{BigNumbers/BigNumbers.d.ts → BigNumber/BigNumber.d.ts} +5 -5
- package/lib/components/{BigNumbers/BigNumbers.js → BigNumber/BigNumber.js} +11 -11
- package/lib/components/BigNumber/BigNumberSkeleton.d.ts +17 -0
- package/lib/components/{BigNumbers/BigNumbersSkeleton.js → BigNumber/BigNumberSkeleton.js} +15 -15
- package/lib/components/{BigNumbers → BigNumber}/constants.d.ts +3 -3
- package/lib/components/{BigNumbers → BigNumber}/constants.js +6 -6
- package/lib/components/BigNumber/index.d.ts +7 -0
- package/lib/components/Coachmark/Coachmark.js +2 -2
- package/lib/components/Coachmark/next/Coachmark/Coachmark.d.ts +72 -0
- package/lib/components/Coachmark/next/Coachmark/Coachmark.js +189 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBeacon/CoachmarkBeacon.d.ts +44 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBeacon/index.d.ts +8 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubble.d.ts +38 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubble.js +127 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubbleHeader.d.ts +24 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBubble/CoachmarkBubbleHeader.js +27 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkBubble/index.d.ts +10 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts +34 -0
- package/lib/components/Coachmark/next/Coachmark/CoachmarkContent.js +122 -0
- package/lib/components/Coachmark/next/Coachmark/ContentBody.d.ts +23 -0
- package/lib/components/Coachmark/next/Coachmark/ContentBody.js +41 -0
- package/lib/components/Coachmark/next/Coachmark/ContentHeader.d.ts +21 -0
- package/lib/components/Coachmark/next/Coachmark/ContentHeader.js +93 -0
- package/lib/components/Coachmark/next/Coachmark/index.d.ts +7 -0
- package/lib/components/CoachmarkBeacon/CoachmarkBeacon.js +0 -1
- package/lib/components/CoachmarkFixed/CoachmarkFixed.js +2 -2
- package/lib/components/CoachmarkStack/CoachmarkStack.js +2 -2
- package/lib/components/CoachmarkStack/CoachmarkStackHome.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +2 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +11 -5
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +11 -4
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +1 -1
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +41 -2
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +3 -1
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +5 -3
- package/lib/components/ConditionBuilder/utils/useTranslations.js +1 -1
- package/lib/components/EditInPlace/EditInPlace.js +0 -3
- package/lib/components/EmptyStates/EmptyState.d.ts +2 -2
- package/lib/components/EmptyStates/EmptyState.js +2 -8
- package/lib/components/FilterPanel/FilterPanelGroup/index.d.ts +1 -0
- package/lib/components/InterstitialScreen/InterstitialScreen.d.ts +1 -25
- package/lib/components/InterstitialScreen/InterstitialScreen.js +6 -25
- package/lib/components/InterstitialScreen/InterstitialScreenBody.d.ts +1 -1
- package/lib/components/InterstitialScreen/InterstitialScreenBody.js +6 -6
- package/lib/components/InterstitialScreen/InterstitialScreenFooter.d.ts +1 -1
- package/lib/components/InterstitialScreen/InterstitialScreenFooter.js +9 -9
- package/lib/components/InterstitialScreen/InterstitialScreenHeader.d.ts +6 -0
- package/lib/components/InterstitialScreen/InterstitialScreenHeader.js +5 -5
- package/lib/components/InterstitialScreen/_story-assets/InterstitialScreenViewModule/InterstitialScreenViewModule.d.ts +1 -1
- package/lib/components/InterstitialScreen/context.d.ts +31 -0
- package/lib/components/InterstitialScreen/context.js +21 -0
- package/lib/components/InterstitialScreen/index.d.ts +3 -2
- package/lib/components/NotificationsPanel/NotificationsPanel.js +36 -13
- package/lib/components/PageHeader/PageHeader.d.ts +2 -1
- package/lib/components/PageHeader/PageHeader.js +2 -1
- package/lib/components/PageHeader/next/PageHeader.d.ts +18 -3
- package/lib/components/PageHeader/next/PageHeader.js +261 -7
- package/lib/components/PageHeader/next/context.d.ts +25 -0
- package/lib/components/PageHeader/next/context.js +33 -0
- package/lib/components/PageHeader/next/index.d.ts +3 -3
- package/lib/components/PageHeader/next/overflowHandler.d.ts +95 -0
- package/lib/components/PageHeader/next/overflowHandler.js +166 -0
- package/lib/components/PageHeader/next/utils.d.ts +19 -0
- package/lib/components/PageHeader/next/utils.js +71 -0
- package/lib/components/ProductiveCard/ProductiveCard.js +2 -1
- package/lib/components/ScrollGradient/ScrollGradient.js +1 -2
- package/lib/components/SidePanel/SidePanel.d.ts +4 -0
- package/lib/components/SidePanel/SidePanel.js +8 -2
- package/lib/components/Tearsheet/TearsheetShell.js +8 -5
- package/lib/components/TruncatedText/TruncatedText.d.ts +48 -0
- package/lib/components/TruncatedText/TruncatedText.js +86 -0
- package/lib/components/TruncatedText/index.d.ts +7 -0
- package/lib/components/TruncatedText/useTruncatedText.d.ts +16 -0
- package/lib/components/TruncatedText/useTruncatedText.js +45 -0
- package/lib/components/index.d.ts +3 -1
- package/lib/global/js/hooks/useOverflowString.d.ts +2 -2
- package/lib/global/js/hooks/usePortalTarget.js +2 -2
- package/lib/global/js/hooks/useResizeObserver.d.ts +1 -1
- package/lib/global/js/package-settings.d.ts +2 -1
- package/lib/global/js/package-settings.js +3 -2
- package/lib/global/js/utils/checkForOverflow.js +23 -0
- package/lib/global/js/utils/makeDraggable/index.d.ts +1 -0
- package/lib/global/js/utils/makeDraggable/makeDraggable.d.ts +19 -0
- package/lib/global/js/utils/makeDraggable/makeDraggable.js +93 -0
- package/lib/global/js/utils/makeDraggable/makeDraggable.stories.d.ts +22 -0
- package/lib/index.js +10 -3
- package/lib/node_modules/@floating-ui/core/dist/floating-ui.core.js +600 -0
- package/lib/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +722 -0
- package/lib/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +102 -0
- package/lib/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +182 -0
- package/lib/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +164 -0
- package/lib/settings.d.ts +2 -1
- package/package.json +9 -10
- package/scss/components/{BigNumbers/_big-numbers.scss → BigNumber/_big-number.scss} +5 -5
- package/scss/components/{BigNumbers → BigNumber}/_carbon-imports.scss +3 -3
- package/scss/components/{BigNumbers → BigNumber}/_index-with-carbon.scss +2 -2
- package/scss/components/{BigNumbers → BigNumber}/_index.scss +2 -2
- package/scss/components/Card/_card.scss +2 -0
- package/scss/components/Coachmark/_bubble.scss +62 -0
- package/scss/components/Coachmark/_coachmark-beacon.scss +164 -0
- package/scss/components/Coachmark/_coachmark.scss +15 -0
- package/scss/components/ConditionBuilder/_condition-builder.scss +8 -0
- package/scss/components/PageHeader/_page-header.scss +144 -1
- package/scss/components/Tearsheet/_tearsheet.scss +6 -0
- package/scss/components/TruncatedText/_carbon-imports.scss +6 -0
- package/scss/components/TruncatedText/_index-with-carbon.scss +9 -0
- package/scss/components/TruncatedText/_index.scss +8 -0
- package/scss/components/TruncatedText/_truncated-text.scss +26 -0
- package/scss/components/_index-with-carbon.scss +3 -2
- package/scss/components/_index.scss +3 -2
- package/telemetry.yml +24 -5
- package/es/components/BigNumbers/BigNumbersSkeleton.d.ts +0 -17
- package/lib/components/BigNumbers/BigNumbersSkeleton.d.ts +0 -17
@@ -0,0 +1,95 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2020, 2025
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
|
8
|
+
import { offset as offset$1, flip as flip$1, shift as shift$1, arrow as arrow$2 } from '../../dom/dist/floating-ui.dom.js';
|
9
|
+
export { autoUpdate, computePosition, platform } from '../../dom/dist/floating-ui.dom.js';
|
10
|
+
import 'react';
|
11
|
+
import 'react-dom';
|
12
|
+
|
13
|
+
/**
|
14
|
+
* Provides data to position an inner element of the floating element so that it
|
15
|
+
* appears centered to the reference element.
|
16
|
+
* This wraps the core `arrow` middleware to allow React refs as the element.
|
17
|
+
* @see https://floating-ui.com/docs/arrow
|
18
|
+
*/
|
19
|
+
const arrow$1 = options => {
|
20
|
+
function isRef(value) {
|
21
|
+
return {}.hasOwnProperty.call(value, 'current');
|
22
|
+
}
|
23
|
+
return {
|
24
|
+
name: 'arrow',
|
25
|
+
options,
|
26
|
+
fn(state) {
|
27
|
+
const {
|
28
|
+
element,
|
29
|
+
padding
|
30
|
+
} = typeof options === 'function' ? options(state) : options;
|
31
|
+
if (element && isRef(element)) {
|
32
|
+
if (element.current != null) {
|
33
|
+
return arrow$2({
|
34
|
+
element: element.current,
|
35
|
+
padding
|
36
|
+
}).fn(state);
|
37
|
+
}
|
38
|
+
return {};
|
39
|
+
}
|
40
|
+
if (element) {
|
41
|
+
return arrow$2({
|
42
|
+
element,
|
43
|
+
padding
|
44
|
+
}).fn(state);
|
45
|
+
}
|
46
|
+
return {};
|
47
|
+
}
|
48
|
+
};
|
49
|
+
};
|
50
|
+
|
51
|
+
/**
|
52
|
+
* Modifies the placement by translating the floating element along the
|
53
|
+
* specified axes.
|
54
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
55
|
+
* object may be passed.
|
56
|
+
* @see https://floating-ui.com/docs/offset
|
57
|
+
*/
|
58
|
+
const offset = (options, deps) => ({
|
59
|
+
...offset$1(options),
|
60
|
+
options: [options, deps]
|
61
|
+
});
|
62
|
+
|
63
|
+
/**
|
64
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
65
|
+
* keep it in view when it will overflow the clipping boundary.
|
66
|
+
* @see https://floating-ui.com/docs/shift
|
67
|
+
*/
|
68
|
+
const shift = (options, deps) => ({
|
69
|
+
...shift$1(options),
|
70
|
+
options: [options, deps]
|
71
|
+
});
|
72
|
+
|
73
|
+
/**
|
74
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
75
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
76
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
77
|
+
* @see https://floating-ui.com/docs/flip
|
78
|
+
*/
|
79
|
+
const flip = (options, deps) => ({
|
80
|
+
...flip$1(options),
|
81
|
+
options: [options, deps]
|
82
|
+
});
|
83
|
+
|
84
|
+
/**
|
85
|
+
* Provides data to position an inner element of the floating element so that it
|
86
|
+
* appears centered to the reference element.
|
87
|
+
* This wraps the core `arrow` middleware to allow React refs as the element.
|
88
|
+
* @see https://floating-ui.com/docs/arrow
|
89
|
+
*/
|
90
|
+
const arrow = (options, deps) => ({
|
91
|
+
...arrow$1(options),
|
92
|
+
options: [options, deps]
|
93
|
+
});
|
94
|
+
|
95
|
+
export { arrow, flip, offset, shift };
|
@@ -0,0 +1,161 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2020, 2025
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
|
8
|
+
function hasWindow() {
|
9
|
+
return typeof window !== 'undefined';
|
10
|
+
}
|
11
|
+
function getNodeName(node) {
|
12
|
+
if (isNode(node)) {
|
13
|
+
return (node.nodeName || '').toLowerCase();
|
14
|
+
}
|
15
|
+
// Mocked nodes in testing environments may not be instances of Node. By
|
16
|
+
// returning `#document` an infinite loop won't occur.
|
17
|
+
// https://github.com/floating-ui/floating-ui/issues/2317
|
18
|
+
return '#document';
|
19
|
+
}
|
20
|
+
function getWindow(node) {
|
21
|
+
var _node$ownerDocument;
|
22
|
+
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
23
|
+
}
|
24
|
+
function getDocumentElement(node) {
|
25
|
+
var _ref;
|
26
|
+
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
27
|
+
}
|
28
|
+
function isNode(value) {
|
29
|
+
if (!hasWindow()) {
|
30
|
+
return false;
|
31
|
+
}
|
32
|
+
return value instanceof Node || value instanceof getWindow(value).Node;
|
33
|
+
}
|
34
|
+
function isElement(value) {
|
35
|
+
if (!hasWindow()) {
|
36
|
+
return false;
|
37
|
+
}
|
38
|
+
return value instanceof Element || value instanceof getWindow(value).Element;
|
39
|
+
}
|
40
|
+
function isHTMLElement(value) {
|
41
|
+
if (!hasWindow()) {
|
42
|
+
return false;
|
43
|
+
}
|
44
|
+
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
45
|
+
}
|
46
|
+
function isShadowRoot(value) {
|
47
|
+
if (!hasWindow() || typeof ShadowRoot === 'undefined') {
|
48
|
+
return false;
|
49
|
+
}
|
50
|
+
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
51
|
+
}
|
52
|
+
function isOverflowElement(element) {
|
53
|
+
const {
|
54
|
+
overflow,
|
55
|
+
overflowX,
|
56
|
+
overflowY,
|
57
|
+
display
|
58
|
+
} = getComputedStyle(element);
|
59
|
+
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
|
60
|
+
}
|
61
|
+
function isTableElement(element) {
|
62
|
+
return ['table', 'td', 'th'].includes(getNodeName(element));
|
63
|
+
}
|
64
|
+
function isTopLayer(element) {
|
65
|
+
return [':popover-open', ':modal'].some(selector => {
|
66
|
+
try {
|
67
|
+
return element.matches(selector);
|
68
|
+
} catch (e) {
|
69
|
+
return false;
|
70
|
+
}
|
71
|
+
});
|
72
|
+
}
|
73
|
+
function isContainingBlock(elementOrCss) {
|
74
|
+
const webkit = isWebKit();
|
75
|
+
const css = isElement(elementOrCss) ? getComputedStyle(elementOrCss) : elementOrCss;
|
76
|
+
|
77
|
+
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
78
|
+
// https://drafts.csswg.org/css-transforms-2/#individual-transforms
|
79
|
+
return ['transform', 'translate', 'scale', 'rotate', 'perspective'].some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
|
80
|
+
}
|
81
|
+
function getContainingBlock(element) {
|
82
|
+
let currentNode = getParentNode(element);
|
83
|
+
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
84
|
+
if (isContainingBlock(currentNode)) {
|
85
|
+
return currentNode;
|
86
|
+
} else if (isTopLayer(currentNode)) {
|
87
|
+
return null;
|
88
|
+
}
|
89
|
+
currentNode = getParentNode(currentNode);
|
90
|
+
}
|
91
|
+
return null;
|
92
|
+
}
|
93
|
+
function isWebKit() {
|
94
|
+
if (typeof CSS === 'undefined' || !CSS.supports) return false;
|
95
|
+
return CSS.supports('-webkit-backdrop-filter', 'none');
|
96
|
+
}
|
97
|
+
function isLastTraversableNode(node) {
|
98
|
+
return ['html', 'body', '#document'].includes(getNodeName(node));
|
99
|
+
}
|
100
|
+
function getComputedStyle(element) {
|
101
|
+
return getWindow(element).getComputedStyle(element);
|
102
|
+
}
|
103
|
+
function getNodeScroll(element) {
|
104
|
+
if (isElement(element)) {
|
105
|
+
return {
|
106
|
+
scrollLeft: element.scrollLeft,
|
107
|
+
scrollTop: element.scrollTop
|
108
|
+
};
|
109
|
+
}
|
110
|
+
return {
|
111
|
+
scrollLeft: element.scrollX,
|
112
|
+
scrollTop: element.scrollY
|
113
|
+
};
|
114
|
+
}
|
115
|
+
function getParentNode(node) {
|
116
|
+
if (getNodeName(node) === 'html') {
|
117
|
+
return node;
|
118
|
+
}
|
119
|
+
const result =
|
120
|
+
// Step into the shadow DOM of the parent of a slotted node.
|
121
|
+
node.assignedSlot ||
|
122
|
+
// DOM Element detected.
|
123
|
+
node.parentNode ||
|
124
|
+
// ShadowRoot detected.
|
125
|
+
isShadowRoot(node) && node.host ||
|
126
|
+
// Fallback.
|
127
|
+
getDocumentElement(node);
|
128
|
+
return isShadowRoot(result) ? result.host : result;
|
129
|
+
}
|
130
|
+
function getNearestOverflowAncestor(node) {
|
131
|
+
const parentNode = getParentNode(node);
|
132
|
+
if (isLastTraversableNode(parentNode)) {
|
133
|
+
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
134
|
+
}
|
135
|
+
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
136
|
+
return parentNode;
|
137
|
+
}
|
138
|
+
return getNearestOverflowAncestor(parentNode);
|
139
|
+
}
|
140
|
+
function getOverflowAncestors(node, list, traverseIframes) {
|
141
|
+
var _node$ownerDocument2;
|
142
|
+
if (list === void 0) {
|
143
|
+
list = [];
|
144
|
+
}
|
145
|
+
if (traverseIframes === void 0) {
|
146
|
+
traverseIframes = true;
|
147
|
+
}
|
148
|
+
const scrollableAncestor = getNearestOverflowAncestor(node);
|
149
|
+
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
150
|
+
const win = getWindow(scrollableAncestor);
|
151
|
+
if (isBody) {
|
152
|
+
const frameElement = getFrameElement(win);
|
153
|
+
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
154
|
+
}
|
155
|
+
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
156
|
+
}
|
157
|
+
function getFrameElement(win) {
|
158
|
+
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
159
|
+
}
|
160
|
+
|
161
|
+
export { getComputedStyle, getContainingBlock, getDocumentElement, getFrameElement, getNearestOverflowAncestor, getNodeName, getNodeScroll, getOverflowAncestors, getParentNode, getWindow, isContainingBlock, isElement, isHTMLElement, isLastTraversableNode, isNode, isOverflowElement, isShadowRoot, isTableElement, isTopLayer, isWebKit };
|
@@ -0,0 +1,142 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2020, 2025
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
|
8
|
+
/**
|
9
|
+
* Custom positioning reference element.
|
10
|
+
* @see https://floating-ui.com/docs/virtual-elements
|
11
|
+
*/
|
12
|
+
|
13
|
+
const min = Math.min;
|
14
|
+
const max = Math.max;
|
15
|
+
const round = Math.round;
|
16
|
+
const floor = Math.floor;
|
17
|
+
const createCoords = v => ({
|
18
|
+
x: v,
|
19
|
+
y: v
|
20
|
+
});
|
21
|
+
const oppositeSideMap = {
|
22
|
+
left: 'right',
|
23
|
+
right: 'left',
|
24
|
+
bottom: 'top',
|
25
|
+
top: 'bottom'
|
26
|
+
};
|
27
|
+
const oppositeAlignmentMap = {
|
28
|
+
start: 'end',
|
29
|
+
end: 'start'
|
30
|
+
};
|
31
|
+
function clamp(start, value, end) {
|
32
|
+
return max(start, min(value, end));
|
33
|
+
}
|
34
|
+
function evaluate(value, param) {
|
35
|
+
return typeof value === 'function' ? value(param) : value;
|
36
|
+
}
|
37
|
+
function getSide(placement) {
|
38
|
+
return placement.split('-')[0];
|
39
|
+
}
|
40
|
+
function getAlignment(placement) {
|
41
|
+
return placement.split('-')[1];
|
42
|
+
}
|
43
|
+
function getOppositeAxis(axis) {
|
44
|
+
return axis === 'x' ? 'y' : 'x';
|
45
|
+
}
|
46
|
+
function getAxisLength(axis) {
|
47
|
+
return axis === 'y' ? 'height' : 'width';
|
48
|
+
}
|
49
|
+
function getSideAxis(placement) {
|
50
|
+
return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
|
51
|
+
}
|
52
|
+
function getAlignmentAxis(placement) {
|
53
|
+
return getOppositeAxis(getSideAxis(placement));
|
54
|
+
}
|
55
|
+
function getAlignmentSides(placement, rects, rtl) {
|
56
|
+
if (rtl === void 0) {
|
57
|
+
rtl = false;
|
58
|
+
}
|
59
|
+
const alignment = getAlignment(placement);
|
60
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
61
|
+
const length = getAxisLength(alignmentAxis);
|
62
|
+
let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
63
|
+
if (rects.reference[length] > rects.floating[length]) {
|
64
|
+
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
65
|
+
}
|
66
|
+
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
67
|
+
}
|
68
|
+
function getExpandedPlacements(placement) {
|
69
|
+
const oppositePlacement = getOppositePlacement(placement);
|
70
|
+
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
71
|
+
}
|
72
|
+
function getOppositeAlignmentPlacement(placement) {
|
73
|
+
return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
|
74
|
+
}
|
75
|
+
function getSideList(side, isStart, rtl) {
|
76
|
+
const lr = ['left', 'right'];
|
77
|
+
const rl = ['right', 'left'];
|
78
|
+
const tb = ['top', 'bottom'];
|
79
|
+
const bt = ['bottom', 'top'];
|
80
|
+
switch (side) {
|
81
|
+
case 'top':
|
82
|
+
case 'bottom':
|
83
|
+
if (rtl) return isStart ? rl : lr;
|
84
|
+
return isStart ? lr : rl;
|
85
|
+
case 'left':
|
86
|
+
case 'right':
|
87
|
+
return isStart ? tb : bt;
|
88
|
+
default:
|
89
|
+
return [];
|
90
|
+
}
|
91
|
+
}
|
92
|
+
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
93
|
+
const alignment = getAlignment(placement);
|
94
|
+
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
95
|
+
if (alignment) {
|
96
|
+
list = list.map(side => side + "-" + alignment);
|
97
|
+
if (flipAlignment) {
|
98
|
+
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
99
|
+
}
|
100
|
+
}
|
101
|
+
return list;
|
102
|
+
}
|
103
|
+
function getOppositePlacement(placement) {
|
104
|
+
return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
|
105
|
+
}
|
106
|
+
function expandPaddingObject(padding) {
|
107
|
+
return {
|
108
|
+
top: 0,
|
109
|
+
right: 0,
|
110
|
+
bottom: 0,
|
111
|
+
left: 0,
|
112
|
+
...padding
|
113
|
+
};
|
114
|
+
}
|
115
|
+
function getPaddingObject(padding) {
|
116
|
+
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
117
|
+
top: padding,
|
118
|
+
right: padding,
|
119
|
+
bottom: padding,
|
120
|
+
left: padding
|
121
|
+
};
|
122
|
+
}
|
123
|
+
function rectToClientRect(rect) {
|
124
|
+
const {
|
125
|
+
x,
|
126
|
+
y,
|
127
|
+
width,
|
128
|
+
height
|
129
|
+
} = rect;
|
130
|
+
return {
|
131
|
+
width,
|
132
|
+
height,
|
133
|
+
top: y,
|
134
|
+
left: x,
|
135
|
+
right: x + width,
|
136
|
+
bottom: y + height,
|
137
|
+
x,
|
138
|
+
y
|
139
|
+
};
|
140
|
+
}
|
141
|
+
|
142
|
+
export { clamp, createCoords, evaluate, expandPaddingObject, floor, getAlignment, getAlignmentAxis, getAlignmentSides, getAxisLength, getExpandedPlacements, getOppositeAlignmentPlacement, getOppositeAxis, getOppositeAxisPlacements, getOppositePlacement, getPaddingObject, getSide, getSideAxis, max, min, rectToClientRect, round };
|
package/es/settings.d.ts
CHANGED
@@ -67,8 +67,9 @@ export const pkg: {
|
|
67
67
|
Nav: boolean;
|
68
68
|
NavItem: boolean;
|
69
69
|
NavList: boolean;
|
70
|
-
|
70
|
+
BigNumber: boolean;
|
71
71
|
TruncatedList: boolean;
|
72
|
+
TruncatedText: boolean;
|
72
73
|
DelimitedList: boolean;
|
73
74
|
ScrollGradient: boolean;
|
74
75
|
StringFormatter: boolean;
|
@@ -5,8 +5,8 @@
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
6
6
|
*/
|
7
7
|
import React, { ReactNode } from 'react';
|
8
|
-
import {
|
9
|
-
export interface
|
8
|
+
import { BigNumberSizeValues } from './constants';
|
9
|
+
export interface BigNumberProps {
|
10
10
|
className?: string;
|
11
11
|
forceShowTotal?: boolean;
|
12
12
|
fractionDigits?: number;
|
@@ -15,7 +15,7 @@ export interface BigNumbersProps {
|
|
15
15
|
label: string;
|
16
16
|
locale?: string;
|
17
17
|
percentage?: boolean;
|
18
|
-
size?:
|
18
|
+
size?: BigNumberSizeValues;
|
19
19
|
tooltipDescription?: string;
|
20
20
|
total?: number;
|
21
21
|
trending?: boolean;
|
@@ -23,7 +23,7 @@ export interface BigNumbersProps {
|
|
23
23
|
value?: number;
|
24
24
|
}
|
25
25
|
/**
|
26
|
-
*
|
26
|
+
* BigNumber is used to display large values in a small area. The display of
|
27
27
|
* values can be the value itself, or grouped in a `numerator/denominator` fashion.
|
28
28
|
* Control over the total fraction decimals displayed as well as how the
|
29
29
|
* values/totals are displayed are done via a locale prop. Other optional props
|
@@ -31,4 +31,4 @@ export interface BigNumbersProps {
|
|
31
31
|
* of a button as well as tool tip functionality.
|
32
32
|
* The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
|
33
33
|
*/
|
34
|
-
export declare let
|
34
|
+
export declare let BigNumber: React.ForwardRefExoticComponent<BigNumberProps & React.RefAttributes<HTMLDivElement>>;
|
@@ -16,18 +16,18 @@ var getSupportedLocale = require('../../global/js/utils/getSupportedLocale.js');
|
|
16
16
|
var settings = require('../../settings.js');
|
17
17
|
var icons = require('@carbon/react/icons');
|
18
18
|
var react = require('@carbon/react');
|
19
|
-
var
|
19
|
+
var BigNumberSkeleton = require('./BigNumberSkeleton.js');
|
20
20
|
var constants = require('./constants.js');
|
21
21
|
var TooltipTrigger = require('../TooltipTrigger/TooltipTrigger.js');
|
22
22
|
|
23
23
|
var _Information;
|
24
|
-
const blockClass = `${settings.pkg.prefix}--big-
|
25
|
-
const componentName = '
|
24
|
+
const blockClass = `${settings.pkg.prefix}--big-number`;
|
25
|
+
const componentName = 'BigNumber';
|
26
26
|
|
27
27
|
// NOTE: the component SCSS is not imported here: it is rolled up separately.
|
28
28
|
|
29
29
|
/**
|
30
|
-
*
|
30
|
+
* BigNumber is used to display large values in a small area. The display of
|
31
31
|
* values can be the value itself, or grouped in a `numerator/denominator` fashion.
|
32
32
|
* Control over the total fraction decimals displayed as well as how the
|
33
33
|
* values/totals are displayed are done via a locale prop. Other optional props
|
@@ -35,7 +35,7 @@ const componentName = 'BigNumbers';
|
|
35
35
|
* of a button as well as tool tip functionality.
|
36
36
|
* The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
|
37
37
|
*/
|
38
|
-
exports.
|
38
|
+
exports.BigNumber = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
39
39
|
let {
|
40
40
|
// The component props, in alphabetical order (for consistency).
|
41
41
|
className,
|
@@ -55,7 +55,7 @@ exports.BigNumbers = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
55
55
|
// Collect any other property values passed in.
|
56
56
|
...rest
|
57
57
|
} = _ref;
|
58
|
-
const
|
58
|
+
const bigNumberClasses = cx(className, {
|
59
59
|
[`${blockClass}--lg`]: size === 'lg',
|
60
60
|
[`${blockClass}--xl`]: size === 'xl'
|
61
61
|
});
|
@@ -64,14 +64,14 @@ exports.BigNumbers = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
64
64
|
const truncatedTotal = constants.formatValue(supportedLocale, total, fractionDigits, truncate) ?? 'Unknown';
|
65
65
|
const shouldDisplayDenominator = forceShowTotal || !percentage && total && value && total > value && truncatedValue !== truncatedTotal;
|
66
66
|
if (loading) {
|
67
|
-
return /*#__PURE__*/React.createElement(
|
67
|
+
return /*#__PURE__*/React.createElement(BigNumberSkeleton.BigNumberSkeleton, _rollupPluginBabelHelpers.extends({}, rest, {
|
68
68
|
ref: ref,
|
69
69
|
className: className,
|
70
70
|
size: size
|
71
71
|
}, devtools.getDevtoolsProps(componentName)));
|
72
72
|
}
|
73
73
|
return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
|
74
|
-
className: cx(blockClass,
|
74
|
+
className: cx(blockClass, bigNumberClasses, className),
|
75
75
|
ref: ref
|
76
76
|
}, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement("span", {
|
77
77
|
className: `${blockClass}__row`
|
@@ -105,16 +105,16 @@ exports.BigNumbers = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
105
105
|
});
|
106
106
|
|
107
107
|
// Return a placeholder if not released and not enabled by feature flag
|
108
|
-
exports.
|
108
|
+
exports.BigNumber = settings.pkg.checkComponentEnabled(exports.BigNumber, componentName);
|
109
109
|
|
110
110
|
// The display name of the component, used by React. Note that displayName
|
111
111
|
// is used in preference to relying on function.name.
|
112
|
-
exports.
|
112
|
+
exports.BigNumber.displayName = componentName;
|
113
113
|
|
114
114
|
// The types and DocGen commentary for the component props,
|
115
115
|
// in alphabetical order (for consistency).
|
116
116
|
// See https://www.npmjs.com/package/prop-types#usage.
|
117
|
-
exports.
|
117
|
+
exports.BigNumber.propTypes = {
|
118
118
|
/**
|
119
119
|
* Provide an optional class to be applied to the containing node.
|
120
120
|
*/
|
@@ -0,0 +1,17 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2025
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import React from 'react';
|
8
|
+
import { BigNumberProps } from './BigNumber';
|
9
|
+
/**
|
10
|
+
* SkeletonBigNumber is used to display a skeleton version while
|
11
|
+
* content is loading (handled by the BigNumber prop `loading').
|
12
|
+
*
|
13
|
+
* Note: This component is only used within BigNumber.
|
14
|
+
*/
|
15
|
+
type BigNumberSkeletonProps = Pick<BigNumberProps, 'className' | 'size'>;
|
16
|
+
export declare const BigNumberSkeleton: React.ForwardRefExoticComponent<BigNumberSkeletonProps & React.RefAttributes<HTMLDivElement>>;
|
17
|
+
export {};
|
@@ -17,30 +17,30 @@ var react = require('@carbon/react');
|
|
17
17
|
var constants = require('./constants.js');
|
18
18
|
|
19
19
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
20
|
-
const blockClass = `${settings.pkg.prefix}--big-
|
21
|
-
const componentName = '
|
20
|
+
const blockClass = `${settings.pkg.prefix}--big-number-skeleton`;
|
21
|
+
const componentName = 'BigNumberSkeleton';
|
22
22
|
|
23
23
|
/**
|
24
|
-
*
|
25
|
-
* content is loading (handled by the
|
24
|
+
* SkeletonBigNumber is used to display a skeleton version while
|
25
|
+
* content is loading (handled by the BigNumber prop `loading').
|
26
26
|
*
|
27
|
-
* Note: This component is only used within
|
27
|
+
* Note: This component is only used within BigNumber.
|
28
28
|
*/
|
29
29
|
|
30
|
-
// Use the same properties and values as parent
|
30
|
+
// Use the same properties and values as parent BigNumberProps
|
31
31
|
|
32
|
-
const
|
32
|
+
const BigNumberSkeleton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
33
33
|
let {
|
34
34
|
className,
|
35
35
|
size,
|
36
36
|
...rest
|
37
37
|
} = _ref;
|
38
|
-
const
|
39
|
-
[`${blockClass}--lg`]: size === constants.
|
40
|
-
[`${blockClass}--xl`]: size === constants.
|
38
|
+
const bigNumberSkeletonClasses = cx(className, blockClass, {
|
39
|
+
[`${blockClass}--lg`]: size === constants.BigNumberSize.Large,
|
40
|
+
[`${blockClass}--xl`]: size === constants.BigNumberSize.XLarge
|
41
41
|
});
|
42
42
|
return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
|
43
|
-
className:
|
43
|
+
className: bigNumberSkeletonClasses,
|
44
44
|
ref: ref
|
45
45
|
}, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(react.SkeletonText, {
|
46
46
|
className: `${blockClass}__label`
|
@@ -53,8 +53,8 @@ const BigNumbersSkeleton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
53
53
|
|
54
54
|
// The display name of the component, used by React. Note that displayName
|
55
55
|
// is used in preference to relying on function.name.
|
56
|
-
|
57
|
-
|
56
|
+
BigNumberSkeleton.displayName = componentName;
|
57
|
+
BigNumberSkeleton.propTypes = {
|
58
58
|
/**
|
59
59
|
* Provide an optional class to be applied to the containing node.
|
60
60
|
*/
|
@@ -62,7 +62,7 @@ BigNumbersSkeleton.propTypes = {
|
|
62
62
|
/**
|
63
63
|
*
|
64
64
|
*/
|
65
|
-
size: index.default.oneOf([constants.
|
65
|
+
size: index.default.oneOf([constants.BigNumberSize.Default, constants.BigNumberSize.Large, constants.BigNumberSize.XLarge])
|
66
66
|
};
|
67
67
|
|
68
|
-
exports.
|
68
|
+
exports.BigNumberSkeleton = BigNumberSkeleton;
|
@@ -4,16 +4,16 @@
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
6
6
|
*/
|
7
|
-
export declare enum
|
7
|
+
export declare enum BigNumberSize {
|
8
8
|
Default = "default",
|
9
9
|
Large = "lg",
|
10
10
|
XLarge = "xl"
|
11
11
|
}
|
12
|
-
export type
|
12
|
+
export type BigNumberSizeValues = `${BigNumberSize}`;
|
13
13
|
export declare enum Characters {
|
14
14
|
Dash = "\u2013",
|
15
15
|
Slash = "/"
|
16
16
|
}
|
17
17
|
export declare const DefaultLocale = "en-US";
|
18
18
|
export declare const formatValue: (locale: Intl.LocalesArgument, value: number | null | undefined, fractionDigits: number, truncate: boolean) => string | null | undefined;
|
19
|
-
export declare const getIconSize: (size:
|
19
|
+
export declare const getIconSize: (size: BigNumberSizeValues) => number;
|
@@ -7,11 +7,11 @@
|
|
7
7
|
|
8
8
|
'use strict';
|
9
9
|
|
10
|
-
let
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
return
|
10
|
+
let BigNumberSize = /*#__PURE__*/function (BigNumberSize) {
|
11
|
+
BigNumberSize["Default"] = "default";
|
12
|
+
BigNumberSize["Large"] = "lg";
|
13
|
+
BigNumberSize["XLarge"] = "xl";
|
14
|
+
return BigNumberSize;
|
15
15
|
}({});
|
16
16
|
|
17
17
|
// = 'default' | 'lg' | 'xl'
|
@@ -43,7 +43,7 @@ const getIconSize = size => {
|
|
43
43
|
}
|
44
44
|
};
|
45
45
|
|
46
|
-
exports.
|
46
|
+
exports.BigNumberSize = BigNumberSize;
|
47
47
|
exports.Characters = Characters;
|
48
48
|
exports.DefaultLocale = DefaultLocale;
|
49
49
|
exports.formatValue = formatValue;
|
@@ -14,7 +14,7 @@ var enums = require('./utils/enums.js');
|
|
14
14
|
var context = require('./utils/context.js');
|
15
15
|
var CoachmarkOverlay = require('./CoachmarkOverlay.js');
|
16
16
|
var index = require('../../_virtual/index.js');
|
17
|
-
var
|
17
|
+
var ReactDOM = require('react-dom');
|
18
18
|
var cx = require('classnames');
|
19
19
|
var devtools = require('../../global/js/utils/devtools.js');
|
20
20
|
var settings = require('../../settings.js');
|
@@ -181,7 +181,7 @@ exports.Coachmark = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
181
181
|
ref: _coachmarkRef
|
182
182
|
}, rest, devtools.getDevtoolsProps(componentName)), overlayKind !== 'tooltip' ? /*#__PURE__*/React.createElement(React.Fragment, null, targetName?.displayName === 'CoachmarkBeacon' ? /*#__PURE__*/React.cloneElement(target, {
|
183
183
|
buttonProps: contextValue.buttonProps
|
184
|
-
}) : target, isOpen && portalNode?.current && /*#__PURE__*/
|
184
|
+
}) : target, isOpen && portalNode?.current && /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React.createElement(CoachmarkOverlay.CoachmarkOverlay, {
|
185
185
|
ref: _overlayRef,
|
186
186
|
fixedIsVisible: false,
|
187
187
|
kind: overlayKind,
|