npm - carbon-react - Versions diffs - 158.21.0 → 158.23.0 - Mend

carbon-react 158.21.0 → 158.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

package/esm/components/button/__next__/__internal__/utils/is-icon-only.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+import { ReactNode } from "react";
+declare const isIconOnly: (children: ReactNode) => boolean;
+export default isIconOnly;

package/esm/components/button/__next__/__internal__/utils/is-icon-only.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ import{Children as r,isValidElement as t}from"react";import{isFragment as e}from"react-is";const o=p=>!!p&&r.toArray(p).every((r=>t(r)?"Icon"===r.type.displayName\|\|!!e(r)&&o(r.props.children):"string"==typeof r&&!r.trim().length));export{o as default};

package/esm/components/button/__next__/button.component.d.ts ADDED Viewed

@@ -0,0 +1,62 @@
+import React, { ReactNode } from "react";
+import { SpaceProps } from "styled-system";
+import { ButtonProps as LegacyButtonProps } from "../button.component";
+import { TagProps } from "../../../__internal__/utils/helpers/tags/tags";
+import { Size, Variant, VariantType } from "./button.config";
+export type ButtonHandle = {
+    focusButton: () => void;
+} | null;
+export interface ButtonProps extends Omit<LegacyButtonProps, "size" | "type" | "iconTooltipMessage" | "iconTooltipPosition">, SpaceProps, TagProps {
+    /** Identifies the element(s) offering additional information about the button that the user might require. */
+    "aria-describedby"?: string;
+    /**
+     * The aria-label attribute of the button.
+     */
+    "aria-label"?: string;
+    /** Identifies the element(s) labelling the button. */
+    "aria-labelledby"?: string;
+    /** The content that the button displays. */
+    children?: ReactNode;
+    /** Flag to indicate that the button is disabled. */
+    disabled?: boolean;
+    /** Flag to indicate that the button can be full-width. */
+    fullWidth?: boolean;
+    /** The ID of the button. */
+    id?: string;
+    /** Set the button to use a dark-mode appearance. */
+    inverse?: boolean;
+    /** The name of the button. */
+    name?: string;
+    /** Flag to indicate whether the button text can wrap over multiple lines. */
+    noWrap?: boolean;
+    /** Handler to fire when the button is blurred. */
+    onBlur?: (ev: React.FocusEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** Handler to fire when the button is clicked. */
+    onClick?: (ev: React.MouseEvent<HTMLAnchorElement> | React.MouseEvent<HTMLButtonElement>) => void;
+    /** Handler to fire when the button is focused. */
+    onFocus?: (ev: React.FocusEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** Handler to fire when the button is activated via the Enter or Space keys. */
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** The size of the button. */
+    size?: Size;
+    /** The HTML type that this button should use. */
+    type?: "button" | "reset" | "submit";
+    /** The variant of the button. */
+    variant?: Variant;
+    /** The variant type of the button. */
+    variantType?: VariantType;
+    /**
+     * @deprecated Please use `variantType` prop instead.
+     * */
+    buttonType?: LegacyButtonProps["buttonType"];
+    /**
+     * @deprecated Please use `variant="destructive"` instead.
+     * */
+    destructive?: LegacyButtonProps["destructive"];
+    /**
+     * @deprecated Please use `inverse` instead.
+     * */
+    isWhite?: LegacyButtonProps["isWhite"];
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<ButtonHandle>>;
+export default Button;

package/esm/components/button/__next__/button.component.js ADDED Viewed

@@ -0,0 +1 @@

+ import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{forwardRef as n,useRef as a,useImperativeHandle as i}from"react";import{StyledButton as o,StyledContentContainer as c}from"./button.style.js";import l from"../../../__internal__/utils/helpers/tags/tags.js";import u from"../../../hooks/useMediaQuery/useMediaQuery.js";import s from"./__internal__/utils/is-icon-only.js";import d from"../../icon/icon.component.js";function y(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function p(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){y(e,r,t[r])}))}return e}function b(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const f=n(((n,y)=>{var{"aria-describedby":f,"aria-label":v,"aria-labelledby":m,children:O,disabled:h=!1,fullWidth:j=!1,id:g,inverse:T,name:P,noWrap:w=!0,onClick:k,size:W="medium",variant:$="default",variantType:_="primary",buttonType:S,destructive:x,iconType:D,iconPosition:z="before",isWhite:B,href:C}=n,E=function(e,r){if(null==e)return{};var t,n,a=function(e,r){if(null==e)return{};var t,n,a={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||(a[t]=e[t]);return a}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}(n,["aria-describedby","aria-label","aria-labelledby","children","disabled","fullWidth","id","inverse","name","noWrap","onClick","size","variant","variantType","buttonType","destructive","iconType","iconPosition","isWhite","href"]);const M=a(null),Q=void 0!==O&&!1!==O,I=!!D&&!Q||s(O);i(y,(()=>({focusButton:()=>{var e;null===(e=M.current)||void 0===e||e.focus()}})),[]);const q=u("screen and (prefers-reduced-motion: no-preference)"),{variant:A,variantType:F}=(({buttonType:e,destructive:r,variant:t,variantType:n})=>{if(!e&&!r)return{variant:t,variantType:n};if(r)return{variant:"destructive",variantType:"primary"===(null!=e?e:n)?"primary":"secondary"};switch(e){case"primary":return{variant:"default",variantType:"primary"};case"tertiary":return{variant:"default",variantType:"tertiary"};case"darkBackground":default:return{variant:"default",variantType:"secondary"};case"gradient-grey":case"gradient-white":return{variant:"gradient",variantType:"secondary"}}})({buttonType:S,destructive:x,variant:$,variantType:_});return e(o,b(p({$allowMotion:q,"aria-describedby":f,"aria-label":v,"aria-labelledby":m,disabled:h,$fullWidth:j,$inverse:T||"darkBackground"===S||B,id:g,name:P,$noWrap:w,onClick:C?void 0:e=>{var r;null===(r=M.current)||void 0===r||r.focus({preventScroll:!0}),null==k||k(e)},ref:M,$size:W,$variant:A,$variantType:F,as:!h&&C?"a":"button",href:C,$iconOnly:I},l("button",E),E),{children:e(c,{"data-role":"button-child-container",children:(()=>{if(!D)return O;const n={"aria-hidden":!0,bg:"transparent"};return Q?r(t,"before"===z?{children:[e(d,b(p({type:D},n),{"data-role":"button-icon-before"})),O]}:{children:[O,e(d,b(p({type:D},n),{"data-role":"button-icon-after"}))]}):e(d,b(p({type:D},n),{"data-role":"button-icon-only"}))})()})}))}));export{f as Button,f as default};

package/esm/components/button/__next__/button.config.d.ts ADDED Viewed

@@ -0,0 +1,34 @@
+export type Size = "xs" | "small" | "medium" | "large";
+export type Variant = "default" | "destructive" | "gradient";
+export type VariantType = "primary" | "secondary" | "tertiary" | "subtle";
+export type ConfigEntry = Record<"active" | "default" | "disabled" | "hover", string>;
+export type ColorConfig = {
+    [key in Variant]: {
+        [key in VariantType]?: {
+            background: ConfigEntry;
+            border: ConfigEntry;
+            label: ConfigEntry;
+        };
+    };
+};
+export type InverseColorConfig = {
+    [key in VariantType]: {
+        background: ConfigEntry;
+        border: ConfigEntry;
+        label: ConfigEntry;
+    };
+};
+export type PropConfig = {
+    [key in Size]: {
+        borderRadius: string;
+        font: string;
+        height: string;
+        iconOnlyWidth: string;
+        paddingVertical: string;
+        paddingHorizontal: string;
+    };
+};
+export declare const propsForSize: PropConfig;
+export declare const inverseColourSettings: InverseColorConfig;
+export declare const colourSettings: ColorConfig;
+export declare const gradientAnimation: import("styled-components").FlattenSimpleInterpolation;

package/esm/components/button/__next__/button.config.js ADDED Viewed

@@ -0,0 +1 @@

+ import{css as a}from"styled-components";const t={xs:{borderRadius:"var(--global-radius-action-l)",font:"var(--global-font-static-comp-medium-xs)",height:"var(--global-size-xs)",iconOnlyWidth:"var(--global-size-xs)",paddingVertical:"var(--global-space-none)",paddingHorizontal:"var(--global-space-comp-s)"},small:{borderRadius:"var(--global-radius-action-l)",font:"var(--global-font-static-comp-medium-s)",height:"var(--global-size-s)",iconOnlyWidth:"var(--global-size-s)",paddingVertical:"var(--global-space-comp-2-xs)",paddingHorizontal:"var(--global-space-comp-m)"},medium:{borderRadius:"var(--global-radius-action-xl)",font:"var(--global-font-static-comp-medium-m)",height:"var(--global-size-m)",iconOnlyWidth:"var(--global-size-m)",paddingVertical:"6px",paddingHorizontal:"var(--global-space-comp-l)"},large:{borderRadius:"var(--global-radius-action-2-xl)",font:"var(--global-font-static-comp-medium-l)",height:"var(--global-size-l)",iconOnlyWidth:"var(--global-size-l)",paddingVertical:"6px",paddingHorizontal:"var(--global-space-comp-l)"}},e={primary:{background:{active:"var(--button-typical-primary-inverse-bg-active)",default:"var(--button-typical-primary-inverse-bg-default)",disabled:"var(--button-typical-primary-inverse-bg-disabled)",hover:"var(--button-typical-primary-inverse-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-primary-inverse-label-active)",default:"var(--button-typical-primary-inverse-label-default)",disabled:"var(--button-typical-primary-inverse-label-disabled)",hover:"var(--button-typical-primary-inverse-label-hover)"}},secondary:{background:{active:"var(--button-typical-secondary-inverse-bg-active)",default:"var(--button-typical-secondary-inverse-bg-default)",disabled:"transparent",hover:"var(--button-typical-secondary-inverse-bg-hover)"},border:{active:"var(--button-typical-secondary-inverse-border-active)",default:"var(--button-typical-secondary-inverse-border-default)",disabled:"var(--button-typical-secondary-inverse-border-disabled)",hover:"var(--button-typical-secondary-inverse-border-hover)"},label:{active:"var(--button-typical-secondary-inverse-label-active)",default:"var(--button-typical-secondary-inverse-label-default)",disabled:"var(--button-typical-secondary-inverse-label-disabled)",hover:"var(--button-typical-secondary-inverse-label-hover)"}},tertiary:{background:{active:"var(--button-typical-tertiary-inverse-bg-active)",default:"var(--button-typical-tertiary-inverse-bg-default)",disabled:"transparent",hover:"var(--button-typical-tertiary-inverse-bg-hover)"},border:{active:"var(--button-typical-tertiary-inverse-border-active)",default:"var(--button-typical-tertiary-inverse-border-default)",disabled:"var(--button-typical-tertiary-inverse-border-disabled)",hover:"var(--button-typical-tertiary-inverse-border-hover)"},label:{active:"var(--button-typical-tertiary-inverse-label-active)",default:"var(--button-typical-tertiary-inverse-label-default)",disabled:"var(--button-typical-tertiary-inverse-label-disabled)",hover:"var(--button-typical-tertiary-inverse-label-hover)"}},subtle:{background:{active:"var(--button-typical-subtle-inverse-bg-active)",default:"transparent",disabled:"transparent",hover:"var(--button-typical-subtle-inverse-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-subtle-inverse-label-active)",default:"var(--button-typical-subtle-inverse-label-default)",disabled:"var(--button-typical-subtle-inverse-label-disabled)",hover:"var(--button-typical-subtle-inverse-label-hover)"}}},r={default:{primary:{background:{active:"var(--button-typical-primary-bg-active)",default:"var(--button-typical-primary-bg-default)",disabled:"var(--button-typical-primary-bg-disabled)",hover:"var(--button-typical-primary-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-primary-label-active)",default:"var(--button-typical-primary-label-default)",disabled:"var(--button-typical-primary-label-disabled)",hover:"var(--button-typical-primary-label-hover)"}},secondary:{background:{active:"var(--button-typical-secondary-bg-active)",default:"var(--button-typical-secondary-bg-default)",disabled:"var(--button-typical-secondary-bg-disabled)",hover:"var(--button-typical-secondary-bg-hover)"},border:{active:"var(--button-typical-secondary-border-active)",default:"var(--button-typical-secondary-border-default)",disabled:"var(--button-typical-secondary-border-disabled)",hover:"var(--button-typical-secondary-border-hover)"},label:{active:"var(--button-typical-secondary-label-active)",default:"var(--button-typical-secondary-label-default)",disabled:"var(--button-typical-secondary-label-disabled)",hover:"var(--button-typical-secondary-label-hover)"}},tertiary:{background:{active:"var(--button-typical-tertiary-bg-active)",default:"var(--button-typical-tertiary-bg-default)",disabled:"var(--button-typical-tertiary-bg-disabled)",hover:"var(--button-typical-tertiary-bg-hover)"},border:{active:"var(--button-typical-tertiary-border-active)",default:"var(--button-typical-tertiary-border-default)",disabled:"var(--button-typical-tertiary-border-disabled)",hover:"var(--button-typical-tertiary-border-hover)"},label:{active:"var(--button-typical-tertiary-label-active)",default:"var(--button-typical-tertiary-label-default)",disabled:"var(--button-typical-tertiary-label-disabled)",hover:"var(--button-typical-tertiary-label-hover)"}},subtle:{background:{active:"var(--button-typical-subtle-bg-active)",default:"transparent",disabled:"transparent",hover:"var(--button-typical-subtle-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-subtle-label-active)",default:"var(--button-typical-subtle-label-default)",disabled:"var(--button-typical-subtle-label-disabled)",hover:"var(--button-typical-subtle-label-hover)"}}},destructive:{primary:{background:{active:"",default:"var(--button-destructive-primary-bg-default)",disabled:"var(--button-destructive-primary-bg-disabled)",hover:"var(--button-destructive-primary-bg-hover)"},label:{active:"",default:"var(--button-destructive-primary-label-default)",disabled:"var(--button-destructive-primary-label-disabled)",hover:"var(--button-destructive-primary-label-hover)"},border:{active:"",default:"transparent",disabled:"transparent",hover:"transparent"}},secondary:{background:{active:"",default:"transparent",disabled:"transparent",hover:"var(--button-destructive-secondary-bg-hover)"},label:{active:"",default:"var(--button-destructive-secondary-label-default)",disabled:"var(--button-destructive-secondary-label-disabled)",hover:"var(--button-destructive-secondary-label-hover)"},border:{active:"",default:"var(--button-destructive-secondary-border-default)",disabled:"var(--button-destructive-secondary-border-disabled)",hover:"var(--button-destructive-secondary-border-hover)"}}},gradient:{secondary:{background:{active:"var(--button-ai-bg-active, linear-gradient(90deg, var(--mode-color-action-ai-active-stop-1) 0%, var(--mode-color-action-ai-active-stop-2) 40%, var(--mode-color-action-ai-active-stop-3) 90%))",default:"transparent",disabled:"transparent",hover:"var(--button-ai-bg-hover, linear-gradient(90deg, var(--mode-color-action-ai-hover-stop-1) 0%, var(--mode-color-action-ai-hover-stop-2) 40%, var(--mode-color-action-ai-hover-stop-3) 90%))"},border:{active:"var(--button-ai-border-active)",default:"var(--button-ai-border-default)",disabled:"var(--button-ai-border-disabled)",hover:"var(--button-ai-border-hover)"},label:{active:"var(--button-ai-label-active)",default:"var(--button-ai-label-default)",disabled:"var(--button-ai-label-disabled)",hover:"var(--button-ai-label-hover)"}}}},l=a(["@keyframes gradient-loop{0%{background-position:0% 0;}100%{background-position:-200% 0;}}"]);export{r as colourSettings,l as gradientAnimation,e as inverseColourSettings,t as propsForSize};

package/esm/components/button/__next__/button.style.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { SpaceProps } from "styled-system";
+import { Size, Variant, VariantType } from "./button.config";
+type StyledButtonProps = SpaceProps & {
+    $allowMotion?: boolean;
+    $inverse?: boolean;
+    $fullWidth?: boolean;
+    $noWrap?: boolean;
+    $iconOnly?: boolean;
+};
+export declare const StyledContentContainer: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledButton: import("styled-components").StyledComponent<"button", any, Omit<StyledButtonProps, "size" | "variantType" | "variant"> & {
+    $size: Size;
+    $variant: Variant;
+    $variantType: VariantType;
+}, never>;
+export default StyledButton;

package/esm/components/button/__next__/button.style.js ADDED Viewed

@@ -0,0 +1 @@

+ import o,{css as e}from"styled-components";import{space as i}from"styled-system";import r from"../../../style/utils/add-focus-styling.js";import{gradientAnimation as n,propsForSize as a,inverseColourSettings as t,colourSettings as d}from"./button.config.js";const l=o.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-c07486b9-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),c=o.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-c07486b9-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],i,(({$allowMotion:o,disabled:i,$inverse:r,$size:l,$variant:c,$variantType:s,$iconOnly:b})=>r?(({disabled:o,size:i,variantType:r,iconOnly:n})=>{const{background:d,border:l,label:c}=t[r],{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],d.default,"tertiary"===r?"1px":"2px",l.default,n?"var(--global-radius-action-circle)":s,c.default,b,u,n?u:"max-content",v,n?"":g,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],d.disabled,l.disabled,c.disabled):e(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],d.active,c.active,l.active,d.hover,c.hover,l.hover))})({disabled:i,size:l,variantType:s,iconOnly:b}):"gradient"===c?e([""," ",""],n,(({allowMotion:o=!0,disabled:i,size:r,iconOnly:n})=>{const{background:t,border:l,label:c}=d.gradient.secondary||{},{borderRadius:s,font:b,height:u,paddingVertical:v,paddingHorizontal:g}=a[r];return e(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],n?"var(--global-radius-action-circle)":s,b,u,n?u:"max-content",v,n?"":g,o&&e(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),i&&e(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!i&&e(["&:active{background:",";color:",";border-color:",";}"],null==t?void 0:t.active,null==c?void 0:c.active,null==l?void 0:l.active))})({allowMotion:o,disabled:i,size:l,iconOnly:b})):(({disabled:o,size:i,variant:r,variantType:n,iconOnly:t})=>{const{background:l,border:c,label:s}=d[r][n]||{},{borderRadius:b,font:u,height:v,paddingVertical:g,paddingHorizontal:p}=a[i];return e(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==l?void 0:l.default,"tertiary"===n?"1px":"2px",null==c?void 0:c.default,t?"var(--global-radius-action-circle)":b,null==s?void 0:s.default,u,v,t?v:"max-content",g,t?"":p,o?e(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==l?void 0:l.disabled,null==c?void 0:c.disabled,null==s?void 0:s.disabled):e(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==l?void 0:l.active,null==s?void 0:s.active,null==c?void 0:c.active,null==l?void 0:l.hover,null==s?void 0:s.hover,null==c?void 0:c.hover))})("xs"!==l||"primary"!==s&&"default"===c?"destructive"!==c||"tertiary"!==s&&"subtle"!==s?{disabled:i,size:l,variant:c,variantType:s,iconOnly:b}:{disabled:i,size:l,variant:c,variantType:"primary",iconOnly:b}:{disabled:i,size:"xs",variant:"default",variantType:"secondary",iconOnly:b})),(({$fullWidth:o,$size:i,$noWrap:r})=>e([""," ",""],o&&e(["width:100%;"]),r?"white-space: nowrap;":`\n flex-flow: wrap;\n min-height: ${a[i].height};\n height: unset;\n `)),r());export{c as StyledButton,l as StyledContentContainer,c as default};

