@carbon/react 1.78.2 → 1.79.0

package/scss/components/dialog/_index.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 2025
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@forward '@carbon/styles/scss/components/dialog';

package/telemetry.yml

@@ -327,6 +327,7 @@ collect:
         - tilePadding
         # FeatureFlags
         - enableExperimentalFocusWrapWithoutSentinels
+        - enableDialogElement
         - enableTreeviewControllable
         - enableV12DynamicFloatingStyles
         - enableV12Overflowmenu

package/es/components/Modal/next/index.d.ts

@@ -1,171 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import React, { ReactNode } from 'react';
-import { ReactAttr } from '../../../types/common';
-import { InlineLoadingStatus } from '../../InlineLoading/InlineLoading';
-export declare const ModalSizes: readonly ["xs", "sm", "md", "lg"];
-export type ModalSize = (typeof ModalSizes)[number];
-export interface ModalSecondaryButton {
-    buttonText?: string | ReactNode;
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
-}
-export interface BaseModalProps extends ReactAttr<HTMLDivElement> {
-    /**
-     * Required props for the accessibility label of the header
-     */
-    'aria-label'?: string;
-    /**
-     * Provide the contents of your Modal
-     */
-    children?: ReactNode;
-    /**
-     * Specify an optional className to be applied to the modal root node
-     */
-    className?: string;
-    /**
-     * Specify an label for the close button of the modal; defaults to close
-     */
-    closeButtonLabel?: string;
-    /**
-     * Specify whether the Modal is for dangerous actions
-     */
-    danger?: boolean;
-    /**
-     * **Experimental**: Provide a decorator component to be rendered inside the `Modal` component
-     */
-    decorator?: ReactNode;
-    /**
-     * Specify whether the modal contains scrolling content
-     */
-    hasScrollingContent?: boolean;
-    /**
-     * Specify the DOM element ID of the top-level node.
-     */
-    id?: string;
-    /**
-     * Specify whether or not the Modal content should have any inner padding.
-     */
-    isFullWidth?: boolean;
-    /**
-     * Specify the description for the loading text
-     */
-    loadingDescription?: string;
-    /**
-     * Specify the description for the loading text
-     */
-    loadingIconDescription?: string;
-    /**
-     * Specify loading status
-     */
-    loadingStatus?: InlineLoadingStatus;
-    /**
-     * Specify a label to be read by screen readers on the modal root node
-     */
-    modalAriaLabel?: string;
-    /**
-     * Specify the content of the modal header title.
-     */
-    modalHeading?: ReactNode;
-    /**
-     * Specify the content of the modal header label.
-     */
-    modalLabel?: ReactNode;
-    /**
-     * Specify a handler for keypresses.
-     * @deprecated this property is unused
-     */
-    onKeyDown?: React.KeyboardEventHandler<HTMLElement>;
-    /**
-     * Specify an optional handler to be invoked when loading is
-     * successful
-     */
-    onLoadingSuccess?: () => void;
-    /**
-     * Specify a handler for closing modal.
-     * The handler should care of closing modal, e.g. changing `open` prop.
-     */
-    onRequestClose?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify a handler for "submitting" modal.
-     * The handler should care of closing modal, e.g. changing `open` prop, if necessary.
-     */
-    onRequestSubmit?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify a handler for the secondary button.
-     * Useful if separate handler from `onRequestClose` is desirable
-     */
-    onSecondarySubmit?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify whether the Modal is currently open
-     */
-    open?: boolean;
-    /**
-     * Prevent closing on click outside of modal
-     */
-    preventCloseOnClickOutside?: boolean;
-    /**
-     * Specify whether the Button should be disabled, or not
-     */
-    primaryButtonDisabled?: boolean;
-    /**
-     * Specify the text for the primary button
-     */
-    primaryButtonText?: ReactNode;
-    /**
-     * Specify the text for the secondary button
-     */
-    secondaryButtonText?: ReactNode;
-    /**
-     * Specify an array of config objects for secondary buttons
-     */
-    secondaryButtons?: ModalSecondaryButton[];
-    /**
-     * Specify a CSS selector that matches the DOM element that should
-     * be focused when the Modal opens
-     */
-    selectorPrimaryFocus?: string;
-    /**
-     * Specify CSS selectors that match DOM elements working as floating menus.
-     * Focusing on those elements won't trigger "focus-wrap" behavior
-     */
-    selectorsFloatingMenus?: string[];
-    /**
-     * Specify if Enter key should be used as "submit" action
-     */
-    shouldSubmitOnEnter?: boolean;
-    /**
-     * Specify the size variant.
-     */
-    size?: ModalSize;
-}
-interface PassiveModal extends BaseModalProps {
-    /**
-     * Specify whether the modal should be button-less
-     */
-    passiveModal?: true;
-    /**
-     * Specify whether the Modal is displaying an alert, error or warning. Should
-     * go hand in hand with the `danger` prop. This changes the `role` to
-     * `alertdialog` and cannot be used with passive modals.
-     */
-    alert?: never;
-}
-interface NonPassiveModal extends BaseModalProps {
-    /**
-     * Specify whether the modal should be button-less
-     */
-    passiveModal?: false;
-    /**
-     * Specify whether the Modal is displaying an alert, error or warning. Should
-     * go hand in hand with the `danger` prop. This changes the `role` to
-     * `alertdialog` and cannot be used with passive modals.
-     */
-    alert?: boolean;
-}
-export type ModalProps = PassiveModal | NonPassiveModal;
-declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
-export default Modal;

