carbon-react 132.2.1 → 133.0.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.
Files changed (60) hide show
  1. package/README.md +1 -1
  2. package/esm/__internal__/input/input.component.d.ts +0 -2
  3. package/esm/__internal__/input/input.component.js +0 -8
  4. package/esm/components/button/button-types.style.d.ts +0 -1
  5. package/esm/components/button/button-types.style.js +0 -21
  6. package/esm/components/button/button.component.d.ts +1 -5
  7. package/esm/components/button/button.component.js +5 -377
  8. package/esm/components/button/button.config.js +1 -1
  9. package/esm/components/button/index.d.ts +1 -1
  10. package/esm/components/button/index.js +1 -1
  11. package/esm/components/checkbox/checkbox.component.d.ts +0 -2
  12. package/esm/components/checkbox/checkbox.component.js +1 -10
  13. package/esm/components/confirm/confirm.component.d.ts +4 -4
  14. package/esm/components/date/date.component.js +0 -9
  15. package/esm/components/decimal/decimal.component.js +1 -9
  16. package/esm/components/grouped-character/grouped-character.component.js +0 -8
  17. package/esm/components/icon/icon.component.d.ts +2 -1
  18. package/esm/components/icon/icon.component.js +7 -3
  19. package/esm/components/number/number.component.js +0 -8
  20. package/esm/components/radio-button/radio-button.component.d.ts +0 -2
  21. package/esm/components/radio-button/radio-button.component.js +1 -11
  22. package/esm/components/select/filterable-select/filterable-select.component.js +2 -10
  23. package/esm/components/select/list-action-button/list-action-button.component.js +1 -1
  24. package/esm/components/select/multi-select/multi-select.component.js +2 -10
  25. package/esm/components/select/select-textbox/select-textbox.component.js +0 -1
  26. package/esm/components/select/simple-select/simple-select.component.js +2 -10
  27. package/esm/components/switch/switch.component.d.ts +0 -2
  28. package/esm/components/switch/switch.component.js +2 -11
  29. package/esm/components/textarea/textarea.component.js +0 -8
  30. package/esm/components/textbox/textbox.component.js +0 -8
  31. package/lib/__internal__/input/input.component.d.ts +0 -2
  32. package/lib/__internal__/input/input.component.js +0 -8
  33. package/lib/components/button/button-types.style.d.ts +0 -1
  34. package/lib/components/button/button-types.style.js +0 -21
  35. package/lib/components/button/button.component.d.ts +1 -5
  36. package/lib/components/button/button.component.js +6 -377
  37. package/lib/components/button/button.config.js +1 -1
  38. package/lib/components/button/index.d.ts +1 -1
  39. package/lib/components/button/index.js +2 -9
  40. package/lib/components/checkbox/checkbox.component.d.ts +0 -2
  41. package/lib/components/checkbox/checkbox.component.js +1 -10
  42. package/lib/components/confirm/confirm.component.d.ts +4 -4
  43. package/lib/components/date/date.component.js +0 -9
  44. package/lib/components/decimal/decimal.component.js +1 -9
  45. package/lib/components/grouped-character/grouped-character.component.js +0 -8
  46. package/lib/components/icon/icon.component.d.ts +2 -1
  47. package/lib/components/icon/icon.component.js +7 -3
  48. package/lib/components/number/number.component.js +0 -8
  49. package/lib/components/radio-button/radio-button.component.d.ts +0 -2
  50. package/lib/components/radio-button/radio-button.component.js +1 -11
  51. package/lib/components/select/filterable-select/filterable-select.component.js +2 -10
  52. package/lib/components/select/list-action-button/list-action-button.component.js +1 -1
  53. package/lib/components/select/multi-select/multi-select.component.js +2 -10
  54. package/lib/components/select/select-textbox/select-textbox.component.js +0 -1
  55. package/lib/components/select/simple-select/simple-select.component.js +2 -10
  56. package/lib/components/switch/switch.component.d.ts +0 -2
  57. package/lib/components/switch/switch.component.js +2 -11
  58. package/lib/components/textarea/textarea.component.js +0 -8
  59. package/lib/components/textbox/textbox.component.js +0 -8
  60. package/package.json +1 -1
package/README.md CHANGED
@@ -1,4 +1,4 @@
1
- # Carbon [![npm](https://img.shields.io/npm/v/carbon-react.svg)](https://www.npmjs.com/package/carbon-react) [![Cypress](https://github.com/Sage/carbon/actions/workflows/cypress.yml/badge.svg)](https://github.com/Sage/carbon/actions/workflows/cypress.yml) [![Playwright](https://github.com/Sage/carbon/actions/workflows/playwright.yml/badge.svg)](https://github.com/Sage/carbon/actions/workflows/playwright.yml)
1
+ # Carbon [![npm](https://img.shields.io/npm/v/carbon-react.svg)](https://www.npmjs.com/package/carbon-react) [![Playwright](https://github.com/Sage/carbon/actions/workflows/playwright.yml/badge.svg)](https://github.com/Sage/carbon/actions/workflows/playwright.yml)
2
2
 