package/esm/components/button/__next__/index.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export { default } from "./button.component";
2	+ export type { ButtonProps } from "./button.component";

package/esm/components/button/__next__/index.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ export{Button as default}from"./button.component.js";

package/esm/components/button/button.component.d.ts CHANGED Viewed

@@ -3,7 +3,11 @@ import { SpaceProps } from "styled-system";
 import { IconType } from "../icon";
 import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
 import { TooltipPositions } from "../tooltip/tooltip.config";
-export type ButtonTypes = "primary" | "secondary" | "tertiary" | "darkBackground" | "gradient-grey" | "gradient-white";
+/**
+ * @deprecated Use "primary", "secondary", "tertiary" or "gradient" instead.
+ */
+export type DeprecatedButtonTypes = "darkBackground" | "gradient-grey" | "gradient-white";
+export type ButtonTypes = "primary" | "secondary" | "tertiary" | DeprecatedButtonTypes;
 export type SizeOptions = "small" | "medium" | "large";
 export type ButtonIconPosition = "before" | "after";
 export interface ButtonProps extends SpaceProps, TagProps {
@@ -16,7 +20,9 @@ export interface ButtonProps extends SpaceProps, TagProps {
     "aria-labelledby"?: string;
     /** Identifies the element(s) offering additional information about the button the user might require. */
     "aria-describedby"?: string;
-    /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
+    /**
+     * @deprecated Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground"
+     * */
     buttonType?: ButtonTypes;
     /** The text the button displays */
     children?: React.ReactNode;
@@ -24,11 +30,15 @@ export interface ButtonProps extends SpaceProps, TagProps {
     name?: string;
     /** Apply disabled state to the button */
     disabled?: boolean;
-    /** Apply destructive style to the button */
+    /**
+     * @deprecated Apply destructive style to the button
+     * */
     destructive?: boolean;
     /** Apply fullWidth style to the button */
     fullWidth?: boolean;
-    /** Used to transform button into anchor */
+    /**
+     * @deprecated Used to transform button into anchor
+     * */
     href?: string;
     /** Defines an Icon position related to the children: "before" | "after" */
     iconPosition?: ButtonIconPosition;
@@ -40,7 +50,9 @@ export interface ButtonProps extends SpaceProps, TagProps {
     iconType?: IconType;
     /** id attribute */
     id?: string;
-    /** Whether to use the white-on-dark colour variant */
+    /**
+     * @deprecated Whether to use the white-on-dark colour variant
+     * */
     isWhite?: boolean;
     /** If provided, the text inside a button will not wrap */
     noWrap?: boolean;
@@ -56,13 +68,19 @@ export interface ButtonProps extends SpaceProps, TagProps {
     onClick?: (ev: React.MouseEvent<HTMLAnchorElement> | React.MouseEvent<HTMLButtonElement>) => void;
     /** Assigns a size to the button: "small" | "medium" | "large" */
     size?: SizeOptions;
-    /** Second text child, renders under main text, only when size is "large" */
+    /**
+     * @deprecated Second text child, renders under main text, only when size is "large"
+     * */
     subtext?: string;
     /** HTML button type property */
     type?: string;
-    /** HTML target attribute */
+    /**
+     * @deprecated HTML target attribute
+     * */
     target?: string;
-    /** HTML rel attribute */
+    /**
+     * @deprecated HTML rel attribute
+     * */
     rel?: string;
     /**
      * @private
@@ -72,5 +90,8 @@ export interface ButtonProps extends SpaceProps, TagProps {
      */
     className?: string;
 }
+/**
+ * @deprecated This version of Button has been deprecated. See the Carbon documentation for migration details.
+ */
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 export default Button;

package/esm/components/icon/icon.style.js CHANGED Viewed

	@@ -1 +1 @@
1	- import o,{css as e}from"styled-components";import{margin as t}from"styled-system";import i from"../../__internal__/utils/logger/index.js";import n from"../../style/themes/apply-base-theme.js";import r from"../../style/utils/add-focus-styling.js";import s from"../../style/utils/color.js";import{getWindow as l,getNavigator as a}from"../../__internal__/dom/globals.js";import c,{isSafari as m}from"../../__internal__/utils/helpers/browser-type-check/index.js";import d from"./icon-config.js";import f from"./icon-unicodes.js";const g=o.span.attrs(n).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-~~74150e41~~-0"})(["",""],(({theme:o,color:n,bg:g,isInteractive:p,bgSize:h,bgShape:b,type:u,fontSize:y,disabled:_,hasTooltip:z})=>{let S="var(--colorsYin090)",j="transparent";const v=l(),k=a(),x=function(o,e){const t={small:1,medium:2,large:3,"extra-large":4};return o&&e?t[e]<t[o]?(i.warn(`[WARNING - Icon] The "${e}" \`bgSize\` is smaller than "${o}" \`fontSize\`, the \`bgSize\` has been auto adjusted to a larger size.`),d.backgroundSize[o]):d.backgroundSize[e]:e?d.backgroundSize[e]:void 0}(y,h);if(_)S="var(--colorsYin030)";else if(n){const{color:e}=s({color:n,theme:o});S=e}if(g){const{backgroundColor:e}=s({bg:g,theme:o});j=e}return e(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," ",""],S,j,x,x,b?`border-radius: ${d.backgroundShape[b]}`:"",p&&e(["&:not(:focus):hover{filter:brightness(0.9);}"]),f[u],y&&e(["font-size:",";line-height:",";"],d.iconSize[y],d.iconSize[y]),v&&"services"===u&&c(v)&&e(["margin-top:",";"],"small"===y?"-7px":"-8px"),k&&v&&"services"===u&&m(k)&&!c(v)&&e(["margin-top:-6px;"]),z&&`\n :focus {\n ${r()}\n }\n `,t)}));export{g as default};
1	+ import o,{css as e}from"styled-components";import{margin as t}from"styled-system";import i from"../../__internal__/utils/logger/index.js";import n from"../../style/themes/apply-base-theme.js";import r from"../../style/utils/add-focus-styling.js";import s from"../../style/utils/color.js";import{getWindow as l,getNavigator as a}from"../../__internal__/dom/globals.js";import c,{isSafari as m}from"../../__internal__/utils/helpers/browser-type-check/index.js";import d from"./icon-config.js";import f from"./icon-unicodes.js";import{StyledButton as g}from"../button/__next__/button.style.js";const p=o.span.attrs(n).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-d8f39d88-0"})([""," "," &{color:currentColor;}"],(({theme:o,color:n,bg:g,isInteractive:p,bgSize:u,bgShape:b,type:h,fontSize:y,disabled:_,hasTooltip:z})=>{let S="var(--colorsYin090)",j="transparent";const v=l(),x=a(),k=function(o,e){const t={small:1,medium:2,large:3,"extra-large":4};return o&&e?t[e]<t[o]?(i.warn(`[WARNING - Icon] The "${e}" \`bgSize\` is smaller than "${o}" \`fontSize\`, the \`bgSize\` has been auto adjusted to a larger size.`),d.backgroundSize[o]):d.backgroundSize[e]:e?d.backgroundSize[e]:void 0}(y,u);if(_)S="var(--colorsYin030)";else if(n){const{color:e}=s({color:n,theme:o});S=e}if(g){const{backgroundColor:e}=s({bg:g,theme:o});j=e}return e(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," ",""],S,j,k,k,b?`border-radius: ${d.backgroundShape[b]}`:"",p&&e(["&:not(:focus):hover{filter:brightness(0.9);}"]),f[h],y&&e(["font-size:",";line-height:",";"],d.iconSize[y],d.iconSize[y]),v&&"services"===h&&c(v)&&e(["margin-top:",";"],"small"===y?"-7px":"-8px"),x&&v&&"services"===h&&m(x)&&!c(v)&&e(["margin-top:-6px;"]),z&&`\n :focus {\n ${r()}\n }\n `,t)}),g);export{p as default};

package/esm/components/loader/__next__/loader.style.js CHANGED Viewed

	@@ -1 +1 @@
1	- import e,{css as a}from"styled-components";import{margin as t}from"styled-system";import i from"../../../style/themes/apply-base-theme.js";import{Typography as r}from"../../typography/typography.component.js";import"react/jsx-runtime";import"react";import n from"../../button/button.style.js";const o={"extra-small":20,small:32,medium:64,large:80},s={"extra-small":2.7,small:2.7,medium:2.7,large:2.7},l={small:"4px",medium:"8px",large:"16px"},d={"extra-small":"8px",small:"8px",medium:"12px",large:"16px"},m=(e,a)=>{const t=a?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.08)";return"ai"===e?{outerBarBackground:t,innerBarBackground:a?"linear-gradient(90deg, var(--mode-color-ai-alt-stop-1, #00D639) 0%, var(--mode-color-ai-alt-stop-2, #00D6DE) 40%, var(--mode-color-ai-alt-stop-3, #9D60FF) 90%)":"linear-gradient(90deg, var(--mode-color-ai-stop-1, #13A038) 0%, var(--mode-color-ai-stop-2, #149197) 40%, var(--mode-color-ai-stop-3, #A87CFB) 90%)"}:{outerBarBackground:t,innerBarBackground:a?"#FFFFFF":"#000000"}},c=a(["display:flex;justify-content:center;text-align:center;"]),p=e.div.withConfig({displayName:"loader.style__StyledLoaderPlaceholder",componentId:"sc-~~aaaf19f2~~-0"})(["display:inline-block;min-width:var(--sizing800);"]),f=e.div.attrs(i).withConfig({displayName:"loader.style__StyledLoader",componentId:"sc-~~aaaf19f2~~-1"})([""," text-align:center;white-space:nowrap;"],t),g=e.div.withConfig({displayName:"loader.style__OuterBar",componentId:"sc-~~aaaf19f2~~-2"})(["",""],(({size:e,variant:t,inverse:i})=>a(["border-radius:var(--borderRadius400);height:",";width:100%;background:",";overflow:hidden;position:relative;"],l[e],m(t,i).outerBarBackground))),h=e.div.withConfig({displayName:"loader.style__InnerBar",componentId:"sc-~~aaaf19f2~~-3"})(["",""],(({size:e,variant:t,inverse:i,animationTime:r,hasMotion:n})=>a(["@keyframes innerBarAnimationOne{0%{left:0%;animation-timing-function:linear;}30%{left:10px;animation-timing-function:cubic-bezier(0.5,0.6,0.4,1);}100%{left:calc(100% - 15px);}}@keyframes innerBarAnimationTwo{0%{width:15px;animation-timing-function:cubic-bezier(0.7,0,0.8,1);}50%{width:35%;}100%{width:15px;}}position:absolute;background:",";width:15px;height:",";border-radius:var(--borderRadius400);animation-name:innerBarAnimationOne,innerBarAnimationTwo;"," animation-iteration-count:",";"],m(t,i).innerBarBackground,l[e],n&&`animation-duration: ${r}s, ${r}s;`,n?"infinite, infinite":"none, none"))),u=e.svg.withConfig({displayName:"loader.style__StyledRingCircleSvg",componentId:"sc-~~aaaf19f2~~-4"})([""," ",' & circle[data-role="inner-arc"]{stroke:currentColor;}'],(({inverse:e,size:t,hasMotion:i,isTracked:r,isError:n,isSuccess:l,animationTime:d})=>{const m=`${o[t]}px`,c=s[t];return a(["height:",";min-height:",';circle[data-role="outer-arc"]{fill:transparent;stroke-width:',"px;stroke:",';cx:12px;cy:12px;r:10px;}circle[data-role="inner-arc"]{fill:transparent;stroke-width:',"px;stroke:",";stroke-linecap:round;stroke-dasharray:100px;stroke-dashoffset:95px;transform-origin:12px 12px 0px;cx:12px;cy:12px;r:10px;transform:rotate(-90deg);@keyframes trackedAnimation{from{stroke-dasharray:100;stroke-dashoffset:100;}to{stroke-dasharray:100;stroke-dashoffset:20;}}@keyframes untrackedAnimation{0%{transform:rotate(-90deg);stroke-dashoffset:95;}50%{transform:rotate(90deg);stroke-dashoffset:80;}100%{transform:rotate(270deg);stroke-dashoffset:95;}}animation-name:",";"," animation-timing-function:cubic-bezier(0,0,1,1);animation-iteration-count:",";}"],m,m,c,e?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.08)",c,(({inverse:e,isSuccess:a,isError:t})=>t?"#DB004E;":a?"#00811F;":e?"#FFF;":"#000000")({inverse:e,isSuccess:l,isError:n}),r?"trackedAnimation":"untrackedAnimation",i&&`animation-duration: ${d}s;`,i?"infinite":"none")}),n),x="40px",y=e.div.withConfig({displayName:"loader.style__StyledStars",componentId:"sc-~~aaaf19f2~~-5"})(["position:relative;width:",";height:",";"],x,x),k={standalone:{small:"4px",medium:"8px",large:"12px"},ring:{"extra-small":"4px",small:"8px",medium:"8px",large:"12px"}},w=e.div.withConfig({displayName:"loader.style__StyledStarLoaderWrapper",componentId:"sc-~~aaaf19f2~~-6"})(["position:relative;display:flex;align-items:center;justify-content:center;"]),v=e(r).withConfig({displayName:"loader.style__StyledLoaderLabel",componentId:"sc-~~aaaf19f2~~-7"})([""," line-height:150%;color:",";"," &{color:currentColor;}",""],c,(({inverse:e})=>e?"rgba(255, 255, 255, 0.55)":"rgba(0, 0, 0, 0.65)"),n,(({size:e="medium",loaderType:t,loaderVariant:i})=>"star"===t?a(["font-size:16px;font-weight:400;margin-left:12px;width:min-content;"]):"standalone"===t?a(["font-size:",";font-weight:500;width:100%;margin-top:",";"],"large"===e?"16px":"14px",k[t][e]):a(["font-size:",";font-weight:500;width:",";",";"],"large"===e?"16px":"extra-small"===e?"13px":"14px","inline"===i?"auto":"100%","inline"===i?`margin-left: ${d[e]}`:`margin-top: ${k[t][e]}`))),b=e.div.withConfig({displayName:"loader.style__StyledRingLoaderWrapper",componentId:"sc-~~aaaf19f2~~-8"})(["",""],(({loaderVariant:e})=>a(["display:flex;flex-direction:",";align-items:center;justify-content:center;width:",";"],"inline"===e?"row":"column","inline"===e?"auto":"100%"))),B=e.span.withConfig({displayName:"loader.style__StyledLabel",componentId:"sc-~~aaaf19f2~~-9"})(["",";"],(({inverse:e})=>a(["color:",";"," &{color:currentColor;}"],e?"rgba(255, 255, 255, 0.90)":"rgba(0, 0, 0, 0.90)",n)));export{h as InnerBar,g as OuterBar,B as StyledLabel,f as StyledLoader,v as StyledLoaderLabel,p as StyledLoaderPlaceholder,u as StyledRingCircleSvg,b as StyledRingLoaderWrapper,w as StyledStarLoaderWrapper,y as StyledStars};
1	+ import e,{css as t}from"styled-components";import{margin as i}from"styled-system";import r from"../../../style/themes/apply-base-theme.js";import{Typography as a}from"../../typography/typography.component.js";import"react/jsx-runtime";import"react";import n from"../../button/button.style.js";import{StyledButton as o}from"../../button/__next__/button.style.js";const s={"extra-small":20,small:32,medium:64,large:80},l={"extra-small":2.7,small:2.7,medium:2.7,large:2.7},d={small:"4px",medium:"8px",large:"16px"},m={"extra-small":"8px",small:"8px",medium:"12px",large:"16px"},c=(e,t)=>{const i=t?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.08)";return"ai"===e?{outerBarBackground:i,innerBarBackground:t?"linear-gradient(90deg, var(--mode-color-ai-alt-stop-1, #00D639) 0%, var(--mode-color-ai-alt-stop-2, #00D6DE) 40%, var(--mode-color-ai-alt-stop-3, #9D60FF) 90%)":"linear-gradient(90deg, var(--mode-color-ai-stop-1, #13A038) 0%, var(--mode-color-ai-stop-2, #149197) 40%, var(--mode-color-ai-stop-3, #A87CFB) 90%)"}:{outerBarBackground:i,innerBarBackground:t?"#FFFFFF":"#000000"}},p=t(["display:flex;justify-content:center;text-align:center;"]),g=e.div.withConfig({displayName:"loader.style__StyledLoaderPlaceholder",componentId:"sc-74569bc2-0"})(["display:inline-block;min-width:var(--sizing800);"]),f=e.div.attrs(r).withConfig({displayName:"loader.style__StyledLoader",componentId:"sc-74569bc2-1"})([""," text-align:center;white-space:nowrap;"],i),u=e.div.withConfig({displayName:"loader.style__OuterBar",componentId:"sc-74569bc2-2"})(["",""],(({size:e,variant:i,inverse:r})=>t(["border-radius:var(--borderRadius400);height:",";width:100%;background:",";overflow:hidden;position:relative;"],d[e],c(i,r).outerBarBackground))),x=e.div.withConfig({displayName:"loader.style__InnerBar",componentId:"sc-74569bc2-3"})(["",""],(({size:e,variant:i,inverse:r,animationTime:a,hasMotion:n})=>t(["@keyframes innerBarAnimationOne{0%{left:0%;animation-timing-function:linear;}30%{left:10px;animation-timing-function:cubic-bezier(0.5,0.6,0.4,1);}100%{left:calc(100% - 15px);}}@keyframes innerBarAnimationTwo{0%{width:15px;animation-timing-function:cubic-bezier(0.7,0,0.8,1);}50%{width:35%;}100%{width:15px;}}position:absolute;background:",";width:15px;height:",";border-radius:var(--borderRadius400);animation-name:innerBarAnimationOne,innerBarAnimationTwo;"," animation-iteration-count:",";"],c(i,r).innerBarBackground,d[e],n&&`animation-duration: ${a}s, ${a}s;`,n?"infinite, infinite":"none, none"))),h=e.svg.withConfig({displayName:"loader.style__StyledRingCircleSvg",componentId:"sc-74569bc2-4"})([""," ",' & circle[data-role="inner-arc"],',' & circle[data-role="inner-arc"]{stroke:currentColor;}'],(({inverse:e,size:i,hasMotion:r,isTracked:a,isError:n,isSuccess:o,animationTime:d})=>{const m=`${s[i]}px`,c=l[i];return t(["height:",";min-height:",';circle[data-role="outer-arc"]{fill:transparent;stroke-width:',"px;stroke:",';cx:12px;cy:12px;r:10px;}circle[data-role="inner-arc"]{fill:transparent;stroke-width:',"px;stroke:",";stroke-linecap:round;stroke-dasharray:100px;stroke-dashoffset:95px;transform-origin:12px 12px 0px;cx:12px;cy:12px;r:10px;transform:rotate(-90deg);@keyframes trackedAnimation{from{stroke-dasharray:100;stroke-dashoffset:100;}to{stroke-dasharray:100;stroke-dashoffset:20;}}@keyframes untrackedAnimation{0%{transform:rotate(-90deg);stroke-dashoffset:95;}50%{transform:rotate(90deg);stroke-dashoffset:80;}100%{transform:rotate(270deg);stroke-dashoffset:95;}}animation-name:",";"," animation-timing-function:cubic-bezier(0,0,1,1);animation-iteration-count:",";}"],m,m,c,e?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.08)",c,(({inverse:e,isSuccess:t,isError:i})=>i?"#DB004E;":t?"#00811F;":e?"#FFF;":"#000000")({inverse:e,isSuccess:o,isError:n}),a?"trackedAnimation":"untrackedAnimation",r&&`animation-duration: ${d}s;`,r?"infinite":"none")}),o,n),y="40px",b=e.div.withConfig({displayName:"loader.style__StyledStars",componentId:"sc-74569bc2-5"})(["position:relative;width:",";height:",";"],y,y),k={standalone:{small:"4px",medium:"8px",large:"12px"},ring:{"extra-small":"4px",small:"8px",medium:"8px",large:"12px"}},w=e.div.withConfig({displayName:"loader.style__StyledStarLoaderWrapper",componentId:"sc-74569bc2-6"})(["position:relative;display:flex;align-items:center;justify-content:center;"]),v=e(a).withConfig({displayName:"loader.style__StyledLoaderLabel",componentId:"sc-74569bc2-7"})([""," line-height:150%;color:",";"," &,"," &{color:currentColor;}",""],p,(({inverse:e})=>e?"rgba(255, 255, 255, 0.55)":"rgba(0, 0, 0, 0.65)"),o,n,(({size:e="medium",loaderType:i,loaderVariant:r})=>"star"===i?t(["font-size:16px;font-weight:400;margin-left:12px;width:min-content;"]):"standalone"===i?t(["font-size:",";font-weight:500;width:100%;margin-top:",";"],"large"===e?"16px":"14px",k[i][e]):t(["font-size:",";font-weight:500;width:",";",";"],"large"===e?"16px":"extra-small"===e?"13px":"14px","inline"===r?"auto":"100%","inline"===r?`margin-left: ${m[e]}`:`margin-top: ${k[i][e]}`))),_=e.div.withConfig({displayName:"loader.style__StyledRingLoaderWrapper",componentId:"sc-74569bc2-8"})(["",""],(({loaderVariant:e})=>t(["display:flex;flex-direction:",";align-items:center;justify-content:center;width:",";"],"inline"===e?"row":"column","inline"===e?"auto":"100%"))),B=e.span.withConfig({displayName:"loader.style__StyledLabel",componentId:"sc-74569bc2-9"})(["",";"],(({inverse:e})=>t(["color:",";"," &,"," &{color:currentColor;}"],e?"rgba(255, 255, 255, 0.90)":"rgba(0, 0, 0, 0.90)",o,n)));export{x as InnerBar,u as OuterBar,B as StyledLabel,f as StyledLoader,v as StyledLoaderLabel,g as StyledLoaderPlaceholder,h as StyledRingCircleSvg,_ as StyledRingLoaderWrapper,w as StyledStarLoaderWrapper,b as StyledStars};

package/esm/components/text-editor/__internal__/__ui__/ContentEditor/content-editor.component.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{jsxs as t,jsx as o}from"react/jsx-runtime";import{ContentEditable as e}from"@lexical/react/LexicalContentEditable";import{forwardRef as i}from"react";import r from"./content-editor.style.js";import"../../__plugins__/AutoLinker/auto-link.component.js";import"@lexical/react/LexicalComposerContext";import"@lexical/link";import"@lexical/headless";import"@lexical/html";import"lexical";import"@lexical/code";import"@lexical/list";import"@lexical/react/LexicalHorizontalRuleNode";import"@lexical/rich-text";import"../../../text-editor.context.js";import n from"../../__plugins__/useCursorAtEnd/index.js";import"../CharacterCounter/character-counter.style.js";import"lodash/debounce";import"../../../../../__internal__/i18n-context/index.js";import a from"../LinkPreviewer/link-previewer.component.js";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"react-dom";import"../Mentions/constants.js";import"../Mentions/mentions.style.js";import"../../../../tooltip/tooltip.component.js";import"../../../../portrait/portrait.style.js";import"../../../../../style/utils/filter-styled-system-padding-props.js";import"../Placeholder/placeholder.style.js";import"@lexical/utils";import"../Toolbar/toolbar.style.js";import"../../../../button/button.component.js";import"../../../../box/box.component.js";import"../Toolbar/buttons/typography-dropdown/dropdown.style.js";import"../../../../icon/icon.component.js";import"../Toolbar/button-group/button-group.style.js";import"../../../../../__internal__/form-field/form-field.component.js";import"../../../../../__internal__/hint-text/hint-text.style.js";import"../../../../carbon-provider/__internal__/new-validation.context.js";import"../../../../../__internal__/input/input.component.js";import"../../../../../__internal__/input/input-presentation.style.js";import"../../../../../__internal__/input-icon-toggle/input-icon-toggle.style.js";import"invariant";import"../../../../../__internal__/validations/validation-icon.style.js";import"../../../../../__internal__/validation-message/validation-message.style.js";import"../../../../numeral-date/__internal__/numeral-date.context.js";import"../../../../../__internal__/character-count/character-count.style.js";import"../../../../textbox/textbox.style.js";import"../../../../textbox/__internal__/prefix.style.js";import"../../../../dialog/dialog.style.js";import"../../../../heading/heading.style.js";import"../../../../icon-button/icon-button.component.js";import"../../../../typography/typography.component.js";import"react-transition-group";import"../../../../../hooks/__internal__/useScrollBlock/useScrollBlock.js";import"../../../../portal/portal.js";import"../../../../../__internal__/modal/modal-manager.js";import"../../../../../__internal__/modal/modal.style.js";import"../../../../../__internal__/modal/modal.context.js";import"../../../../carbon-provider/__internal__/top-modal.context.js";import"../../../../../__internal__/full-screen-heading/full-screen-heading.component.js";import"../../../../form/form.component.js";import"../../../../form/required-fields-indicator/required-fields-indicator.component.js";const l=i((({inputHint:i,namespace:l,previews:s=[],rows:p,readOnly:m,required:c,error:d,warning:_,validationMessagePositionTop:u,size:j="medium"},x)=>{const y=n(),b=d\|\|_?`${l}-validation-message`:"",g=i?`${l}-input-hint`:"",f=(u?`${b} ${g}`:`${g} ${b}`).trim();return t(r,{"data-role":`${l}-content-editable`,error:d,warning:_,namespace:l,rows:p,readOnly:m,size:j,children:[o(e,{~~ref~~:x,"aria-describedby":f,"aria-labelledby":`${l}-label`,"aria-required":c,"aria-invalid":d,className:`${l}-editable`,"data-role":`${l}-editable`,onBlur:t=>{var o;if(null===(o=t.relatedTarget)\|\|void 0===o?void 0:o.classList.contains("toolbar-button")){var e;const o=null===(e=t.relatedTarget)\|\|void 0===e?void 0:e.id;if(o){const t=document.querySelector(`[id="${o}"]`);t&&t.focus()}}},onFocus:t=>{t.relatedTarget&&t.relatedTarget.classList.contains("toolbar-button")\|\|y(t)},"aria-autocomplete":void 0,"aria-readonly":void 0}),o(a,{previews:s})]})}));export{l as default};
1	+ import{jsxs as t,jsx as o}from"react/jsx-runtime";import{ContentEditable as e}from"@lexical/react/LexicalContentEditable";import{forwardRef as i}from"react";import r from"./content-editor.style.js";import"../../__plugins__/AutoLinker/auto-link.component.js";import"@lexical/react/LexicalComposerContext";import"@lexical/link";import"@lexical/headless";import"@lexical/html";import"lexical";import"@lexical/code";import"@lexical/list";import"@lexical/react/LexicalHorizontalRuleNode";import"@lexical/rich-text";import"../../../text-editor.context.js";import n from"../../__plugins__/useCursorAtEnd/index.js";import"../CharacterCounter/character-counter.style.js";import"lodash/debounce";import"../../../../../__internal__/i18n-context/index.js";import a from"../LinkPreviewer/link-previewer.component.js";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"react-dom";import"../Mentions/constants.js";import"../Mentions/mentions.style.js";import"../../../../tooltip/tooltip.component.js";import"../../../../portrait/portrait.style.js";import"../../../../../style/utils/filter-styled-system-padding-props.js";import"../Placeholder/placeholder.style.js";import"@lexical/utils";import"../Toolbar/toolbar.style.js";import"../../../../button/button.component.js";import"../../../../box/box.component.js";import"../Toolbar/buttons/typography-dropdown/dropdown.style.js";import"../../../../icon/icon.component.js";import"../Toolbar/button-group/button-group.style.js";import"../../../../../__internal__/form-field/form-field.component.js";import"../../../../../__internal__/hint-text/hint-text.style.js";import"../../../../carbon-provider/__internal__/new-validation.context.js";import"../../../../../__internal__/input/input.component.js";import"../../../../../__internal__/input/input-presentation.style.js";import"../../../../../__internal__/input-icon-toggle/input-icon-toggle.style.js";import"invariant";import"../../../../../__internal__/validations/validation-icon.style.js";import"../../../../../__internal__/validation-message/validation-message.style.js";import"../../../../numeral-date/__internal__/numeral-date.context.js";import"../../../../../__internal__/character-count/character-count.style.js";import"../../../../textbox/textbox.style.js";import"../../../../textbox/__internal__/prefix.style.js";import"../../../../dialog/dialog.style.js";import"../../../../heading/heading.style.js";import"../../../../icon-button/icon-button.component.js";import"../../../../typography/typography.component.js";import"react-transition-group";import"../../../../../hooks/__internal__/useScrollBlock/useScrollBlock.js";import"../../../../portal/portal.js";import"../../../../../__internal__/modal/modal-manager.js";import"../../../../../__internal__/modal/modal.style.js";import"../../../../../__internal__/modal/modal.context.js";import"../../../../carbon-provider/__internal__/top-modal.context.js";import"../../../../../__internal__/full-screen-heading/full-screen-heading.component.js";import"../../../../form/form.component.js";import"../../../../form/required-fields-indicator/required-fields-indicator.component.js";const l=i((({inputHint:i,namespace:l,previews:s=[],rows:p,readOnly:m,required:c,error:d,warning:_,validationMessagePositionTop:u,size:j="medium",id:x},y)=>{const b=n(),g=d\|\|_?`${l}-validation-message`:"",f=i?`${l}-input-hint`:"",h=(u?`${g} ${f}`:`${f} ${g}`).trim();return t(r,{"data-role":`${l}-content-editable`,error:d,warning:_,namespace:l,rows:p,readOnly:m,size:j,children:[o(e,{id:x,ref:y,"aria-describedby":h,"aria-labelledby":`${l}-label`,"aria-required":c,"aria-invalid":d,className:`${l}-editable`,"data-role":`${l}-editable`,onBlur:t=>{var o;if(null===(o=t.relatedTarget)\|\|void 0===o?void 0:o.classList.contains("toolbar-button")){var e;const o=null===(e=t.relatedTarget)\|\|void 0===e?void 0:e.id;if(o){const t=document.querySelector(`[id="${o}"]`);t&&t.focus()}}},onFocus:t=>{t.relatedTarget&&t.relatedTarget.classList.contains("toolbar-button")\|\|b(t)},"aria-autocomplete":void 0,"aria-readonly":void 0}),o(a,{previews:s})]})}));export{l as default};

package/esm/components/text-editor/__internal__/__utils__/interfaces.types.d.ts CHANGED Viewed

@@ -23,6 +23,8 @@ export interface TextEditorProps extends MarginProps, TagProps {
     labelText: string;
     /** The identifier for the Text Editor. This allows for the using of multiple Text Editors on a screen */
     namespace?: string;
+    /** The id attribute, set on the content editable div within the Text Editor */
+    id?: string;
     /** Callback that is triggered when the editor loses focus. */
     onBlur?: (ev: React.FocusEvent<HTMLElement>) => void;
     /**
@@ -101,6 +103,8 @@ export interface ContentEditorProps {
     validationMessagePositionTop?: boolean;
     /** The size of the content editor */
     size?: "small" | "medium" | "large";
+    /** The id attribute */
+    id?: string;
 }
 export interface CharacterCounterPluginProps {
     /** Whether the content editor has focused */

package/esm/components/text-editor/text-editor.component.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{LexicalComposer as n}from"@lexical/react/LexicalComposer";import{ClickableLinkPlugin as o}from"@lexical/react/LexicalClickableLinkPlugin";import{LexicalErrorBoundary as i}from"@lexical/react/LexicalErrorBoundary";import{HistoryPlugin as a}from"@lexical/react/LexicalHistoryPlugin";import{MarkdownShortcutPlugin as l}from"@lexical/react/LexicalMarkdownShortcutPlugin";import{RichTextPlugin as s}from"@lexical/react/LexicalRichTextPlugin";import{LinkPlugin as c}from"@lexical/react/LexicalLinkPlugin";import{ListPlugin as p}from"@lexical/react/LexicalListPlugin";import{OnChangePlugin as d}from"@lexical/react/LexicalOnChangePlugin";import{$getRoot as _}from"lexical";import u,{forwardRef as m,useRef as f,useState as g,useImperativeHandle as h,useEffect as v,useMemo as b,useCallback as x}from"react";import y from"../../__internal__/label/label.component.js";import j from"../../hooks/__internal__/useLocale/useLocale.js";import w from"../../__internal__/utils/logger/index.js";import{COMPONENT_PREFIX as O,MARKDOWN_NODES as P}from"./__internal__/__utils__/constants.js";import L from"./__internal__/__plugins__/AutoLinker/auto-link.component.js";import C from"./__internal__/__plugins__/LinkMonitor/link-monitor.plugin.js";import E from"./__internal__/__plugins__/StyledSpanEnter/styled-span-enter.plugin.js";import"./__internal__/__plugins__/useCursorAtEnd/index.js";import T from"./text-editor.context.js";import{StyledTextEditorWrapper as k,StyledWrapper as S,StyledEditorToolbarWrapper as M,StyledHeaderWrapper as $,StyledTextEditor as B,StyledFooterWrapper as F}from"./text-editor.style.js";import{createEmpty as H,SerializeLexical as z,validateUrl as A}from"./__internal__/__utils__/helpers.js";import{HintText as q}from"../../__internal__/hint-text/hint-text.component.js";import D from"../../__internal__/validation-message/validation-message.component.js";import I from"../textbox/textbox.style.js";import"../../style/utils/filter-styled-system-padding-props.js";import R from"../../style/utils/filter-styled-system-margin-props.js";import V from"../../__internal__/utils/helpers/tags/tags.js";import U from"./__internal__/__ui__/ReadOnlyEditor/read-only-rte.component.js";import{getTheme as G}from"./__internal__/__utils__/theme.js";import J from"./__internal__/__ui__/CharacterCounter/character-counter.component.js";import K from"./__internal__/__ui__/ContentEditor/content-editor.component.js";import"./__internal__/__ui__/LinkPreviewer/link-previewer.style.js";import"@lexical/react/LexicalComposerContext";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"react-dom";import"./__internal__/__ui__/Mentions/constants.js";import"./__internal__/__ui__/Mentions/mentions.style.js";import"../tooltip/tooltip.component.js";import"../portrait/portrait.style.js";import N from"./__internal__/__ui__/Placeholder/placeholder.component.js";import Q from"./__internal__/__ui__/Toolbar/toolbar.component.js";function W(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function X(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){W(e,r,t[r])}))}return e}let Y=!1,Z=!1,ee=!1;const re=m(((m,W)=>{var re,te,ne,{characterLimit:oe=3e3,error:ie,footer:ae,header:le,inputHint:se,labelText:ce,namespace:pe=O,~~onBlur~~:de,~~onCancel~~:_e,~~onChange~~:ue,~~onFocus~~:me,~~onLinkAdded~~:fe,~~onSave~~:ge,~~placeholder~~:he,previews:ve=[],readOnly:be=!1,required:xe=!1,rows:ye,size:je="medium",warning:we,customPlugins:Oe,validationMessagePositionTop:Pe=!1,toolbarControls:Le}=m,Ce=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0\|\|(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0\|\|Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(m,["characterLimit","error","footer","header","inputHint","labelText","namespace","onBlur","onCancel","onChange","onFocus","onLinkAdded","onSave","placeholder","previews","readOnly","required","rows","size","warning","customPlugins","validationMessagePositionTop","toolbarControls"]);!Y&&Ce.value&&(Y=!0,w.deprecate("`value` is deprecated in TextEditor and support will soon be removed. Please use `initialValue` instead.")),!Z&&_e&&(Z=!0,w.deprecate("`onCancel` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the cancel functionality.")),!ee&&ge&&(ee=!0,w.deprecate("`onSave` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the save functionality."));const Ee=f(null!==(ne=null!==(te=Ce.initialValue)&&void 0!==te?te:Ce.value)&&void 0!==ne?ne:H()),Te=j(),[ke,Se]=g(void 0)~~,Me~~=f(null),[$e,Be]=g(!1);h(W,(()=>({focus(){var e;null===(e~~=Me~~.current)\|\|void 0===e\|\|e.focus()}})),[]),v((()=>{const e=null~~==Me~~?void 0~~:Me~~.current,r=()=>{Be(!0)},t=()=>{Be(!1)};return null==e\|\|e.addEventListener("focus",r),null==e\|\|e.addEventListener("blur",t),()=>{null==e\|\|e.removeEventListener("focus",r),null==e\|\|e.removeEventListener("blur",t)}}),[Me]);const Fe=b((()=>({namespace:pe,nodes:P,onError:e=>w.error(e.message),theme:G(),editorState:Ee.current,editable:!be})),[pe,be]),He=x(((e,r)=>{const t=e.read((()=>_().getChildren().map((e=>e.getTextContent())).join("\n\n")));if(ue){const e=z(r);null==ue\|\|ue(t,e)}if(oe>0){const e=oe-t.length;Se(e<0?Te.textEditor.characterLimit(Math.abs(e)):void 0)}}),[oe,Te.textEditor,ue]),ze=x((e=>{if(!e.isEditable())return;if(!_e)return;const r=e.parseEditorState(Ee.current);e.setEditorState(r),_e()}),[_e]),Ae=b((()=>({namespace:pe,onCancel:_e?ze:void 0,onSave:ge,toolbarControls:Le})),[ze,pe,_e,ge,Le]),qe=we\|\|ke,De=()=>{switch(je){case"large":return"var(--spacing150)";case"small":return"var(--spacing050)";default:return"var(--spacing100)"}};return e(k,(Ie=X({"data-role":`${pe}-editor-wrapper`,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==de\|\|de(e)},onFocus:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==me\|\|me(e)}},R(Ce),V("text-editor",Ce)),Re=null!=(Re={children:r(T.Provider,{value:{onLinkAdded:fe},children:[e(y,{isRequired:xe,labelId:`${pe}-label`,children:ce}),se&&!be&&e(q,{id:`${pe}-input-hint`,marginBottom:De(),children:se}),e(n,{initialConfig:Fe,children:r(S,{"data-role":`${pe}-wrapper`,children:[Pe&&r(t,{children:[e(D,{error:ie,warning:qe,validationId:`${pe}-validation-message`,"data-role":`${pe}-validation-message`,validationMessagePositionTop:Pe}),(ie\|\|qe)&&e(I,{warning:!(ie\|\|!qe)})]}),r(M,{"data-role":`${pe}-editor-toolbar-wrapper`,error:!!ie,id:`${pe}-editor-toolbar-wrapper`,children:[le&&e($,{"data-role":`${pe}-header-wrapper`,children:le}),be?e(U,{"aria-label":ce,initialValue:(null===(re~~=Me~~.current)\|\|void 0===re?void 0:re.innerHTML)\|\|Ee.current,size:je}):r(t,{children:[e(Q,X({contentEditorRef~~:Me~~,hasHeader:Boolean(le),size:je},Ae)),r(B,{"data-role":`${pe}-editor`,error:!!ie,children:[e(s,{contentEditable:e(K,{~~ref~~:Me,inputHint:se,isFocused~~:$e~~,namespace:pe,previews:ve,rows:ye,readOnly:be,required:xe,error:!!ie,warning:!!we\|\|!!ke,validationMessagePositionTop:Pe,size:je}),placeholder:e(N,{namespace:pe,text:he}),ErrorBoundary:i}),e(p,{}),e(a,{}),e(l,{}),e(d,{onChange:He,ignoreHistoryMergeTagChange:!0,ignoreSelectionChange:!0}),e(c,{validateUrl:A}),e(o,{newTab:!0}),e(L,{}),e(E,{}),u.Children.toArray(Oe)]})]}),ae&&e(F,{"data-role":`${pe}-footer-wrapper`,size:je,children:ae}),e(C,{})]}),!Pe&&r(t,{children:[e(D,{error:ie,warning:qe,validationId:`${pe}-validation-message`,"data-role":`${pe}-validation-message`,validationMessagePositionTop:Pe}),(ie\|\|qe)&&e(I,{warning:!(ie\|\|!qe)})]}),oe>0&&!be&&e(J,{isFocused~~:$e~~,maxChars:oe,namespace:pe,marginTop:De()})]})})]})})?Re:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Ie,Object.getOwnPropertyDescriptors(Re)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(Re)).forEach((function(e){Object.defineProperty(Ie,e,Object.getOwnPropertyDescriptor(Re,e))})),Ie));var Ie,Re}));export{re as TextEditor,re as default};
1	+ import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{LexicalComposer as n}from"@lexical/react/LexicalComposer";import{ClickableLinkPlugin as o}from"@lexical/react/LexicalClickableLinkPlugin";import{LexicalErrorBoundary as i}from"@lexical/react/LexicalErrorBoundary";import{HistoryPlugin as a}from"@lexical/react/LexicalHistoryPlugin";import{MarkdownShortcutPlugin as l}from"@lexical/react/LexicalMarkdownShortcutPlugin";import{RichTextPlugin as s}from"@lexical/react/LexicalRichTextPlugin";import{LinkPlugin as c}from"@lexical/react/LexicalLinkPlugin";import{ListPlugin as p}from"@lexical/react/LexicalListPlugin";import{OnChangePlugin as d}from"@lexical/react/LexicalOnChangePlugin";import{$getRoot as _}from"lexical";import u,{forwardRef as m,useRef as f,useState as g,useImperativeHandle as h,useEffect as v,useMemo as b,useCallback as x}from"react";import y from"../../__internal__/label/label.component.js";import j from"../../hooks/__internal__/useLocale/useLocale.js";import w from"../../__internal__/utils/logger/index.js";import{COMPONENT_PREFIX as O,MARKDOWN_NODES as P}from"./__internal__/__utils__/constants.js";import L from"./__internal__/__plugins__/AutoLinker/auto-link.component.js";import C from"./__internal__/__plugins__/LinkMonitor/link-monitor.plugin.js";import E from"./__internal__/__plugins__/StyledSpanEnter/styled-span-enter.plugin.js";import"./__internal__/__plugins__/useCursorAtEnd/index.js";import T from"./text-editor.context.js";import{StyledTextEditorWrapper as k,StyledWrapper as S,StyledEditorToolbarWrapper as M,StyledHeaderWrapper as $,StyledTextEditor as B,StyledFooterWrapper as F}from"./text-editor.style.js";import{createEmpty as H,SerializeLexical as z,validateUrl as A}from"./__internal__/__utils__/helpers.js";import{HintText as q}from"../../__internal__/hint-text/hint-text.component.js";import D from"../../__internal__/validation-message/validation-message.component.js";import I from"../textbox/textbox.style.js";import"../../style/utils/filter-styled-system-padding-props.js";import R from"../../style/utils/filter-styled-system-margin-props.js";import V from"../../__internal__/utils/helpers/tags/tags.js";import U from"./__internal__/__ui__/ReadOnlyEditor/read-only-rte.component.js";import{getTheme as G}from"./__internal__/__utils__/theme.js";import J from"./__internal__/__ui__/CharacterCounter/character-counter.component.js";import K from"./__internal__/__ui__/ContentEditor/content-editor.component.js";import"./__internal__/__ui__/LinkPreviewer/link-previewer.style.js";import"@lexical/react/LexicalComposerContext";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"react-dom";import"./__internal__/__ui__/Mentions/constants.js";import"./__internal__/__ui__/Mentions/mentions.style.js";import"../tooltip/tooltip.component.js";import"../portrait/portrait.style.js";import N from"./__internal__/__ui__/Placeholder/placeholder.component.js";import Q from"./__internal__/__ui__/Toolbar/toolbar.component.js";function W(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function X(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){W(e,r,t[r])}))}return e}let Y=!1,Z=!1,ee=!1;const re=m(((m,W)=>{var re,te,ne,{characterLimit:oe=3e3,error:ie,footer:ae,header:le,inputHint:se,labelText:ce,namespace:pe=O,id:de,onBlur:_e,onCancel:ue,onChange:me,onFocus:fe,onLinkAdded:ge,onSave:he,placeholder:ve,previews:be=[],readOnly:xe=!1,required:ye=!1,rows:je,size:we="medium",warning:Oe,customPlugins:Pe,validationMessagePositionTop:Le=!1,toolbarControls:Ce}=m,Ee=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0\|\|(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0\|\|Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(m,["characterLimit","error","footer","header","inputHint","labelText","namespace","id","onBlur","onCancel","onChange","onFocus","onLinkAdded","onSave","placeholder","previews","readOnly","required","rows","size","warning","customPlugins","validationMessagePositionTop","toolbarControls"]);!Y&&Ee.value&&(Y=!0,w.deprecate("`value` is deprecated in TextEditor and support will soon be removed. Please use `initialValue` instead.")),!Z&&ue&&(Z=!0,w.deprecate("`onCancel` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the cancel functionality.")),!ee&&he&&(ee=!0,w.deprecate("`onSave` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the save functionality."));const Te=f(null!==(ne=null!==(te=Ee.initialValue)&&void 0!==te?te:Ee.value)&&void 0!==ne?ne:H()),ke=j(),[Se,Me]=g(void 0),$e=f(null),[Be,Fe]=g(!1);h(W,(()=>({focus(){var e;null===(e=$e.current)\|\|void 0===e\|\|e.focus()}})),[]),v((()=>{const e=null==$e?void 0:$e.current,r=()=>{Fe(!0)},t=()=>{Fe(!1)};return null==e\|\|e.addEventListener("focus",r),null==e\|\|e.addEventListener("blur",t),()=>{null==e\|\|e.removeEventListener("focus",r),null==e\|\|e.removeEventListener("blur",t)}}),[$e]);const He=b((()=>({namespace:pe,nodes:P,onError:e=>w.error(e.message),theme:G(),editorState:Te.current,editable:!xe})),[pe,xe]),ze=x(((e,r)=>{const t=e.read((()=>_().getChildren().map((e=>e.getTextContent())).join("\n\n")));if(me){const e=z(r);null==me\|\|me(t,e)}if(oe>0){const e=oe-t.length;Me(e<0?ke.textEditor.characterLimit(Math.abs(e)):void 0)}}),[oe,ke.textEditor,me]),Ae=x((e=>{if(!e.isEditable())return;if(!ue)return;const r=e.parseEditorState(Te.current);e.setEditorState(r),ue()}),[ue]),qe=b((()=>({namespace:pe,onCancel:ue?Ae:void 0,onSave:he,toolbarControls:Ce})),[Ae,pe,ue,he,Ce]),De=Oe\|\|Se,Ie=()=>{switch(we){case"large":return"var(--spacing150)";case"small":return"var(--spacing050)";default:return"var(--spacing100)"}};return e(k,(Re=X({"data-role":`${pe}-editor-wrapper`,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==_e\|\|_e(e)},onFocus:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==fe\|\|fe(e)}},R(Ee),V("text-editor",Ee)),Ve=null!=(Ve={children:r(T.Provider,{value:{onLinkAdded:ge},children:[e(y,{isRequired:ye,labelId:`${pe}-label`,children:ce}),se&&!xe&&e(q,{id:`${pe}-input-hint`,marginBottom:Ie(),children:se}),e(n,{initialConfig:He,children:r(S,{"data-role":`${pe}-wrapper`,children:[Le&&r(t,{children:[e(D,{error:ie,warning:De,validationId:`${pe}-validation-message`,"data-role":`${pe}-validation-message`,validationMessagePositionTop:Le}),(ie\|\|De)&&e(I,{warning:!(ie\|\|!De)})]}),r(M,{"data-role":`${pe}-editor-toolbar-wrapper`,error:!!ie,id:`${pe}-editor-toolbar-wrapper`,children:[le&&e($,{"data-role":`${pe}-header-wrapper`,children:le}),xe?e(U,{"aria-label":ce,initialValue:(null===(re=$e.current)\|\|void 0===re?void 0:re.innerHTML)\|\|Te.current,size:we}):r(t,{children:[e(Q,X({contentEditorRef:$e,hasHeader:Boolean(le),size:we},qe)),r(B,{"data-role":`${pe}-editor`,error:!!ie,children:[e(s,{contentEditable:e(K,{id:de,ref:$e,inputHint:se,isFocused:Be,namespace:pe,previews:be,rows:je,readOnly:xe,required:ye,error:!!ie,warning:!!Oe\|\|!!Se,validationMessagePositionTop:Le,size:we}),placeholder:e(N,{namespace:pe,text:ve}),ErrorBoundary:i}),e(p,{}),e(a,{}),e(l,{}),e(d,{onChange:ze,ignoreHistoryMergeTagChange:!0,ignoreSelectionChange:!0}),e(c,{validateUrl:A}),e(o,{newTab:!0}),e(L,{}),e(E,{}),u.Children.toArray(Pe)]})]}),ae&&e(F,{"data-role":`${pe}-footer-wrapper`,size:we,children:ae}),e(C,{})]}),!Le&&r(t,{children:[e(D,{error:ie,warning:De,validationId:`${pe}-validation-message`,"data-role":`${pe}-validation-message`,validationMessagePositionTop:Le}),(ie\|\|De)&&e(I,{warning:!(ie\|\|!De)})]}),oe>0&&!xe&&e(J,{isFocused:Be,maxChars:oe,namespace:pe,marginTop:Ie()})]})})]})})?Ve:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Re,Object.getOwnPropertyDescriptors(Ve)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(Ve)).forEach((function(e){Object.defineProperty(Re,e,Object.getOwnPropertyDescriptor(Ve,e))})),Re));var Re,Ve}));export{re as TextEditor,re as default};

