@carbon/react 1.66.0-rc.0 → 1.67.0-rc.0

package/es/components/FluidNumberInput/FluidNumberInput.d.ts

@@ -0,0 +1,95 @@
+/**
+ * Copyright IBM Corp. 2022
+ *
+ * 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 from 'react';
+export interface FluidNumberInputProps {
+    /**
+     * `true` to allow empty string.
+     */
+    allowEmpty?: boolean;
+    /**
+     * Specify an optional className to be applied to the wrapper node
+     */
+    className?: string;
+    /**
+     * Optional starting value for uncontrolled state
+     */
+    defaultValue?: number | string;
+    /**
+     * Specify if the wheel functionality for the input should be disabled, or not
+     */
+    disableWheel?: boolean;
+    /**
+     * Specify if the control should be disabled, or not
+     */
+    disabled?: boolean;
+    /**
+     * Provide a description for up/down icons that can be read by screen readers
+     */
+    iconDescription?: string;
+    /**
+     * Specify a custom `id` for the input
+     */
+    id: string;
+    /**
+     * Specify if the currently value is invalid.
+     */
+    invalid?: boolean;
+    /**
+     * Message which is displayed if the value is invalid.
+     */
+    invalidText?: React.ReactNode;
+    /**
+     * Generic `label` that will be used as the textual representation of what
+     * this field is for
+     */
+    label?: React.ReactNode;
+    /**
+     * The maximum value.
+     */
+    max?: number;
+    /**
+     * The minimum value.
+     */
+    min?: number;
+    onChange?: (event: React.MouseEvent<HTMLButtonElement>, state: {
+        value: number | string;
+        direction: string;
+    }) => void;
+    /**
+     * Provide an optional function to be called when the up/down button is clicked
+     */
+    onClick?: (event: React.MouseEvent<HTMLElement>, state?: {
+        value: number | string;
+        direction: string;
+    }) => void;
+    /**
+     * Provide an optional function to be called when a key is pressed in the number input
+     */
+    onKeyUp?: React.KeyboardEventHandler<HTMLInputElement>;
+    /**
+     * Specify how much the values should increase/decrease upon clicking on up/down button
+     */
+    step?: number;
+    /**
+     * Provide custom text for the component for each translation id
+     */
+    translateWithId?: (id: string) => string;
+    /**
+     * Specify the value of the input
+     */
+    value?: number | string;
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in warning state
+     */
+    warnText?: React.ReactNode;
+}
+declare const FluidNumberInput: React.FC<FluidNumberInputProps>;
+export default FluidNumberInput;

package/es/components/FluidNumberInput/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 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 { FluidNumberInputProps } from './FluidNumberInput';
+import { FluidNumberInputSkeletonProps } from './FluidNumberInput.Skeleton';
+export { type FluidNumberInputProps, type FluidNumberInputSkeletonProps };
+export { default, default as FluidNumberInput } from './FluidNumberInput';
+export { default as FluidNumberInputSkeleton } from './FluidNumberInput.Skeleton';

package/es/components/FluidSearch/FluidSearch.Skeleton.d.ts

@@ -0,0 +1,15 @@
+/**
+ * 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 React from 'react';
+export interface FluidSearchSkeletonProps {
+    /**
+     * Specify an optional className to be applied to the outer FluidForm wrapper
+     */
+    className?: string;
+}
+declare const FluidSearchSkeleton: React.FC<FluidSearchSkeletonProps>;
+export default FluidSearchSkeleton;

package/es/components/FluidSearch/FluidSearch.Skeleton.js

@@ -12,7 +12,7 @@ import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-function FluidSearchSkeleton(_ref) {
+const FluidSearchSkeleton = _ref => {
   let {
     className,
     ...other
@@ -29,7 +29,7 @@ function FluidSearchSkeleton(_ref) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: `${prefix}--skeleton ${prefix}--text-input`
   })));
