carbon-react 106.6.6 → 106.6.9

package/lib/components/accordion/accordion.style.d.ts

@@ -1,10 +1,46 @@
-export const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledAccordionHeadingsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
-export const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, {}, never>;
-export const StyledAccordionIcon: import("styled-components").StyledComponent<typeof Icon, any, {}, never>;
-export const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 import Icon from "../icon";
+declare const StyledAccordionGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
+export interface StyledAccordionContainerProps {
+    /** Toggles left and right borders */
+    borders?: "default" | "full" | "none";
+    /** Renders the accordion heading in the style of a tertiary button */
+    buttonHeading?: boolean;
+    /** Sets background as white or transparent */
+    scheme?: "white" | "transparent";
+    /** Sets accordion width */
+    width?: string;
+}
+declare const StyledAccordionContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionContainerProps, never>;
+interface StyledAccordionTitleProps {
+    size?: "large" | "small";
+}
+declare const StyledAccordionTitle: import("styled-components").StyledComponent<"h3", any, StyledAccordionTitleProps, never>;
+declare const StyledAccordionSubTitle: import("styled-components").StyledComponent<"span", any, {}, never>;
+interface StyledAccordionIconProps {
+    isExpanded?: boolean;
+    iconAlign?: "left" | "right";
+}
+declare const StyledAccordionIcon: import("styled-components").StyledComponent<typeof Icon, any, StyledAccordionIconProps, never>;
+interface StyledAccordionHeadingsContainerProps {
+    buttonHeading?: boolean;
+    hasValidationIcon?: boolean;
+}
+declare const StyledAccordionHeadingsContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionHeadingsContainerProps, never>;
+interface StyledAccordionTitleContainerProps {
+    buttonHeading?: boolean;
+    buttonWidth?: number;
+    hasButtonProps?: boolean;
+    iconAlign?: "left" | "right";
+    size?: "large" | "small";
+}
+declare const StyledAccordionTitleContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionTitleContainerProps, never>;
+export interface StyledAccordionContentContainerProps {
+    isExpanded?: boolean;
+    maxHeight?: string | number;
+}
+declare const StyledAccordionContentContainer: import("styled-components").StyledComponent<"div", any, StyledAccordionContentContainerProps, never>;
+export interface StyledAccordionContentProps {
+    disableContentPadding?: boolean;
+}
+declare const StyledAccordionContent: import("styled-components").StyledComponent<"div", any, StyledAccordionContentProps, never>;
+export { StyledAccordionGroup, StyledAccordionContainer, StyledAccordionHeadingsContainer, StyledAccordionSubTitle, StyledAccordionTitleContainer, StyledAccordionTitle, StyledAccordionIcon, StyledAccordionContent, StyledAccordionContentContainer, };

package/lib/components/accordion/index.d.ts

@@ -1,2 +1,4 @@
-export { default as Accordion } from "./accordion";
-export { default as AccordionGroup } from "./accordion-group/accordion-group";
+export { default as Accordion } from "./accordion.component";
+export type { AccordionProps } from "./accordion.component";
+export { default as AccordionGroup } from "./accordion-group/accordion-group.component";
+export type { AccordionGroupProps } from "./accordion-group/accordion-group.component";

package/lib/components/decimal/decimal.component.js