package/lib/components/button/__next__/__internal__/utils/is-icon-only.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+import { ReactNode } from "react";
+declare const isIconOnly: (children: ReactNode) => boolean;
+export default isIconOnly;

package/lib/components/button/__next__/__internal__/utils/is-icon-only.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("react-is");const t=i=>!!i&&e.Children.toArray(i).every((i=>e.isValidElement(i)?"Icon"===i.type.displayName\|\|!!r.isFragment(i)&&t(i.props.children):"string"==typeof i&&!i.trim().length));exports.default=t;

package/lib/components/button/__next__/button.component.d.ts ADDED Viewed

@@ -0,0 +1,62 @@
+import React, { ReactNode } from "react";
+import { SpaceProps } from "styled-system";
+import { ButtonProps as LegacyButtonProps } from "../button.component";
+import { TagProps } from "../../../__internal__/utils/helpers/tags/tags";
+import { Size, Variant, VariantType } from "./button.config";
+export type ButtonHandle = {
+    focusButton: () => void;
+} | null;
+export interface ButtonProps extends Omit<LegacyButtonProps, "size" | "type" | "iconTooltipMessage" | "iconTooltipPosition">, SpaceProps, TagProps {
+    /** Identifies the element(s) offering additional information about the button that the user might require. */
+    "aria-describedby"?: string;
+    /**
+     * The aria-label attribute of the button.
+     */
+    "aria-label"?: string;
+    /** Identifies the element(s) labelling the button. */
+    "aria-labelledby"?: string;
+    /** The content that the button displays. */
+    children?: ReactNode;
+    /** Flag to indicate that the button is disabled. */
+    disabled?: boolean;
+    /** Flag to indicate that the button can be full-width. */
+    fullWidth?: boolean;
+    /** The ID of the button. */
+    id?: string;
+    /** Set the button to use a dark-mode appearance. */
+    inverse?: boolean;
+    /** The name of the button. */
+    name?: string;
+    /** Flag to indicate whether the button text can wrap over multiple lines. */
+    noWrap?: boolean;
+    /** Handler to fire when the button is blurred. */
+    onBlur?: (ev: React.FocusEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** Handler to fire when the button is clicked. */
+    onClick?: (ev: React.MouseEvent<HTMLAnchorElement> | React.MouseEvent<HTMLButtonElement>) => void;
+    /** Handler to fire when the button is focused. */
+    onFocus?: (ev: React.FocusEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** Handler to fire when the button is activated via the Enter or Space keys. */
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /** The size of the button. */
+    size?: Size;
+    /** The HTML type that this button should use. */
+    type?: "button" | "reset" | "submit";
+    /** The variant of the button. */
+    variant?: Variant;
+    /** The variant type of the button. */
+    variantType?: VariantType;
+    /**
+     * @deprecated Please use `variantType` prop instead.
+     * */
+    buttonType?: LegacyButtonProps["buttonType"];
+    /**
+     * @deprecated Please use `variant="destructive"` instead.
+     * */
+    destructive?: LegacyButtonProps["destructive"];
+    /**
+     * @deprecated Please use `inverse` instead.
+     * */
+    isWhite?: LegacyButtonProps["isWhite"];
+}
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<ButtonHandle>>;
+export default Button;

package/lib/components/button/__next__/button.component.js ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./button.style.js"),n=require("../../../__internal__/utils/helpers/tags/tags.js"),a=require("../../../hooks/useMediaQuery/useMediaQuery.js"),i=require("./__internal__/utils/is-icon-only.js"),o=require("../../icon/icon.component.js");function l(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function u(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){l(e,r,t[r])}))}return e}function c(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const s=r.forwardRef(((l,s)=>{var{"aria-describedby":d,"aria-label":y,"aria-labelledby":p,children:b,disabled:f=!1,fullWidth:v=!1,id:j,inverse:O,name:h,noWrap:g=!0,onClick:m,size:T="medium",variant:P="default",variantType:w="primary",buttonType:x,destructive:k,iconType:_,iconPosition:S="before",isWhite:W,href:$}=l,q=function(e,r){if(null==e)return{};var t,n,a=function(e,r){if(null==e)return{};var t,n,a={},i=Object.keys(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||(a[t]=e[t]);return a}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)t=i[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}(l,["aria-describedby","aria-label","aria-labelledby","children","disabled","fullWidth","id","inverse","name","noWrap","onClick","size","variant","variantType","buttonType","destructive","iconType","iconPosition","isWhite","href"]);const B=r.useRef(null),C=void 0!==b&&!1!==b,D=!!_&&!C||i.default(b);r.useImperativeHandle(s,(()=>({focusButton:()=>{var e;null===(e=B.current)||void 0===e||e.focus()}})),[]);const M=a.default("screen and (prefers-reduced-motion: no-preference)"),{variant:z,variantType:E}=(({buttonType:e,destructive:r,variant:t,variantType:n})=>{if(!e&&!r)return{variant:t,variantType:n};if(r)return{variant:"destructive",variantType:"primary"===(null!=e?e:n)?"primary":"secondary"};switch(e){case"primary":return{variant:"default",variantType:"primary"};case"tertiary":return{variant:"default",variantType:"tertiary"};case"darkBackground":default:return{variant:"default",variantType:"secondary"};case"gradient-grey":case"gradient-white":return{variant:"gradient",variantType:"secondary"}}})({buttonType:x,destructive:k,variant:P,variantType:w});return e.jsx(t.StyledButton,c(u({$allowMotion:M,"aria-describedby":d,"aria-label":y,"aria-labelledby":p,disabled:f,$fullWidth:v,$inverse:O||"darkBackground"===x||W,id:j,name:h,$noWrap:g,onClick:$?void 0:e=>{var r;null===(r=B.current)||void 0===r||r.focus({preventScroll:!0}),null==m||m(e)},ref:B,$size:T,$variant:z,$variantType:E,as:!f&&$?"a":"button",href:$,$iconOnly:D},n.default("button",q),q),{children:e.jsx(t.StyledContentContainer,{"data-role":"button-child-container",children:(()=>{if(!_)return b;const r={"aria-hidden":!0,bg:"transparent"};return C?"before"===S?e.jsxs(e.Fragment,{children:[e.jsx(o.default,c(u({type:_},r),{"data-role":"button-icon-before"})),b]}):e.jsxs(e.Fragment,{children:[b,e.jsx(o.default,c(u({type:_},r),{"data-role":"button-icon-after"}))]}):e.jsx(o.default,c(u({type:_},r),{"data-role":"button-icon-only"}))})()})}))}));exports.Button=s,exports.default=s;

package/lib/components/button/__next__/button.config.d.ts ADDED Viewed

@@ -0,0 +1,34 @@
+export type Size = "xs" | "small" | "medium" | "large";
+export type Variant = "default" | "destructive" | "gradient";
+export type VariantType = "primary" | "secondary" | "tertiary" | "subtle";
+export type ConfigEntry = Record<"active" | "default" | "disabled" | "hover", string>;
+export type ColorConfig = {
+    [key in Variant]: {
+        [key in VariantType]?: {
+            background: ConfigEntry;
+            border: ConfigEntry;
+            label: ConfigEntry;
+        };
+    };
+};
+export type InverseColorConfig = {
+    [key in VariantType]: {
+        background: ConfigEntry;
+        border: ConfigEntry;
+        label: ConfigEntry;
+    };
+};
+export type PropConfig = {
+    [key in Size]: {
+        borderRadius: string;
+        font: string;
+        height: string;
+        iconOnlyWidth: string;
+        paddingVertical: string;
+        paddingHorizontal: string;
+    };
+};
+export declare const propsForSize: PropConfig;
+export declare const inverseColourSettings: InverseColorConfig;
+export declare const colourSettings: ColorConfig;
+export declare const gradientAnimation: import("styled-components").FlattenSimpleInterpolation;

package/lib/components/button/__next__/button.config.js ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";const a=require("styled-components").css(["@keyframes gradient-loop{0%{background-position:0% 0;}100%{background-position:-200% 0;}}"]);exports.colourSettings={default:{primary:{background:{active:"var(--button-typical-primary-bg-active)",default:"var(--button-typical-primary-bg-default)",disabled:"var(--button-typical-primary-bg-disabled)",hover:"var(--button-typical-primary-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-primary-label-active)",default:"var(--button-typical-primary-label-default)",disabled:"var(--button-typical-primary-label-disabled)",hover:"var(--button-typical-primary-label-hover)"}},secondary:{background:{active:"var(--button-typical-secondary-bg-active)",default:"var(--button-typical-secondary-bg-default)",disabled:"var(--button-typical-secondary-bg-disabled)",hover:"var(--button-typical-secondary-bg-hover)"},border:{active:"var(--button-typical-secondary-border-active)",default:"var(--button-typical-secondary-border-default)",disabled:"var(--button-typical-secondary-border-disabled)",hover:"var(--button-typical-secondary-border-hover)"},label:{active:"var(--button-typical-secondary-label-active)",default:"var(--button-typical-secondary-label-default)",disabled:"var(--button-typical-secondary-label-disabled)",hover:"var(--button-typical-secondary-label-hover)"}},tertiary:{background:{active:"var(--button-typical-tertiary-bg-active)",default:"var(--button-typical-tertiary-bg-default)",disabled:"var(--button-typical-tertiary-bg-disabled)",hover:"var(--button-typical-tertiary-bg-hover)"},border:{active:"var(--button-typical-tertiary-border-active)",default:"var(--button-typical-tertiary-border-default)",disabled:"var(--button-typical-tertiary-border-disabled)",hover:"var(--button-typical-tertiary-border-hover)"},label:{active:"var(--button-typical-tertiary-label-active)",default:"var(--button-typical-tertiary-label-default)",disabled:"var(--button-typical-tertiary-label-disabled)",hover:"var(--button-typical-tertiary-label-hover)"}},subtle:{background:{active:"var(--button-typical-subtle-bg-active)",default:"transparent",disabled:"transparent",hover:"var(--button-typical-subtle-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-subtle-label-active)",default:"var(--button-typical-subtle-label-default)",disabled:"var(--button-typical-subtle-label-disabled)",hover:"var(--button-typical-subtle-label-hover)"}}},destructive:{primary:{background:{active:"",default:"var(--button-destructive-primary-bg-default)",disabled:"var(--button-destructive-primary-bg-disabled)",hover:"var(--button-destructive-primary-bg-hover)"},label:{active:"",default:"var(--button-destructive-primary-label-default)",disabled:"var(--button-destructive-primary-label-disabled)",hover:"var(--button-destructive-primary-label-hover)"},border:{active:"",default:"transparent",disabled:"transparent",hover:"transparent"}},secondary:{background:{active:"",default:"transparent",disabled:"transparent",hover:"var(--button-destructive-secondary-bg-hover)"},label:{active:"",default:"var(--button-destructive-secondary-label-default)",disabled:"var(--button-destructive-secondary-label-disabled)",hover:"var(--button-destructive-secondary-label-hover)"},border:{active:"",default:"var(--button-destructive-secondary-border-default)",disabled:"var(--button-destructive-secondary-border-disabled)",hover:"var(--button-destructive-secondary-border-hover)"}}},gradient:{secondary:{background:{active:"var(--button-ai-bg-active, linear-gradient(90deg, var(--mode-color-action-ai-active-stop-1) 0%, var(--mode-color-action-ai-active-stop-2) 40%, var(--mode-color-action-ai-active-stop-3) 90%))",default:"transparent",disabled:"transparent",hover:"var(--button-ai-bg-hover, linear-gradient(90deg, var(--mode-color-action-ai-hover-stop-1) 0%, var(--mode-color-action-ai-hover-stop-2) 40%, var(--mode-color-action-ai-hover-stop-3) 90%))"},border:{active:"var(--button-ai-border-active)",default:"var(--button-ai-border-default)",disabled:"var(--button-ai-border-disabled)",hover:"var(--button-ai-border-hover)"},label:{active:"var(--button-ai-label-active)",default:"var(--button-ai-label-default)",disabled:"var(--button-ai-label-disabled)",hover:"var(--button-ai-label-hover)"}}}},exports.gradientAnimation=a,exports.inverseColourSettings={primary:{background:{active:"var(--button-typical-primary-inverse-bg-active)",default:"var(--button-typical-primary-inverse-bg-default)",disabled:"var(--button-typical-primary-inverse-bg-disabled)",hover:"var(--button-typical-primary-inverse-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-primary-inverse-label-active)",default:"var(--button-typical-primary-inverse-label-default)",disabled:"var(--button-typical-primary-inverse-label-disabled)",hover:"var(--button-typical-primary-inverse-label-hover)"}},secondary:{background:{active:"var(--button-typical-secondary-inverse-bg-active)",default:"var(--button-typical-secondary-inverse-bg-default)",disabled:"transparent",hover:"var(--button-typical-secondary-inverse-bg-hover)"},border:{active:"var(--button-typical-secondary-inverse-border-active)",default:"var(--button-typical-secondary-inverse-border-default)",disabled:"var(--button-typical-secondary-inverse-border-disabled)",hover:"var(--button-typical-secondary-inverse-border-hover)"},label:{active:"var(--button-typical-secondary-inverse-label-active)",default:"var(--button-typical-secondary-inverse-label-default)",disabled:"var(--button-typical-secondary-inverse-label-disabled)",hover:"var(--button-typical-secondary-inverse-label-hover)"}},tertiary:{background:{active:"var(--button-typical-tertiary-inverse-bg-active)",default:"var(--button-typical-tertiary-inverse-bg-default)",disabled:"transparent",hover:"var(--button-typical-tertiary-inverse-bg-hover)"},border:{active:"var(--button-typical-tertiary-inverse-border-active)",default:"var(--button-typical-tertiary-inverse-border-default)",disabled:"var(--button-typical-tertiary-inverse-border-disabled)",hover:"var(--button-typical-tertiary-inverse-border-hover)"},label:{active:"var(--button-typical-tertiary-inverse-label-active)",default:"var(--button-typical-tertiary-inverse-label-default)",disabled:"var(--button-typical-tertiary-inverse-label-disabled)",hover:"var(--button-typical-tertiary-inverse-label-hover)"}},subtle:{background:{active:"var(--button-typical-subtle-inverse-bg-active)",default:"transparent",disabled:"transparent",hover:"var(--button-typical-subtle-inverse-bg-hover)"},border:{active:"transparent",default:"transparent",disabled:"transparent",hover:"transparent"},label:{active:"var(--button-typical-subtle-inverse-label-active)",default:"var(--button-typical-subtle-inverse-label-default)",disabled:"var(--button-typical-subtle-inverse-label-disabled)",hover:"var(--button-typical-subtle-inverse-label-hover)"}}},exports.propsForSize={xs:{borderRadius:"var(--global-radius-action-l)",font:"var(--global-font-static-comp-medium-xs)",height:"var(--global-size-xs)",iconOnlyWidth:"var(--global-size-xs)",paddingVertical:"var(--global-space-none)",paddingHorizontal:"var(--global-space-comp-s)"},small:{borderRadius:"var(--global-radius-action-l)",font:"var(--global-font-static-comp-medium-s)",height:"var(--global-size-s)",iconOnlyWidth:"var(--global-size-s)",paddingVertical:"var(--global-space-comp-2-xs)",paddingHorizontal:"var(--global-space-comp-m)"},medium:{borderRadius:"var(--global-radius-action-xl)",font:"var(--global-font-static-comp-medium-m)",height:"var(--global-size-m)",iconOnlyWidth:"var(--global-size-m)",paddingVertical:"6px",paddingHorizontal:"var(--global-space-comp-l)"},large:{borderRadius:"var(--global-radius-action-2-xl)",font:"var(--global-font-static-comp-medium-l)",height:"var(--global-size-l)",iconOnlyWidth:"var(--global-size-l)",paddingVertical:"6px",paddingHorizontal:"var(--global-space-comp-l)"}};

package/lib/components/button/__next__/button.style.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { SpaceProps } from "styled-system";
+import { Size, Variant, VariantType } from "./button.config";
+type StyledButtonProps = SpaceProps & {
+    $allowMotion?: boolean;
+    $inverse?: boolean;
+    $fullWidth?: boolean;
+    $noWrap?: boolean;
+    $iconOnly?: boolean;
+};
+export declare const StyledContentContainer: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledButton: import("styled-components").StyledComponent<"button", any, Omit<StyledButtonProps, "size" | "variantType" | "variant"> & {
+    $size: Size;
+    $variant: Variant;
+    $variantType: VariantType;
+}, never>;
+export default StyledButton;

package/lib/components/button/__next__/button.style.js ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("styled-components"),e=require("styled-system"),r=require("../../../style/utils/add-focus-styling.js"),i=require("./button.config.js");function n(o){return o&&o.__esModule?o:{default:o}}var t=n(o);const a=t.default.span.withConfig({displayName:"button.style__StyledContentContainer",componentId:"sc-c07486b9-0"})(["display:flex;gap:var(--global-space-comp-s);align-items:center;justify-content:center;"]),d=t.default.button.withConfig({displayName:"button.style__StyledButton",componentId:"sc-c07486b9-1"})([""," align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;outline-offset:0;text-decoration:none;vertical-align:middle;cursor:pointer;"," "," &:focus{"," position:relative;z-index:1;}"],e.space,(({$allowMotion:e,disabled:r,$inverse:n,$size:t,$variant:a,$variantType:d,$iconOnly:l})=>n?(({disabled:e,size:r,variantType:n,iconOnly:t})=>{const{background:a,border:d,label:l}=i.inverseColourSettings[n],{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=i.propsForSize[r];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],a.default,"tertiary"===n?"1px":"2px",d.default,t?"var(--global-radius-action-circle)":s,l.default,c,u,t?u:"max-content",b,t?"":v,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],a.disabled,d.disabled,l.disabled):o.css(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],a.active,l.active,d.active,a.hover,l.hover,d.hover))})({disabled:r,size:t,variantType:d,iconOnly:l}):"gradient"===a?o.css([""," ",""],i.gradientAnimation,(({allowMotion:e=!0,disabled:r,size:n,iconOnly:t})=>{const{background:a,border:d,label:l}=i.colourSettings.gradient.secondary||{},{borderRadius:s,font:c,height:u,paddingVertical:b,paddingHorizontal:v}=i.propsForSize[n];return o.css(["position:relative;z-index:0;border:none;border-radius:",";background:white;color:var(--button-ai-label-default);font:",";height:",";width:",";padding:"," ",';overflow:hidden;&::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;z-index:-1;background:var(--button-ai-border-default);background-position:0% 0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;}&:hover{background:linear-gradient( 90deg,var(--mode-color-action-ai-hover-stop-1) 0%,var(--mode-color-action-ai-hover-stop-2) 40%,var(--mode-color-action-ai-hover-stop-3) 90% );}&:hover::before{',"}"," ",""],t?"var(--global-radius-action-circle)":s,c,u,t?u:"max-content",b,t?"":v,e&&o.css(["background-size:300% 100%;animation:gradient-loop 1000ms linear infinite;"]),r&&o.css(["opacity:0.6;pointer-events:none;cursor:not-allowed;&::before{animation:none;background:none;-webkit-mask:none;mask:none;border:2px solid var(--button-ai-border-disabled);padding:0;}color:var(--button-ai-label-disabled);"]),!r&&o.css(["&:active{background:",";color:",";border-color:",";}"],null==a?void 0:a.active,null==l?void 0:l.active,null==d?void 0:d.active))})({allowMotion:e,disabled:r,size:t,iconOnly:l})):(({disabled:e,size:r,variant:n,variantType:t,iconOnly:a})=>{const{background:d,border:l,label:s}=i.colourSettings[n][t]||{},{borderRadius:c,font:u,height:b,paddingVertical:v,paddingHorizontal:p}=i.propsForSize[r];return o.css(["background-color:",";border:"," solid ",";border-radius:",";color:",";font:",";height:",";width:",";padding:"," ",";",""],null==d?void 0:d.default,"tertiary"===t?"1px":"2px",null==l?void 0:l.default,a?"var(--global-radius-action-circle)":c,null==s?void 0:s.default,u,b,a?b:"max-content",v,a?"":p,e?o.css(["background-color:",";border-color:",";color:",";cursor:not-allowed;"],null==d?void 0:d.disabled,null==l?void 0:l.disabled,null==s?void 0:s.disabled):o.css(["&:active{background-color:",";color:",";border-color:",";}&:hover{background-color:",";color:",";border-color:",";}"],null==d?void 0:d.active,null==s?void 0:s.active,null==l?void 0:l.active,null==d?void 0:d.hover,null==s?void 0:s.hover,null==l?void 0:l.hover))})("xs"!==t||"primary"!==d&&"default"===a?"destructive"!==a||"tertiary"!==d&&"subtle"!==d?{disabled:r,size:t,variant:a,variantType:d,iconOnly:l}:{disabled:r,size:t,variant:a,variantType:"primary",iconOnly:l}:{disabled:r,size:"xs",variant:"default",variantType:"secondary",iconOnly:l})),(({$fullWidth:e,$size:r,$noWrap:n})=>o.css([""," ",""],e&&o.css(["width:100%;"]),n?"white-space: nowrap;":`\n flex-flow: wrap;\n min-height: ${i.propsForSize[r].height};\n height: unset;\n `)),r.default());exports.StyledButton=d,exports.StyledContentContainer=a,exports.default=d;