-}
+};
 FluidSearchSkeleton.propTypes = {
   /**
    * Specify an optional className to be applied to the outer FluidForm wrapper

package/es/components/FluidSearch/FluidSearch.d.ts

@@ -0,0 +1,73 @@
+/**
+ * Copyright IBM Corp. 2022
+ *
+ * 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 from 'react';
+export interface FluidSearchProps {
+    /**
+     * Specify an optional value for the `autocomplete` property on the underlying
+     * `<input>`, defaults to "off"
+     */
+    autoComplete?: string;
+    /**
+     * Specify an optional className to be applied to the container node
+     */
+    className?: string;
+    /**
+     * Specify a label to be read by screen readers on the "close" button
+     */
+    closeButtonLabelText?: string;
+    /**
+     * Optionally provide the default value of the `<input>`
+     */
+    defaultValue?: string | number;
+    /**
+     * Specify whether the `<input>` should be disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify a custom `id` for the input
+     */
+    id?: string;
+    /**
+     * Provide the label text for the Search icon
+     */
+    labelText: React.ReactNode;
+    /**
+     * Optional callback called when the search value changes.
+     */
+    onChange?(e: {
+        target: HTMLInputElement;
+        type: 'change';
+    }): void;
+    /**
+     * Optional callback called when the search value is cleared.
+     */
+    onClear?: () => void;
+    /**
+     * Provide a handler that is invoked on the key down event for the input
+     */
+    onKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;
+    /**
+     * Provide an optional placeholder text for the Search.
+     * Note: if the label and placeholder differ,
+     * VoiceOver on Mac will read both
+     */
+    placeholder?: string;
+    /**
+     * Specify the role for the underlying `<input>`, defaults to `searchbox`
+     */
+    role?: string;
+    /**
+     * Optional prop to specify the type of the `<input>`
+     */
+    type?: string;
+    /**
+     * Specify the value of the `<input>`
+     */
+    value?: string | number;
+}
+declare const FluidSearch: React.FC<FluidSearchProps>;
+export default FluidSearch;

package/es/components/FluidSearch/FluidSearch.js

@@ -91,6 +91,5 @@ FluidSearch.propTypes = {
    */
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
 };
-var FluidSearch$1 = FluidSearch;
 
-export { FluidSearch$1 as default };
+export { FluidSearch as default };

package/es/components/FluidSearch/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 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 { FluidSearchProps } from './FluidSearch';
+import { FluidSearchSkeletonProps } from './FluidSearch.Skeleton';
+export { default, default as FluidSearch } from './FluidSearch';
+export { type FluidSearchProps, type FluidSearchSkeletonProps };
+export { default as FluidSearchSkeleton } from './FluidSearch.Skeleton';

package/es/components/FluidSelect/FluidSelect.Skeleton.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright IBM Corp. 2022
+ *
+ * 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 from 'react';
+export interface FluidSelectSkeletonProps {
+    /**
+     * Specify an optional className to add.
+     */
+    className?: string;
+}
+declare const FluidSelectSkeleton: React.FC<FluidSelectSkeletonProps>;
+export default FluidSelectSkeleton;

package/es/components/FluidSelect/FluidSelect.Skeleton.js

@@ -34,6 +34,5 @@ FluidSelectSkeleton.propTypes = {
    */
   className: PropTypes.string
 };
-var FluidSelectSkeleton$1 = FluidSelectSkeleton;
 
-export { FluidSelectSkeleton$1 as default };
+export { FluidSelectSkeleton as default };

package/es/components/FluidSelect/FluidSelect.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Copyright IBM Corp. 2022
+ *
+ * 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 from 'react';
+export interface FluidSelectProps {
+    /**
+     * Provide the contents of your Select
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the node containing the label and the select box
+     */
+    className?: string;
+    /**
+     * Optionally provide the default value of the `<select>`
+     */
+    defaultValue?: any;
+    /**
+     * Specify whether the control is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify a custom `id` for the `<select>`
+     */
+    id: string;
+    /**
+     * Specify if the currently value is invalid.
+     */
+    invalid?: boolean;
+    /**
+     * Message which is displayed if the value is invalid.
+     */
+    invalidText?: React.ReactNode;
+    /**
+     * Provide label text to be read by screen readers when interacting with the
+     * control
+     */
+    labelText?: React.ReactNode;
+    /**
+     * Provide an optional `onChange` hook that is called each time the value of
+     * the underlying `<input>` changes
+     */
+    onChange?: React.ChangeEventHandler<HTMLSelectElement>;
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in warning state
+     */
+    warnText?: React.ReactNode;
+}
+declare const FluidSelect: React.ForwardRefExoticComponent<FluidSelectProps & React.RefAttributes<HTMLSelectElement>>;
+export default FluidSelect;