@@ -50,8 +50,7 @@ const Decimal = ({
 }) => {
   const l = (0, _react.useContext)(_i18nContext.default);
   const emptyValue = allowEmptyValue ? "" : "0.00";
-
-  const getSafeValueProp = initialValue => {
+  const getSafeValueProp = (0, _react.useCallback)(initialValue => {
     // We're intentionally preventing the use of number values to help prevent any unintentional rounding issues
     (0, _invariant.default)(typeof initialValue === "string", "Decimal `value` prop must be a string");
 
@@ -60,8 +59,7 @@ const Decimal = ({
     }
 
     return initialValue;
-  };
-
+  }, [allowEmptyValue]);
   const getSeparator = (0, _react.useCallback)(separatorType => {
     const numberWithGroupAndDecimalSeparator = 10000.1;
     return Intl.NumberFormat(locale || l.locale()).formatToParts(numberWithGroupAndDecimalSeparator).find(part => part.type === separatorType).value;
@@ -190,18 +188,22 @@ const Decimal = ({
     (0, _invariant.default)(prevControlledRef.current !== isControlled, message);
     prevControlledRef.current = isControlled;
   }, [isControlled]);
+  const prevValue = (0, _usePrevious.default)(value);
   (0, _react.useEffect)(() => {
-    const unformattedValue = toStandardDecimal(stateValue);
+    const standardDecimalValue = toStandardDecimal(stateValue);
 
     if (isControlled) {
       const valueProp = getSafeValueProp(value);
 
-      if (unformattedValue !== valueProp) {
-        setStateValue(formatValue(value));
+      if (standardDecimalValue !== valueProp) {
+        if (valueProp === "" && prevValue === "") {
+          setStateValue(formatValue(emptyValue));
+        } else {
+          setStateValue(formatValue(valueProp));
+        }
       }
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  }, [value]);
+    }
+  }, [emptyValue, formatValue, getSafeValueProp, isControlled, prevValue, stateValue, toStandardDecimal, value]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_textbox.default, _extends({
     onKeyPress: onKeyPress,
     align: align,

package/lib/components/menu/menu-item/menu-item.style.js

@@ -141,7 +141,7 @@ const StyledMenuItemWrapper = _styledComponents.default.a`
     ${isOpen && (0, _styledComponents.css)`
       a,
       button {
-        background-color: ${_menu.default[menuType].submenuOpenedBackground};
+        background-color: ${_menu.default[menuType].submenuItemBackground};
         color: ${_menu.default[menuType].color};
       }
     `} 
@@ -165,11 +165,14 @@ const StyledMenuItemWrapper = _styledComponents.default.a`
 
       a:hover,
       button:hover {
+        background-color: ${_menu.default[menuType].submenuOpenedBackground};
+        color: var(--colorsComponentsMenuYang100);
+
         ${!(href || clickToOpen) && (0, _styledComponents.css)`
           cursor: default;
+          background-color: ${_menu.default[menuType].submenuItemBackground};
+          color: ${_menu.default[menuType].color};
         `}
-        background-color: ${_menu.default[menuType].submenuOpenedBackground};
-        color: ${_menu.default[menuType].color};
 
         [data-component="icon"] {
           color: ${_menu.default[menuType].color};

package/lib/components/multi-action-button/index.d.ts

@@ -1 +1,2 @@
-export { default } from "./multi-action-button";
+export { default } from "./multi-action-button.component";
+export type { MultiActionButtonProps } from "./multi-action-button.component";

package/lib/components/multi-action-button/multi-action-button.component.d.ts

@@ -1,53 +1,10 @@
-export default MultiActionButton;
-declare function MultiActionButton({ align, disabled, as, buttonType, size, children, text, subtext, "data-element": dataElement, "data-role": dataRole, ...rest }: {
-    [x: string]: any;
-    align?: string | undefined;
-    disabled: any;
-    as: any;
-    buttonType: any;
-    size: any;
-    children: any;
-    text: any;
-    subtext: any;
-    "data-element": any;
-    "data-role": any;
-}): JSX.Element;
-declare namespace MultiActionButton {
-    const propTypes: {
-        /** Button type: "primary" | "secondary" | "tertiary" */
-        buttonType: PropTypes.Requireable<string>;
-        /** The additional button to display. */
-        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /** Second text child, renders under main text, only when size is "large". */
-        subtext: PropTypes.Requireable<string>;
-        /** Customizes the appearance, can be set to 'primary', 'secondary' or 'transparent'. */
-        as: PropTypes.Requireable<string>;
-        /** The text to be displayed in the SplitButton. */
-        text: PropTypes.Validator<string>;
-        /** Gives the button a disabled state. */
-        disabled: PropTypes.Requireable<boolean>;
-        /** The size of the MultiActionButton. */
-        size: PropTypes.Requireable<string>;
-        /** A custom value for the data-element attribute. */
-        "data-element": PropTypes.Requireable<string>;
-        /** A custom value for the data-element attribute. */
-        "data-role": PropTypes.Requireable<string>;
-        /** Aligns the button's options */
-        align: PropTypes.Requireable<string>;
-        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
-    };
+/// <reference types="react" />
+import { SplitButtonProps } from "../split-button";
+export interface MultiActionButtonProps extends Omit<SplitButtonProps, "buttonType"> {
+    /** Button type: "primary" | "secondary" | "tertiary" */
+    buttonType?: "primary" | "secondary" | "tertiary";
+    /** Second text child, renders under main text, only when size is "large" */
+    subtext?: string;
 }
-import PropTypes from "prop-types";
+export declare const MultiActionButton: ({ align, disabled, as, buttonType, size, children, text, subtext, "data-element": dataElement, "data-role": dataRole, ...rest }: MultiActionButtonProps) => JSX.Element;
+export default MultiActionButton;