@carbon/react 1.53.0-rc.0 → 1.53.1
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/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +1075 -1110
- package/es/components/AiSkeleton/AiSkeletonIcon.js +39 -0
- package/es/components/AiSkeleton/AiSkeletonPlaceholder.js +37 -0
- package/es/components/AiSkeleton/AiSkeletonText.js +51 -0
- package/es/components/Copy/Copy.d.ts +74 -0
- package/es/components/Copy/Copy.js +1 -1
- package/es/components/Copy/index.d.ts +9 -0
- package/es/components/CopyButton/CopyButton.d.ts +71 -0
- package/es/components/CopyButton/index.d.ts +9 -0
- package/es/components/OverflowMenu/OverflowMenu.js +13 -1
- package/es/components/Slug/index.js +1 -11
- package/es/index.d.ts +1 -0
- package/es/index.js +5 -2
- package/lib/components/AiSkeleton/AiSkeletonIcon.js +49 -0
- package/lib/components/AiSkeleton/AiSkeletonPlaceholder.js +47 -0
- package/lib/components/AiSkeleton/AiSkeletonText.js +61 -0
- package/lib/components/Copy/Copy.d.ts +74 -0
- package/lib/components/Copy/Copy.js +1 -1
- package/lib/components/Copy/index.d.ts +9 -0
- package/lib/components/CopyButton/CopyButton.d.ts +71 -0
- package/lib/components/CopyButton/index.d.ts +9 -0
- package/lib/components/OverflowMenu/OverflowMenu.js +13 -1
- package/lib/components/Slug/index.js +1 -11
- package/lib/index.d.ts +1 -0
- package/lib/index.js +10 -4
- package/package.json +8 -8
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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 PropTypes from 'prop-types';
|
|
8
|
+
import { MouseEventHandler } from 'react';
|
|
9
|
+
import { ButtonProps } from '../Button';
|
|
10
|
+
export interface CopyButtonProps extends ButtonProps<'button'> {
|
|
11
|
+
/**
|
|
12
|
+
* Specify how the trigger should align with the tooltip
|
|
13
|
+
*/
|
|
14
|
+
align?: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right';
|
|
15
|
+
/**
|
|
16
|
+
* Specify an optional className to be applied to the underlying `<button>`
|
|
17
|
+
*/
|
|
18
|
+
className?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Specify the string that is displayed when the button is clicked and the
|
|
21
|
+
* content is copied
|
|
22
|
+
*/
|
|
23
|
+
feedback?: string;
|
|
24
|
+
/**
|
|
25
|
+
* Specify the time it takes for the feedback message to timeout
|
|
26
|
+
*/
|
|
27
|
+
feedbackTimeout?: number;
|
|
28
|
+
/**
|
|
29
|
+
* Provide a description for the icon representing the copy action that can
|
|
30
|
+
* be read by screen readers
|
|
31
|
+
*/
|
|
32
|
+
iconDescription?: string;
|
|
33
|
+
/**
|
|
34
|
+
* Specify an optional `onClick` handler that is called when the underlying
|
|
35
|
+
* `<button>` is clicked
|
|
36
|
+
*/
|
|
37
|
+
onClick?: MouseEventHandler<HTMLButtonElement>;
|
|
38
|
+
}
|
|
39
|
+
declare function CopyButton({ align, feedback, feedbackTimeout, iconDescription, className, onClick, ...other }: CopyButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
40
|
+
declare namespace CopyButton {
|
|
41
|
+
var propTypes: {
|
|
42
|
+
/**
|
|
43
|
+
* Specify how the trigger should align with the tooltip
|
|
44
|
+
*/
|
|
45
|
+
align: PropTypes.Requireable<string>;
|
|
46
|
+
/**
|
|
47
|
+
* Specify an optional className to be applied to the underlying `<button>`
|
|
48
|
+
*/
|
|
49
|
+
className: PropTypes.Requireable<string>;
|
|
50
|
+
/**
|
|
51
|
+
* Specify the string that is displayed when the button is clicked and the
|
|
52
|
+
* content is copied
|
|
53
|
+
*/
|
|
54
|
+
feedback: PropTypes.Requireable<string>;
|
|
55
|
+
/**
|
|
56
|
+
* Specify the time it takes for the feedback message to timeout
|
|
57
|
+
*/
|
|
58
|
+
feedbackTimeout: PropTypes.Requireable<number>;
|
|
59
|
+
/**
|
|
60
|
+
* Provide a description for the icon representing the copy action that can
|
|
61
|
+
* be read by screen readers
|
|
62
|
+
*/
|
|
63
|
+
iconDescription: PropTypes.Requireable<string>;
|
|
64
|
+
/**
|
|
65
|
+
* Specify an optional `onClick` handler that is called when the underlying
|
|
66
|
+
* `<button>` is clicked
|
|
67
|
+
*/
|
|
68
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
export default CopyButton;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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 CopyButton from './CopyButton';
|
|
8
|
+
export default CopyButton;
|
|
9
|
+
export { CopyButton };
|
|
@@ -129,6 +129,9 @@ class OverflowMenu extends React.Component {
|
|
|
129
129
|
const {
|
|
130
130
|
onClick = noopFn.noopFn
|
|
131
131
|
} = this.props;
|
|
132
|
+
this.setState({
|
|
133
|
+
click: true
|
|
134
|
+
});
|
|
132
135
|
evt.stopPropagation();
|
|
133
136
|
if (!this._menuBody || !this._menuBody.contains(evt.target)) {
|
|
134
137
|
this.setState({
|
|
@@ -138,6 +141,15 @@ class OverflowMenu extends React.Component {
|
|
|
138
141
|
}
|
|
139
142
|
});
|
|
140
143
|
_rollupPluginBabelHelpers.defineProperty(this, "closeMenuAndFocus", () => {
|
|
144
|
+
let wasClicked = this.state.click;
|
|
145
|
+
let wasOpen = this.state.open;
|
|
146
|
+
this.closeMenu(() => {
|
|
147
|
+
if (wasOpen && !wasClicked) {
|
|
148
|
+
this.focusMenuEl();
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
});
|
|
152
|
+
_rollupPluginBabelHelpers.defineProperty(this, "closeMenuOnEscape", () => {
|
|
141
153
|
let wasOpen = this.state.open;
|
|
142
154
|
this.closeMenu(() => {
|
|
143
155
|
if (wasOpen) {
|
|
@@ -152,7 +164,7 @@ class OverflowMenu extends React.Component {
|
|
|
152
164
|
|
|
153
165
|
// Close the overflow menu on escape
|
|
154
166
|
if (match.matches(evt, [keys.Escape])) {
|
|
155
|
-
this.
|
|
167
|
+
this.closeMenuOnEscape();
|
|
156
168
|
|
|
157
169
|
// Stop the esc keypress from bubbling out and closing something it shouldn't
|
|
158
170
|
evt.stopPropagation();
|
|
@@ -86,7 +86,6 @@ const Slug = /*#__PURE__*/React__default["default"].forwardRef(function Slug(_re
|
|
|
86
86
|
autoAlign = true,
|
|
87
87
|
children,
|
|
88
88
|
className,
|
|
89
|
-
dotType,
|
|
90
89
|
kind = 'default',
|
|
91
90
|
onRevertClick,
|
|
92
91
|
revertActive,
|
|
@@ -99,11 +98,6 @@ const Slug = /*#__PURE__*/React__default["default"].forwardRef(function Slug(_re
|
|
|
99
98
|
const id = useId.useId('slug');
|
|
100
99
|
const slugClasses = cx__default["default"](className, {
|
|
101
100
|
[`${prefix}--slug`]: true,
|
|
102
|
-
[`${prefix}--slug--hollow`]: kind === 'hollow' || dotType === 'hollow',
|
|
103
|
-
// Need to come up with a better name; explainable?
|
|
104
|
-
// Need to be able to target the non-hollow variant another way
|
|
105
|
-
// other than using `:not` all over the styles
|
|
106
|
-
[`${prefix}--slug--enabled`]: kind !== 'hollow' && dotType !== 'hollow',
|
|
107
101
|
[`${prefix}--slug--revert`]: revertActive
|
|
108
102
|
});
|
|
109
103
|
const slugButtonClasses = cx__default["default"]({
|
|
@@ -165,14 +159,10 @@ Slug.propTypes = {
|
|
|
165
159
|
* Specify an optional className to be added to the AI slug
|
|
166
160
|
*/
|
|
167
161
|
className: PropTypes__default["default"].string,
|
|
168
|
-
/**
|
|
169
|
-
* Specify the type of dot that should be rendered in front of the inline variant
|
|
170
|
-
*/
|
|
171
|
-
dotType: PropTypes__default["default"].oneOf(['default', 'hollow']),
|
|
172
162
|
/**
|
|
173
163
|
* Specify the type of Slug, from the following list of types:
|
|
174
164
|
*/
|
|
175
|
-
kind: PropTypes__default["default"].oneOf(['default', '
|
|
165
|
+
kind: PropTypes__default["default"].oneOf(['default', 'inline']),
|
|
176
166
|
/**
|
|
177
167
|
* Callback function that fires when the revert button is clicked
|
|
178
168
|
*/
|
package/lib/index.d.ts
CHANGED
|
@@ -116,6 +116,7 @@ export * from './components/Popover';
|
|
|
116
116
|
export * from './components/ProgressBar';
|
|
117
117
|
export { Slug as unstable__Slug, SlugContent as unstable__SlugContent, SlugActions as unstable__SlugActions, } from './components/Slug';
|
|
118
118
|
export { ChatButton as unstable__ChatButton, ChatButtonSkeleton as unstable__ChatButtonSkeleton, } from './components/ChatButton';
|
|
119
|
+
export { AiSkeletonText as unstable__AiSkeletonText, AiSkeletonIcon as unstable__AiSkeletonIcon, AiSkeletonPlaceholder as unstable__AiSkeletonPlaceholder, } from './components/AiSkeleton';
|
|
119
120
|
export * from './components/Stack';
|
|
120
121
|
export * from './components/Tooltip';
|
|
121
122
|
export { Text as unstable_Text, TextDirection as unstable_TextDirection, } from './components/Text';
|
package/lib/index.js
CHANGED
|
@@ -29,6 +29,8 @@ var ComposedModal = require('./components/ComposedModal/ComposedModal.js');
|
|
|
29
29
|
var ModalHeader = require('./components/ComposedModal/ModalHeader.js');
|
|
30
30
|
var ModalFooter = require('./components/ComposedModal/ModalFooter.js');
|
|
31
31
|
var index$6 = require('./components/ContentSwitcher/index.js');
|
|
32
|
+
var Copy = require('./components/Copy/Copy.js');
|
|
33
|
+
var CopyButton = require('./components/CopyButton/CopyButton.js');
|
|
32
34
|
var DangerButton = require('./components/DangerButton/DangerButton.js');
|
|
33
35
|
require('./components/DataTable/index.js');
|
|
34
36
|
var DataTableSkeleton = require('./components/DataTableSkeleton/DataTableSkeleton.js');
|
|
@@ -153,6 +155,9 @@ var index$2 = require('./components/OverflowMenuV2/index.js');
|
|
|
153
155
|
var index$g = require('./components/Popover/index.js');
|
|
154
156
|
var ProgressBar = require('./components/ProgressBar/ProgressBar.js');
|
|
155
157
|
var index$3 = require('./components/Slug/index.js');
|
|
158
|
+
var AiSkeletonPlaceholder = require('./components/AiSkeleton/AiSkeletonPlaceholder.js');
|
|
159
|
+
var AiSkeletonIcon = require('./components/AiSkeleton/AiSkeletonIcon.js');
|
|
160
|
+
var AiSkeletonText = require('./components/AiSkeleton/AiSkeletonText.js');
|
|
156
161
|
var index$h = require('./components/Stack/index.js');
|
|
157
162
|
var DefinitionTooltip = require('./components/Tooltip/DefinitionTooltip.js');
|
|
158
163
|
var Tooltip = require('./components/Tooltip/Tooltip.js');
|
|
@@ -173,8 +178,6 @@ var CodeSnippet = require('./components/CodeSnippet/CodeSnippet.js');
|
|
|
173
178
|
var ContainedListItem = require('./components/ContainedList/ContainedListItem/ContainedListItem.js');
|
|
174
179
|
var ContainedList = require('./components/ContainedList/ContainedList.js');
|
|
175
180
|
var useContextMenu = require('./components/ContextMenu/useContextMenu.js');
|
|
176
|
-
var Copy = require('./components/Copy/Copy.js');
|
|
177
|
-
var CopyButton = require('./components/CopyButton/CopyButton.js');
|
|
178
181
|
var Slider_Skeleton = require('./components/Slider/Slider.Skeleton.js');
|
|
179
182
|
var TextInput_Skeleton = require('./components/TextInput/TextInput.Skeleton.js');
|
|
180
183
|
var TextInput = require('./components/TextInput/TextInput.js');
|
|
@@ -255,6 +258,8 @@ exports.ModalBody = ComposedModal.ModalBody;
|
|
|
255
258
|
exports.ModalHeader = ModalHeader.ModalHeader;
|
|
256
259
|
exports.ModalFooter = ModalFooter.ModalFooter;
|
|
257
260
|
exports.ContentSwitcher = index$6["default"];
|
|
261
|
+
exports.Copy = Copy["default"];
|
|
262
|
+
exports.CopyButton = CopyButton["default"];
|
|
258
263
|
exports.DangerButton = DangerButton["default"];
|
|
259
264
|
exports.DataTableSkeleton = DataTableSkeleton["default"];
|
|
260
265
|
exports.DatePicker = DatePicker["default"];
|
|
@@ -414,6 +419,9 @@ exports.ProgressBar = ProgressBar["default"];
|
|
|
414
419
|
exports.unstable__Slug = index$3.Slug;
|
|
415
420
|
exports.unstable__SlugActions = index$3.SlugActions;
|
|
416
421
|
exports.unstable__SlugContent = index$3.SlugContent;
|
|
422
|
+
exports.unstable__AiSkeletonPlaceholder = AiSkeletonPlaceholder["default"];
|
|
423
|
+
exports.unstable__AiSkeletonIcon = AiSkeletonIcon["default"];
|
|
424
|
+
exports.unstable__AiSkeletonText = AiSkeletonText["default"];
|
|
417
425
|
exports.HStack = index$h.HStack;
|
|
418
426
|
exports.VStack = index$h.VStack;
|
|
419
427
|
exports.DefinitionTooltip = DefinitionTooltip.DefinitionTooltip;
|
|
@@ -438,8 +446,6 @@ exports.CodeSnippet = CodeSnippet["default"];
|
|
|
438
446
|
exports.ContainedListItem = ContainedListItem["default"];
|
|
439
447
|
exports.ContainedList = ContainedList["default"];
|
|
440
448
|
exports.useContextMenu = useContextMenu["default"];
|
|
441
|
-
exports.Copy = Copy["default"];
|
|
442
|
-
exports.CopyButton = CopyButton["default"];
|
|
443
449
|
exports.SliderSkeleton = Slider_Skeleton["default"];
|
|
444
450
|
exports.TextInputSkeleton = TextInput_Skeleton["default"];
|
|
445
451
|
exports.TextInput = TextInput["default"];
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@carbon/react",
|
|
3
3
|
"description": "React components for the Carbon Design System",
|
|
4
|
-
"version": "1.53.
|
|
4
|
+
"version": "1.53.1",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "lib/index.js",
|
|
7
7
|
"module": "es/index.js",
|
|
@@ -48,14 +48,14 @@
|
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
50
|
"@babel/runtime": "^7.18.3",
|
|
51
|
-
"@carbon/feature-flags": "^0.18.0
|
|
52
|
-
"@carbon/icons-react": "^11.38.0
|
|
53
|
-
"@carbon/layout": "^11.21.0
|
|
54
|
-
"@carbon/styles": "^1.53.
|
|
51
|
+
"@carbon/feature-flags": "^0.18.0",
|
|
52
|
+
"@carbon/icons-react": "^11.38.0",
|
|
53
|
+
"@carbon/layout": "^11.21.0",
|
|
54
|
+
"@carbon/styles": "^1.53.1",
|
|
55
55
|
"@ibm/telemetry-js": "^1.2.1",
|
|
56
56
|
"classnames": "2.5.1",
|
|
57
57
|
"copy-to-clipboard": "^3.3.1",
|
|
58
|
-
"downshift": "8.
|
|
58
|
+
"downshift": "8.4.0",
|
|
59
59
|
"flatpickr": "4.6.13",
|
|
60
60
|
"invariant": "^2.2.3",
|
|
61
61
|
"lodash.debounce": "^4.0.8",
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"@babel/preset-react": "^7.22.3",
|
|
80
80
|
"@babel/preset-typescript": "^7.21.5",
|
|
81
81
|
"@carbon/test-utils": "^10.30.0",
|
|
82
|
-
"@carbon/themes": "^11.33.
|
|
82
|
+
"@carbon/themes": "^11.33.1",
|
|
83
83
|
"@rollup/plugin-babel": "^6.0.0",
|
|
84
84
|
"@rollup/plugin-commonjs": "^25.0.0",
|
|
85
85
|
"@rollup/plugin-node-resolve": "^15.0.0",
|
|
@@ -139,5 +139,5 @@
|
|
|
139
139
|
"**/*.scss",
|
|
140
140
|
"**/*.css"
|
|
141
141
|
],
|
|
142
|
-
"gitHead": "
|
|
142
|
+
"gitHead": "56291fbf93e5fe5a8b75cdc162131784cdc57947"
|
|
143
143
|
}
|