3
3
  Carbon is a [React](https://react.dev/) component library developed by Sage.
4
4
 
@@ -15,8 +15,6 @@ export interface CommonInputProps extends Omit<React.InputHTMLAttributes<HTMLInp
15
15
  id?: string;
16
16
  /** Specify a custom border radius for the input. Any valid border-radius design token, or an array of border-radius design tokens. */
17
17
  inputBorderRadius?: BorderRadiusType | BorderRadiusType[];
18
- /** A callback to retrieve the input reference */
19
- inputRef?: (input: React.RefObject<HTMLInputElement | HTMLTextAreaElement>) => void;
20
18
  /** Name of the input */
21
19
  name?: string;
22
20
  /** Specify a callback triggered on blur */
@@ -32,8 +32,6 @@ const Input = /*#__PURE__*/React.forwardRef(({
32
32
  disabled,
33
33
  readOnly,
34
34
  autoFocus,
35
- // TODO: remove inputRef prop from this component (and props interface) when it has been removed from all exposed input components
36
- inputRef,
37
35
  onClick,
38
36
  onChangeDeferred,
39
37
  onChange,
@@ -67,11 +65,6 @@ const Input = /*#__PURE__*/React.forwardRef(({
67
65
  element.setAttribute("enterkeyhint", enterKeyHint);
68
66
  }
69
67
  }, [autoFocus, ref, enterKeyHint]);
70
- useEffect(() => {
71
- if (inputRef) {
72
- inputRef(input);
73
- }
74
- }, [input, inputRef]);
75
68
  useEffect(() => {
76
69
  if (context.inputRef) {
77
70
  context.inputRef(input);
@@ -249,7 +242,6 @@ if (process.env.NODE_ENV !== "production") {
249
242
  "inlist": PropTypes.any,
250
243
  "inputBorderRadius": PropTypes.any,
251
244
  "inputMode": PropTypes.oneOf(["decimal", "email", "none", "numeric", "search", "tel", "text", "url"]),
252
- "inputRef": PropTypes.func,
253
245
  "is": PropTypes.string,
254
246
  "itemID": PropTypes.string,
255
247
  "itemProp": PropTypes.string,
@@ -2,7 +2,6 @@ declare const _default: (isDisabled?: boolean, destructive?: boolean) => {
2
2
  primary: string;
3
3
  secondary: string;
4
4
  tertiary: string;
5
- dashed: string;
6
5
  darkBackground: string;
7
6
  "gradient-grey": string;
8
7
  "gradient-white": string;
@@ -123,27 +123,6 @@ export default ((isDisabled, destructive) => ({
123
123
  ${disabledImageStyle}
124
124
  ` : ""}
125
125
  `,
126
- dashed: `
127
- background: transparent;
128
- border: 2px dashed var(--colorsActionMinor500);
129
- ${makeColors("var(--colorsActionMinor500)")};
130
- &:hover {
131
- background-color: var(--colorsActionMinor200);
132
- }
133
-
134
- ${destructive ? `
135
- border-color: var(--colorsSemanticNegative500);
136
- ` : ""}
137
-
138
- ${isDisabled ? `
139
- border-color: var(--colorsActionDisabled500);
140
- ${makeColors("var(--colorsActionMinorYin030)")};
141
- &:hover {
142
- background-color: transparent;
143
- }
144
- ${disabledImageStyle}
145
- ` : ""}
146
- `,
147
126
  darkBackground: `
148
127
  background: var(--colorsActionMajorYang100);
149
128
  border-color: transparent;
@@ -3,7 +3,7 @@ import { SpaceProps } from "styled-system";
3
3
  import { IconType } from "../icon";
4
4
  import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
5
5
  import { TooltipPositions } from "../tooltip/tooltip.config";
6
- export declare type ButtonTypes = "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" | "gradient-grey" | "gradient-white";
6
+ export declare type ButtonTypes = "primary" | "secondary" | "tertiary" | "darkBackground" | "gradient-grey" | "gradient-white";
7
7
  export declare type SizeOptions = "small" | "medium" | "large";
8
8
  export declare type ButtonIconPosition = "before" | "after";
9
9
  export interface ButtonProps extends SpaceProps, TagProps {
@@ -26,8 +26,6 @@ export interface ButtonProps extends SpaceProps, TagProps {
26
26
  disabled?: boolean;
27
27
  /** Apply destructive style to the button */
28
28
  destructive?: boolean;
29
- /** Ref to be forwarded */
30
- forwardRef?: React.RefCallback<HTMLButtonElement> | React.MutableRefObject<HTMLButtonElement | null> | null;
31
29
  /** Apply fullWidth style to the button */
32
30
  fullWidth?: boolean;
33
31
  /** Used to transform button into anchor */
@@ -66,6 +64,4 @@ export interface ButtonProps extends SpaceProps, TagProps {
66
64
  rel?: string;
67
65
  }
68
66
  declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
69
- declare const ButtonWithForwardRef: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
70
- export { ButtonWithForwardRef };
71
67
  export default Button;
@@ -6,7 +6,6 @@ import Icon from "../icon";
6
6
  import StyledButton, { StyledButtonSubtext, StyledButtonMainText } from "./button.style";
7
7
  import tagComponent from "../../__internal__/utils/helpers/tags/tags";
8
8
  import { TooltipProvider } from "../../__internal__/tooltip-provider";
9
- import Logger from "../../__internal__/utils/logger";
10
9
  import { ButtonBarContext } from "../button-bar/button-bar.component";
11
10
  import SplitButtonContext from "../split-button/__internal__/split-button.context";
12
11
  function renderChildren({
@@ -57,8 +56,6 @@ function renderChildren({
57
56
  type: iconType
58
57
  }, iconProps)));
59
58
  }
60
- let deprecatedForwardRefWarnTriggered = false;
61
- let deprecatedDashedButtonWarnTriggered = false;
62
59
  const Button = /*#__PURE__*/React.forwardRef(({
63
60
  "aria-describedby": ariaDescribedBy,
64
61
  "aria-label": ariaLabel,
@@ -67,7 +64,6 @@ const Button = /*#__PURE__*/React.forwardRef(({
67
64
  children,
68
65
  destructive = false,
69
66
  disabled = false,
70
- forwardRef,
71
67
  fullWidth: fullWidthProp = false,
72
68
  href,
73
69
  iconPosition: iconPositionProp = "before",
@@ -98,14 +94,6 @@ const Button = /*#__PURE__*/React.forwardRef(({
98
94
  if (subtext) {
99
95
  !(size === "large") ? process.env.NODE_ENV !== "production" ? invariant(false, "subtext prop has no effect unless the button is large.") : invariant(false) : void 0;
100
96
  }
101
- if (!deprecatedForwardRefWarnTriggered && forwardRef) {
102
- deprecatedForwardRefWarnTriggered = true;
103
- Logger.deprecate("The `forwardRef` prop in `Button` component is deprecated and will soon be removed. Please use `ref` instead.");
104
- }
105
- if (!deprecatedDashedButtonWarnTriggered && buttonType === "dashed") {
106
- deprecatedDashedButtonWarnTriggered = true;
107
- Logger.deprecate("The `dashed` variant of the `buttonType` prop for `Button` component is deprecated and will soon be removed.");
108
- }
109
97
  const [internalRef, setInternalRef] = useState();
110
98
  const {
111
99
  inSplitButton,
@@ -131,11 +119,10 @@ const Button = /*#__PURE__*/React.forwardRef(({
131
119
  }
132
120
  const setRefs = useCallback(reference => {
133
121
  setInternalRef(reference);
134
- const activeRef = ref || forwardRef;
135
- if (!activeRef) return;
136
- if (typeof activeRef === "object") activeRef.current = reference;
137
- if (typeof activeRef === "function") activeRef(reference);
138
- }, [ref, forwardRef]);
122
+ if (!ref) return;
123
+ if (typeof ref === "object") ref.current = reference;
124
+ if (typeof ref === "function") ref(reference);
125
+ }, [ref]);
139
126
  const isValidChildren = children !== undefined && children !== false;
140
127
  return /*#__PURE__*/React.createElement(StyledButton, _extends({
141
128
  "aria-label": !isValidChildren && iconType ? ariaLabel || iconType : ariaLabel,
@@ -181,370 +168,13 @@ if (process.env.NODE_ENV !== "production") {
181
168
  "aria-describedby": PropTypes.string,
182
169
  "aria-label": PropTypes.string,
183
170
  "aria-labelledby": PropTypes.string,
184
- "buttonType": PropTypes.oneOf(["darkBackground", "dashed", "gradient-grey", "gradient-white", "primary", "secondary", "tertiary"]),
185
- "children": PropTypes.node,
186
- "data-component": PropTypes.string,
187
- "data-element": PropTypes.string,
188
- "data-role": PropTypes.string,
189
- "destructive": PropTypes.bool,
190
- "disabled": PropTypes.bool,
191
- "forwardRef": PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
192
- "current": PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.object]).isRequired
193
- })]),
194
- "fullWidth": PropTypes.bool,
195
- "href": PropTypes.string,
196
- "iconPosition": PropTypes.oneOf(["after", "before"]),
197
- "iconTooltipMessage": PropTypes.string,
198
- "iconTooltipPosition": PropTypes.oneOf(["bottom", "left", "right", "top"]),
199
- "iconType": PropTypes.oneOf(["accessibility_web", "add", "admin", "alert_on", "alert", "analysis", "app_facebook", "app_instagram", "app_tiktok", "app_twitter", "app_youtube", "apps", "arrow_bottom_right_circle", "arrow_down", "arrow_left_boxed", "arrow_left_right_small", "arrow_left_small", "arrow_left", "arrow_right_small", "arrow_right", "arrow_top_left_circle", "arrow_up", "arrow", "arrows_left_right", "attach", "bank_with_card", "bank", "basket_with_squares", "basket", "bed", "bill_paid", "bill_unpaid", "bin", "block_arrow_right", "blocked_square", "blocked", "bold", "box_arrow_left", "box_arrow_right", "boxed_shapes", "bulk_destroy", "bullet_list_dotted", "bullet_list_numbers", "bullet_list", "business", "calendar_pay_date", "calendar_today", "calendar", "call", "camera", "car_lock", "car_money", "car_repair", "card_view", "card_wallet", "caret_down", "caret_large_down", "caret_large_left", "caret_large_right", "caret_large_up", "caret_left", "caret_right", "caret_up", "cart", "cash", "chart_bar", "chart_line", "chart_pie", "chat_notes", "chat", "check_all", "check_none", "chevron_down_thick", "chevron_down", "chevron_left_thick", "chevron_left", "chevron_right_thick", "chevron_right", "chevron_up_thick", "chevron_up", "circle_with_dots", "circles_connection", "clock", "close", "cloud_co2", "coins", "collaborate", "computer_clock", "connect_off", "connect", "construction", "contact_card", "contacts", "copy", "create", "credit_card_slash", "credit_card", "cross_circle", "cross", "csv", "dashboard", "delete", "delivery", "disconnect", "disputed", "document_right_align", "document_tick", "document_vertical_lines", "download", "draft", "drag_vertical", "drag", "drill", "dropdown", "duplicate", "edit", "edited", "ellipsis_horizontal", "ellipsis_vertical", "email_switch", "email", "entry", "envelope_dollar", "envelope_euro", "error_square", "error", "euro", "expand", "factory", "favourite_lined", "favourite", "fax", "feedback", "file_excel", "file_generic", "file_image", "file_pdf", "file_word", "files_leaning", "filter_new", "filter", "fit_height", "fit_width", "flag", "folder", "form_refresh", "gift", "go", "graduation_hat", "graph", "grid", "hand_cash_coins", "hand_cash_note", "heart_pulse", "help", "hide", "home", "image", "in_progress", "in_transit", "individual", "info", "intranet", "italic", "job_seeked", "key", "laptop", "leaf", "ledger_arrow_left", "ledger_arrow_right", "ledger", "lightbulb_off", "lightbulb_on", "like_no", "like", "link_cloud", "link_on", "link", "list_view", "location", "locked", "logout", "lookup", "marker", "message", "microphone", "minimise", "minus_large", "minus", "mobile", "money_bag", "none", "old_warning", "palm_tree", "pause_circle", "pause", "pdf", "people_switch", "people", "percentage_boxed", "person_info", "person_tick", "person", "petrol_pump", "phone", "piggy_bank", "pin", "plane", "play_circle", "play", "plus_large", "plus", "pound", "print", "progress", "progressed", "protect", "question_hollow", "question_mark", "question", "recruiting", "refresh_clock", "refresh", "remove", "sage_coin", "save", "scan", "search", "send", "services", "settings_old", "settings", "share", "shop", "sort_down", "sort_up", "spanner", "split_container", "split", "square_dot", "squares_nine", "stacked_boxes", "stacked_squares", "submitted", "support_online", "sync", "tag", "talk", "target_man", "target", "theatre_masks", "three_boxes", "tick_circle", "tick_thick", "tick", "true_tick", "u_turn_left", "u_turn_right", "undo", "unlocked", "upload", "uploaded", "video", "view", "volunteering", "warning", "website", "welfare"]),
200
- "id": PropTypes.string,
201
- "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
202
- "__@toStringTag": PropTypes.string.isRequired,
203
- "description": PropTypes.string,
204
- "toString": PropTypes.func.isRequired,
205
- "valueOf": PropTypes.func.isRequired
206
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
207
- "__@toStringTag": PropTypes.string.isRequired,
208
- "description": PropTypes.string,
209
- "toString": PropTypes.func.isRequired,
210
- "valueOf": PropTypes.func.isRequired
211
- }), PropTypes.string]),
212
- "margin": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
213
- "__@toStringTag": PropTypes.string.isRequired,
214
- "description": PropTypes.string,
215
- "toString": PropTypes.func.isRequired,
216
- "valueOf": PropTypes.func.isRequired
217
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
218
- "__@toStringTag": PropTypes.string.isRequired,
219
- "description": PropTypes.string,
220
- "toString": PropTypes.func.isRequired,
221
- "valueOf": PropTypes.func.isRequired
222
- }), PropTypes.string]),
223
- "marginBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
224
- "__@toStringTag": PropTypes.string.isRequired,
225
- "description": PropTypes.string,
226
- "toString": PropTypes.func.isRequired,
227
- "valueOf": PropTypes.func.isRequired
228
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
229
- "__@toStringTag": PropTypes.string.isRequired,
230
- "description": PropTypes.string,
231
- "toString": PropTypes.func.isRequired,
232
- "valueOf": PropTypes.func.isRequired
233
- }), PropTypes.string]),
234
- "marginLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
235
- "__@toStringTag": PropTypes.string.isRequired,
236
- "description": PropTypes.string,
237
- "toString": PropTypes.func.isRequired,
238
- "valueOf": PropTypes.func.isRequired
239
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
240
- "__@toStringTag": PropTypes.string.isRequired,
241
- "description": PropTypes.string,
242
- "toString": PropTypes.func.isRequired,
243
- "valueOf": PropTypes.func.isRequired
244
- }), PropTypes.string]),
245
- "marginRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
246
- "__@toStringTag": PropTypes.string.isRequired,
247
- "description": PropTypes.string,
248
- "toString": PropTypes.func.isRequired,
249
- "valueOf": PropTypes.func.isRequired
250
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
251
- "__@toStringTag": PropTypes.string.isRequired,
252
- "description": PropTypes.string,
253
- "toString": PropTypes.func.isRequired,
254
- "valueOf": PropTypes.func.isRequired
255
- }), PropTypes.string]),
256
- "marginTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
257
- "__@toStringTag": PropTypes.string.isRequired,
258
- "description": PropTypes.string,
259
- "toString": PropTypes.func.isRequired,
260
- "valueOf": PropTypes.func.isRequired
261
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
262
- "__@toStringTag": PropTypes.string.isRequired,
263
- "description": PropTypes.string,
264
- "toString": PropTypes.func.isRequired,
265
- "valueOf": PropTypes.func.isRequired
266
- }), PropTypes.string]),
267
- "marginX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
268
- "__@toStringTag": PropTypes.string.isRequired,
269
- "description": PropTypes.string,
270
- "toString": PropTypes.func.isRequired,
271
- "valueOf": PropTypes.func.isRequired
272
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
273
- "__@toStringTag": PropTypes.string.isRequired,
274
- "description": PropTypes.string,
275
- "toString": PropTypes.func.isRequired,
276
- "valueOf": PropTypes.func.isRequired
277
- }), PropTypes.string]),
278
- "marginY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
279
- "__@toStringTag": PropTypes.string.isRequired,
280
- "description": PropTypes.string,
281
- "toString": PropTypes.func.isRequired,
282
- "valueOf": PropTypes.func.isRequired
283
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
284
- "__@toStringTag": PropTypes.string.isRequired,
285
- "description": PropTypes.string,
286
- "toString": PropTypes.func.isRequired,
287
- "valueOf": PropTypes.func.isRequired
288
- }), PropTypes.string]),
289
- "mb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
290
- "__@toStringTag": PropTypes.string.isRequired,
291
- "description": PropTypes.string,
292
- "toString": PropTypes.func.isRequired,
293
- "valueOf": PropTypes.func.isRequired
294
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
295
- "__@toStringTag": PropTypes.string.isRequired,
296
- "description": PropTypes.string,
297
- "toString": PropTypes.func.isRequired,
298
- "valueOf": PropTypes.func.isRequired
299
- }), PropTypes.string]),
300
- "ml": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
301
- "__@toStringTag": PropTypes.string.isRequired,
302
- "description": PropTypes.string,
303
- "toString": PropTypes.func.isRequired,
304
- "valueOf": PropTypes.func.isRequired
305
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
306
- "__@toStringTag": PropTypes.string.isRequired,
307
- "description": PropTypes.string,
308
- "toString": PropTypes.func.isRequired,
309
- "valueOf": PropTypes.func.isRequired
310
- }), PropTypes.string]),
311
- "mr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
312
- "__@toStringTag": PropTypes.string.isRequired,
313
- "description": PropTypes.string,
314
- "toString": PropTypes.func.isRequired,
315
- "valueOf": PropTypes.func.isRequired
316
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
317
- "__@toStringTag": PropTypes.string.isRequired,
318
- "description": PropTypes.string,
319
- "toString": PropTypes.func.isRequired,
320
- "valueOf": PropTypes.func.isRequired
321
- }), PropTypes.string]),
322
- "mt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
323
- "__@toStringTag": PropTypes.string.isRequired,
324
- "description": PropTypes.string,
325
- "toString": PropTypes.func.isRequired,
326
- "valueOf": PropTypes.func.isRequired
327
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
328
- "__@toStringTag": PropTypes.string.isRequired,
329
- "description": PropTypes.string,
330
- "toString": PropTypes.func.isRequired,
331
- "valueOf": PropTypes.func.isRequired
332
- }), PropTypes.string]),
333
- "mx": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
334
- "__@toStringTag": PropTypes.string.isRequired,
335
- "description": PropTypes.string,
336
- "toString": PropTypes.func.isRequired,
337
- "valueOf": PropTypes.func.isRequired
338
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
339
- "__@toStringTag": PropTypes.string.isRequired,
340
- "description": PropTypes.string,
341
- "toString": PropTypes.func.isRequired,
342
- "valueOf": PropTypes.func.isRequired
343
- }), PropTypes.string]),
344
- "my": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
345
- "__@toStringTag": PropTypes.string.isRequired,
346
- "description": PropTypes.string,
347
- "toString": PropTypes.func.isRequired,
348
- "valueOf": PropTypes.func.isRequired
349
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
350
- "__@toStringTag": PropTypes.string.isRequired,
351
- "description": PropTypes.string,
352
- "toString": PropTypes.func.isRequired,
353
- "valueOf": PropTypes.func.isRequired
354
- }), PropTypes.string]),
355
- "name": PropTypes.string,
356
- "noWrap": PropTypes.bool,
357
- "onBlur": PropTypes.func,
358
- "onChange": PropTypes.func,
359
- "onClick": PropTypes.func,
360
- "onFocus": PropTypes.func,
361
- "onKeyDown": PropTypes.func,
362
- "p": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
363
- "__@toStringTag": PropTypes.string.isRequired,
364
- "description": PropTypes.string,
365
- "toString": PropTypes.func.isRequired,
366
- "valueOf": PropTypes.func.isRequired
367
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
368
- "__@toStringTag": PropTypes.string.isRequired,
369
- "description": PropTypes.string,
370
- "toString": PropTypes.func.isRequired,
371
- "valueOf": PropTypes.func.isRequired
372
- }), PropTypes.string]),
373
- "padding": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
374
- "__@toStringTag": PropTypes.string.isRequired,
375
- "description": PropTypes.string,
376
- "toString": PropTypes.func.isRequired,
377
- "valueOf": PropTypes.func.isRequired
378
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
379
- "__@toStringTag": PropTypes.string.isRequired,
380
- "description": PropTypes.string,
381
- "toString": PropTypes.func.isRequired,
382
- "valueOf": PropTypes.func.isRequired
383
- }), PropTypes.string]),
384
- "paddingBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
385
- "__@toStringTag": PropTypes.string.isRequired,
386
- "description": PropTypes.string,
387
- "toString": PropTypes.func.isRequired,
388
- "valueOf": PropTypes.func.isRequired
389
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
390
- "__@toStringTag": PropTypes.string.isRequired,
391
- "description": PropTypes.string,
392
- "toString": PropTypes.func.isRequired,
393
- "valueOf": PropTypes.func.isRequired
394
- }), PropTypes.string]),
395
- "paddingLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
396
- "__@toStringTag": PropTypes.string.isRequired,
397
- "description": PropTypes.string,
398
- "toString": PropTypes.func.isRequired,
399
- "valueOf": PropTypes.func.isRequired
400
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
401
- "__@toStringTag": PropTypes.string.isRequired,
402
- "description": PropTypes.string,
403
- "toString": PropTypes.func.isRequired,
404
- "valueOf": PropTypes.func.isRequired
405
- }), PropTypes.string]),
406
- "paddingRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
407
- "__@toStringTag": PropTypes.string.isRequired,
408
- "description": PropTypes.string,
409
- "toString": PropTypes.func.isRequired,
410
- "valueOf": PropTypes.func.isRequired
411
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
412
- "__@toStringTag": PropTypes.string.isRequired,
413
- "description": PropTypes.string,
414
- "toString": PropTypes.func.isRequired,
415
- "valueOf": PropTypes.func.isRequired
416
- }), PropTypes.string]),
417
- "paddingTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
418
- "__@toStringTag": PropTypes.string.isRequired,
419
- "description": PropTypes.string,
420
- "toString": PropTypes.func.isRequired,
421
- "valueOf": PropTypes.func.isRequired
422
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
423
- "__@toStringTag": PropTypes.string.isRequired,
424
- "description": PropTypes.string,
425
- "toString": PropTypes.func.isRequired,
426
- "valueOf": PropTypes.func.isRequired
427
- }), PropTypes.string]),
428
- "paddingX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
429
- "__@toStringTag": PropTypes.string.isRequired,
430
- "description": PropTypes.string,
431
- "toString": PropTypes.func.isRequired,
432
- "valueOf": PropTypes.func.isRequired
433
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
434
- "__@toStringTag": PropTypes.string.isRequired,
435
- "description": PropTypes.string,
436
- "toString": PropTypes.func.isRequired,
437
- "valueOf": PropTypes.func.isRequired
438
- }), PropTypes.string]),
439
- "paddingY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
440
- "__@toStringTag": PropTypes.string.isRequired,
441
- "description": PropTypes.string,
442
- "toString": PropTypes.func.isRequired,
443
- "valueOf": PropTypes.func.isRequired
444
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
445
- "__@toStringTag": PropTypes.string.isRequired,
446
- "description": PropTypes.string,
447
- "toString": PropTypes.func.isRequired,
448
- "valueOf": PropTypes.func.isRequired
449
- }), PropTypes.string]),
450
- "pb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
451
- "__@toStringTag": PropTypes.string.isRequired,
452
- "description": PropTypes.string,
453
- "toString": PropTypes.func.isRequired,
454
- "valueOf": PropTypes.func.isRequired
455
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
456
- "__@toStringTag": PropTypes.string.isRequired,
457
- "description": PropTypes.string,
458
- "toString": PropTypes.func.isRequired,
459
- "valueOf": PropTypes.func.isRequired
460
- }), PropTypes.string]),
461
- "pl": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
462
- "__@toStringTag": PropTypes.string.isRequired,
463
- "description": PropTypes.string,
464
- "toString": PropTypes.func.isRequired,
465
- "valueOf": PropTypes.func.isRequired
466
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
467
- "__@toStringTag": PropTypes.string.isRequired,
468
- "description": PropTypes.string,
469
- "toString": PropTypes.func.isRequired,
470
- "valueOf": PropTypes.func.isRequired
471
- }), PropTypes.string]),
472
- "pr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
473
- "__@toStringTag": PropTypes.string.isRequired,
474
- "description": PropTypes.string,
475
- "toString": PropTypes.func.isRequired,
476
- "valueOf": PropTypes.func.isRequired
477
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
478
- "__@toStringTag": PropTypes.string.isRequired,
479
- "description": PropTypes.string,
480
- "toString": PropTypes.func.isRequired,
481
- "valueOf": PropTypes.func.isRequired
482
- }), PropTypes.string]),
483
- "pt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
484
- "__@toStringTag": PropTypes.string.isRequired,
485
- "description": PropTypes.string,
486
- "toString": PropTypes.func.isRequired,
487
- "valueOf": PropTypes.func.isRequired
488
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
489
- "__@toStringTag": PropTypes.string.isRequired,
490
- "description": PropTypes.string,
491
- "toString": PropTypes.func.isRequired,
492
- "valueOf": PropTypes.func.isRequired
493
- }), PropTypes.string]),
494
- "px": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
495
- "__@toStringTag": PropTypes.string.isRequired,
496
- "description": PropTypes.string,
497
- "toString": PropTypes.func.isRequired,
498
- "valueOf": PropTypes.func.isRequired
499
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
500
- "__@toStringTag": PropTypes.string.isRequired,
501
- "description": PropTypes.string,
502
- "toString": PropTypes.func.isRequired,
503
- "valueOf": PropTypes.func.isRequired
504
- }), PropTypes.string]),
505
- "py": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
506
- "__@toStringTag": PropTypes.string.isRequired,
507
- "description": PropTypes.string,
508
- "toString": PropTypes.func.isRequired,
509
- "valueOf": PropTypes.func.isRequired
510
- }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
511
- "__@toStringTag": PropTypes.string.isRequired,
512
- "description": PropTypes.string,
513
- "toString": PropTypes.func.isRequired,
514
- "valueOf": PropTypes.func.isRequired
515
- }), PropTypes.string]),
516
- "rel": PropTypes.string,
517
- "size": PropTypes.oneOf(["large", "medium", "small"]),
518
- "subtext": PropTypes.string,
519
- "target": PropTypes.string,
520
- "type": PropTypes.string
521
- };
522
- }
523
- let deprecatedButtonForwardRefWarnTriggered = false;
524
- const ButtonWithForwardRef = /*#__PURE__*/React.forwardRef((props, ref) => {
525
- if (!deprecatedButtonForwardRefWarnTriggered) {
526
- deprecatedButtonForwardRefWarnTriggered = true;
527
- Logger.deprecate("The `ButtonWithForwardRef` component is deprecated and will soon be removed. Please use a basic `Button` component with `ref` instead.");
528
- }
529
- return /*#__PURE__*/React.createElement(Button, _extends({
530
- ref: ref
531
- }, props));
532
- });
533
- if (process.env.NODE_ENV !== "production") {
534
- ButtonWithForwardRef.propTypes = {
535
- "aria-describedby": PropTypes.string,
536
- "aria-label": PropTypes.string,
537
- "aria-labelledby": PropTypes.string,
538
- "buttonType": PropTypes.oneOf(["darkBackground", "dashed", "gradient-grey", "gradient-white", "primary", "secondary", "tertiary"]),
171
+ "buttonType": PropTypes.oneOf(["darkBackground", "gradient-grey", "gradient-white", "primary", "secondary", "tertiary"]),
539
172
  "children": PropTypes.node,
540
173
  "data-component": PropTypes.string,
541
174
  "data-element": PropTypes.string,
542
175
  "data-role": PropTypes.string,
543
176
  "destructive": PropTypes.bool,
544
177
  "disabled": PropTypes.bool,
545
- "forwardRef": PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
546
- "current": PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.object]).isRequired
547
- })]),
548
178
  "fullWidth": PropTypes.bool,
549
179
  "href": PropTypes.string,
550
180
  "iconPosition": PropTypes.oneOf(["after", "before"]),
@@ -874,7 +504,5 @@ if (process.env.NODE_ENV !== "production") {
874
504
  "type": PropTypes.string
875
505
  };
876
506
  }
877
- ButtonWithForwardRef.displayName = "Button";
878
507
  Button.displayName = "Button";
879
- export { ButtonWithForwardRef };
880
508
  export default Button;
@@ -1,3 +1,3 @@
1
- export const BUTTON_VARIANTS = ["primary", "secondary", "tertiary", "dashed", "darkBackground", "gradient-white", "gradient-grey"];
1
+ export const BUTTON_VARIANTS = ["primary", "secondary", "tertiary", "darkBackground", "gradient-white", "gradient-grey"];
2
2
  export const BUTTON_SIZES = ["small", "medium", "large"];
3
3
  export const BUTTON_ICON_POSITIONS = ["before", "after"];
@@ -1,2 +1,2 @@
1
- export { default, ButtonWithForwardRef } from "./button.component";
1
+ export { default } from "./button.component";
2
2
  export type { ButtonProps } from "./button.component";
@@ -1 +1 @@
1
- export { default, ButtonWithForwardRef } from "./button.component";
1
+ export { default } from "./button.component";
@@ -22,8 +22,6 @@ export interface CheckboxProps extends CommonCheckableInputProps, MarginProps {
22
22
  tooltipPosition?: "top" | "bottom" | "left" | "right";
23
23
  /** The value of the checkbox, passed on form submit */
24
24
  value?: string;
25
- /** A callback to retrieve the input reference (deprecated) */
26
- inputRef?: React.Ref<HTMLInputElement>;
27
25
  }
28
26
  export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
29
27
  export default Checkbox;
@@ -10,7 +10,6 @@ import { CheckboxGroupContext } from "./checkbox-group/checkbox-group.component"
10
10
  import Logger from "../../__internal__/utils/logger";
11
11
  import useFormSpacing from "../../hooks/__internal__/useFormSpacing";
12
12
  import { NewValidationContext } from "../carbon-provider/carbon-provider.component";
13
- let deprecateInputRefWarnTriggered = false;
14
13
  let deprecateUncontrolledWarnTriggered = false;
15
14
  const Checkbox = /*#__PURE__*/React.forwardRef(({
16
15
  "aria-labelledby": ariaLabelledBy,
@@ -45,7 +44,6 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
45
44
  "data-element": dataElement,
46
45
  "data-role": dataRole,
47
46
  helpAriaLabel,
48
- inputRef,
49
47
  ...rest
50
48
  }, ref) => {
51
49
  const {
@@ -59,10 +57,6 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
59
57
  warning: contextWarning,
60
58
  info: contextInfo
61
59
  } = checkboxGroupContext;
62
- if (!deprecateInputRefWarnTriggered && inputRef) {
63
- deprecateInputRefWarnTriggered = true;
64
- Logger.deprecate("The `inputRef` prop in `Checkbox` component is deprecated and will soon be removed. Please use `ref` instead.");
65
- }
66
60
  if (!deprecateUncontrolledWarnTriggered && !onChange) {
67
61
  deprecateUncontrolledWarnTriggered = true;
68
62
  Logger.deprecate("Uncontrolled behaviour in `Checkbox` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
@@ -91,7 +85,7 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
91
85
  disabled,
92
86
  inputWidth,
93
87
  labelWidth,
94
- ref: ref || inputRef,
88
+ ref,
95
89
  ...rest
96
90
  };
97
91
  const validationProps = {
@@ -222,9 +216,6 @@ if (process.env.NODE_ENV !== "production") {
222
216
  "info": PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
223
217
  "inlist": PropTypes.any,
224
218
  "inputMode": PropTypes.oneOf(["decimal", "email", "none", "numeric", "search", "tel", "text", "url"]),
225
- "inputRef": PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
226
- "current": PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.object]).isRequired
227
- })]),
228
219
  "inputWidth": PropTypes.number,
229
220
  "is": PropTypes.string,
230
221
  "isOptional": PropTypes.bool,
@@ -3,10 +3,10 @@ import { DialogProps } from "../dialog";
3
3
  import { IconType } from "../icon";
4
4
  import { TagProps } from "../../__internal__/utils/helpers/tags";
5
5
  export interface ConfirmProps extends Omit<DialogProps, "className" | "disableFocusTrap" | "bespokeFocusTrap" | "focusableSelectors" | "help" | "role" | "contentPadding" | "focusableContainers" | "ariaRole" | "timeout" | "enableBackgroundUI" | "disableClose"> {
6
- /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" */
7
- cancelButtonType?: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground";
8
- /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground" */
9
- confirmButtonType?: "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground";
6
+ /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
7
+ cancelButtonType?: "primary" | "secondary" | "tertiary" | "darkBackground";
8
+ /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
9
+ confirmButtonType?: "primary" | "secondary" | "tertiary" | "darkBackground";
10
10
  /** Customise the cancel button label */
11
11
  cancelLabel?: string;
12
12
  /** Customise the confirm button label */