package/es/internal/focus/index.js

@@ -1,15 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-function focus(elementOrRef) {
-  const element = elementOrRef.current || elementOrRef;
-  if (element && element.focus && document.activeElement !== element) {
-    element.focus();
-  }
-}
-
-export { focus };

package/es/internal/useEffectOnce.js

@@ -1,30 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { useRef, useEffect } from 'react';
-
-/**
- * A custom hook which will call the given callback exactly once when your
- * component is initially rendered and effects are first called
- *
- * @param {Function} callback
- */
-function useEffectOnce(callback) {
-  const savedCallback = useRef(callback);
-  const effectGuard = useRef(false);
-  useEffect(() => {
-    savedCallback.current = callback;
-  });
-  useEffect(() => {
-    if (effectGuard.current !== true) {
-      effectGuard.current = true;
-      savedCallback.current();
-    }
-  }, []);
-}
-
-export { useEffectOnce };

package/lib/components/Modal/next/index.d.ts

@@ -1,171 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-import React, { ReactNode } from 'react';
-import { ReactAttr } from '../../../types/common';
-import { InlineLoadingStatus } from '../../InlineLoading/InlineLoading';
-export declare const ModalSizes: readonly ["xs", "sm", "md", "lg"];
-export type ModalSize = (typeof ModalSizes)[number];
-export interface ModalSecondaryButton {
-    buttonText?: string | ReactNode;
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
-}
-export interface BaseModalProps extends ReactAttr<HTMLDivElement> {
-    /**
-     * Required props for the accessibility label of the header
-     */
-    'aria-label'?: string;
-    /**
-     * Provide the contents of your Modal
-     */
-    children?: ReactNode;
-    /**
-     * Specify an optional className to be applied to the modal root node
-     */
-    className?: string;
-    /**
-     * Specify an label for the close button of the modal; defaults to close
-     */
-    closeButtonLabel?: string;
-    /**
-     * Specify whether the Modal is for dangerous actions
-     */
-    danger?: boolean;
-    /**
-     * **Experimental**: Provide a decorator component to be rendered inside the `Modal` component
-     */
-    decorator?: ReactNode;
-    /**
-     * Specify whether the modal contains scrolling content
-     */
-    hasScrollingContent?: boolean;
-    /**
-     * Specify the DOM element ID of the top-level node.
-     */
-    id?: string;
-    /**
-     * Specify whether or not the Modal content should have any inner padding.
-     */
-    isFullWidth?: boolean;
-    /**
-     * Specify the description for the loading text
-     */
-    loadingDescription?: string;
-    /**
-     * Specify the description for the loading text
-     */
-    loadingIconDescription?: string;
-    /**
-     * Specify loading status
-     */
-    loadingStatus?: InlineLoadingStatus;
-    /**
-     * Specify a label to be read by screen readers on the modal root node
-     */
-    modalAriaLabel?: string;
-    /**
-     * Specify the content of the modal header title.
-     */
-    modalHeading?: ReactNode;
-    /**
-     * Specify the content of the modal header label.
-     */
-    modalLabel?: ReactNode;
-    /**
-     * Specify a handler for keypresses.
-     * @deprecated this property is unused
-     */
-    onKeyDown?: React.KeyboardEventHandler<HTMLElement>;
-    /**
-     * Specify an optional handler to be invoked when loading is
-     * successful
-     */
-    onLoadingSuccess?: () => void;
-    /**
-     * Specify a handler for closing modal.
-     * The handler should care of closing modal, e.g. changing `open` prop.
-     */
-    onRequestClose?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify a handler for "submitting" modal.
-     * The handler should care of closing modal, e.g. changing `open` prop, if necessary.
-     */
-    onRequestSubmit?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify a handler for the secondary button.
-     * Useful if separate handler from `onRequestClose` is desirable
-     */
-    onSecondarySubmit?: React.ReactEventHandler<HTMLElement>;
-    /**
-     * Specify whether the Modal is currently open
-     */
-    open?: boolean;
-    /**
-     * Prevent closing on click outside of modal
-     */
-    preventCloseOnClickOutside?: boolean;
-    /**
-     * Specify whether the Button should be disabled, or not
-     */
-    primaryButtonDisabled?: boolean;
-    /**
-     * Specify the text for the primary button
-     */
-    primaryButtonText?: ReactNode;
-    /**
-     * Specify the text for the secondary button
-     */
-    secondaryButtonText?: ReactNode;
-    /**
-     * Specify an array of config objects for secondary buttons
-     */
-    secondaryButtons?: ModalSecondaryButton[];
-    /**
-     * Specify a CSS selector that matches the DOM element that should
-     * be focused when the Modal opens
-     */
-    selectorPrimaryFocus?: string;
-    /**
-     * Specify CSS selectors that match DOM elements working as floating menus.
-     * Focusing on those elements won't trigger "focus-wrap" behavior
-     */
-    selectorsFloatingMenus?: string[];
-    /**
-     * Specify if Enter key should be used as "submit" action
-     */
-    shouldSubmitOnEnter?: boolean;
-    /**
-     * Specify the size variant.
-     */
-    size?: ModalSize;
-}
-interface PassiveModal extends BaseModalProps {
-    /**
-     * Specify whether the modal should be button-less
-     */
-    passiveModal?: true;
-    /**
-     * Specify whether the Modal is displaying an alert, error or warning. Should
-     * go hand in hand with the `danger` prop. This changes the `role` to
-     * `alertdialog` and cannot be used with passive modals.
-     */
-    alert?: never;
-}
-interface NonPassiveModal extends BaseModalProps {
-    /**
-     * Specify whether the modal should be button-less
-     */
-    passiveModal?: false;
-    /**
-     * Specify whether the Modal is displaying an alert, error or warning. Should
-     * go hand in hand with the `danger` prop. This changes the `role` to
-     * `alertdialog` and cannot be used with passive modals.
-     */
-    alert?: boolean;
-}
-export type ModalProps = PassiveModal | NonPassiveModal;
-declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
-export default Modal;

package/lib/internal/focus/index.js

@@ -1,19 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-function focus(elementOrRef) {
-  const element = elementOrRef.current || elementOrRef;
-  if (element && element.focus && document.activeElement !== element) {
-    element.focus();
-  }
-}
-
-exports.focus = focus;

package/lib/internal/useEffectOnce.js

@@ -1,34 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-/**
- * A custom hook which will call the given callback exactly once when your
- * component is initially rendered and effects are first called
- *
- * @param {Function} callback
- */
-function useEffectOnce(callback) {
-  const savedCallback = React.useRef(callback);
-  const effectGuard = React.useRef(false);
-  React.useEffect(() => {
-    savedCallback.current = callback;
-  });
-  React.useEffect(() => {
-    if (effectGuard.current !== true) {
-      effectGuard.current = true;
-      savedCallback.current();
-    }
-  }, []);
-}
-
-exports.useEffectOnce = useEffectOnce;