package/es/components/FluidSelect/FluidSelect.js

@@ -79,6 +79,5 @@ FluidSelect.propTypes = {
    */
   warnText: PropTypes.node
 };
-var FluidSelect$1 = FluidSelect;
 
-export { FluidSelect$1 as default };
+export { FluidSelect as default };

package/es/components/FluidSelect/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 2022
+ *
+ * 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 FluidSelect from './FluidSelect';
+import FluidSelectSkeletonProps from './FluidSelect.Skeleton';
+import FluidSelectProps from './FluidSelect.Skeleton';
+export type { FluidSelectSkeletonProps, FluidSelectProps };
+export default FluidSelect;
+export { FluidSelect };
+export { default as FluidSelectSkeleton } from './FluidSelect.Skeleton';

package/es/components/FluidSelect/index.js

@@ -7,3 +7,4 @@
 
 import FluidSelect from './FluidSelect.js';
 export { default as FluidSelect, default } from './FluidSelect.js';
+export { default as FluidSelectSkeleton } from './FluidSelect.Skeleton.js';

package/es/components/FluidTextArea/FluidTextArea.Skeleton.d.ts

@@ -0,0 +1,20 @@
+import PropTypes from 'prop-types';
+export interface FluidTextAreaSkeletonProps {
+    /**
+     * Specify an optional className to be applied to the outer FluidForm wrapper
+     */
+    className?: string;
+}
+declare function FluidTextAreaSkeleton({ className, ...other }: {
+    [x: string]: any;
+    className: any;
+}): void;
+declare namespace FluidTextAreaSkeleton {
+    var propTypes: {
+        /**
+         * Specify an optional className to be applied to the outer FluidForm wrapper
+         */
+        className: PropTypes.Requireable<string>;
+    };
+}
+export default FluidTextAreaSkeleton;

package/es/components/FluidTextArea/FluidTextArea.Skeleton.js

@@ -5,30 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default from 'react';
-import cx from 'classnames';
+import 'react';
+import 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
-import { FormContext } from '../FluidForm/FormContext.js';
 
 function FluidTextAreaSkeleton(_ref) {
-  let {
-    className,
-    ...other
-  } = _ref;
-  const prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement(FormContext.Provider, {
-    value: {
-      isFluid: true
-    }
-  }, /*#__PURE__*/React__default.createElement("div", _extends({
-    className: cx(`${prefix}--form-item ${prefix}--text-area--fluid__skeleton`, className)
-  }, other), /*#__PURE__*/React__default.createElement("span", {
-    className: `${prefix}--label ${prefix}--skeleton`
-  }), /*#__PURE__*/React__default.createElement("div", {
-    className: `${prefix}--skeleton ${prefix}--text-area`
-  })));
+  usePrefix();
 }
 FluidTextAreaSkeleton.propTypes = {
   /**

package/es/components/FluidTextArea/FluidTextArea.d.ts

@@ -0,0 +1,96 @@
+/**
+ * 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 React from 'react';
+export interface FluidTextAreaProps {
+    /**
+     * Provide a custom className that is applied directly to the underlying
+     * `<textarea>` node
+     */
+    className?: string;
+    /**
+     * Specify the `cols` attribute for the underlying `<textarea>` node
+     */
+    cols?: number;
+    /**
+     * Optionally provide the default value of the `<textarea>`
+     */
+    defaultValue?: string | number;
+    /**
+     * Specify whether the control is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify whether to display the character counter
+     */
+    enableCounter?: boolean;
+    /**
+     * Provide text that is used alongside the control label for additional help
+     */
+    helperText?: React.ReactNode;
+    /**
+     * Specify whether you want the underlying label to be visually hidden
+     */
+    hideLabel?: boolean;
+    /**
+     * Provide a unique identifier for the control
+     */
+    id?: string;
+    /**
+     * Specify whether the control is currently invalid
+     */
+    invalid?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in an invalid state
+     */
+    invalidText?: React.ReactNode;
+    /**
+     * Provide the text that will be read by a screen reader when visiting this
+     * control
+     */
+    labelText: React.ReactNode;
+    /**
+     * `true` to use the light version. For use on $ui-01 backgrounds only.
+     * Don't use this to make tile background color same as container background color.
+     */
+    light?: boolean;
+    /**
+     * Max character count allowed for the textarea. This is needed in order for enableCounter to display
+     */
+    maxCount?: number;
+    /**
+     * Optionally provide an `onChange` handler that is called whenever `<textarea>`
+     * is updated
+     */
+    onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;
+    /**
+     * Optionally provide an `onClick` handler that is called whenever the
+     * `<textarea>` is clicked
+     */
+    onClick?: React.MouseEventHandler<HTMLTextAreaElement>;
+    /**
+     * Specify the placeholder attribute for the `<textarea>`
+     */
+    placeholder?: string;
+    /**
+     * Specify the rows attribute for the `<textarea>`
+     */
+    rows?: number;
+    /**
+     * Provide the current value of the `<textarea>`
+     */
+    value?: string | number;
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn?: boolean;
+    /**
+     *  Provide the text that is displayed when the control is in warning state
+     */
+    warnText?: React.ReactNode;
+}
+declare const FluidTextArea: React.FC<FluidTextAreaProps>;
+export default FluidTextArea;