package/lib/components/button/__next__/index.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export { default } from "./button.component";
2	+ export type { ButtonProps } from "./button.component";

package/lib/components/button/__next__/index.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./button.component.js");exports.default=e.Button;

package/lib/components/button/__next__/package.json ADDED Viewed

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "main": "./index.js",
+  "module": "../../../esm/components/button/__next__/index.js",
+  "types": "./index.d.ts"
+}

package/lib/components/button/button.component.d.ts CHANGED Viewed

@@ -3,7 +3,11 @@ import { SpaceProps } from "styled-system";
 import { IconType } from "../icon";
 import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
 import { TooltipPositions } from "../tooltip/tooltip.config";
-export type ButtonTypes = "primary" | "secondary" | "tertiary" | "darkBackground" | "gradient-grey" | "gradient-white";
+/**
+ * @deprecated Use "primary", "secondary", "tertiary" or "gradient" instead.
+ */
+export type DeprecatedButtonTypes = "darkBackground" | "gradient-grey" | "gradient-white";
+export type ButtonTypes = "primary" | "secondary" | "tertiary" | DeprecatedButtonTypes;
 export type SizeOptions = "small" | "medium" | "large";
 export type ButtonIconPosition = "before" | "after";
 export interface ButtonProps extends SpaceProps, TagProps {
@@ -16,7 +20,9 @@ export interface ButtonProps extends SpaceProps, TagProps {
     "aria-labelledby"?: string;
     /** Identifies the element(s) offering additional information about the button the user might require. */
     "aria-describedby"?: string;
-    /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
+    /**
+     * @deprecated Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground"
+     * */
     buttonType?: ButtonTypes;
     /** The text the button displays */
     children?: React.ReactNode;
@@ -24,11 +30,15 @@ export interface ButtonProps extends SpaceProps, TagProps {
     name?: string;
     /** Apply disabled state to the button */
     disabled?: boolean;
-    /** Apply destructive style to the button */
+    /**
+     * @deprecated Apply destructive style to the button
+     * */
     destructive?: boolean;
     /** Apply fullWidth style to the button */
     fullWidth?: boolean;
-    /** Used to transform button into anchor */
+    /**
+     * @deprecated Used to transform button into anchor
+     * */
     href?: string;
     /** Defines an Icon position related to the children: "before" | "after" */
     iconPosition?: ButtonIconPosition;
@@ -40,7 +50,9 @@ export interface ButtonProps extends SpaceProps, TagProps {
     iconType?: IconType;
     /** id attribute */
     id?: string;
-    /** Whether to use the white-on-dark colour variant */
+    /**
+     * @deprecated Whether to use the white-on-dark colour variant
+     * */
     isWhite?: boolean;
     /** If provided, the text inside a button will not wrap */
     noWrap?: boolean;
@@ -56,13 +68,19 @@ export interface ButtonProps extends SpaceProps, TagProps {
     onClick?: (ev: React.MouseEvent<HTMLAnchorElement> | React.MouseEvent<HTMLButtonElement>) => void;
     /** Assigns a size to the button: "small" | "medium" | "large" */
     size?: SizeOptions;
-    /** Second text child, renders under main text, only when size is "large" */
+    /**
+     * @deprecated Second text child, renders under main text, only when size is "large"
+     * */
     subtext?: string;
     /** HTML button type property */
     type?: string;
-    /** HTML target attribute */
+    /**
+     * @deprecated HTML target attribute
+     * */
     target?: string;
-    /** HTML rel attribute */
+    /**
+     * @deprecated HTML rel attribute
+     * */
     rel?: string;
     /**
      * @private
@@ -72,5 +90,8 @@ export interface ButtonProps extends SpaceProps, TagProps {
      */
     className?: string;
 }
+/**
+ * @deprecated This version of Button has been deprecated. See the Carbon documentation for migration details.
+ */
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 export default Button;

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

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),i=require("../../__internal__/utils/logger/index.js"),o=require("../../style/themes/apply-base-theme.js"),s=require("../../style/utils/add-focus-styling.js"),r=require("../../style/utils/color.js"),n=require("../../__internal__/dom/globals.js"),l=require("../../__internal__/utils/helpers/browser-type-check/index.js"),a=require("./icon-config.js"),c=require("./icon-unicodes.js");function u(e){return e&&e.__esModule?e:{default:e}}const d=u(e).default.span.attrs(o.default).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-~~74150e41~~-0"})(["",""],(({theme:o,color:u,bg:d,isInteractive:f,bgSize:g,bgShape:m,type:h,fontSize:b,disabled:p,hasTooltip:y})=>{let _="var(--colorsYin090)",S="transparent";const v=n.getWindow(),z=n.getNavigator(),j=function(e,t){const o={small:1,medium:2,large:3,"extra-large":4};return e&&t?o[t]<o[e]?(i.default.warn(`[WARNING - Icon] The "${t}" \`bgSize\` is smaller than "${e}" \`fontSize\`, the \`bgSize\` has been auto adjusted to a larger size.`),a.default.backgroundSize[e]):a.default.backgroundSize[t]:t?a.default.backgroundSize[t]:void 0}(b,g);if(p)_="var(--colorsYin030)";else if(u){const{color:e}=r.default({color:u,theme:o});_=e}if(d){const{backgroundColor:e}=r.default({bg:d,theme:o});S=e}return e.css(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," ",""],_,S,j,j,m?`border-radius: ${a.default.backgroundShape[m]}`:"",f&&e.css(["&:not(:focus):hover{filter:brightness(0.9);}"]),c.default[h],b&&e.css(["font-size:",";line-height:",";"],a.default.iconSize[b],a.default.iconSize[b]),v&&"services"===h&&l.default(v)&&e.css(["margin-top:",";"],"small"===b?"-7px":"-8px"),z&&v&&"services"===h&&l.isSafari(z)&&!l.default(v)&&e.css(["margin-top:-6px;"]),y&&`\n :focus {\n ${s.default()}\n }\n `,t.margin)}));exports.default=d;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),o=require("../../__internal__/utils/logger/index.js"),i=require("../../style/themes/apply-base-theme.js"),r=require("../../style/utils/add-focus-styling.js"),n=require("../../style/utils/color.js"),s=require("../../__internal__/dom/globals.js"),l=require("../../__internal__/utils/helpers/browser-type-check/index.js"),a=require("./icon-config.js"),u=require("./icon-unicodes.js"),c=require("../button/__next__/button.style.js");function d(e){return e&&e.__esModule?e:{default:e}}const f=d(e).default.span.attrs(i.default).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-d8f39d88-0"})([""," "," &{color:currentColor;}"],(({theme:i,color:c,bg:d,isInteractive:f,bgSize:g,bgShape:m,type:b,fontSize:h,disabled:p,hasTooltip:y})=>{let _="var(--colorsYin090)",S="transparent";const v=s.getWindow(),z=s.getNavigator(),j=function(e,t){const i={small:1,medium:2,large:3,"extra-large":4};return e&&t?i[t]<i[e]?(o.default.warn(`[WARNING - Icon] The "${t}" \`bgSize\` is smaller than "${e}" \`fontSize\`, the \`bgSize\` has been auto adjusted to a larger size.`),a.default.backgroundSize[e]):a.default.backgroundSize[t]:t?a.default.backgroundSize[t]:void 0}(h,g);if(p)_="var(--colorsYin030)";else if(c){const{color:e}=n.default({color:c,theme:i});_=e}if(d){const{backgroundColor:e}=n.default({bg:d,theme:i});S=e}return e.css(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," ",""],_,S,j,j,m?`border-radius: ${a.default.backgroundShape[m]}`:"",f&&e.css(["&:not(:focus):hover{filter:brightness(0.9);}"]),u.default[b],h&&e.css(["font-size:",";line-height:",";"],a.default.iconSize[h],a.default.iconSize[h]),v&&"services"===b&&l.default(v)&&e.css(["margin-top:",";"],"small"===h?"-7px":"-8px"),z&&v&&"services"===b&&l.isSafari(z)&&!l.default(v)&&e.css(["margin-top:-6px;"]),y&&`\n :focus {\n ${r.default()}\n }\n `,t.margin)}),c.StyledButton);exports.default=f;

