carbon-react 152.7.0 → 153.0.0

package/lib/components/icon/icon-unicodes.d.ts

@@ -1,6 +1,6 @@
 export default iconUnicodes;
 declare namespace iconUnicodes {
-    export const none: string;
+    export let none: string;
     import add = plus;
     export { add };
     import create = plus;
@@ -15,8 +15,8 @@ declare namespace iconUnicodes {
     export { graph };
     import basket = cart;
     export { basket };
-    export const bin: string;
-    export const bulk_destroy: string;
+    export let bin: string;
+    export let bulk_destroy: string;
     import caret_down = dropdown;
     export { caret_down };
     import collaborate = share;
@@ -59,255 +59,255 @@ declare namespace iconUnicodes {
     export { in_transit };
     import progress = circle_with_dots;
     export { progress };
-    export const boxed_shapes: string;
-    export const circles_connection: string;
-    export const document_right_align: string;
-    export const document_tick: string;
-    export const document_vertical_lines: string;
-    export const error_square: string;
-    export const factory: string;
-    export const files_leaning: string;
-    export const ledger: string;
-    export const ledger_arrow_left: string;
-    export const ledger_arrow_right: string;
-    export const money_bag: string;
-    export const spanner: string;
-    export const split_container: string;
-    export const stacked_boxes: string;
-    export const tag: string;
-    export const three_boxes: string;
-    export const circle_with_dots: string;
-    export const squares_nine: string;
-    export const coins: string;
-    export const file_generic: string;
-    export const file_pdf: string;
-    export const file_excel: string;
-    export const file_word: string;
-    export const file_image: string;
-    export const euro: string;
-    export const pound: string;
-    export const stacked_squares: string;
-    export const expand: string;
-    export const flag: string;
-    export const square_dot: string;
-    export const envelope_dollar: string;
-    export const envelope_euro: string;
-    export const sage_coin: string;
-    export const palm_tree: string;
-    export const arrow_bottom_right_circle: string;
-    export const arrow_top_left_circle: string;
-    export const arrows_left_right: string;
-    export const bank_with_card: string;
-    export const bed: string;
-    export const car_lock: string;
-    export const car_money: string;
-    export const car_repair: string;
-    export const cash: string;
-    export const construction: string;
-    export const drill: string;
-    export const form_refresh: string;
-    export const graduation_hat: string;
-    export const hand_cash_coins: string;
-    export const hand_cash_note: string;
-    export const laptop: string;
-    export const percentage_boxed: string;
-    export const petrol_pump: string;
-    export const plane: string;
-    export const theatre_masks: string;
-    export const accessibility_web: string;
-    export const app_facebook: string;
-    export const app_instagram: string;
-    export const app_tiktok: string;
-    export const app_twitter: string;
-    export const app_youtube: string;
-    export const apps: string;
-    export const bill_paid: string;
-    export const bill_unpaid: string;
-    export const box_arrow_right: string;
-    export const calendar_pay_date: string;
-    export const card_wallet: string;
-    export const connect_off: string;
-    export const heart_pulse: string;
-    export const intranet: string;
-    export const job_seeked: string;
-    export const like: string;
-    export const link_cloud: string;
-    export const link_on: string;
-    export const microphone: string;
-    export const protect: string;
-    export const recruiting: string;
-    export const send: string;
-    export const support_online: string;
-    export const target_man: string;
-    export const target: string;
-    export const volunteering: string;
-    export const website: string;
-    export const welfare: string;
-    export const contact_card: string;
-    export const cloud_co2: string;
-    export const leaf: string;
-    export const like_no: string;
-    export const minimise: string;
-    export const pin: string;
-    export const biometric: string;
-    const _import: string;
+    export let boxed_shapes: string;
+    export let circles_connection: string;
+    export let document_right_align: string;
+    export let document_tick: string;
+    export let document_vertical_lines: string;
+    export let error_square: string;
+    export let factory: string;
+    export let files_leaning: string;
+    export let ledger: string;
+    export let ledger_arrow_left: string;
+    export let ledger_arrow_right: string;
+    export let money_bag: string;
+    export let spanner: string;
+    export let split_container: string;
+    export let stacked_boxes: string;
+    export let tag: string;
+    export let three_boxes: string;
+    export let circle_with_dots: string;
+    export let squares_nine: string;
+    export let coins: string;
+    export let file_generic: string;
+    export let file_pdf: string;
+    export let file_excel: string;
+    export let file_word: string;
+    export let file_image: string;
+    export let euro: string;
+    export let pound: string;
+    export let stacked_squares: string;
+    export let expand: string;
+    export let flag: string;
+    export let square_dot: string;
+    export let envelope_dollar: string;
+    export let envelope_euro: string;
+    export let sage_coin: string;
+    export let palm_tree: string;
+    export let arrow_bottom_right_circle: string;
+    export let arrow_top_left_circle: string;
+    export let arrows_left_right: string;
+    export let bank_with_card: string;
+    export let bed: string;
+    export let car_lock: string;
+    export let car_money: string;
+    export let car_repair: string;
+    export let cash: string;
+    export let construction: string;
+    export let drill: string;
+    export let form_refresh: string;
+    export let graduation_hat: string;
+    export let hand_cash_coins: string;
+    export let hand_cash_note: string;
+    export let laptop: string;
+    export let percentage_boxed: string;
+    export let petrol_pump: string;
+    export let plane: string;
+    export let theatre_masks: string;
+    export let accessibility_web: string;
+    export let app_facebook: string;
+    export let app_instagram: string;
+    export let app_tiktok: string;
+    export let app_twitter: string;
+    export let app_youtube: string;
+    export let apps: string;
+    export let bill_paid: string;
+    export let bill_unpaid: string;
+    export let box_arrow_right: string;
+    export let calendar_pay_date: string;
+    export let card_wallet: string;
+    export let connect_off: string;
+    export let heart_pulse: string;
+    export let intranet: string;
+    export let job_seeked: string;
+    export let like: string;
+    export let link_cloud: string;
+    export let link_on: string;
+    export let microphone: string;
+    export let protect: string;
+    export let recruiting: string;
+    export let send: string;
+    export let support_online: string;
+    export let target_man: string;
+    export let target: string;
+    export let volunteering: string;
+    export let website: string;
+    export let welfare: string;
+    export let contact_card: string;
+    export let cloud_co2: string;
+    export let leaf: string;
+    export let like_no: string;
+    export let minimise: string;
+    export let pin: string;
+    export let biometric: string;
+    let _import: string;
     export { _import as import };
-    const _export: string;
+    let _export: string;
     export { _export as export };
-    export const shield_with_tick: string;
-    export const shield_with_tick_outline: string;
-    export const stop: string;
-    export const stop_circle: string;
-    export const worldwide_location: string;
-    export const error: string;
-    export const warning: string;
-    export const tick: string;
-    export const tick_circle: string;
-    export const tick_thick: string;
-    export const draft: string;
-    export const progressed: string;
-    export const in_progress: string;
-    export const clock: string;
-    export const locked: string;
-    export const unlocked: string;
-    export const gift: string;
-    export const blocked: string;
-    export const key: string;
-    export const chart_line: string;
-    export const chart_pie: string;
-    export const chart_bar: string;
-    export const blocked_square: string;
-    export const disputed: string;
-    export const lightbulb_on: string;
-    export const lightbulb_off: string;
-    export const chevron_up: string;
-    export const chevron_down: string;
-    export const chevron_right: string;
-    export const chevron_left: string;
-    export const chevron_up_thick: string;
-    export const chevron_down_thick: string;
-    export const chevron_left_thick: string;
-    export const chevron_right_thick: string;
-    export const link: string;
-    export const list_view: string;
-    export const card_view: string;
-    export const sort_down: string;
-    export const sort_up: string;
-    export const arrow_left: string;
-    export const arrow_right: string;
-    export const arrow_down: string;
-    export const arrow_up: string;
-    export const arrow_left_right_small: string;
-    export const arrow_left_small: string;
-    export const arrow_right_small: string;
-    export const block_arrow_right: string;
-    export const drag_vertical: string;
-    export const drag: string;
-    export const fit_height: string;
-    export const fit_width: string;
-    export const ellipsis_horizontal: string;
-    export const ellipsis_vertical: string;
-    export const u_turn_left: string;
-    export const u_turn_right: string;
-    export const cart: string;
-    export const basket_with_squares: string;
-    const _delete: string;
+    export let shield_with_tick: string;
+    export let shield_with_tick_outline: string;
+    export let stop: string;
+    export let stop_circle: string;
+    export let worldwide_location: string;
+    export let error: string;
+    export let warning: string;
+    export let tick: string;
+    export let tick_circle: string;
+    export let tick_thick: string;
+    export let draft: string;
+    export let progressed: string;
+    export let in_progress: string;
+    export let clock: string;
+    export let locked: string;
+    export let unlocked: string;
+    export let gift: string;
+    export let blocked: string;
+    export let key: string;
+    export let chart_line: string;
+    export let chart_pie: string;
+    export let chart_bar: string;
+    export let blocked_square: string;
+    export let disputed: string;
+    export let lightbulb_on: string;
+    export let lightbulb_off: string;
+    export let chevron_up: string;
+    export let chevron_down: string;
+    export let chevron_right: string;
+    export let chevron_left: string;
+    export let chevron_up_thick: string;
+    export let chevron_down_thick: string;
+    export let chevron_left_thick: string;
+    export let chevron_right_thick: string;
+    export let link: string;
+    export let list_view: string;
+    export let card_view: string;
+    export let sort_down: string;
+    export let sort_up: string;
+    export let arrow_left: string;
+    export let arrow_right: string;
+    export let arrow_down: string;
+    export let arrow_up: string;
+    export let arrow_left_right_small: string;
+    export let arrow_left_small: string;
+    export let arrow_right_small: string;
+    export let block_arrow_right: string;
+    export let drag_vertical: string;
+    export let drag: string;
+    export let fit_height: string;
+    export let fit_width: string;
+    export let ellipsis_horizontal: string;
+    export let ellipsis_vertical: string;
+    export let u_turn_left: string;
+    export let u_turn_right: string;
+    export let cart: string;
+    export let basket_with_squares: string;
+    let _delete: string;
     export { _delete as delete };
-    export const print: string;
-    export const csv: string;
-    export const pdf: string;
-    export const duplicate: string;
-    export const copy: string;
-    export const check_all: string;
-    export const check_none: string;
-    export const calendar: string;
-    export const calendar_today: string;
-    export const dropdown: string;
-    export const caret_up: string;
-    export const caret_left: string;
-    export const caret_right: string;
-    export const caret_large_down: string;
-    export const caret_large_up: string;
-    export const caret_large_left: string;
-    export const caret_large_right: string;
-    export const plus: string;
-    export const plus_large: string;
-    export const minus: string;
-    export const minus_large: string;
-    export const edit: string;
-    export const edited: string;
-    export const favourite: string;
-    export const favourite_lined: string;
-    export const credit_card: string;
-    export const credit_card_slash: string;
-    export const save: string;
-    export const uploaded: string;
-    export const arrow_left_boxed: string;
-    export const question: string;
-    export const info: string;
-    export const download: string;
-    export const upload: string;
-    export const share: string;
-    export const close: string;
-    export const cross: string;
-    export const cross_circle: string;
-    export const filter: string;
-    export const refresh: string;
-    export const computer_clock: string;
-    export const refresh_clock: string;
-    export const sync: string;
-    export const attach: string;
-    export const camera: string;
-    export const image: string;
-    export const folder: string;
-    export const help: string;
-    export const connect: string;
-    export const disconnect: string;
-    export const split: string;
-    export const filter_new: string;
-    export const delivery: string;
-    export const chat: string;
-    export const chat_notes: string;
-    export const bullet_list: string;
-    export const bullet_list_numbers: string;
-    export const bullet_list_dotted: string;
-    export const view: string;
-    export const hide: string;
-    export const video: string;
-    export const play: string;
-    export const pause: string;
-    export const play_circle: string;
-    export const pause_circle: string;
-    export const scan: string;
-    export const lookup: string;
-    export const bold: string;
-    export const italic: string;
-    export const undo: string;
-    export const box_arrow_left: string;
-    export const home: string;
-    export const dashboard: string;
-    export const settings: string;
-    export const search: string;
-    export const feedback: string;
-    export const logout: string;
-    export const alert: string;
-    export const alert_on: string;
-    export const talk: string;
-    export const person: string;
-    export const person_info: string;
-    export const person_tick: string;
-    export const people: string;
-    export const people_switch: string;
-    const business_1: string;
+    export let print: string;
+    export let csv: string;
+    export let pdf: string;
+    export let duplicate: string;
+    export let copy: string;
+    export let check_all: string;
+    export let check_none: string;
+    export let calendar: string;
+    export let calendar_today: string;
+    export let dropdown: string;
+    export let caret_up: string;
+    export let caret_left: string;
+    export let caret_right: string;
+    export let caret_large_down: string;
+    export let caret_large_up: string;
+    export let caret_large_left: string;
+    export let caret_large_right: string;
+    export let plus: string;
+    export let plus_large: string;
+    export let minus: string;
+    export let minus_large: string;
+    export let edit: string;
+    export let edited: string;
+    export let favourite: string;
+    export let favourite_lined: string;
+    export let credit_card: string;
+    export let credit_card_slash: string;
+    export let save: string;
+    export let uploaded: string;
+    export let arrow_left_boxed: string;
+    export let question: string;
+    export let info: string;
+    export let download: string;
+    export let upload: string;
+    export let share: string;
+    export let close: string;
+    export let cross: string;
+    export let cross_circle: string;
+    export let filter: string;
+    export let refresh: string;
+    export let computer_clock: string;
+    export let refresh_clock: string;
+    export let sync: string;
+    export let attach: string;
+    export let camera: string;
+    export let image: string;
+    export let folder: string;
+    export let help: string;
+    export let connect: string;
+    export let disconnect: string;
+    export let split: string;
+    export let filter_new: string;
+    export let delivery: string;
+    export let chat: string;
+    export let chat_notes: string;
+    export let bullet_list: string;
+    export let bullet_list_numbers: string;
+    export let bullet_list_dotted: string;
+    export let view: string;
+    export let hide: string;
+    export let video: string;
+    export let play: string;
+    export let pause: string;
+    export let play_circle: string;
+    export let pause_circle: string;
+    export let scan: string;
+    export let lookup: string;
+    export let bold: string;
+    export let italic: string;
+    export let undo: string;
+    export let box_arrow_left: string;
+    export let home: string;
+    export let dashboard: string;
+    export let settings: string;
+    export let search: string;
+    export let feedback: string;
+    export let logout: string;
+    export let alert: string;
+    export let alert_on: string;
+    export let talk: string;
+    export let person: string;
+    export let person_info: string;
+    export let person_tick: string;
+    export let people: string;
+    export let people_switch: string;
+    let business_1: string;
     export { business_1 as business };
-    export const shop: string;
-    export const bank: string;
-    export const call: string;
-    export const mobile: string;
-    export const fax: string;
-    export const email: string;
-    export const email_switch: string;
-    export const marker: string;
+    export let shop: string;
+    export let bank: string;
+    export let call: string;
+    export let mobile: string;
+    export let fax: string;
+    export let email: string;
+    export let email_switch: string;
+    export let marker: string;
 }
 declare namespace actions { }
 declare namespace statusSymbols { }

package/lib/components/icon/icon.component.d.ts

@@ -4,7 +4,7 @@ import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
 import { StyledIconProps } from "./icon.style";
 import { IconType } from "./icon-type";
 import { TooltipPositions } from "../tooltip/tooltip.config";
-export declare type LegacyIconTypes = "help" | "maintenance" | "new" | "success" | "messages";
+export type LegacyIconTypes = "help" | "maintenance" | "new" | "success" | "messages";
 export interface IconProps extends Omit<StyledIconProps, "type">, MarginProps, TagProps {
     /** Set whether icon should be recognised by assistive technologies */
     "aria-hidden"?: boolean;

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

@@ -1,8 +1,8 @@
 import { ThemeObject } from "../../style/themes/base";
 import { IconType } from "./icon-type";
-export declare type BackgroundShape = "circle" | "rounded-rect" | "square";
-export declare type BgSize = "small" | "medium" | "large" | "extra-large";
-export declare type FontSize = "small" | "medium" | "large" | "extra-large";
+export type BackgroundShape = "circle" | "rounded-rect" | "square";
+export type BgSize = "small" | "medium" | "large" | "extra-large";
+export type FontSize = "small" | "medium" | "large" | "extra-large";
 export interface StyledIconProps {
     /** Background colour, provide any color from palette or any valid css color value. */
     bg?: string;

package/lib/components/icon/icon.style.js

@@ -54,10 +54,10 @@ const StyledIcon = _styledComponents.default.span`
   disabled,
   hasTooltip
 }) => {
-  let finalColor;
-  let finalHoverColor;
-  let bgColor;
-  let bgHoverColor;
+  let finalColor = "var(--colorsYin090)";
+  let finalHoverColor = "var(--colorsYin090)";
+  let bgColor = "transparent";
+  let bgHoverColor = "transparent";
   const win = (0, _globals.getWindow)();
   const nav = (0, _globals.getNavigator)();
   const adjustedBgSize = adjustIconBgSize(fontSize, bgSize);
@@ -74,9 +74,6 @@ const StyledIcon = _styledComponents.default.span`
       });
       finalColor = renderedColor;
       finalHoverColor = (0, _polished.shade)(0.2, (0, _getColorValue.default)(renderedColor));
-    } else {
-      finalColor = "var(--colorsYin090)";
-      finalHoverColor = "var(--colorsYin090)";
     }
     if (bg) {
       const {
@@ -87,9 +84,6 @@ const StyledIcon = _styledComponents.default.span`
       });
       bgColor = backgroundColor;
       bgHoverColor = (0, _polished.shade)(0.2, (0, _getColorValue.default)(backgroundColor));
-    } else {
-      bgColor = "transparent";
-      bgHoverColor = "transparent";
     }
   } catch (e) {
     // eslint-disable-next-line no-console
@@ -141,7 +135,7 @@ const StyledIcon = _styledComponents.default.span`
 
       ${hasTooltip && `
         :focus {
-        ${(0, _addFocusStyling.default)()}
+          ${(0, _addFocusStyling.default)()}
         }
       `}
 

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { MarginProps, BackgroundProps, LayoutProps, PaddingProps } from "styled-system";
 import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
-export declare type PositionProps = "absolute" | "fixed" | "relative" | "static" | "sticky";
+export type PositionProps = "absolute" | "fixed" | "relative" | "static" | "sticky";
 export interface StyledImageProps extends BackgroundProps, LayoutProps, MarginProps, PaddingProps, TagProps {
     /** HTML alt property to display when an img fails to load */
     alt?: string;
@@ -34,5 +34,5 @@ declare const StyledImage: import("styled-components").StyledComponent<"div", an
     bottom: string | undefined;
     left: string | undefined;
     as?: string | undefined;
-} & StyledImageProps, "hidden" | "children" | "left" | "right" | "top" | "bottom" | "as" | "src" | "position">;
+} & StyledImageProps, "hidden" | "children" | "left" | "right" | "top" | "bottom" | "position" | "src" | "as">;
 export { StyledImage };

package/lib/components/inline-inputs/inline-inputs.style.d.ts

@@ -1,5 +1,5 @@
 import { InlineInputsProps } from "./inline-inputs.component";
-declare type GutterOptions = "none" | "extra-small" | "small" | "medium-small" | "medium" | "medium-large" | "large" | "extra-large";
+type GutterOptions = "none" | "extra-small" | "small" | "medium-small" | "medium" | "medium-large" | "large" | "extra-large";
 interface StyledInlineInputProps {
     /** Gutter prop gets passed down to Row component if false gutter value is "none" */
     gutter?: GutterOptions;

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

@@ -1,4 +1,4 @@
-declare type Variants = "default" | "negative" | "neutral";
+type Variants = "default" | "negative" | "neutral";
 export interface StyledLinkProps {
     /** The disabled state of the link. */
     disabled?: boolean;

package/lib/components/loader-spinner/loader-spinner.config.d.ts

@@ -1,8 +1,8 @@
 declare const LOADER_SPINNER_VARIANTS: readonly ["action", "neutral", "inverse", "gradient-grey", "gradient-white"];
-declare type LoaderSpinnerVariants = (typeof LOADER_SPINNER_VARIANTS)[number];
+type LoaderSpinnerVariants = (typeof LOADER_SPINNER_VARIANTS)[number];
 declare const LOADER_SPINNER_SIZES: readonly ["extra-small", "small", "medium", "large", "extra-large"];
-declare type LoaderSpinnerSizes = (typeof LOADER_SPINNER_SIZES)[number];
-declare type LoaderSpinnerSizeParams = Record<LoaderSpinnerSizes, {
+type LoaderSpinnerSizes = (typeof LOADER_SPINNER_SIZES)[number];
+type LoaderSpinnerSizeParams = Record<LoaderSpinnerSizes, {
     wrapperDimensions: number;
     strokeWidth: number;
     labelMarginTop?: number;

package/lib/components/loader-spinner/loader-spinner.style.js

@@ -60,7 +60,7 @@ const StyledSpinnerCircleSvg = exports.StyledSpinnerCircleSvg = _styledComponent
           fill: transparent;
           stroke-width: ${_loaderSpinner.LOADER_SPINNER_SIZE_PARAMS[size].strokeWidth}px;
           stroke: ${calculateColors(false, variant)};
-          ${variant === "inverse" && `stroke-opacity: 0.3`}
+          ${variant === "inverse" && `stroke-opacity: 0.3;`}
           cx: 12px;
           cy: 12px;
           r: 10px;