carbon-react 110.10.1 → 110.10.3

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.
@@ -3,7 +3,7 @@ import { PaddingProps } from "styled-system";
3
3
  export interface RenderOpenProps {
4
4
  tabIndex: number;
5
5
  isOpen?: boolean;
6
- "data-element": string;
6
+ "data-element"?: string;
7
7
  onClick: (ev: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => void;
8
8
  ref: React.RefObject<HTMLButtonElement>;
9
9
  "aria-label"?: string;
@@ -11,13 +11,15 @@ export interface RenderOpenProps {
11
11
  "aria-expanded": boolean;
12
12
  "aria-haspopup": "dialog";
13
13
  }
14
+ export declare const renderOpen: ({ tabIndex, onClick, "data-element": dataElement, ref, "aria-label": ariaLabel, id, "aria-expanded": ariaExpanded, "aria-haspopup": ariaHasPopup, }: RenderOpenProps) => JSX.Element;
14
15
  export interface RenderCloseProps {
15
- "data-element": string;
16
+ "data-element"?: string;
16
17
  tabIndex: number;
17
18
  onClick: (ev: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => void;
18
19
  ref: React.RefObject<HTMLButtonElement>;
19
20
  "aria-label": string;
20
21
  }
22
+ export declare const renderClose: ({ "data-element": dataElement, tabIndex, onClick, ref, "aria-label": ariaLabel, }: RenderCloseProps) => JSX.Element;
21
23
  export interface PopoverContainerProps extends PaddingProps {
22
24
  /** A function that will render the open component
23
25
  *
@@ -36,12 +36,13 @@ renderOpen.propTypes = {
36
36
  "aria-expanded": PropTypes.bool.isRequired,
37
37
  "aria-haspopup": PropTypes.oneOf(["dialog"]).isRequired,
38
38
  "aria-label": PropTypes.string,
39
- "data-element": PropTypes.string.isRequired,
39
+ "data-element": PropTypes.string,
40
40
  "id": PropTypes.string,
41
41
  "isOpen": PropTypes.bool,
42
42
  "onClick": PropTypes.func.isRequired,
43
43
  "tabIndex": PropTypes.number.isRequired
44
44
  };
45
+ export { renderOpen };
45
46
 
46
47
  const renderClose = ({
47
48
  "data-element": dataElement,
@@ -61,10 +62,11 @@ const renderClose = ({
61
62
 
62
63
  renderClose.propTypes = {
63
64
  "aria-label": PropTypes.string.isRequired,
64
- "data-element": PropTypes.string.isRequired,
65
+ "data-element": PropTypes.string,
65
66
  "onClick": PropTypes.func.isRequired,
66
67
  "tabIndex": PropTypes.number.isRequired
67
68
  };
69
+ export { renderClose };
68
70
 
69
71
  const offset = ({
70
72
  reference
@@ -99,6 +101,7 @@ const PopoverContainer = ({
99
101
  const [isOpenInternal, setIsOpenInternal] = useState(false);
100
102
  const closeButtonRef = useRef(null);
101
103
  const openButtonRef = useRef(null);
104
+ const popoverReference = useRef(null);
102
105
  const guid = useRef(createGuid());
103
106
  const popoverContentNodeRef = useRef(null);
104
107
  const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
@@ -153,7 +156,9 @@ const PopoverContainer = ({
153
156
  return /*#__PURE__*/React.createElement(PopoverContainerWrapperStyle, {
154
157
  "data-component": "popover-container",
155
158
  onMouseDown: handleClick
156
- }, renderOpenComponent(renderOpenComponentProps), /*#__PURE__*/React.createElement(Transition, {
159
+ }, /*#__PURE__*/React.createElement("div", {
160
+ ref: popoverReference
161
+ }, renderOpenComponent(renderOpenComponentProps)), /*#__PURE__*/React.createElement(Transition, {
157
162
  in: isOpen,
158
163
  timeout: {
159
164
  exit: 300
@@ -163,7 +168,7 @@ const PopoverContainer = ({
163
168
  unmountOnExit: true,
164
169
  nodeRef: popoverContentNodeRef
165
170
  }, state => isOpen && /*#__PURE__*/React.createElement(Popover, _extends({
166
- reference: openButtonRef,
171
+ reference: popoverReference,
167
172
  placement: position === "right" ? "bottom-start" : "bottom-end"
168
173
  }, shouldCoverButton && {
169
174
  modifiers: popperModifiers
@@ -34,7 +34,7 @@ export interface TabsProps extends MarginProps {
34
34
  * The `id` property should match the `tabId`s for the rendered Tabs.
35
35
  */
36
36
  validationStatusOverride?: {
37
- id?: {
37
+ [id?: string]: {
38
38
  error?: boolean;
39
39
  warning?: boolean;
40
40
  info?: boolean;
@@ -3,7 +3,7 @@ import { PaddingProps } from "styled-system";
3
3
  export interface RenderOpenProps {
4
4
  tabIndex: number;
5
5
  isOpen?: boolean;
6
- "data-element": string;
6
+ "data-element"?: string;
7
7
  onClick: (ev: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => void;
8
8
  ref: React.RefObject<HTMLButtonElement>;
9
9
  "aria-label"?: string;
@@ -11,13 +11,15 @@ export interface RenderOpenProps {
11
11
  "aria-expanded": boolean;
12
12
  "aria-haspopup": "dialog";
13
13
  }
14
+ export declare const renderOpen: ({ tabIndex, onClick, "data-element": dataElement, ref, "aria-label": ariaLabel, id, "aria-expanded": ariaExpanded, "aria-haspopup": ariaHasPopup, }: RenderOpenProps) => JSX.Element;
14
15
  export interface RenderCloseProps {
15
- "data-element": string;
16
+ "data-element"?: string;
16
17
  tabIndex: number;
17
18
  onClick: (ev: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => void;
18
19
  ref: React.RefObject<HTMLButtonElement>;
19
20
  "aria-label": string;
20
21
  }
22
+ export declare const renderClose: ({ "data-element": dataElement, tabIndex, onClick, ref, "aria-label": ariaLabel, }: RenderCloseProps) => JSX.Element;
21
23
  export interface PopoverContainerProps extends PaddingProps {
22
24
  /** A function that will render the open component
23
25
  *
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.default = exports.PopoverContainer = void 0;
6
+ exports.default = exports.PopoverContainer = exports.renderClose = exports.renderOpen = void 0;
7
7
 
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
 
@@ -53,11 +53,12 @@ const renderOpen = ({
53
53
  type: "settings"
54
54
  }));
55
55
 
56
+ exports.renderOpen = renderOpen;
56
57
  renderOpen.propTypes = {
57
58
  "aria-expanded": _propTypes.default.bool.isRequired,
58
59
  "aria-haspopup": _propTypes.default.oneOf(["dialog"]).isRequired,
59
60
  "aria-label": _propTypes.default.string,
60
- "data-element": _propTypes.default.string.isRequired,
61
+ "data-element": _propTypes.default.string,
61
62
  "id": _propTypes.default.string,
62
63
  "isOpen": _propTypes.default.bool,
63
64
  "onClick": _propTypes.default.func.isRequired,
@@ -80,9 +81,10 @@ const renderClose = ({
80
81
  type: "close"
81
82
  }));
82
83
 
84
+ exports.renderClose = renderClose;
83
85
  renderClose.propTypes = {
84
86
  "aria-label": _propTypes.default.string.isRequired,
85
- "data-element": _propTypes.default.string.isRequired,
87
+ "data-element": _propTypes.default.string,
86
88
  "onClick": _propTypes.default.func.isRequired,
87
89
  "tabIndex": _propTypes.default.number.isRequired
88
90
  };
@@ -120,6 +122,7 @@ const PopoverContainer = ({
120
122
  const [isOpenInternal, setIsOpenInternal] = (0, _react.useState)(false);
121
123
  const closeButtonRef = (0, _react.useRef)(null);
122
124
  const openButtonRef = (0, _react.useRef)(null);
125
+ const popoverReference = (0, _react.useRef)(null);
123
126
  const guid = (0, _react.useRef)((0, _guid.default)());
124
127
  const popoverContentNodeRef = (0, _react.useRef)(null);
125
128
  const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
@@ -174,7 +177,9 @@ const PopoverContainer = ({
174
177
  return /*#__PURE__*/_react.default.createElement(_popoverContainer.PopoverContainerWrapperStyle, {
175
178
  "data-component": "popover-container",
176
179
  onMouseDown: handleClick
177
- }, renderOpenComponent(renderOpenComponentProps), /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, {
180
+ }, /*#__PURE__*/_react.default.createElement("div", {
181
+ ref: popoverReference
182
+ }, renderOpenComponent(renderOpenComponentProps)), /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, {
178
183
  in: isOpen,
179
184
  timeout: {
180
185
  exit: 300
@@ -184,7 +189,7 @@ const PopoverContainer = ({
184
189
  unmountOnExit: true,
185
190
  nodeRef: popoverContentNodeRef
186
191
  }, state => isOpen && /*#__PURE__*/_react.default.createElement(_popover.default, _extends({
187
- reference: openButtonRef,
192
+ reference: popoverReference,
188
193
  placement: position === "right" ? "bottom-start" : "bottom-end"
189
194
  }, shouldCoverButton && {
190
195
  modifiers: popperModifiers
@@ -34,7 +34,7 @@ export interface TabsProps extends MarginProps {
34
34
  * The `id` property should match the `tabId`s for the rendered Tabs.
35
35
  */
36
36
  validationStatusOverride?: {
37
- id?: {
37
+ [id?: string]: {
38
38
  error?: boolean;
39
39
  warning?: boolean;
40
40
  info?: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "110.10.1",
3
+ "version": "110.10.3",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "files": [
6
6
  "lib",