package/es/components/FluidTextArea/FluidTextArea.js

@@ -15,7 +15,7 @@ import deprecate from '../../prop-types/deprecate.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { FormContext } from '../FluidForm/FormContext.js';
 
-function FluidTextArea(_ref) {
+const FluidTextArea = _ref => {
   let {
     className,
     ...other
@@ -29,7 +29,7 @@ function FluidTextArea(_ref) {
   }, /*#__PURE__*/React__default.createElement(TextArea, _extends({
     className: classNames
   }, other)));
-}
+};
 FluidTextArea.propTypes = {
   /**
    * Provide a custom className that is applied directly to the underlying

package/es/components/FluidTextArea/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 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 FluidTextArea from './FluidTextArea';
+import { type FluidTextAreaProps } from './FluidTextArea';
+import { type FluidTextAreaSkeletonProps } from './FluidTextArea.Skeleton';
+export default FluidTextArea;
+export { FluidTextArea, type FluidTextAreaProps, type FluidTextAreaSkeletonProps, };
+export { default as FluidTextAreaSkeleton } from './FluidTextArea.Skeleton';

package/es/components/FluidTextInput/FluidPasswordInput.d.ts

@@ -0,0 +1,83 @@
+/**
+ * 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 React from 'react';
+export interface FluidPasswordInputProps {
+    /**
+     * Specify an optional className to be applied to the outer FluidForm wrapper
+     */
+    className?: string;
+    /**
+     * Optionally provide the default value of the `<input>`
+     */
+    defaultValue?: string | number;
+    /**
+     * Specify whether the `<input>` should be disabled
+     */
+    disabled?: boolean;
+    /**
+     * "Hide password" tooltip text on password visibility toggle
+     */
+    hidePasswordLabel?: string;
+    /**
+     * Specify a custom `id` for the `<input>`
+     */
+    id: string;
+    /**
+     * Specify whether the control is currently invalid
+     */
+    invalid?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in an invalid state
+     */
+    invalidText?: React.ReactNode;
+    /**
+     * Specify whether the control is a password input
+     */
+    isPassword?: boolean;
+    /**
+     * Provide the text that will be read by a screen reader when visiting this
+     * control
+     */
+    labelText: React.ReactNode;
+    /**
+     * Optionally provide an `onChange` handler that is called whenever `<input>`
+     * is updated
+     */
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    /**
+     * Optionally provide an `onClick` handler that is called whenever the
+     * `<input>` is clicked
+     */
+    onClick?: React.MouseEventHandler<HTMLInputElement>;
+    /**
+     * Callback function that is called whenever the toggle password visibility
+     * button is clicked
+     */
+    onTogglePasswordVisibility?: React.MouseEventHandler<HTMLButtonElement>;
+    /**
+     * Specify the placeholder attribute for the `<input>`
+     */
+    placeholder?: string;
+    /**
+     * "Show password" tooltip text on password visibility toggle
+     */
+    showPasswordLabel?: string;
+    /**
+     * Specify the value of the `<input>`
+     */
+    value?: string | number;
+    /**
+     * Specify whether the control is currently in warning state
+     */
+    warn?: boolean;
+    /**
+     * Provide the text that is displayed when the control is in warning state
+     */
+    warnText?: React.ReactNode;
+}
+declare const FluidPasswordInput: React.FC<FluidPasswordInputProps>;
+export default FluidPasswordInput;