package/lib/components/loader/__next__/loader.style.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";var e=require("styled-components"),a=require("styled-system"),t=require("../../../style/themes/apply-base-theme.js"),r=require("../../typography/typography.component.js");require("react/jsx-runtime"),require("react");var i=require("../../button/button.style.js");function n(e){return e&&e.__esModule?e:{default:e}}var o=n(e);const s={"extra-small":20,small:32,medium:64,large:80},l={"extra-small":2.7,small:2.7,medium:2.7,large:2.7},d={small:"4px",medium:"8px",large:"16px"},c={"extra-small":"8px",small:"8px",medium:"12px",large:"16px"},p=(e,a)=>{const t=a?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.08)";return"ai"===e?{outerBarBackground:t,innerBarBackground:a?"linear-gradient(90deg, var(--mode-color-ai-alt-stop-1, #00D639) 0%, var(--mode-color-ai-alt-stop-2, #00D6DE) 40%, var(--mode-color-ai-alt-stop-3, #9D60FF) 90%)":"linear-gradient(90deg, var(--mode-color-ai-stop-1, #13A038) 0%, var(--mode-color-ai-stop-2, #149197) 40%, var(--mode-color-ai-stop-3, #A87CFB) 90%)"}:{outerBarBackground:t,innerBarBackground:a?"#FFFFFF":"#000000"}},m=e.css(["display:flex;justify-content:center;text-align:center;"]),f=o.default.div.withConfig({displayName:"loader.style__StyledLoaderPlaceholder",componentId:"sc-~~aaaf19f2~~-0"})(["display:inline-block;min-width:var(--sizing800);"]),u=o.default.div.attrs(t.default).withConfig({displayName:"loader.style__StyledLoader",componentId:"sc-~~aaaf19f2~~-1"})([""," text-align:center;white-space:nowrap;"],a.margin),g=o.default.div.withConfig({displayName:"loader.style__OuterBar",componentId:"sc-~~aaaf19f2~~-2"})(["",""],(({size:a,variant:t,inverse:r})=>e.css(["border-radius:var(--borderRadius400);height:",";width:100%;background:",";overflow:hidden;position:relative;"],d[a],p(t,r).outerBarBackground))),x=o.default.div.withConfig({displayName:"loader.style__InnerBar",componentId:"sc-~~aaaf19f2~~-3"})(["",""],(({size:a,variant:t,inverse:r,animationTime:i,hasMotion:n})=>e.css(["@keyframes innerBarAnimationOne{0%{left:0%;animation-timing-function:linear;}30%{left:10px;animation-timing-function:cubic-bezier(0.5,0.6,0.4,1);}100%{left:calc(100% - 15px);}}@keyframes innerBarAnimationTwo{0%{width:15px;animation-timing-function:cubic-bezier(0.7,0,0.8,1);}50%{width:35%;}100%{width:15px;}}position:absolute;background:",";width:15px;height:",";border-radius:var(--borderRadius400);animation-name:innerBarAnimationOne,innerBarAnimationTwo;"," animation-iteration-count:",";"],p(t,r).innerBarBackground,d[a],n&&`animation-duration: ${i}s, ${i}s;`,n?"infinite, infinite":"none, none"))),y=o.default.svg.withConfig({displayName:"loader.style__StyledRingCircleSvg",componentId:"sc-~~aaaf19f2~~-4"})([""," ",' & circle[data-role="inner-arc"]{stroke:currentColor;}'],(({inverse:a,size:t,hasMotion:r,isTracked:i,isError:n,isSuccess:o,animationTime:d})=>{const c=`${s[t]}px`,p=l[t];return e.css(["height:",";min-height:",';circle[data-role="outer-arc"]{fill:transparent;stroke-width:',"px;stroke:",';cx:12px;cy:12px;r:10px;}circle[data-role="inner-arc"]{fill:transparent;stroke-width:',"px;stroke:",";stroke-linecap:round;stroke-dasharray:100px;stroke-dashoffset:95px;transform-origin:12px 12px 0px;cx:12px;cy:12px;r:10px;transform:rotate(-90deg);@keyframes trackedAnimation{from{stroke-dasharray:100;stroke-dashoffset:100;}to{stroke-dasharray:100;stroke-dashoffset:20;}}@keyframes untrackedAnimation{0%{transform:rotate(-90deg);stroke-dashoffset:95;}50%{transform:rotate(90deg);stroke-dashoffset:80;}100%{transform:rotate(270deg);stroke-dashoffset:95;}}animation-name:",";"," animation-timing-function:cubic-bezier(0,0,1,1);animation-iteration-count:",";}"],c,c,p,a?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.08)",p,(({inverse:e,isSuccess:a,isError:t})=>t?"#DB004E;":a?"#00811F;":e?"#FFF;":"#000000")({inverse:a,isSuccess:o,isError:n}),i?"trackedAnimation":"untrackedAnimation",r&&`animation-duration: ${d}s;`,r?"infinite":"none")}),i.default),h="40px",v=o.default.div.withConfig({displayName:"loader.style__StyledStars",componentId:"sc-~~aaaf19f2~~-5"})(["position:relative;width:",";height:",";"],h,h),k={standalone:{small:"4px",medium:"8px",large:"12px"},ring:{"extra-small":"4px",small:"8px",medium:"8px",large:"12px"}},w=o.default.div.withConfig({displayName:"loader.style__StyledStarLoaderWrapper",componentId:"sc-~~aaaf19f2~~-6"})(["position:relative;display:flex;align-items:center;justify-content:center;"]),b=o.default(r.Typography).withConfig({displayName:"loader.style__StyledLoaderLabel",componentId:"sc-~~aaaf19f2~~-7"})([""," line-height:150%;color:",";"," &{color:currentColor;}",""],m,(({inverse:e})=>e?"rgba(255, 255, 255, 0.55)":"rgba(0, 0, 0, 0.65)"),i.default,(({size:a="medium",loaderType:t,loaderVariant:r})=>"star"===t?e.css(["font-size:16px;font-weight:400;margin-left:12px;width:min-content;"]):"standalone"===t?e.css(["font-size:",";font-weight:500;width:100%;margin-top:",";"],"large"===a?"16px":"14px",k[t][a]):e.css(["font-size:",";font-weight:500;width:",";",";"],"large"===a?"16px":"extra-small"===a?"13px":"14px","inline"===r?"auto":"100%","inline"===r?`margin-left: ${c[a]}`:`margin-top: ${k[t][a]}`))),S=o.default.div.withConfig({displayName:"loader.style__StyledRingLoaderWrapper",componentId:"sc-~~aaaf19f2~~-8"})(["",""],(({loaderVariant:a})=>e.css(["display:flex;flex-direction:",";align-items:center;justify-content:center;width:",";"],"inline"===a?"row":"column","inline"===a?"auto":"100%"))),B=o.default.span.withConfig({displayName:"loader.style__StyledLabel",componentId:"sc-~~aaaf19f2~~-9"})(["",";"],(({inverse:a})=>e.css(["color:",";"," &{color:currentColor;}"],a?"rgba(255, 255, 255, 0.90)":"rgba(0, 0, 0, 0.90)",i.default)));exports.InnerBar=x,exports.OuterBar=g,exports.StyledLabel=B,exports.StyledLoader=u,exports.StyledLoaderLabel=b,exports.StyledLoaderPlaceholder=f,exports.StyledRingCircleSvg=y,exports.StyledRingLoaderWrapper=S,exports.StyledStarLoaderWrapper=w,exports.StyledStars=v;
1	+ "use strict";var e=require("styled-components"),t=require("styled-system"),r=require("../../../style/themes/apply-base-theme.js"),a=require("../../typography/typography.component.js");require("react/jsx-runtime"),require("react");var i=require("../../button/button.style.js"),n=require("../../button/__next__/button.style.js");function o(e){return e&&e.__esModule?e:{default:e}}var s=o(e);const l={"extra-small":20,small:32,medium:64,large:80},d={"extra-small":2.7,small:2.7,medium:2.7,large:2.7},c={small:"4px",medium:"8px",large:"16px"},p={"extra-small":"8px",small:"8px",medium:"12px",large:"16px"},m=(e,t)=>{const r=t?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.08)";return"ai"===e?{outerBarBackground:r,innerBarBackground:t?"linear-gradient(90deg, var(--mode-color-ai-alt-stop-1, #00D639) 0%, var(--mode-color-ai-alt-stop-2, #00D6DE) 40%, var(--mode-color-ai-alt-stop-3, #9D60FF) 90%)":"linear-gradient(90deg, var(--mode-color-ai-stop-1, #13A038) 0%, var(--mode-color-ai-stop-2, #149197) 40%, var(--mode-color-ai-stop-3, #A87CFB) 90%)"}:{outerBarBackground:r,innerBarBackground:t?"#FFFFFF":"#000000"}},u=e.css(["display:flex;justify-content:center;text-align:center;"]),g=s.default.div.withConfig({displayName:"loader.style__StyledLoaderPlaceholder",componentId:"sc-74569bc2-0"})(["display:inline-block;min-width:var(--sizing800);"]),f=s.default.div.attrs(r.default).withConfig({displayName:"loader.style__StyledLoader",componentId:"sc-74569bc2-1"})([""," text-align:center;white-space:nowrap;"],t.margin),y=s.default.div.withConfig({displayName:"loader.style__OuterBar",componentId:"sc-74569bc2-2"})(["",""],(({size:t,variant:r,inverse:a})=>e.css(["border-radius:var(--borderRadius400);height:",";width:100%;background:",";overflow:hidden;position:relative;"],c[t],m(r,a).outerBarBackground))),x=s.default.div.withConfig({displayName:"loader.style__InnerBar",componentId:"sc-74569bc2-3"})(["",""],(({size:t,variant:r,inverse:a,animationTime:i,hasMotion:n})=>e.css(["@keyframes innerBarAnimationOne{0%{left:0%;animation-timing-function:linear;}30%{left:10px;animation-timing-function:cubic-bezier(0.5,0.6,0.4,1);}100%{left:calc(100% - 15px);}}@keyframes innerBarAnimationTwo{0%{width:15px;animation-timing-function:cubic-bezier(0.7,0,0.8,1);}50%{width:35%;}100%{width:15px;}}position:absolute;background:",";width:15px;height:",";border-radius:var(--borderRadius400);animation-name:innerBarAnimationOne,innerBarAnimationTwo;"," animation-iteration-count:",";"],m(r,a).innerBarBackground,c[t],n&&`animation-duration: ${i}s, ${i}s;`,n?"infinite, infinite":"none, none"))),h=s.default.svg.withConfig({displayName:"loader.style__StyledRingCircleSvg",componentId:"sc-74569bc2-4"})([""," ",' & circle[data-role="inner-arc"],',' & circle[data-role="inner-arc"]{stroke:currentColor;}'],(({inverse:t,size:r,hasMotion:a,isTracked:i,isError:n,isSuccess:o,animationTime:s})=>{const c=`${l[r]}px`,p=d[r];return e.css(["height:",";min-height:",';circle[data-role="outer-arc"]{fill:transparent;stroke-width:',"px;stroke:",';cx:12px;cy:12px;r:10px;}circle[data-role="inner-arc"]{fill:transparent;stroke-width:',"px;stroke:",";stroke-linecap:round;stroke-dasharray:100px;stroke-dashoffset:95px;transform-origin:12px 12px 0px;cx:12px;cy:12px;r:10px;transform:rotate(-90deg);@keyframes trackedAnimation{from{stroke-dasharray:100;stroke-dashoffset:100;}to{stroke-dasharray:100;stroke-dashoffset:20;}}@keyframes untrackedAnimation{0%{transform:rotate(-90deg);stroke-dashoffset:95;}50%{transform:rotate(90deg);stroke-dashoffset:80;}100%{transform:rotate(270deg);stroke-dashoffset:95;}}animation-name:",";"," animation-timing-function:cubic-bezier(0,0,1,1);animation-iteration-count:",";}"],c,c,p,t?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.08)",p,(({inverse:e,isSuccess:t,isError:r})=>r?"#DB004E;":t?"#00811F;":e?"#FFF;":"#000000")({inverse:t,isSuccess:o,isError:n}),i?"trackedAnimation":"untrackedAnimation",a&&`animation-duration: ${s}s;`,a?"infinite":"none")}),n.StyledButton,i.default),b="40px",v=s.default.div.withConfig({displayName:"loader.style__StyledStars",componentId:"sc-74569bc2-5"})(["position:relative;width:",";height:",";"],b,b),k={standalone:{small:"4px",medium:"8px",large:"12px"},ring:{"extra-small":"4px",small:"8px",medium:"8px",large:"12px"}},w=s.default.div.withConfig({displayName:"loader.style__StyledStarLoaderWrapper",componentId:"sc-74569bc2-6"})(["position:relative;display:flex;align-items:center;justify-content:center;"]),S=s.default(a.Typography).withConfig({displayName:"loader.style__StyledLoaderLabel",componentId:"sc-74569bc2-7"})([""," line-height:150%;color:",";"," &,"," &{color:currentColor;}",""],u,(({inverse:e})=>e?"rgba(255, 255, 255, 0.55)":"rgba(0, 0, 0, 0.65)"),n.StyledButton,i.default,(({size:t="medium",loaderType:r,loaderVariant:a})=>"star"===r?e.css(["font-size:16px;font-weight:400;margin-left:12px;width:min-content;"]):"standalone"===r?e.css(["font-size:",";font-weight:500;width:100%;margin-top:",";"],"large"===t?"16px":"14px",k[r][t]):e.css(["font-size:",";font-weight:500;width:",";",";"],"large"===t?"16px":"extra-small"===t?"13px":"14px","inline"===a?"auto":"100%","inline"===a?`margin-left: ${p[t]}`:`margin-top: ${k[r][t]}`))),_=s.default.div.withConfig({displayName:"loader.style__StyledRingLoaderWrapper",componentId:"sc-74569bc2-8"})(["",""],(({loaderVariant:t})=>e.css(["display:flex;flex-direction:",";align-items:center;justify-content:center;width:",";"],"inline"===t?"row":"column","inline"===t?"auto":"100%"))),B=s.default.span.withConfig({displayName:"loader.style__StyledLabel",componentId:"sc-74569bc2-9"})(["",";"],(({inverse:t})=>e.css(["color:",";"," &,"," &{color:currentColor;}"],t?"rgba(255, 255, 255, 0.90)":"rgba(0, 0, 0, 0.90)",n.StyledButton,i.default)));exports.InnerBar=x,exports.OuterBar=y,exports.StyledLabel=B,exports.StyledLoader=f,exports.StyledLoaderLabel=S,exports.StyledLoaderPlaceholder=g,exports.StyledRingCircleSvg=h,exports.StyledRingLoaderWrapper=_,exports.StyledStarLoaderWrapper=w,exports.StyledStars=v;

package/lib/components/text-editor/__internal__/__ui__/ContentEditor/content-editor.component.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@lexical/react/LexicalContentEditable"),t=require("react"),i=require("./content-editor.style.js");require("../../__plugins__/AutoLinker/auto-link.component.js"),require("@lexical/react/LexicalComposerContext"),require("@lexical/link"),require("@lexical/headless"),require("@lexical/html"),require("lexical"),require("@lexical/code"),require("@lexical/list"),require("@lexical/react/LexicalHorizontalRuleNode"),require("@lexical/rich-text"),require("../../../text-editor.context.js");var n=require("../../__plugins__/useCursorAtEnd/index.js");require("../CharacterCounter/character-counter.style.js"),require("lodash/debounce"),require("../../../../../__internal__/i18n-context/index.js");var o=require("../LinkPreviewer/link-previewer.component.js");require("@lexical/react/LexicalTypeaheadMenuPlugin"),require("react-dom"),require("../Mentions/constants.js"),require("../Mentions/mentions.style.js"),require("../../../../tooltip/tooltip.component.js"),require("../../../../portrait/portrait.style.js"),require("../../../../../style/utils/filter-styled-system-padding-props.js"),require("../Placeholder/placeholder.style.js"),require("@lexical/utils"),require("../Toolbar/toolbar.style.js"),require("../../../../button/button.component.js"),require("../../../../box/box.component.js"),require("../Toolbar/buttons/typography-dropdown/dropdown.style.js"),require("../../../../icon/icon.component.js"),require("../Toolbar/button-group/button-group.style.js"),require("../../../../../__internal__/form-field/form-field.component.js"),require("../../../../../__internal__/hint-text/hint-text.style.js"),require("../../../../carbon-provider/__internal__/new-validation.context.js"),require("../../../../../__internal__/input/input.component.js"),require("../../../../../__internal__/input/input-presentation.style.js"),require("../../../../../__internal__/input-icon-toggle/input-icon-toggle.style.js"),require("invariant"),require("../../../../../__internal__/validations/validation-icon.style.js"),require("../../../../../__internal__/validation-message/validation-message.style.js"),require("../../../../numeral-date/__internal__/numeral-date.context.js"),require("../../../../../__internal__/character-count/character-count.style.js"),require("../../../../textbox/textbox.style.js"),require("../../../../textbox/__internal__/prefix.style.js"),require("../../../../dialog/dialog.style.js"),require("../../../../heading/heading.style.js"),require("../../../../icon-button/icon-button.component.js"),require("../../../../typography/typography.component.js"),require("react-transition-group"),require("../../../../../hooks/__internal__/useScrollBlock/useScrollBlock.js"),require("../../../../portal/portal.js"),require("../../../../../__internal__/modal/modal-manager.js"),require("../../../../../__internal__/modal/modal.style.js"),require("../../../../../__internal__/modal/modal.context.js"),require("../../../../carbon-provider/__internal__/top-modal.context.js"),require("../../../../../__internal__/full-screen-heading/full-screen-heading.component.js"),require("../../../../form/form.component.js"),require("../../../../form/required-fields-indicator/required-fields-indicator.component.js");const a=t.forwardRef((({inputHint:t,namespace:a,previews:l=[],rows:s,readOnly:u,required:c,error:d,warning:_,validationMessagePositionTop:q,size:p="medium"},j)=>{const m=n.default(),x=d\|\|_?`${a}-validation-message`:"",y=t?`${a}-input-hint`:"",b=(q?`${x} ${y}`:`${y} ${x}`).trim();return e.jsxs(i.default,{"data-role":`${a}-content-editable`,error:d,warning:_,namespace:a,rows:s,readOnly:u,size:p,children:[e.jsx(r.ContentEditable,{~~ref~~:j,"aria-describedby":b,"aria-labelledby":`${a}-label`,"aria-required":c,"aria-invalid":d,className:`${a}-editable`,"data-role":`${a}-editable`,onBlur:e=>{var r;if(null===(r=e.relatedTarget)\|\|void 0===r?void 0:r.classList.contains("toolbar-button")){var t;const r=null===(t=e.relatedTarget)\|\|void 0===t?void 0:t.id;if(r){const e=document.querySelector(`[id="${r}"]`);e&&e.focus()}}},onFocus:e=>{e.relatedTarget&&e.relatedTarget.classList.contains("toolbar-button")\|\|m(e)},"aria-autocomplete":void 0,"aria-readonly":void 0}),e.jsx(o.default,{previews:l})]})}));exports.default=a;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@lexical/react/LexicalContentEditable"),i=require("react"),t=require("./content-editor.style.js");require("../../__plugins__/AutoLinker/auto-link.component.js"),require("@lexical/react/LexicalComposerContext"),require("@lexical/link"),require("@lexical/headless"),require("@lexical/html"),require("lexical"),require("@lexical/code"),require("@lexical/list"),require("@lexical/react/LexicalHorizontalRuleNode"),require("@lexical/rich-text"),require("../../../text-editor.context.js");var n=require("../../__plugins__/useCursorAtEnd/index.js");require("../CharacterCounter/character-counter.style.js"),require("lodash/debounce"),require("../../../../../__internal__/i18n-context/index.js");var o=require("../LinkPreviewer/link-previewer.component.js");require("@lexical/react/LexicalTypeaheadMenuPlugin"),require("react-dom"),require("../Mentions/constants.js"),require("../Mentions/mentions.style.js"),require("../../../../tooltip/tooltip.component.js"),require("../../../../portrait/portrait.style.js"),require("../../../../../style/utils/filter-styled-system-padding-props.js"),require("../Placeholder/placeholder.style.js"),require("@lexical/utils"),require("../Toolbar/toolbar.style.js"),require("../../../../button/button.component.js"),require("../../../../box/box.component.js"),require("../Toolbar/buttons/typography-dropdown/dropdown.style.js"),require("../../../../icon/icon.component.js"),require("../Toolbar/button-group/button-group.style.js"),require("../../../../../__internal__/form-field/form-field.component.js"),require("../../../../../__internal__/hint-text/hint-text.style.js"),require("../../../../carbon-provider/__internal__/new-validation.context.js"),require("../../../../../__internal__/input/input.component.js"),require("../../../../../__internal__/input/input-presentation.style.js"),require("../../../../../__internal__/input-icon-toggle/input-icon-toggle.style.js"),require("invariant"),require("../../../../../__internal__/validations/validation-icon.style.js"),require("../../../../../__internal__/validation-message/validation-message.style.js"),require("../../../../numeral-date/__internal__/numeral-date.context.js"),require("../../../../../__internal__/character-count/character-count.style.js"),require("../../../../textbox/textbox.style.js"),require("../../../../textbox/__internal__/prefix.style.js"),require("../../../../dialog/dialog.style.js"),require("../../../../heading/heading.style.js"),require("../../../../icon-button/icon-button.component.js"),require("../../../../typography/typography.component.js"),require("react-transition-group"),require("../../../../../hooks/__internal__/useScrollBlock/useScrollBlock.js"),require("../../../../portal/portal.js"),require("../../../../../__internal__/modal/modal-manager.js"),require("../../../../../__internal__/modal/modal.style.js"),require("../../../../../__internal__/modal/modal.context.js"),require("../../../../carbon-provider/__internal__/top-modal.context.js"),require("../../../../../__internal__/full-screen-heading/full-screen-heading.component.js"),require("../../../../form/form.component.js"),require("../../../../form/required-fields-indicator/required-fields-indicator.component.js");const a=i.forwardRef((({inputHint:i,namespace:a,previews:l=[],rows:s,readOnly:u,required:c,error:d,warning:_,validationMessagePositionTop:q,size:p="medium",id:j},m)=>{const x=n.default(),y=d\|\|_?`${a}-validation-message`:"",b=i?`${a}-input-hint`:"",g=(q?`${y} ${b}`:`${b} ${y}`).trim();return e.jsxs(t.default,{"data-role":`${a}-content-editable`,error:d,warning:_,namespace:a,rows:s,readOnly:u,size:p,children:[e.jsx(r.ContentEditable,{id:j,ref:m,"aria-describedby":g,"aria-labelledby":`${a}-label`,"aria-required":c,"aria-invalid":d,className:`${a}-editable`,"data-role":`${a}-editable`,onBlur:e=>{var r;if(null===(r=e.relatedTarget)\|\|void 0===r?void 0:r.classList.contains("toolbar-button")){var i;const r=null===(i=e.relatedTarget)\|\|void 0===i?void 0:i.id;if(r){const e=document.querySelector(`[id="${r}"]`);e&&e.focus()}}},onFocus:e=>{e.relatedTarget&&e.relatedTarget.classList.contains("toolbar-button")\|\|x(e)},"aria-autocomplete":void 0,"aria-readonly":void 0}),e.jsx(o.default,{previews:l})]})}));exports.default=a;

package/lib/components/text-editor/__internal__/__utils__/interfaces.types.d.ts CHANGED Viewed

@@ -23,6 +23,8 @@ export interface TextEditorProps extends MarginProps, TagProps {
     labelText: string;
     /** The identifier for the Text Editor. This allows for the using of multiple Text Editors on a screen */
     namespace?: string;
+    /** The id attribute, set on the content editable div within the Text Editor */
+    id?: string;
     /** Callback that is triggered when the editor loses focus. */
     onBlur?: (ev: React.FocusEvent<HTMLElement>) => void;
     /**
@@ -101,6 +103,8 @@ export interface ContentEditorProps {
     validationMessagePositionTop?: boolean;
     /** The size of the content editor */
     size?: "small" | "medium" | "large";
+    /** The id attribute */
+    id?: string;
 }
 export interface CharacterCounterPluginProps {
     /** Whether the content editor has focused */

package/lib/components/text-editor/text-editor.component.js CHANGED Viewed

	@@ -1 +1 @@
1	- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@lexical/react/LexicalComposer"),t=require("@lexical/react/LexicalClickableLinkPlugin"),n=require("@lexical/react/LexicalErrorBoundary"),i=require("@lexical/react/LexicalHistoryPlugin"),a=require("@lexical/react/LexicalMarkdownShortcutPlugin"),l=require("@lexical/react/LexicalRichTextPlugin"),o=require("@lexical/react/LexicalLinkPlugin"),s=require("@lexical/react/LexicalListPlugin"),u=require("@lexical/react/LexicalOnChangePlugin"),c=require("lexical"),d=require("react"),_=require("../../__internal__/label/label.component.js"),p=require("../../hooks/__internal__/useLocale/useLocale.js"),x=require("../../__internal__/utils/logger/index.js"),g=require("./__internal__/__utils__/constants.js"),j=require("./__internal__/__plugins__/AutoLinker/auto-link.component.js"),f=require("./__internal__/__plugins__/LinkMonitor/link-monitor.plugin.js"),m=require("./__internal__/__plugins__/StyledSpanEnter/styled-span-enter.plugin.js");require("./__internal__/__plugins__/useCursorAtEnd/index.js");var h=require("./text-editor.context.js"),v=require("./text-editor.style.js"),b=require("./__internal__/__utils__/helpers.js"),y=require("../../__internal__/hint-text/hint-text.component.js"),q=require("../../__internal__/validation-message/validation-message.component.js"),w=require("../textbox/textbox.style.js");require("../../style/utils/filter-styled-system-padding-props.js");var P=require("../../style/utils/filter-styled-system-margin-props.js"),O=require("../../__internal__/utils/helpers/tags/tags.js"),E=require("./__internal__/__ui__/ReadOnlyEditor/read-only-rte.component.js"),L=require("./__internal__/__utils__/theme.js"),C=require("./__internal__/__ui__/CharacterCounter/character-counter.component.js"),T=require("./__internal__/__ui__/ContentEditor/content-editor.component.js");require("./__internal__/__ui__/LinkPreviewer/link-previewer.style.js"),require("@lexical/react/LexicalComposerContext"),require("@lexical/react/LexicalTypeaheadMenuPlugin"),require("react-dom"),require("./__internal__/__ui__/Mentions/constants.js"),require("./__internal__/__ui__/Mentions/mentions.style.js"),require("../tooltip/tooltip.component.js"),require("../portrait/portrait.style.js");var S=require("./__internal__/__ui__/Placeholder/placeholder.component.js"),k=require("./__internal__/__ui__/Toolbar/toolbar.component.js");function M(e){return e&&e.__esModule?e:{default:e}}var $=M(d);function F(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function H(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){F(e,r,t[r])}))}return e}let R=!1,B=!1,z=!1;const A=d.forwardRef(((M,F)=>{var A,D,I,{characterLimit:W=3e3,error:N,footer:V,header:U,inputHint:K,labelText:X,namespace:G=g.COMPONENT_PREFIX,~~onBlur~~:J,~~onCancel~~:Q,~~onChange~~:Y,~~onFocus~~:Z,~~onLinkAdded~~:ee,~~onSave~~:re,~~placeholder~~:te,previews:ne=[],readOnly:ie=!1,required:ae=!1,rows:le,size:oe="medium",warning:se,customPlugins:ue,validationMessagePositionTop:ce=!1,toolbarControls:de}=M,_e=function(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},a=Object.keys(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0\|\|(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0\|\|Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(M,["characterLimit","error","footer","header","inputHint","labelText","namespace","onBlur","onCancel","onChange","onFocus","onLinkAdded","onSave","placeholder","previews","readOnly","required","rows","size","warning","customPlugins","validationMessagePositionTop","toolbarControls"]);!R&&_e.value&&(R=!0,x.default.deprecate("`value` is deprecated in TextEditor and support will soon be removed. Please use `initialValue` instead.")),!B&&Q&&(B=!0,x.default.deprecate("`onCancel` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the cancel functionality.")),!z&&re&&(z=!0,x.default.deprecate("`onSave` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the save functionality."));const pe=d.useRef(null!==(I=null!==(D=_e.initialValue)&&void 0!==D?D:_e.value)&&void 0!==I?I:b.createEmpty()),xe=p.default(),[ge,je]=d.useState(void 0),fe=d.useRef(null),[me,he]=d.useState(!1);d.useImperativeHandle(F,(()=>({focus(){var e;null===(e=fe.current)\|\|void 0===e\|\|e.focus()}})),[]),d.useEffect((()=>{const e=null==fe?void 0:fe.current,r=()=>{he(!0)},t=()=>{he(!1)};return null==e\|\|e.addEventListener("focus",r),null==e\|\|e.addEventListener("blur",t),()=>{null==e\|\|e.removeEventListener("focus",r),null==e\|\|e.removeEventListener("blur",t)}}),[fe]);const ve=d.useMemo((()=>({namespace:G,nodes:g.MARKDOWN_NODES,onError:e=>x.default.error(e.message),theme:L.getTheme(),editorState:pe.current,editable:!ie})),[G,ie]),be=d.useCallback(((e,r)=>{const t=e.read((()=>c.$getRoot().getChildren().map((e=>e.getTextContent())).join("\n\n")));if(Y){const e=b.SerializeLexical(r);null==Y\|\|Y(t,e)}if(W>0){const e=W-t.length;je(e<0?xe.textEditor.characterLimit(Math.abs(e)):void 0)}}),[W,xe.textEditor,Y]),ye=d.useCallback((e=>{if(!e.isEditable())return;if(!Q)return;const r=e.parseEditorState(pe.current);e.setEditorState(r),Q()}),[Q]),qe=d.useMemo((()=>({namespace:G,onCancel:Q?ye:void 0,onSave:re,toolbarControls:de})),[ye,G,Q,re,de]),we=se\|\|ge,Pe=()=>{switch(oe){case"large":return"var(--spacing150)";case"small":return"var(--spacing050)";default:return"var(--spacing100)"}};return e.jsx(v.StyledTextEditorWrapper,(Oe=H({"data-role":`${G}-editor-wrapper`,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==J\|\|J(e)},onFocus:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==Z\|\|Z(e)}},P.default(_e),O.default("text-editor",_e)),Ee=null!=(Ee={children:e.jsxs(h.default.Provider,{value:{onLinkAdded:ee},children:[e.jsx(_.default,{isRequired:ae,labelId:`${G}-label`,children:X}),K&&!ie&&e.jsx(y.HintText,{id:`${G}-input-hint`,marginBottom:Pe(),children:K}),e.jsx(r.LexicalComposer,{initialConfig:ve,children:e.jsxs(v.StyledWrapper,{"data-role":`${G}-wrapper`,children:[ce&&e.jsxs(e.Fragment,{children:[e.jsx(q.default,{error:N,warning:we,validationId:`${G}-validation-message`,"data-role":`${G}-validation-message`,validationMessagePositionTop:ce}),(N\|\|we)&&e.jsx(w.default,{warning:!(N\|\|!we)})]}),e.jsxs(v.StyledEditorToolbarWrapper,{"data-role":`${G}-editor-toolbar-wrapper`,error:!!N,id:`${G}-editor-toolbar-wrapper`,children:[U&&e.jsx(v.StyledHeaderWrapper,{"data-role":`${G}-header-wrapper`,children:U}),ie?e.jsx(E.default,{"aria-label":X,initialValue:(null===(A=fe.current)\|\|void 0===A?void 0:A.innerHTML)\|\|pe.current,size:oe}):e.jsxs(e.Fragment,{children:[e.jsx(k.default,H({contentEditorRef:fe,hasHeader:Boolean(U),size:oe},qe)),e.jsxs(v.StyledTextEditor,{"data-role":`${G}-editor`,error:!!N,children:[e.jsx(l.RichTextPlugin,{contentEditable:e.jsx(T.default,{ref:fe,inputHint:K,isFocused:me,namespace:G,previews:ne,rows:le,readOnly:ie,required:ae,error:!!N,warning:!!se\|\|!!ge,validationMessagePositionTop:ce,size:oe}),placeholder:e.jsx(S.default,{namespace:G,text:te}),ErrorBoundary:n.LexicalErrorBoundary}),e.jsx(s.ListPlugin,{}),e.jsx(i.HistoryPlugin,{}),e.jsx(a.MarkdownShortcutPlugin,{}),e.jsx(u.OnChangePlugin,{onChange:be,ignoreHistoryMergeTagChange:!0,ignoreSelectionChange:!0}),e.jsx(o.LinkPlugin,{validateUrl:b.validateUrl}),e.jsx(t.ClickableLinkPlugin,{newTab:!0}),e.jsx(j.default,{}),e.jsx(m.default,{}),$.default.Children.toArray(ue)]})]}),V&&e.jsx(v.StyledFooterWrapper,{"data-role":`${G}-footer-wrapper`,size:oe,children:V}),e.jsx(f.default,{})]}),!ce&&e.jsxs(e.Fragment,{children:[e.jsx(q.default,{error:N,warning:we,validationId:`${G}-validation-message`,"data-role":`${G}-validation-message`,validationMessagePositionTop:ce}),(N\|\|we)&&e.jsx(w.default,{warning:!(N\|\|!we)})]}),W>0&&!ie&&e.jsx(C.default,{isFocused:me,maxChars:W,namespace:G,marginTop:Pe()})]})})]})})?Ee:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Oe,Object.getOwnPropertyDescriptors(Ee)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(Ee)).forEach((function(e){Object.defineProperty(Oe,e,Object.getOwnPropertyDescriptor(Ee,e))})),Oe));var Oe,Ee}));exports.TextEditor=A,exports.default=A;
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("@lexical/react/LexicalComposer"),t=require("@lexical/react/LexicalClickableLinkPlugin"),n=require("@lexical/react/LexicalErrorBoundary"),i=require("@lexical/react/LexicalHistoryPlugin"),a=require("@lexical/react/LexicalMarkdownShortcutPlugin"),l=require("@lexical/react/LexicalRichTextPlugin"),o=require("@lexical/react/LexicalLinkPlugin"),s=require("@lexical/react/LexicalListPlugin"),u=require("@lexical/react/LexicalOnChangePlugin"),d=require("lexical"),c=require("react"),_=require("../../__internal__/label/label.component.js"),p=require("../../hooks/__internal__/useLocale/useLocale.js"),x=require("../../__internal__/utils/logger/index.js"),g=require("./__internal__/__utils__/constants.js"),j=require("./__internal__/__plugins__/AutoLinker/auto-link.component.js"),f=require("./__internal__/__plugins__/LinkMonitor/link-monitor.plugin.js"),m=require("./__internal__/__plugins__/StyledSpanEnter/styled-span-enter.plugin.js");require("./__internal__/__plugins__/useCursorAtEnd/index.js");var h=require("./text-editor.context.js"),v=require("./text-editor.style.js"),b=require("./__internal__/__utils__/helpers.js"),y=require("../../__internal__/hint-text/hint-text.component.js"),q=require("../../__internal__/validation-message/validation-message.component.js"),w=require("../textbox/textbox.style.js");require("../../style/utils/filter-styled-system-padding-props.js");var P=require("../../style/utils/filter-styled-system-margin-props.js"),O=require("../../__internal__/utils/helpers/tags/tags.js"),E=require("./__internal__/__ui__/ReadOnlyEditor/read-only-rte.component.js"),L=require("./__internal__/__utils__/theme.js"),C=require("./__internal__/__ui__/CharacterCounter/character-counter.component.js"),T=require("./__internal__/__ui__/ContentEditor/content-editor.component.js");require("./__internal__/__ui__/LinkPreviewer/link-previewer.style.js"),require("@lexical/react/LexicalComposerContext"),require("@lexical/react/LexicalTypeaheadMenuPlugin"),require("react-dom"),require("./__internal__/__ui__/Mentions/constants.js"),require("./__internal__/__ui__/Mentions/mentions.style.js"),require("../tooltip/tooltip.component.js"),require("../portrait/portrait.style.js");var S=require("./__internal__/__ui__/Placeholder/placeholder.component.js"),k=require("./__internal__/__ui__/Toolbar/toolbar.component.js");function M(e){return e&&e.__esModule?e:{default:e}}var $=M(c);function F(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function H(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){F(e,r,t[r])}))}return e}let R=!1,B=!1,z=!1;const A=c.forwardRef(((M,F)=>{var A,D,I,{characterLimit:W=3e3,error:N,footer:V,header:U,inputHint:K,labelText:X,namespace:G=g.COMPONENT_PREFIX,id:J,onBlur:Q,onCancel:Y,onChange:Z,onFocus:ee,onLinkAdded:re,onSave:te,placeholder:ne,previews:ie=[],readOnly:ae=!1,required:le=!1,rows:oe,size:se="medium",warning:ue,customPlugins:de,validationMessagePositionTop:ce=!1,toolbarControls:_e}=M,pe=function(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},a=Object.keys(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0\|\|(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0\|\|Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(M,["characterLimit","error","footer","header","inputHint","labelText","namespace","id","onBlur","onCancel","onChange","onFocus","onLinkAdded","onSave","placeholder","previews","readOnly","required","rows","size","warning","customPlugins","validationMessagePositionTop","toolbarControls"]);!R&&pe.value&&(R=!0,x.default.deprecate("`value` is deprecated in TextEditor and support will soon be removed. Please use `initialValue` instead.")),!B&&Y&&(B=!0,x.default.deprecate("`onCancel` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the cancel functionality.")),!z&&te&&(z=!0,x.default.deprecate("`onSave` is deprecated in TextEditor and support will soon be removed. Please ensure that `TextEditor` is used as a part of a `Form` component, which will handle the save functionality."));const xe=c.useRef(null!==(I=null!==(D=pe.initialValue)&&void 0!==D?D:pe.value)&&void 0!==I?I:b.createEmpty()),ge=p.default(),[je,fe]=c.useState(void 0),me=c.useRef(null),[he,ve]=c.useState(!1);c.useImperativeHandle(F,(()=>({focus(){var e;null===(e=me.current)\|\|void 0===e\|\|e.focus()}})),[]),c.useEffect((()=>{const e=null==me?void 0:me.current,r=()=>{ve(!0)},t=()=>{ve(!1)};return null==e\|\|e.addEventListener("focus",r),null==e\|\|e.addEventListener("blur",t),()=>{null==e\|\|e.removeEventListener("focus",r),null==e\|\|e.removeEventListener("blur",t)}}),[me]);const be=c.useMemo((()=>({namespace:G,nodes:g.MARKDOWN_NODES,onError:e=>x.default.error(e.message),theme:L.getTheme(),editorState:xe.current,editable:!ae})),[G,ae]),ye=c.useCallback(((e,r)=>{const t=e.read((()=>d.$getRoot().getChildren().map((e=>e.getTextContent())).join("\n\n")));if(Z){const e=b.SerializeLexical(r);null==Z\|\|Z(t,e)}if(W>0){const e=W-t.length;fe(e<0?ge.textEditor.characterLimit(Math.abs(e)):void 0)}}),[W,ge.textEditor,Z]),qe=c.useCallback((e=>{if(!e.isEditable())return;if(!Y)return;const r=e.parseEditorState(xe.current);e.setEditorState(r),Y()}),[Y]),we=c.useMemo((()=>({namespace:G,onCancel:Y?qe:void 0,onSave:te,toolbarControls:_e})),[qe,G,Y,te,_e]),Pe=ue\|\|je,Oe=()=>{switch(se){case"large":return"var(--spacing150)";case"small":return"var(--spacing050)";default:return"var(--spacing100)"}};return e.jsx(v.StyledTextEditorWrapper,(Ee=H({"data-role":`${G}-editor-wrapper`,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==Q\|\|Q(e)},onFocus:e=>{e.currentTarget.contains(e.relatedTarget)\|\|null==ee\|\|ee(e)}},P.default(pe),O.default("text-editor",pe)),Le=null!=(Le={children:e.jsxs(h.default.Provider,{value:{onLinkAdded:re},children:[e.jsx(_.default,{isRequired:le,labelId:`${G}-label`,children:X}),K&&!ae&&e.jsx(y.HintText,{id:`${G}-input-hint`,marginBottom:Oe(),children:K}),e.jsx(r.LexicalComposer,{initialConfig:be,children:e.jsxs(v.StyledWrapper,{"data-role":`${G}-wrapper`,children:[ce&&e.jsxs(e.Fragment,{children:[e.jsx(q.default,{error:N,warning:Pe,validationId:`${G}-validation-message`,"data-role":`${G}-validation-message`,validationMessagePositionTop:ce}),(N\|\|Pe)&&e.jsx(w.default,{warning:!(N\|\|!Pe)})]}),e.jsxs(v.StyledEditorToolbarWrapper,{"data-role":`${G}-editor-toolbar-wrapper`,error:!!N,id:`${G}-editor-toolbar-wrapper`,children:[U&&e.jsx(v.StyledHeaderWrapper,{"data-role":`${G}-header-wrapper`,children:U}),ae?e.jsx(E.default,{"aria-label":X,initialValue:(null===(A=me.current)\|\|void 0===A?void 0:A.innerHTML)\|\|xe.current,size:se}):e.jsxs(e.Fragment,{children:[e.jsx(k.default,H({contentEditorRef:me,hasHeader:Boolean(U),size:se},we)),e.jsxs(v.StyledTextEditor,{"data-role":`${G}-editor`,error:!!N,children:[e.jsx(l.RichTextPlugin,{contentEditable:e.jsx(T.default,{id:J,ref:me,inputHint:K,isFocused:he,namespace:G,previews:ie,rows:oe,readOnly:ae,required:le,error:!!N,warning:!!ue\|\|!!je,validationMessagePositionTop:ce,size:se}),placeholder:e.jsx(S.default,{namespace:G,text:ne}),ErrorBoundary:n.LexicalErrorBoundary}),e.jsx(s.ListPlugin,{}),e.jsx(i.HistoryPlugin,{}),e.jsx(a.MarkdownShortcutPlugin,{}),e.jsx(u.OnChangePlugin,{onChange:ye,ignoreHistoryMergeTagChange:!0,ignoreSelectionChange:!0}),e.jsx(o.LinkPlugin,{validateUrl:b.validateUrl}),e.jsx(t.ClickableLinkPlugin,{newTab:!0}),e.jsx(j.default,{}),e.jsx(m.default,{}),$.default.Children.toArray(de)]})]}),V&&e.jsx(v.StyledFooterWrapper,{"data-role":`${G}-footer-wrapper`,size:se,children:V}),e.jsx(f.default,{})]}),!ce&&e.jsxs(e.Fragment,{children:[e.jsx(q.default,{error:N,warning:Pe,validationId:`${G}-validation-message`,"data-role":`${G}-validation-message`,validationMessagePositionTop:ce}),(N\|\|Pe)&&e.jsx(w.default,{warning:!(N\|\|!Pe)})]}),W>0&&!ae&&e.jsx(C.default,{isFocused:he,maxChars:W,namespace:G,marginTop:Oe()})]})})]})})?Le:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Ee,Object.getOwnPropertyDescriptors(Le)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(Le)).forEach((function(e){Object.defineProperty(Ee,e,Object.getOwnPropertyDescriptor(Le,e))})),Ee));var Ee,Le}));exports.TextEditor=A,exports.default=A;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "158.21.0",
+  "version": "158.23.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",