carbon-react 114.0.0 → 114.2.0

package/esm/__internal__/utils/helpers/events/events.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 /**
  * JavaScript Events
  *
@@ -13,6 +14,10 @@ declare const Events: {
      * A method to determine if an event is of a particular type
      * */
     isEventType: (ev: React.SyntheticEvent | Event, type: string) => boolean;
+    /**
+     * Determines if event is a keyboard event
+     */
+    isKeyboardEvent: (ev: React.SyntheticEvent | Event) => ev is React.KeyboardEvent<Element> | KeyboardEvent;
     /**
      * Determines if a number key along the top of the keyboard or a number key on the
      * keypad is pressed

package/esm/__internal__/utils/helpers/events/events.js

@@ -18,6 +18,13 @@ const Events = {
     return ev.type === type;
   },
 
+  /**
+   * Determines if event is a keyboard event
+   */
+  isKeyboardEvent: ev => {
+    return ["keydown", "keypress", "keyup"].includes(ev.type);
+  },
+
   /**
    * Determines if a number key along the top of the keyboard or a number key on the
    * keypad is pressed

package/esm/__spec_helper__/mock-match-media.d.ts

@@ -1,8 +1,5 @@
-declare function setupMatchMediaMock(): void;
-declare function mockMatchMedia(
-  matches?: boolean
-): {
-  removeListener: jest.Mock;
+/// <reference types="jest" />
+export declare const setupMatchMediaMock: () => void;
+export declare const mockMatchMedia: (matches: boolean) => {
+    removeEventListener: jest.Mock<any, any>;
 };
-
-export { setupMatchMediaMock, mockMatchMedia };

package/esm/__spec_helper__/mock-match-media.js

@@ -1,6 +1,6 @@
 let mocked = false;
 let _matches = false;
-const removeListener = jest.fn();
+const removeEventListener = jest.fn();
 export const setupMatchMediaMock = () => {
   if (!global.window) {
     return;
@@ -14,8 +14,8 @@ export const setupMatchMediaMock = () => {
       matches: _matches,
       media: query,
       onchange: null,
-      addListener: noop,
-      removeListener,
+      addEventListener: noop,
+      removeEventListener,
       dispatchEvent: noop
     })
   });
@@ -28,6 +28,6 @@ export const mockMatchMedia = matches => {
 
   _matches = matches;
   return {
-    removeListener
+    removeEventListener
   };
 };

package/esm/components/i18n-provider/i18n-provider.component.js

@@ -73,6 +73,9 @@ I18nProvider.propTypes = {
       "records": PropTypes.func.isRequired,
       "show": PropTypes.func.isRequired
     }),
+    "pod": PropTypes.shape({
+      "undo": PropTypes.func.isRequired
+    }),
     "progressTracker": PropTypes.shape({
       "of": PropTypes.func.isRequired
     }),

package/esm/components/inline-inputs/inline-inputs.component.d.ts

@@ -14,10 +14,12 @@ export interface InlineInputsProps extends StyledContentContainerProps, StyledIn
     htmlFor?: string;
     /** Defines the label text for the heading. */
     label?: string;
+    /** Flag to configure component as mandatory. */
+    required?: boolean;
 }
 export declare const InlineInputsContext: React.Context<InlineInputsContextProps>;
 declare const InlineInputs: {
-    ({ adaptiveLabelBreakpoint, label, htmlFor, children, className, gutter, inputWidth, labelInline, labelWidth, }: InlineInputsProps): JSX.Element;
+    ({ adaptiveLabelBreakpoint, label, htmlFor, children, className, gutter, inputWidth, labelInline, labelWidth, required, }: InlineInputsProps): JSX.Element;
     displayName: string;
 };
 export default InlineInputs;

package/esm/components/inline-inputs/inline-inputs.component.js

@@ -28,7 +28,8 @@ const InlineInputs = ({
   gutter = "none",
   inputWidth,
   labelInline = true,
-  labelWidth
+  labelWidth,
+  required
 }) => {
   const labelId = useRef(createGuid());
   const largeScreen = useIsAboveBreakpoint(adaptiveLabelBreakpoint);
@@ -43,7 +44,8 @@ const InlineInputs = ({
     return /*#__PURE__*/React.createElement(Label, {
       labelId: labelId.current,
       inline: inlineLabel,
-      htmlFor: htmlFor
+      htmlFor: htmlFor,
+      isRequired: required
     }, label);
   }
 
@@ -69,7 +71,8 @@ InlineInputs.propTypes = {
   "inputWidth": PropTypes.number,
   "label": PropTypes.string,
   "labelInline": PropTypes.bool,
-  "labelWidth": PropTypes.number
+  "labelWidth": PropTypes.number,
+  "required": PropTypes.bool
 };
 InlineInputs.displayName = "InlineInputs";
 export default InlineInputs;

package/esm/components/pod/index.d.ts

@@ -1,2 +1,2 @@
-export { default } from "./pod";
-export * from "./pod";
+export { default } from "./pod.component";
+export type { PodProps } from "./pod.component";

package/esm/components/pod/pod.component.d.ts

@@ -0,0 +1,47 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { PodAlignment, PodSize, PodVariant } from "./pod.config";
+export interface PodProps extends MarginProps {
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-element"?: string;
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-role"?: string;
+    /** Aligns the title to left, right or center */
+    alignTitle?: PodAlignment;
+    /** Enables/disables the border around the pod. */
+    border?: boolean;
+    /** Children elements */
+    children?: React.ReactNode;
+    /** Custom className */
+    className?: string;
+    /** Determines the padding around the pod */
+    size?: PodSize;
+    /** Prop to apply a theme to the Pod */
+    variant?: PodVariant;
+    /** Title for the pod h4 element always shown */
+    title?: string | React.ReactNode;
+    /** Optional subtitle for the pod */
+    subtitle?: string;
+    /** A component to render as a Pod footer */
+    footer?: string | React.ReactNode;
+    /** Supplies an edit action to the pod */
+    onEdit?: string | Record<string, unknown> | ((ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void);
+    /** Supplies a delete action to the pod */
+    onDelete?: (ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
+    /** Supplies an undo action to the pod in soft delete state. */
+    onUndo?: (ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
+    /** Sets softboolean; delete state */
+    softDelete?: boolean;
+    /** Determines if the editable pod content should be full width */
+    editContentFullWidth?: boolean;
+    /** Determines if the edit button should be hidden until the user hovers over the content */
+    displayEditButtonOnHover?: boolean;
+    /** Determines if clicking the pod content calls the onEdit action */
+    triggerEditOnContent?: boolean;
+    /** Sets Pod height, number is changed to pixels and string is passed as raw css value */
+    height?: string | number;
+    /** Renders edit button inside the pod if it exists. */
+    internalEditButton?: boolean;
+}
+declare const Pod: React.ForwardRefExoticComponent<PodProps & React.RefAttributes<HTMLDivElement>>;
+export default Pod;