carbon-react 113.0.3 → 114.1.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 (71) hide show
  1. package/esm/__internal__/utils/helpers/events/events.d.ts +5 -0
  2. package/esm/__internal__/utils/helpers/events/events.js +7 -0
  3. package/esm/__spec_helper__/mock-match-media.d.ts +4 -7
  4. package/esm/__spec_helper__/mock-match-media.js +4 -4
  5. package/esm/components/i18n-provider/i18n-provider.component.js +6 -0
  6. package/esm/components/pod/index.d.ts +2 -2
  7. package/esm/components/pod/pod.component.d.ts +47 -0
  8. package/esm/components/pod/pod.component.js +289 -258
  9. package/esm/components/pod/pod.config.d.ts +6 -0
  10. package/esm/components/pod/pod.config.js +2 -2
  11. package/esm/components/pod/pod.style.d.ts +44 -0
  12. package/esm/components/pod/pod.style.js +151 -103
  13. package/esm/components/progress-tracker/progress-tracker.component.js +30 -41
  14. package/esm/components/progress-tracker/progress-tracker.d.ts +3 -5
  15. package/esm/components/progress-tracker/progress-tracker.style.js +48 -86
  16. package/esm/components/show-edit-pod/show-edit-pod.style.js +1 -1
  17. package/esm/components/tile/index.d.ts +2 -1
  18. package/esm/components/tile/tile-footer/index.d.ts +2 -1
  19. package/esm/components/tile/tile-footer/tile-footer.component.d.ts +9 -0
  20. package/esm/components/tile/tile-footer/tile-footer.component.js +160 -8
  21. package/esm/components/tile/tile-footer/tile-footer.style.d.ts +5 -0
  22. package/esm/components/tile/tile.component.d.ts +29 -0
  23. package/esm/components/tile/tile.component.js +330 -44
  24. package/esm/components/tile/tile.config.d.ts +2 -0
  25. package/esm/components/tile/tile.style.d.ts +12 -0
  26. package/esm/components/tile/tile.style.js +13 -21
  27. package/esm/hooks/useMediaQuery/useMediaQuery.js +2 -2
  28. package/esm/locales/en-gb.js +6 -0
  29. package/esm/locales/locale.d.ts +6 -0
  30. package/esm/locales/pl-pl.js +6 -0
  31. package/lib/__internal__/utils/helpers/events/events.d.ts +5 -0
  32. package/lib/__internal__/utils/helpers/events/events.js +7 -0
  33. package/lib/__spec_helper__/mock-match-media.d.ts +4 -7
  34. package/lib/__spec_helper__/mock-match-media.js +4 -4
  35. package/lib/components/i18n-provider/i18n-provider.component.js +6 -0
  36. package/lib/components/pod/index.d.ts +2 -2
  37. package/lib/components/pod/pod.component.d.ts +47 -0
  38. package/lib/components/pod/pod.component.js +292 -259
  39. package/lib/components/pod/pod.config.d.ts +6 -0
  40. package/lib/components/pod/pod.config.js +4 -4
  41. package/lib/components/pod/pod.style.d.ts +44 -0
  42. package/lib/components/pod/pod.style.js +153 -106
  43. package/lib/components/progress-tracker/progress-tracker.component.js +30 -42
  44. package/lib/components/progress-tracker/progress-tracker.d.ts +3 -5
  45. package/lib/components/progress-tracker/progress-tracker.style.js +49 -86
  46. package/lib/components/show-edit-pod/show-edit-pod.style.js +4 -4
  47. package/lib/components/tile/index.d.ts +2 -1
  48. package/lib/components/tile/tile-footer/index.d.ts +2 -1
  49. package/lib/components/tile/tile-footer/tile-footer.component.d.ts +9 -0
  50. package/lib/components/tile/tile-footer/tile-footer.component.js +157 -11
  51. package/lib/components/tile/tile-footer/tile-footer.style.d.ts +5 -0
  52. package/lib/components/tile/tile.component.d.ts +29 -0
  53. package/lib/components/tile/tile.component.js +329 -46
  54. package/lib/components/tile/tile.config.d.ts +2 -0
  55. package/lib/components/tile/tile.style.d.ts +12 -0
  56. package/lib/components/tile/tile.style.js +13 -22
  57. package/lib/hooks/useMediaQuery/useMediaQuery.js +2 -2
  58. package/lib/locales/en-gb.js +6 -0
  59. package/lib/locales/locale.d.ts +6 -0
  60. package/lib/locales/pl-pl.js +6 -0
  61. package/package.json +6 -16
  62. package/esm/__internal__/utils/argTypes/specialCharacters.d.ts +0 -36
  63. package/esm/__internal__/utils/argTypes/specialCharacters.js +0 -36
  64. package/esm/components/pod/pod.d.ts +0 -55
  65. package/esm/components/tile/tile-footer/tile-footer.d.ts +0 -13
  66. package/esm/components/tile/tile.d.ts +0 -46
  67. package/lib/__internal__/utils/argTypes/specialCharacters.d.ts +0 -36
  68. package/lib/__internal__/utils/argTypes/specialCharacters.js +0 -46
  69. package/lib/components/pod/pod.d.ts +0 -55
  70. package/lib/components/tile/tile-footer/tile-footer.d.ts +0 -13
  71. package/lib/components/tile/tile.d.ts +0 -46
@@ -1,3 +1,4 @@
1
+ import React from "react";
1
2
  /**
2
3
  * JavaScript Events
3
4
  *
@@ -13,6 +14,10 @@ declare const Events: {
13
14
  * A method to determine if an event is of a particular type
14
15
  * */
15
16
  isEventType: (ev: React.SyntheticEvent | Event, type: string) => boolean;
17
+ /**
18
+ * Determines if event is a keyboard event
19
+ */
20
+ isKeyboardEvent: (ev: React.SyntheticEvent | Event) => ev is React.KeyboardEvent<Element> | KeyboardEvent;
16
21
  /**
17
22
  * Determines if a number key along the top of the keyboard or a number key on the
18
23
  * keypad is pressed
@@ -18,6 +18,13 @@ const Events = {
18
18
  return ev.type === type;
19
19
  },
20
20
 
21
+ /**
22
+ * Determines if event is a keyboard event
23
+ */
24
+ isKeyboardEvent: ev => {
25
+ return ["keydown", "keypress", "keyup"].includes(ev.type);
26
+ },
27
+
21
28
  /**
22
29
  * Determines if a number key along the top of the keyboard or a number key on the
23
30
  * keypad is pressed
@@ -1,8 +1,5 @@
1
- declare function setupMatchMediaMock(): void;
2
- declare function mockMatchMedia(
3
- matches?: boolean
4
- ): {
5
- removeListener: jest.Mock;
1
+ /// <reference types="jest" />
2
+ export declare const setupMatchMediaMock: () => void;
3
+ export declare const mockMatchMedia: (matches: boolean) => {
4
+ removeEventListener: jest.Mock<any, any>;
6
5
  };
7
-
8
- export { setupMatchMediaMock, mockMatchMedia };
@@ -1,6 +1,6 @@
1
1
  let mocked = false;
2
2
  let _matches = false;
3
- const removeListener = jest.fn();
3
+ const removeEventListener = jest.fn();
4
4
  export const setupMatchMediaMock = () => {
5
5
  if (!global.window) {
6
6
  return;
@@ -14,8 +14,8 @@ export const setupMatchMediaMock = () => {
14
14
  matches: _matches,
15
15
  media: query,
16
16
  onchange: null,
17
- addListener: noop,
18
- removeListener,
17
+ addEventListener: noop,
18
+ removeEventListener,
19
19
  dispatchEvent: noop
20
20
  })
21
21
  });
@@ -28,6 +28,6 @@ export const mockMatchMedia = matches => {
28
28
 
29
29
  _matches = matches;
30
30
  return {
31
- removeListener
31
+ removeEventListener
32
32
  };
33
33
  };
@@ -73,6 +73,12 @@ I18nProvider.propTypes = {
73
73
  "records": PropTypes.func.isRequired,
74
74
  "show": PropTypes.func.isRequired
75
75
  }),
76
+ "pod": PropTypes.shape({
77
+ "undo": PropTypes.func.isRequired
78
+ }),
79
+ "progressTracker": PropTypes.shape({
80
+ "of": PropTypes.func.isRequired
81
+ }),
76
82
  "select": PropTypes.shape({
77
83
  "actionButtonText": PropTypes.func.isRequired,
78
84
  "noResultsForTerm": PropTypes.func.isRequired,
@@ -1,2 +1,2 @@
1
- export { default } from "./pod";
2
- export * from "./pod";
1
+ export { default } from "./pod.component";
2
+ export type { PodProps } from "./pod.component";
@@ -0,0 +1,47 @@
1
+ import React from "react";
2
+ import { MarginProps } from "styled-system";
3
+ import { PodAlignment, PodSize, PodVariant } from "./pod.config";
4
+ export interface PodProps extends MarginProps {
5
+ /** Identifier used for testing purposes, applied to the root element of the component. */
6
+ "data-element"?: string;
7
+ /** Identifier used for testing purposes, applied to the root element of the component. */
8
+ "data-role"?: string;
9
+ /** Aligns the title to left, right or center */
10
+ alignTitle?: PodAlignment;
11
+ /** Enables/disables the border around the pod. */
12
+ border?: boolean;
13
+ /** Children elements */
14
+ children?: React.ReactNode;
15
+ /** Custom className */
16
+ className?: string;
17
+ /** Determines the padding around the pod */
18
+ size?: PodSize;
19
+ /** Prop to apply a theme to the Pod */
20
+ variant?: PodVariant;
21
+ /** Title for the pod h4 element always shown */
22
+ title?: string | React.ReactNode;
23
+ /** Optional subtitle for the pod */
24
+ subtitle?: string;
25
+ /** A component to render as a Pod footer */
26
+ footer?: string | React.ReactNode;
27
+ /** Supplies an edit action to the pod */
28
+ onEdit?: string | Record<string, unknown> | ((ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void);
29
+ /** Supplies a delete action to the pod */
30
+ onDelete?: (ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
31
+ /** Supplies an undo action to the pod in soft delete state. */
32
+ onUndo?: (ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
33
+ /** Sets softboolean; delete state */
34
+ softDelete?: boolean;
35
+ /** Determines if the editable pod content should be full width */
36
+ editContentFullWidth?: boolean;
37
+ /** Determines if the edit button should be hidden until the user hovers over the content */
38
+ displayEditButtonOnHover?: boolean;
39
+ /** Determines if clicking the pod content calls the onEdit action */
40
+ triggerEditOnContent?: boolean;
41
+ /** Sets Pod height, number is changed to pixels and string is passed as raw css value */
42
+ height?: string | number;
43
+ /** Renders edit button inside the pod if it exists. */
44
+ internalEditButton?: boolean;
45
+ }
46
+ declare const Pod: React.ForwardRefExoticComponent<PodProps & React.RefAttributes<HTMLDivElement>>;
47
+ export default Pod;