carbon-react 158.50.0-beta.1 → 159.0.0

package/esm/__internal__/legacy-hint-text/hint-text.component.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+export interface HintTextProps {
+    /** The alignment of the hint text */
+    align?: "left" | "right";
+    /** Children elements */
+    children?: React.ReactNode;
+    /** Sets the font weight for the hint text */
+    fontWeight?: string;
+    /** Sets the id for the component. */
+    id?: string;
+    /** Indicates whether the parent component is inline. */
+    isComponentInline?: boolean;
+    /** Indicates whether the parent component has a dark background. */
+    isDarkBackground?: boolean;
+    /** Indicates whether the parent component is disabled. */
+    isDisabled?: boolean;
+    /** Margin bottom for the hint text */
+    marginBottom?: string;
+    /** Margin top for the hint text */
+    marginTop?: string;
+    /** Max width for the hint text */
+    maxWidth?: string;
+    /** Set large font-size */
+    isLarge?: boolean;
+}
+export declare const HintText: ({ align, children, fontWeight, id, isComponentInline, isDarkBackground, isDisabled, marginBottom, marginTop, maxWidth, isLarge, }: HintTextProps) => React.JSX.Element | null;
+export default HintText;

package/esm/__internal__/legacy-hint-text/hint-text.component.js

@@ -0,0 +1 @@
+import{jsx as i}from"react/jsx-runtime";import{useContext as t}from"react";import n from"./hint-text.style.js";import a from"../../components/carbon-provider/__internal__/new-validation.context.js";const r=({align:r,children:o,fontWeight:e,id:m,isComponentInline:s=!1,isDarkBackground:d=!1,isDisabled:l=!1,marginBottom:g="var(--spacing100)",marginTop:p="var(--spacing000)",maxWidth:c,isLarge:h})=>{const{validationRedesignOptIn:f}=t(a);return s&&!f?null:i(n,{align:r,"data-element":"input-hint","data-role":"hint-text",fontWeight:e,id:m,isDarkBackground:d,isDisabled:l,marginBottom:g,marginTop:p,maxWidth:c,isLarge:h,children:o})};export{r as HintText,r as default};

package/esm/__internal__/legacy-hint-text/hint-text.style.d.ts

@@ -0,0 +1,3 @@
+import { HintTextProps } from "./hint-text.component";
+declare const StyledHintText: import("styled-components").StyledComponent<"div", any, HintTextProps, never>;
+export default StyledHintText;

package/esm/__internal__/legacy-hint-text/hint-text.style.js

@@ -0,0 +1 @@
+import t,{css as i}from"styled-components";const o=t.div.withConfig({displayName:"hint-text.style__StyledHintText",componentId:"sc-92b90b9-0"})(["display:flex;align-items:center;font-size:14px;"," "," margin-bottom:",";margin-top:",";"," "," ",' ::after{content:" ";}'],(({isLarge:t})=>t&&i(["font-size:var(--fontSizes200);"])),(({align:t})=>i(["justify-content:",";"],"right"!==t?"flex-start":"flex-end")),(({marginBottom:t})=>t),(({marginTop:t})=>t),(({isDarkBackground:t,isDisabled:o})=>i(["color:",";"],((t,i)=>t?"var(--colorsUtilityYang080)":i?"var(--colorsUtilityYin030)":"var(--colorsUtilityYin055)")(t,o))),(({fontWeight:t})=>t&&i(["font-weight:",";"],t)),(({maxWidth:t})=>t&&i(["max-width:",";"],t)));export{o as default};

package/esm/__internal__/legacy-hint-text/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./hint-text.component";
+export type { HintTextProps } from "./hint-text.component";

package/esm/__internal__/legacy-hint-text/index.js

@@ -0,0 +1 @@
+export{HintText as default}from"./hint-text.component.js";

package/esm/__internal__/legacy-input/index.d.ts

@@ -0,0 +1,5 @@
+import Input from "./input.component";
+import InputPresentation from "./input-presentation.component";
+export type { InputProps, CommonInputProps, EnterKeyHintTypes, } from "./input.component";
+export { Input, InputPresentation };
+export default Input;

package/esm/__internal__/legacy-input/index.js

@@ -0,0 +1 @@
+import t from"./input.component.js";export{default as InputPresentation}from"./input-presentation.component.js";export{t as Input,t as default};

package/{lib/__internal__/input → esm/__internal__/legacy-input}/input-presentation.style.d.ts

@@ -2,5 +2,5 @@ import { CommonInputPresentationProps } from "./input-presentation.component";
 import { InputContextProps } from "../input-behaviour";
 import { CarbonProviderProps } from "../../components/carbon-provider";
 export declare const StyledInputPresentationContainer: import("styled-components").StyledComponent<"div", any, Pick<CommonInputPresentationProps, "maxWidth" | "inputWidth">, never>;
-declare const InputPresentationStyle: import("styled-components").StyledComponent<"div", any, Pick<InputContextProps, "hasFocus"> & Pick<CommonInputPresentationProps, "disabled" | "error" | "info" | "warning" | "prefix" | "readOnly" | "size" | "align" | "borderRadius" | "hasIcon" | "hideBorders"> & Pick<CarbonProviderProps, "validationRedesignOptIn">, never>;
+declare const InputPresentationStyle: import("styled-components").StyledComponent<"div", any, Pick<InputContextProps, "hasFocus"> & Pick<CommonInputPresentationProps, "disabled" | "error" | "info" | "warning" | "readOnly" | "size" | "align" | "borderRadius" | "hasIcon" | "hideBorders"> & Pick<CarbonProviderProps, "validationRedesignOptIn">, never>;
 export default InputPresentationStyle;

package/esm/__internal__/{input → legacy-input}/input-presentation.style.js

@@ -1 +1 @@
-import r,{css as i}from"styled-components";import t from"./input-sizes.style.js";import o from"./input.style.js";import e from"../../style/utils/add-focus-styling.js";const n=r.div.withConfig({displayName:"input-presentation.style__StyledInputPresentationContainer",componentId:"sc-5369fb17-0"})(["flex:0 0 ","%;display:flex;position:relative;max-width:",";"],(({inputWidth:r})=>r),(({maxWidth:r})=>r?`${r}`:"100%")),a=r.div.withConfig({displayName:"input-presentation.style__InputPresentationStyle",componentId:"sc-5369fb17-1"})(["align-items:stretch;background:var(--colorsUtilityYang100);"," box-sizing:border-box;cursor:text;display:flex;flex-wrap:wrap;width:100%;margin:0;"," "," "," "," "," "," "," input::-ms-clear{display:none;}input::-webkit-contacts-auto-fill-button{display:none !important;}"],(({hideBorders:r})=>r?"border: 1px solid transparent;":"border: 1px solid var(--colorsUtilityMajor300);"),(({borderRadius:r})=>Array.isArray(r)?`border-radius: ${r.map((r=>`var(--${r})`)).join(" ")};`:`border-radius: var(--${r});`),(({size:r,hasIcon:e,align:n})=>r&&i(["min-height:",";","{padding:0 ",";"," ","}"],t[r].height,o,t[r].horizontalPadding,e&&"right"===n&&"padding-left: 0;",e&&"left"===n&&"padding-right: 0;")),(({disabled:r,hideBorders:t})=>r&&i(["background:var(--colorsUtilityDisabled400);border-color:",";cursor:not-allowed;"],t?"transparent":"var(--colorsUtilityDisabled600)")),(({hasFocus:r})=>r&&i(["&{"," z-index:2;}"],e())),(function({error:r,warning:t,info:o,disabled:e,validationRedesignOptIn:n}){let a;if(e)return"";if(r)a="var(--colorsSemanticNegative500)";else if(t)a=n?"var(--colorsUtilityMajor300)":"var(--colorsSemanticCaution500)";else{if(!o)return"";a="var(--colorsSemanticInfo500)"}return i(["border-color:"," !important;z-index:1;",""],a,r&&`box-shadow: inset 1px 1px 0 ${a}, inset -1px -1px 0 ${a};`)}),(({readOnly:r,hideBorders:t})=>r&&i(["background-color:var(--colorsUtilityReadOnly400);border-color:",";"],t?"transparent":"var(--colorsUtilityReadOnly600)")),(({align:r,prefix:i})=>"right"===r&&`flex-direction: ${i?"row":"row-reverse"};\n  `));export{n as StyledInputPresentationContainer,a as default};
+import r,{css as i}from"styled-components";import t from"./input-sizes.style.js";import o from"./input.style.js";import e from"../../style/utils/add-focus-styling.js";const n=r.div.withConfig({displayName:"input-presentation.style__StyledInputPresentationContainer",componentId:"sc-83661d80-0"})(["flex:0 0 ","%;display:flex;position:relative;max-width:",";"],(({inputWidth:r})=>r),(({maxWidth:r})=>r?`${r}`:"100%")),a=r.div.withConfig({displayName:"input-presentation.style__InputPresentationStyle",componentId:"sc-83661d80-1"})(["align-items:stretch;background:var(--colorsUtilityYang100);"," box-sizing:border-box;cursor:text;display:flex;flex-wrap:wrap;width:100%;margin:0;"," "," "," "," "," "," "," input::-ms-clear{display:none;}input::-webkit-contacts-auto-fill-button{display:none !important;}"],(({hideBorders:r})=>r?"border: 1px solid transparent;":"border: 1px solid var(--colorsUtilityMajor300);"),(({borderRadius:r})=>Array.isArray(r)?`border-radius: ${r.map((r=>`var(--${r})`)).join(" ")};`:`border-radius: var(--${r});`),(({size:r,hasIcon:e,align:n})=>r&&i(["min-height:",";","{padding:0 ",";"," ","}"],t[r].height,o,t[r].horizontalPadding,e&&"right"===n&&"padding-left: 0;",e&&"left"===n&&"padding-right: 0;")),(({disabled:r,hideBorders:t})=>r&&i(["background:var(--colorsUtilityDisabled400);border-color:",";cursor:not-allowed;"],t?"transparent":"var(--colorsUtilityDisabled600)")),(({hasFocus:r})=>r&&i(["&{"," z-index:2;}"],e())),(function({error:r,warning:t,info:o,disabled:e,validationRedesignOptIn:n}){let a;if(e)return"";if(r)a="var(--colorsSemanticNegative500)";else if(t)a=n?"var(--colorsUtilityMajor300)":"var(--colorsSemanticCaution500)";else{if(!o)return"";a="var(--colorsSemanticInfo500)"}return i(["border-color:"," !important;z-index:1;",""],a,r&&`box-shadow: inset 1px 1px 0 ${a}, inset -1px -1px 0 ${a};`)}),(({readOnly:r})=>r&&i(["background-color:var(--colorsUtilityReadOnly400);border-color:transparent;"])),(({align:r})=>"right"===r&&"flex-direction: row-reverse;\n  "));export{n as StyledInputPresentationContainer,a as default};

package/esm/__internal__/legacy-input/input.component.d.ts

@@ -0,0 +1,54 @@
+import React from "react";
+import { BorderRadiusType } from "../../components/box/box.component";
+export type EnterKeyHintTypes = "enter" | "done" | "go" | "next" | "previous" | "search" | "send";
+export interface CommonInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "value"> {
+    align?: "right" | "left";
+    /** The ID of the input's description, is set along with hint text and error message. */
+    "aria-describedby"?: string;
+    /** Override the variant component */
+    as?: React.ElementType;
+    /** If true the Component will be focused when rendered */
+    autoFocus?: boolean;
+    /** If true, the component will be disabled */
+    disabled?: boolean;
+    /** HTML id attribute of the input */
+    id?: string;
+    /** Specify a custom border radius for the input. Any valid border-radius design token, or an array of border-radius design tokens. */
+    inputBorderRadius?: BorderRadiusType | BorderRadiusType[];
+    /** Name of the input */
+    name?: string;
+    /** Specify a callback triggered on blur */
+    onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
+    /** Specify a callback triggered on change */
+    onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Specify a callback triggered on click */
+    onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
+    /** Specify a callback triggered on focus */
+    onFocus?: (ev: React.FocusEvent<HTMLInputElement>) => void;
+    /** Specify a callback triggered on keyDown */
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** Placeholder string to be displayed in input */
+    placeholder?: string;
+    /** If true, the component will be read-only */
+    readOnly?: boolean;
+    /** Flag to configure component as mandatory */
+    required?: boolean;
+    /** Id of the validation icon */
+    validationIconId?: string;
+    /** The value of the input */
+    value: string | readonly string[] | number | undefined;
+}
+export interface InputProps extends CommonInputProps {
+    /** The visible width of the text control, in average character widths */
+    cols?: number;
+    /** Integer to determine a timeout for the deferred callback */
+    deferTimeout?: number;
+    /** Deferred callback to be called after the onChange event */
+    onChangeDeferred?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    /** The number of visible text lines for the control */
+    rows?: number;
+    /** HTML type attribute of the input */
+    type?: string;
+}
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
+export default Input;

package/esm/__internal__/legacy-input/input.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import r,{useContext as t,useRef as n,useCallback as o,useEffect as u}from"react";import i from"./input.style.js";import{InputContext as a}from"../input-behaviour/input-behaviour.component.js";import{InputGroupContext as c}from"../input-behaviour/input-group-behaviour.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}const s=r.forwardRef(((r,s)=>{var{align:d,"aria-labelledby":p,"aria-describedby":b,placeholder:f,disabled:y,readOnly:O,autoFocus:m,onClick:h,onChangeDeferred:g,onChange:v,onBlur:j,onFocus:B,deferTimeout:P,type:w="text",id:F,name:C,validationIconId:R,inputBorderRadius:S="borderRadius050",enterKeyHint:k}=r,x=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},u=Object.keys(e);for(n=0;n<u.length;n++)t=u[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var u=Object.getOwnPropertySymbols(e);for(n=0;n<u.length;n++)t=u[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(r,["align","aria-labelledby","aria-describedby","placeholder","disabled","readOnly","autoFocus","onClick","onChangeDeferred","onChange","onBlur","onFocus","deferTimeout","type","id","name","validationIconId","inputBorderRadius","enterKeyHint"]);const D=t(a),I=t(c),E=n(null);let T=n(null);s&&"current"in s&&(T=s);const H=o((e=>{T.current=e,"function"==typeof s&&s(e),m&&e&&e.focus(),k&&e&&e.setAttribute("enterkeyhint",k)}),[m,s,k]);u((()=>{D.inputRef&&D.inputRef(T)}),[D,T]),u((()=>{y&&D.onBlur&&D.onBlur()}),[y,D]);const K=b?[b]:[];(D.hasFocus||I.hasFocus||D.hasMouseOver||I.hasMouseOver)&&R&&K.push(R);const M=K.length?K.filter(Boolean).join(" "):void 0;return e(i,(A=function(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}({},x),N={"data-has-autofocus":!!m||void 0,"aria-describedby":M,"aria-labelledby":p,align:d,placeholder:f,disabled:y,readOnly:O,name:C,type:w,id:F||C,ref:H,"data-element":"input",onFocus:e=>{B&&B(e),D.onFocus&&D.onFocus(),I.onFocus&&I.onFocus(),"text"===w&&function(e){setTimeout((()=>{if(null==e?void 0:e.current){const{selectionStart:r,selectionEnd:t,value:n}=e.current,{length:o}=n;(0===r&&0===t||r===o&&t===o)&&document.activeElement===e.current&&e.current.setSelectionRange(0,o)}}))}(T)},onBlur:e=>{j&&j(e),D.onBlur&&D.onBlur(),I.onBlur&&I.onBlur()},onClick:y||O?void 0:e=>{var r;h&&h(e),null==T||null===(r=T.current)||void 0===r||r.focus()},onChange:e=>{v&&v(e),(e=>{g&&(E.current&&clearTimeout(E.current),E.current=setTimeout((()=>{g(e)}),P||750))})(e)},inputBorderRadius:S},N=null!=N?N:{},Object.getOwnPropertyDescriptors?Object.defineProperties(A,Object.getOwnPropertyDescriptors(N)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(N)).forEach((function(e){Object.defineProperty(A,e,Object.getOwnPropertyDescriptor(N,e))})),A));var A,N}));s.displayName="Input";export{s as default};

package/esm/__internal__/legacy-input/input.style.d.ts

@@ -0,0 +1,3 @@
+import { CommonInputProps } from "./input.component";
+declare const StyledInput: import("styled-components").StyledComponent<"input", any, Pick<CommonInputProps, "disabled" | "align" | "inputBorderRadius">, never>;
+export default StyledInput;

package/esm/__internal__/legacy-input/input.style.js

@@ -0,0 +1 @@
+import o,{css as r}from"styled-components";const t=o.input.withConfig({displayName:"input.style__StyledInput",componentId:"sc-745cf632-0"})(["background:transparent;border:none;color:var(--colorsUtilityYin090);flex-grow:1;font-size:var(--fontSizes100);outline:none;padding:0;margin:0;width:30px;&:-webkit-autofill{background-clip:text;-webkit-background-clip:text;}"," &::placeholder{color:var(--colorsUtilityYin055);}"," ",""],(({inputBorderRadius:o})=>Array.isArray(o)?`border-radius: ${o.map((o=>`var(--${o})`)).join(" ")};`:`border-radius: var(--${o});`),(({align:o})=>o&&r(["text-align:",";"],o)),(({disabled:o})=>o&&r(["color:var(--colorsUtilityYin030);cursor:not-allowed;"])));export{t as default};

package/esm/__internal__/legacy-label/index.d.ts

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

package/esm/__internal__/legacy-label/index.js

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

package/esm/__internal__/legacy-label/label.component.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+import { StyledLabelProps, StyledLabelContainerProps } from "./label.style";
+import { ValidationProps } from "../validations";
+import { IconType } from "../../components/icon";
+export interface LabelProps extends ValidationProps, StyledLabelProps, StyledLabelContainerProps {
+    as?: "span" | "label";
+    /** Children elements */
+    children?: React.ReactNode;
+    /** A message that the Help component will display */
+    help?: React.ReactNode;
+    /** Icon type */
+    helpIcon?: IconType;
+    /** A string that represents the ID of another form element */
+    htmlFor?: string;
+    /** The unique id of the label element */
+    labelId?: string;
+    /** The unique id of the Help component tooltip, used for accessibility */
+    tooltipId?: string;
+    /** Whether to show the validation icon */
+    useValidationIcon?: boolean;
+    /** Id of the validation icon */
+    validationIconId?: string;
+    /**
+     * @private
+     * @internal
+     * Sets className for component. INTERNAL USE ONLY. */
+    className?: string;
+    /** Sets aria-label for label element */
+    "aria-label"?: string;
+    /** Whether this component is shown against a dark background */
+    isDarkBackground?: boolean;
+    /** @internal @private */
+    onClick?: () => void;
+}
+export declare const Label: ({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element;
+declare const _default: React.MemoExoticComponent<({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element>;
+export default _default;

package/esm/__internal__/legacy-label/label.component.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import o,{useState as n,useContext as t,useRef as i}from"react";import{Help as l}from"../../components/help/help.component.js";import a,{StyledLabelContainer as c}from"./label.style.js";import{ValidationIcon as s}from"../validations/validation-icon.component.js";import p from"./icon-wrapper.style.js";import{InputContext as u}from"../input-behaviour/input-behaviour.component.js";import{InputGroupContext as b}from"../input-behaviour/input-group-behaviour.component.js";import d from"../utils/helpers/guid/index.js";function m(e,r,o){return r in e?Object.defineProperty(e,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[r]=o,e}function f(e){for(var r=1;r<arguments.length;r++){var o=null!=arguments[r]?arguments[r]:{},n=Object.keys(o);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(o).filter((function(e){return Object.getOwnPropertyDescriptor(o,e).enumerable})))),n.forEach((function(r){m(e,r,o[r])}))}return e}function g(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 o=Object.getOwnPropertySymbols(e);r.push.apply(r,o)}return r}(Object(r)).forEach((function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(r,o))})),e}const h=({align:o,as:m="label",children:h,disabled:O,error:j,help:y,helpIcon:w,htmlFor:v,info:P,inline:k,isDarkBackground:I=!1,isRequired:D,labelId:L,pr:M,pl:E,tooltipId:F,useValidationIcon:S=!0,validationIconId:x,warning:B,width:q=30,className:C,onClick:N,"aria-label":R,isLarge:V})=>{const[$,z]=n(!1),{onMouseEnter:A,onMouseLeave:G}=t(u),{onMouseEnter:H,onMouseLeave:J}=t(b),K=i(d());let Q;return Q=k&&!o?"right":o||"left",e(c,{"data-role":"label-container",id:`label-container-${null!=L?L:K.current}`,align:Q,inline:k,width:q,pr:M,pl:E,className:C,onClick:N,children:[r(a,g(f({"data-element":"label",disabled:O,id:L},"label"===m?{htmlFor:v}:{}),{onMouseEnter:()=>{A&&A(),H&&H()},onMouseLeave:()=>{G&&G(),J&&J()},isRequired:D,as:m,"aria-label":R,isDarkBackground:I,isLarge:V,children:h})),(()=>{const e={onFocus:()=>z(!0),onBlur:()=>z(!1)};if(S&&(({error:e,warning:r,info:o,disabled:n})=>!n&&"string"==typeof(e||r||o))({error:j,warning:B,info:P,disabled:O})){const e=(({error:e,warning:r,info:o,inline:n})=>(e||r||o)&&n?"top":"right")({error:j,warning:B,info:P,inline:k});return r(p,{children:r(s,{tooltipId:x,error:j,warning:B,info:P,tooltipPosition:e,tooltipFlipOverrides:["top","bottom"]})})}return y&&r(p,g(f({},e),{children:r(l,{tooltipId:F,type:w,isFocused:$,children:y})}))})()]})};var O=o.memo(h);export{h as Label,O as default};

package/esm/__internal__/legacy-label/label.style.d.ts

@@ -0,0 +1,25 @@
+export interface StyledLabelProps {
+    /** If true, the component will be disabled */
+    disabled?: boolean;
+    /** Flag to configure component as mandatory */
+    isRequired?: boolean;
+    /** Flag to determine whether to use colours for dark backgrounds */
+    isDarkBackground?: boolean;
+    /** Set large font-size */
+    isLarge?: boolean;
+}
+declare const StyledLabel: import("styled-components").StyledComponent<"label", any, StyledLabelProps, never>;
+export interface StyledLabelContainerProps {
+    /** Label alignment */
+    align?: "left" | "right";
+    /** When true, label is placed in line an input */
+    inline?: boolean;
+    /** Padding right, integer multiplied by base spacing constant (8) */
+    pr?: 1 | 2;
+    /** Padding left, integer multiplied by base spacing constant (8) */
+    pl?: 1 | 2;
+    /** Label width */
+    width?: number;
+}
+export declare const StyledLabelContainer: import("styled-components").StyledComponent<"div", any, StyledLabelContainerProps, never>;
+export default StyledLabel;

package/esm/__internal__/legacy-label/label.style.js

@@ -0,0 +1 @@
+import i,{css as t}from"styled-components";const e=i.label.withConfig({displayName:"label.style__StyledLabel",componentId:"sc-e75e7420-0"})([""," display:block;font-weight:var(--fontWeights500);"," "," ",""],(({isDarkBackground:i})=>t(["color:",";"],i?"var(--colorsUtilityYang100)":"var(--colorsUtilityYin090)")),(({isLarge:i})=>i&&t(["font-size:var(--fontSizes200);"])),(({isRequired:i})=>i&&t(['::after{content:"*";color:var(--colorsSemanticNegative500);font-weight:var(--fontWeights500);margin-left:var(--spacing050);}'])),(({disabled:i})=>i&&t(["color:var(--colorsUtilityYin030);"]))),a=i.div.withConfig({displayName:"label.style__StyledLabelContainer",componentId:"sc-e75e7420-1"})(["display:flex;align-items:center;margin-bottom:8px;"," ",""],(({align:i})=>t(["justify-content:",";"],"right"!==i?"flex-start":"flex-end")),(({inline:i,pr:e,pl:a,width:o})=>i&&t(["box-sizing:border-box;margin-bottom:0;",";",";width:","%;"],e&&t(["padding-right:var(",");"],1===e?"--spacing100":"--spacing200"),a&&t(["padding-left:var(",");"],1===a?"--spacing100":"--spacing200"),o)));export{a as StyledLabelContainer,e as default};

package/esm/__internal__/utils/helpers/combine-refs/index.d.ts

@@ -0,0 +1,3 @@
+import { MutableRefObject, RefCallback } from "react";
+declare const _default: <T = unknown>(...refs: (MutableRefObject<T | null> | RefCallback<T> | null | undefined)[]) => RefCallback<T>;
+export default _default;

package/esm/__internal__/utils/helpers/combine-refs/index.js

@@ -0,0 +1 @@
+var r=(...r)=>t=>{r.forEach((r=>{r&&("function"!=typeof r?"current"in r&&(r.current=t):r(t))}))};export{r as default};

package/esm/__internal__/validation-message/__next__/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./validation-message.component";

package/esm/__internal__/validation-message/__next__/index.js

@@ -0,0 +1 @@
+export{default}from"./validation-message.component.js";

package/esm/__internal__/validation-message/__next__/validation-message.component.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { TagProps } from "../../../__internal__/utils/helpers/tags";
+export interface ValidationMessageProps extends TagProps {
+    /**
+     * If true, displays error styling. If passed as a valid string, displays error styling
+     * and the message as children.
+     */
+    error?: boolean | string;
+    /** Id of the component, to be used for accessibility purposes */
+    id?: string;
+    /**
+     * If true, displays warning styling. If passed as a valid string, displays warning styling
+     * and the message as children.
+     */
+    warning?: boolean | string;
+    /** Size of the validation message font */
+    size?: "small" | "medium" | "large";
+}
+declare const ValidationMessage: ({ error, id, warning, "data-element": dataElement, "data-role": dataRole, size, }: ValidationMessageProps) => React.JSX.Element | null;
+export default ValidationMessage;

package/esm/__internal__/validation-message/__next__/validation-message.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import"react";import t from"./validation-message.style.js";import r from"../../utils/helpers/tags/tags.js";function n(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const o=({error:o,id:i,warning:a,"data-element":c,"data-role":s="validation-message",size:l})=>{const p=o||a;return"string"==typeof p?e(t,(u=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){n(e,t,r[t])}))}return e}({id:i,$isError:Boolean(o)},r("validation-message",{"data-element":c,"data-role":s})),b=null!=(b={$size:l,children:p})?b:{},Object.getOwnPropertyDescriptors?Object.defineProperties(u,Object.getOwnPropertyDescriptors(b)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(b)).forEach((function(e){Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(b,e))})),u)):null;var u,b};export{o as default};

package/esm/__internal__/validation-message/__next__/validation-message.style.d.ts

@@ -0,0 +1,6 @@
+interface StyledValidationMessageProps {
+    $isError?: boolean;
+    $size?: "small" | "medium" | "large";
+}
+declare const StyledValidationMessage: import("styled-components").StyledComponent<"span", any, StyledValidationMessageProps, never>;
+export default StyledValidationMessage;

package/esm/__internal__/validation-message/__next__/validation-message.style.js

@@ -0,0 +1 @@
+import a,{css as t}from"styled-components";const l=a.span.withConfig({displayName:"validation-message.style__StyledValidationMessage",componentId:"sc-554aba6-0"})(["",""],(({$isError:a,$size:l})=>t(["display:flex;align-items:center;align-content:center;align-self:stretch;flex-wrap:wrap;margin:0px;color:",";"," "," ",""],a?"var(--input-validation-label-error)":"var(--input-validation-label-warn)","large"===l&&t(["font:",";"],a?"var(--global-font-static-comp-medium-l)":"var(--global-font-static-comp-regular-l)"),"medium"===l&&t(["font:",";"],a?"var(--global-font-static-comp-medium-m)":"var(--global-font-static-comp-regular-m)"),"small"===l&&t(["font:",";"],a?"var(--global-font-static-comp-medium-s)":"var(--global-font-static-comp-regular-s)"))));export{l as default};

package/esm/__spec_helper__/mock-match-media.d.ts

@@ -2,5 +2,3 @@ export declare const setupMatchMediaMock: () => void;
 export declare const mockMatchMedia: (matches: boolean) => {
     removeEventListener: jest.Mock<any, any, any>;
 };
-/** Simulate a media query change — updates `matches` and fires captured listeners */
-export declare const simulateMediaQueryChange: (matches: boolean) => void;

package/esm/__spec_helper__/mock-match-media.js

@@ -1 +1 @@
-let e=!1,t=!1;const n=jest.fn();let o=new Set;const r=()=>{if("undefined"==typeof window)return;const r=()=>{};Object.defineProperty(global.window,"matchMedia",{writable:!0,value:e=>({get matches(){return t},media:e,onchange:null,addEventListener:(e,t)=>{o.add(t)},removeEventListener:(e,t)=>{o.delete(t),n()},dispatchEvent:r})}),e=!0},a=r=>{if(!e)throw new Error("window.matchMedia has not been mocked. Did you call setupMatchMediaMock()?");return t=r,o=new Set,{removeEventListener:n}},d=e=>{t=e,o.forEach((e=>e()))};export{a as mockMatchMedia,r as setupMatchMediaMock,d as simulateMediaQueryChange};
+let e=!1,t=!1;const n=jest.fn(),o=()=>{if("undefined"==typeof window)return;const o=()=>{};Object.defineProperty(global.window,"matchMedia",{writable:!0,value:e=>({matches:t,media:e,onchange:null,addEventListener:o,removeEventListener:n,dispatchEvent:o})}),e=!0},i=o=>{if(!e)throw new Error("window.matchMedia has not been mocked. Did you call setupMatchMediaMock()?");return t=o,{removeEventListener:n}};export{i as mockMatchMedia,o as setupMatchMediaMock};

package/esm/components/button-toggle/button-toggle-group/button-toggle-group.component.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import l,{useMemo as n,useRef as r,useContext as i,useState as o}from"react";import a from"invariant";import p from"../../../__internal__/form-field/form-field.component.js";import s from"../../../__internal__/utils/helpers/tags/tags.js";import u from"../../../__internal__/utils/helpers/guid/index.js";import c from"./button-toggle-group.style.js";import{ButtonToggle as d}from"../button-toggle.component.js";import"../../../style/utils/filter-styled-system-padding-props.js";import b from"../../../style/utils/filter-styled-system-margin-props.js";import{TooltipProvider as f}from"../../../__internal__/tooltip-provider/index.js";import{InputGroupBehaviour as m}from"../../../__internal__/input-behaviour/input-group-behaviour.component.js";import g from"../../../__internal__/utils/helpers/events/events.js";import y from"../../carbon-provider/__internal__/new-validation.context.js";import{ButtonToggleGroupProvider as h}from"./__internal__/button-toggle-group.context.js";import{HintText as _}from"../../../__internal__/hint-text/hint-text.component.js";function j(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}function v(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{},n=Object.keys(l);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(l).filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable})))),n.forEach((function(t){j(e,t,l[t])}))}return e}function O(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);t.push.apply(t,l)}return t}(Object(t)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(t,l))})),e}const w=j=>{var{children:w,fieldHelp:P,fieldHelpInline:x,"aria-label":H,label:I,labelHelp:D,labelSpacing:S,inputHint:B,inputWidth:W,fullWidth:A,labelInline:E,labelWidth:C,onChange:T,value:k,helpAriaLabel:L,id:G,allowDeselect:K=!1,disabled:N=!1}=j,R=function(e,t){if(null==e)return{};var l,n,r=function(e,t){if(null==e)return{};var l,n,r={},i=Object.keys(e);for(n=0;n<i.length;n++)l=i[n],t.indexOf(l)>=0||(r[l]=e[l]);return r}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)l=i[n],t.indexOf(l)>=0||Object.prototype.propertyIsEnumerable.call(e,l)&&(r[l]=e[l])}return r}(j,["children","fieldHelp","fieldHelpInline","aria-label","label","labelHelp","labelSpacing","inputHint","inputWidth","fullWidth","labelInline","labelWidth","onChange","value","helpAriaLabel","id","allowDeselect","disabled"]);const V=n((()=>!l.Children.toArray(w).find((e=>!l.isValidElement(e)||"ButtonToggle"!==e.type.displayName))),[w]);a(V,`\`ButtonToggleGroup\` only accepts children of type \`${d.displayName}\``);const q=r(u()),M=r(u()),$=r(null),{validationRedesignOptIn:z}=i(y),F=e=>z?void 0:e,J=()=>{var e;return null===(e=$.current)||void 0===e?void 0:e.querySelectorAll('[data-element="button-toggle-button"]')},[Q,U]=o();var X;return e(f,{helpAriaLabel:L,children:e(m,{children:e(p,O(v({label:I,labelHelp:F(D),labelSpacing:F(S),fieldHelp:F(P),fieldHelpInline:F(x),labelInline:F(E),labelWidth:F(C),labelId:q.current,id:G,labelAs:"span",disabled:N},b(R),s(null!==(X=R["data-component"])&&void 0!==X?X:"button-toggle-group",R)),{children:t(h,{value:{onButtonClick:()=>{},handleKeyDown:e=>{const t=J();if(!t||!document.activeElement)return;const l=Array.from(t).indexOf(document.activeElement);let n;g.isLeftKey(e)?n=t[0===l?t.length-1:l-1]:g.isRightKey(e)&&(n=t[(l+1)%t.length]),n instanceof HTMLButtonElement&&n.focus()},pressedButtonValue:k,onChange:T,allowDeselect:K,isInGroup:!0,isDisabled:N,firstButton:Q,childButtonCallbackRef:e=>{setTimeout((()=>{if(e){const t=J();t?e===t[0]&&U(e):U(void 0)}}),0)},hintTextId:B?M.current:void 0},children:[B&&e(_,{id:M.current,isDisabled:N,marginBottom:"var(--spacing150)",children:B}),e(c,O(v({ref:$},I?{"aria-labelledby":q.current}:{"aria-label":H}),{labelInline:E,inputWidth:W,fullWidth:A,role:"group",id:G,disabled:N,children:w}))]})}))})})};w.displayName="ButtonToggleGroup";export{w as default};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import l,{useMemo as n,useRef as r,useContext as i,useState as o}from"react";import a from"invariant";import p from"../../../__internal__/form-field/form-field.component.js";import s from"../../../__internal__/utils/helpers/tags/tags.js";import u from"../../../__internal__/utils/helpers/guid/index.js";import c from"./button-toggle-group.style.js";import{ButtonToggle as d}from"../button-toggle.component.js";import"../../../style/utils/filter-styled-system-padding-props.js";import b from"../../../style/utils/filter-styled-system-margin-props.js";import{TooltipProvider as f}from"../../../__internal__/tooltip-provider/index.js";import{InputGroupBehaviour as m}from"../../../__internal__/input-behaviour/input-group-behaviour.component.js";import g from"../../../__internal__/utils/helpers/events/events.js";import y from"../../carbon-provider/__internal__/new-validation.context.js";import{ButtonToggleGroupProvider as h}from"./__internal__/button-toggle-group.context.js";import{HintText as _}from"../../../__internal__/legacy-hint-text/hint-text.component.js";function j(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}function v(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{},n=Object.keys(l);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(l).filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable})))),n.forEach((function(t){j(e,t,l[t])}))}return e}function O(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);t.push.apply(t,l)}return t}(Object(t)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(t,l))})),e}const w=j=>{var{children:w,fieldHelp:P,fieldHelpInline:x,"aria-label":H,label:I,labelHelp:D,labelSpacing:S,inputHint:B,inputWidth:W,fullWidth:A,labelInline:E,labelWidth:C,onChange:T,value:k,helpAriaLabel:L,id:G,allowDeselect:K=!1,disabled:N=!1}=j,R=function(e,t){if(null==e)return{};var l,n,r=function(e,t){if(null==e)return{};var l,n,r={},i=Object.keys(e);for(n=0;n<i.length;n++)l=i[n],t.indexOf(l)>=0||(r[l]=e[l]);return r}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)l=i[n],t.indexOf(l)>=0||Object.prototype.propertyIsEnumerable.call(e,l)&&(r[l]=e[l])}return r}(j,["children","fieldHelp","fieldHelpInline","aria-label","label","labelHelp","labelSpacing","inputHint","inputWidth","fullWidth","labelInline","labelWidth","onChange","value","helpAriaLabel","id","allowDeselect","disabled"]);const V=n((()=>!l.Children.toArray(w).find((e=>!l.isValidElement(e)||"ButtonToggle"!==e.type.displayName))),[w]);a(V,`\`ButtonToggleGroup\` only accepts children of type \`${d.displayName}\``);const q=r(u()),M=r(u()),$=r(null),{validationRedesignOptIn:z}=i(y),F=e=>z?void 0:e,J=()=>{var e;return null===(e=$.current)||void 0===e?void 0:e.querySelectorAll('[data-element="button-toggle-button"]')},[Q,U]=o();var X;return e(f,{helpAriaLabel:L,children:e(m,{children:e(p,O(v({label:I,labelHelp:F(D),labelSpacing:F(S),fieldHelp:F(P),fieldHelpInline:F(x),labelInline:F(E),labelWidth:F(C),labelId:q.current,id:G,labelAs:"span",disabled:N},b(R),s(null!==(X=R["data-component"])&&void 0!==X?X:"button-toggle-group",R)),{children:t(h,{value:{onButtonClick:()=>{},handleKeyDown:e=>{const t=J();if(!t||!document.activeElement)return;const l=Array.from(t).indexOf(document.activeElement);let n;g.isLeftKey(e)?n=t[0===l?t.length-1:l-1]:g.isRightKey(e)&&(n=t[(l+1)%t.length]),n instanceof HTMLButtonElement&&n.focus()},pressedButtonValue:k,onChange:T,allowDeselect:K,isInGroup:!0,isDisabled:N,firstButton:Q,childButtonCallbackRef:e=>{setTimeout((()=>{if(e){const t=J();t?e===t[0]&&U(e):U(void 0)}}),0)},hintTextId:B?M.current:void 0},children:[B&&e(_,{id:M.current,isDisabled:N,marginBottom:"var(--spacing150)",children:B}),e(c,O(v({ref:$},I?{"aria-labelledby":q.current}:{"aria-label":H}),{labelInline:E,inputWidth:W,fullWidth:A,role:"group",id:G,disabled:N,children:w}))]})}))})})};w.displayName="ButtonToggleGroup";export{w as default};

package/esm/components/checkbox/checkbox-group/checkbox-group.style.js

@@ -1 +1 @@
-import i,{css as o}from"styled-components";import e from"../../../__internal__/form-field/form-field.style.js";import t from"../../icon/icon.style.js";import l from"../checkbox.style.js";import{StyledLabelContainer as n}from"../../../__internal__/label/label.style.js";import r from"../../../__internal__/validations/validation-icon.style.js";const m=i.div.withConfig({displayName:"checkbox-group.style__StyledCheckboxGroup",componentId:"sc-e51b1b6e-0"})(["display:flex;flex-direction:column;","::before{font-size:16px;}&& ","{margin:0;}& ","{margin-bottom:var(--spacing150);:last-of-type{margin-bottom:0;}}& > ","{& > ","{margin-bottom:4px;vertical-align:middle;","{display:inline-block;}}}"," ",""],t,e,l,e,n,r,(({legendInline:i})=>i&&o(["",":first-child{padding-top:4px;}"],l)),(({inline:i})=>i&&o(["flex-direction:row;","{margin:0;:not(:first-of-type){margin-left:32px;}}"],l)));export{m as default};
+import i,{css as o}from"styled-components";import e from"../../../__internal__/form-field/form-field.style.js";import t from"../../icon/icon.style.js";import l from"../checkbox.style.js";import{StyledLabelContainer as n}from"../../../__internal__/legacy-label/label.style.js";import r from"../../../__internal__/validations/validation-icon.style.js";const a=i.div.withConfig({displayName:"checkbox-group.style__StyledCheckboxGroup",componentId:"sc-ffa9ebbb-0"})(["display:flex;flex-direction:column;","::before{font-size:16px;}&& ","{margin:0;}& ","{margin-bottom:var(--spacing150);:last-of-type{margin-bottom:0;}}& > ","{& > ","{margin-bottom:4px;vertical-align:middle;","{display:inline-block;}}}"," ",""],t,e,l,e,n,r,(({legendInline:i})=>i&&o(["",":first-child{padding-top:4px;}"],l)),(({inline:i})=>i&&o(["flex-direction:row;","{margin:0;:not(:first-of-type){margin-left:32px;}}"],l)));export{a as default};

package/esm/components/checkbox/checkbox.style.js

@@ -1 +1 @@
-import i,{css as e}from"styled-components";import{margin as r}from"styled-system";import{StyledCheckableInput as t}from"../../__internal__/checkable-input/checkable-input.style.js";import o from"../../__internal__/field-help/field-help.style.js";import l from"../../__internal__/checkable-input/hidden-checkable-input.style.js";import a from"../../__internal__/checkable-input/checkable-input-svg-wrapper.style.js";import n,{StyledLabelContainer as s}from"../../__internal__/label/label.style.js";import d from"../../__internal__/validations/validation-icon.style.js";import p from"../../style/themes/apply-base-theme.js";import c from"../../style/utils/add-focus-styling.js";const g=i.div.attrs(p).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"sc-ac6c7db0-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],r,(({disabled:i,error:r,warning:p,info:g,fieldHelpInline:m,labelSpacing:f,inputWidth:h,reverse:b,size:v,adaptiveSpacingSmallScreen:x,applyNewValidation:u})=>e([""," ","{padding-top:1px;}","{height:16px;}svg{background-color:var(--colorsUtilityYang100);","}",",svg{height:16px;position:absolute;padding:1px;}",",",",",",svg{box-sizing:border-box;min-width:16px;width:16px;border-radius:var(--borderRadius025);",";}",":not([disabled]){&:focus + ",",&:hover + ","{","}}","{width:auto;flex:0 1 auto;}","{margin-left:16px;margin-top:0;padding-left:",";}","{position:relative;display:inline-block;}"," ",":checked ~ "," svg path{fill:var(--colorsUtilityYin090);}"," "," "," ",""],x&&"margin-left: 0;",t,a,!i&&e(["border:1px solid var(--colorsUtilityMajor300);"," "," "," ",""],g&&"border: 1px solid var(--colorsSemanticInfo500);",p&&"border: 1px solid var(--colorsSemanticCaution500);",r&&"border: 2px solid var(--colorsSemanticNegative500);",p&&u&&"border: 1px solid var(--colorsUtilityMajor300);"),l,t,l,a,"large"===v&&"border-radius: var(--borderRadius050)",l,a,a,c(),s,o,1===f?"var(--spacing100)":"var(--spacing200)",d,"large"===v&&e(["","{height:24px;}",",",",",",svg{height:24px;width:24px;min-width:24px;}","{margin-left:24px;}",""],a,t,l,a,o,m&&e(["",",","{align-self:center;}"],o,s)),l,a,i&&e(["svg{background-color:var(--colorsUtilityDisabled400);border:1px solid var(--colorsUtilityDisabled600);}svg path{fill:var(--colorsUtilityDisabled400);}",":checked ~ "," svg path{fill:var(--colorsUtilityYin030);}","{&:hover,&:focus{outline:none;cursor:not-allowed;}}"],l,a,a),m&&`\n      ${o} {\n        margin-left: 0;\n      }\n\n      ${n} {\n        flex: 0 1 auto;\n      }\n    `,void 0!==h&&0!==h&&`\n      ${o} {\n        ${b?"margin-right":"margin-left"}: ${h}% !important;\n      }\n    `,b&&e(["","{margin-left:0;padding-left:0;}","{flex:0 1 auto;}",""],o,n,m&&e(["","{margin-right:8px;}","{padding-left:6px;}"],t,o)))));export{g as default};
+import i,{css as e}from"styled-components";import{margin as r}from"styled-system";import{StyledCheckableInput as t}from"../../__internal__/checkable-input/checkable-input.style.js";import o from"../../__internal__/field-help/field-help.style.js";import l from"../../__internal__/checkable-input/hidden-checkable-input.style.js";import a from"../../__internal__/checkable-input/checkable-input-svg-wrapper.style.js";import n,{StyledLabelContainer as s}from"../../__internal__/legacy-label/label.style.js";import d from"../../__internal__/validations/validation-icon.style.js";import p from"../../style/themes/apply-base-theme.js";import c from"../../style/utils/add-focus-styling.js";const g=i.div.attrs(p).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"sc-4f65151c-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],r,(({disabled:i,error:r,warning:p,info:g,fieldHelpInline:m,labelSpacing:f,inputWidth:h,reverse:b,size:v,adaptiveSpacingSmallScreen:x,applyNewValidation:y})=>e([""," ","{padding-top:1px;}","{height:16px;}svg{background-color:var(--colorsUtilityYang100);","}",",svg{height:16px;position:absolute;padding:1px;}",",",",",",svg{box-sizing:border-box;min-width:16px;width:16px;border-radius:var(--borderRadius025);",";}",":not([disabled]){&:focus + ",",&:hover + ","{","}}","{width:auto;flex:0 1 auto;}","{margin-left:16px;margin-top:0;padding-left:",";}","{position:relative;display:inline-block;}"," ",":checked ~ "," svg path{fill:var(--colorsUtilityYin090);}"," "," "," ",""],x&&"margin-left: 0;",t,a,!i&&e(["border:1px solid var(--colorsUtilityMajor300);"," "," "," ",""],g&&"border: 1px solid var(--colorsSemanticInfo500);",p&&"border: 1px solid var(--colorsSemanticCaution500);",r&&"border: 2px solid var(--colorsSemanticNegative500);",p&&y&&"border: 1px solid var(--colorsUtilityMajor300);"),l,t,l,a,"large"===v&&"border-radius: var(--borderRadius050)",l,a,a,c(),s,o,1===f?"var(--spacing100)":"var(--spacing200)",d,"large"===v&&e(["","{height:24px;}",",",",",",svg{height:24px;width:24px;min-width:24px;}","{margin-left:24px;}",""],a,t,l,a,o,m&&e(["",",","{align-self:center;}"],o,s)),l,a,i&&e(["svg{background-color:var(--colorsUtilityDisabled400);border:1px solid var(--colorsUtilityDisabled600);}svg path{fill:var(--colorsUtilityDisabled400);}",":checked ~ "," svg path{fill:var(--colorsUtilityYin030);}","{&:hover,&:focus{outline:none;cursor:not-allowed;}}"],l,a,a),m&&`\n      ${o} {\n        margin-left: 0;\n      }\n\n      ${n} {\n        flex: 0 1 auto;\n      }\n    `,void 0!==h&&0!==h&&`\n      ${o} {\n        ${b?"margin-right":"margin-left"}: ${h}% !important;\n      }\n    `,b&&e(["","{margin-left:0;padding-left:0;}","{flex:0 1 auto;}",""],o,n,m&&e(["","{margin-right:8px;}","{padding-left:6px;}"],t,o)))));export{g as default};

package/esm/components/date/date.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useRef as n,useMemo as o,useContext as a,useState as l,useCallback as i,useEffect as u}from"react";import{isValidLocaleDate as s,checkISOFormatAndLength as c,parseISODate as p,parseDate as d,findMatchedFormatAndValue as m,isDateValid as f,additionalYears as b,formattedValue as y,getSeparator as v,formatToISO as g}from"./__internal__/utils.js";import O from"../../hooks/__internal__/useLocale/useLocale.js";import _ from"../../__internal__/utils/helpers/events/events.js";import"../../style/utils/filter-styled-system-padding-props.js";import P from"../../style/utils/filter-styled-system-margin-props.js";import j from"../../style/utils/filter-out-styled-system-spacing-props.js";import k from"./__internal__/date-formats/index.js";import h from"./date.style.js";import{Textbox as w}from"../textbox/textbox.component.js";import{DatePicker as D}from"./__internal__/date-picker/date-picker.component.js";import x from"../date-range/__internal__/date-range.context.js";import L from"../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js";import C from"../../__internal__/utils/helpers/guid/index.js";import B from"../../__internal__/utils/helpers/tags/tags.js";function W(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function F(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){W(e,t,r[t])}))}return e}function A(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const M=r.forwardRef(((r,W)=>{var{adaptiveLabelBreakpoint:M,allowEmptyValue:S,autoFocus:I,"data-element":E,"data-role":T,disabled:V,disablePortal:K=!0,helpAriaLabel:z,labelInline:R,minDate:N,maxDate:q,onBlur:G,onChange:$,onClick:H,onFocus:J,onKeyDown:Q,pickerProps:U,readOnly:X,size:Y="medium",tooltipPosition:Z,value:ee,inputWidth:te,labelWidth:re,maxWidth:ne,inputName:oe,onPickerClose:ae,onPickerOpen:le,dateFormatOverride:ie,datePickerAriaLabel:ue,datePickerAriaLabelledBy:se,validationMessagePositionTop:ce=!0}=r,pe=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(r,["adaptiveLabelBreakpoint","allowEmptyValue","autoFocus","data-element","data-role","disabled","disablePortal","helpAriaLabel","labelInline","minDate","maxDate","onBlur","onChange","onClick","onFocus","onKeyDown","pickerProps","readOnly","size","tooltipPosition","value","inputWidth","labelWidth","maxWidth","inputName","onPickerClose","onPickerOpen","dateFormatOverride","datePickerAriaLabel","datePickerAriaLabelledBy","validationMessagePositionTop"]);const de=n(null),me=n(null),fe=n(null),be=n(!1),ye=n(!1),ve=n(!1),ge=O(),{dateFnsLocale:Oe,dateFormatOverride:_e}=ge.date,{format:Pe,formats:je}=o((()=>k(Oe(),ie||_e)),[Oe,_e,ie]),{inputRefMap:ke,setInputRefMap:he,validationMessagePositionTop:we}=a(x),[De,xe]=l(!1),[Le,Ce]=l((()=>{if(s(ee,Oe()))return c(ee)?p(ee):d(Pe,ee)})),Be=n(!0),We=n(C()),Fe=null!=we?we:ce,Ae=e=>S&&!e.length?e:null,Me=e=>{const{id:t,name:r}=e.target,[n,o]=m(e.target.value,je),a="blur"===e.type?y(Pe,Le):e.target.value,l=f(d(n,o))?g(...b(n,o)):Ae(e.target.value);return{target:A(F({},r&&{name:r},t&&{id:t}),{value:{formattedValue:a,rawValue:l}})}},Se=L((()=>{var e,t;De&&(be.current=!0,null===(e=fe.current)||void 0===e||e.focus(),ye.current=!1,null===(t=fe.current)||void 0===t||t.blur(),xe(!1),null==ae||ae(),be.current=!1)}),"mousedown"),Ie=e=>{H&&H(e)},Ee=i((e=>{var t;fe.current=e,me.current=null==e?void 0:e.parentElement,W&&("function"==typeof W?W(e):W.current=e),oe&&(null==ke||null===(t=ke[oe])||void 0===t?void 0:t.setOpen)!==xe&&(null==he||he({[oe]:{isBlurBlocked:ye,setOpen:xe}}))}),[oe,ke,he,W]);u((()=>{const[e,t]=m(ee,je);e&&t&&f(d(e,t))?Ce(d(...b(e,t))):c(ee)&&Be.current?Ce(p(ee)):Ce(void 0)}),[ee,je]);const Te=P(pe);return e(h,A(F(A(F({ref:de,role:"presentation",size:Y,labelInline:R},Te),{applyDateRangeStyling:!!ke,maxWidth:ne,inputWidth:te}),B("date",{"data-element":E,"data-role":T})),{children:[t(w,A(F({},j(pe)),{"data-component":"date-input",value:(()=>{if(c(ee)&&Be.current)return y(Pe,p(ee));const e=v(ee),t=v(Pe),r=()=>ee.split("").map((r=>r===e?t:r)).join("");if(Be.current&&e!==t&&f(d(Pe,r()))){Be.current=!1;const[e,t]=m(r(),je);return y(Pe,d(...b(e,t)))}return ee})(),onBlur:e=>{if(V||X)return;let t;if(f(Le)){t=Me(e);const r=c(ee)?y(Pe,p(ee)):ee,[,n]=m(r,je);y(Pe,Le)!==n&&$(t)}else{const{id:r,name:n}=e.target;t={target:A(F({},n&&{name:n},r&&{id:r}),{value:{formattedValue:e.target.value,rawValue:Ae(e.target.value)}})}}ye.current||G&&G(t)},onChange:e=>{Be.current=!1,$(Me(e))},onClick:Ie,onFocus:e=>{V||X||(ye.current=!1,J&&J(e))},onKeyDown:e=>{if(Q&&Q(e),De&&_.isTabKey(e)){if(_.isShiftKey(e))xe(!1),null==ae||ae();else if(!K){var t,r;e.preventDefault(),null===(r=document)||void 0===r||null===(t=r.querySelector(`[id="${We.current}"]`))||void 0===t||t.focus()}be.current=!1}},iconOnClick:Ie,onMouseDown:()=>{Se(),he&&(ye.current=!0),De||null==le||le()},iconOnMouseDown:()=>{ye.current=!0,be.current=!0,Se(),De?(xe(!1),null==ae||ae()):(xe(!0),null==le||le())},inputIcon:"calendar",labelInline:R,ref:Ee,adaptiveLabelBreakpoint:M,tooltipPosition:Z,helpAriaLabel:z,autoFocus:I,size:Y,disabled:V,readOnly:X,inputWidth:te,labelWidth:re,maxWidth:ne,m:0,validationMessagePositionTop:Fe})),t(D,{disablePortal:K,inputElement:me,pickerProps:U,selectedDays:Le,onDayClick:(e,t)=>{var r;Ce(e),$(Me(A(F({},t),{target:A(F({},t.target),{value:y(Pe,e)})}))),ve.current=!0,null===(r=fe.current)||void 0===r||r.focus(),xe(!1)},minDate:N,maxDate:q,pickerMouseDown:()=>{ye.current=!0,Se()},open:De,setOpen:xe,pickerTabGuardId:We.current,onPickerClose:ae,ariaLabel:ue,ariaLabelledBy:se})]}))}));export{M as DateInput,M as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useRef as n,useMemo as a,useContext as o,useState as l,useCallback as i,useEffect as u}from"react";import{isValidLocaleDate as s,checkISOFormatAndLength as c,parseISODate as p,parseDate as d,findMatchedFormatAndValue as m,isDateValid as f,additionalYears as b,formattedValue as y,getSeparator as v,formatToISO as g}from"./__internal__/utils.js";import O from"../../hooks/__internal__/useLocale/useLocale.js";import _ from"../../__internal__/utils/helpers/events/events.js";import"../../style/utils/filter-styled-system-padding-props.js";import P from"../../style/utils/filter-styled-system-margin-props.js";import j from"../../style/utils/filter-out-styled-system-spacing-props.js";import k from"./__internal__/date-formats/index.js";import h from"./date.style.js";import{Textbox as w}from"../textbox/textbox.component.js";import{DatePicker as x}from"./__internal__/date-picker/date-picker.component.js";import D from"../date-range/__internal__/date-range.context.js";import L from"../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js";import C from"../../__internal__/utils/helpers/guid/index.js";import B from"../../__internal__/utils/helpers/tags/tags.js";function W(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function F(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){W(e,t,r[t])}))}return e}function M(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const A={large:"140px",medium:"135px",small:"120px"},S=r.forwardRef(((r,W)=>{var{adaptiveLabelBreakpoint:S,allowEmptyValue:I,autoFocus:E,"data-element":T,"data-role":V,disabled:K,disablePortal:z=!0,helpAriaLabel:R,labelInline:N,minDate:q,maxDate:G,onBlur:$,onChange:H,onClick:J,onFocus:Q,onKeyDown:U,pickerProps:X,readOnly:Y,size:Z="medium",tooltipPosition:ee,value:te,inputWidth:re,labelWidth:ne,maxWidth:ae,inputName:oe,onPickerClose:le,onPickerOpen:ie,dateFormatOverride:ue,datePickerAriaLabel:se,datePickerAriaLabelledBy:ce,validationMessagePositionTop:pe=!0}=r,de=function(e,t){if(null==e)return{};var r,n,a=function(e,t){if(null==e)return{};var r,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(a[r]=e[r]);return a}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(a[r]=e[r])}return a}(r,["adaptiveLabelBreakpoint","allowEmptyValue","autoFocus","data-element","data-role","disabled","disablePortal","helpAriaLabel","labelInline","minDate","maxDate","onBlur","onChange","onClick","onFocus","onKeyDown","pickerProps","readOnly","size","tooltipPosition","value","inputWidth","labelWidth","maxWidth","inputName","onPickerClose","onPickerOpen","dateFormatOverride","datePickerAriaLabel","datePickerAriaLabelledBy","validationMessagePositionTop"]);const me=n(null),fe=n(null),be=n(null),ye=n(!1),ve=n(!1),ge=n(!1),Oe=O(),{dateFnsLocale:_e,dateFormatOverride:Pe}=Oe.date,{format:je,formats:ke}=a((()=>k(_e(),ue||Pe)),[_e,Pe,ue]),{inputRefMap:he,setInputRefMap:we,validationMessagePositionTop:xe}=o(D),[De,Le]=l(!1),[Ce,Be]=l((()=>{if(s(te,_e()))return c(te)?p(te):d(je,te)})),We=n(!0),Fe=n(C()),Me=null!=xe?xe:pe,Ae=e=>I&&!e.length?e:null,Se=e=>{const{id:t,name:r}=e.target,[n,a]=m(e.target.value,ke),o="blur"===e.type?y(je,Ce):e.target.value,l=f(d(n,a))?g(...b(n,a)):Ae(e.target.value);return{target:M(F({},r&&{name:r},t&&{id:t}),{value:{formattedValue:o,rawValue:l}})}},Ie=L((()=>{var e,t;De&&(ye.current=!0,null===(e=be.current)||void 0===e||e.focus(),ve.current=!1,null===(t=be.current)||void 0===t||t.blur(),Le(!1),null==le||le(),ye.current=!1)}),"mousedown"),Ee=e=>{J&&J(e)},Te=i((e=>{var t;be.current=e,fe.current=null==e?void 0:e.parentElement,W&&("function"==typeof W?W(e):W.current=e),oe&&(null==he||null===(t=he[oe])||void 0===t?void 0:t.setOpen)!==Le&&(null==we||we({[oe]:{isBlurBlocked:ve,setOpen:Le}}))}),[oe,he,we,W]);u((()=>{const[e,t]=m(te,ke);e&&t&&f(d(e,t))?Be(d(...b(e,t))):c(te)&&We.current?Be(p(te)):Be(void 0)}),[te,ke]);const Ve=P(de);return e(h,M(F(M(F({ref:me,role:"presentation",size:Z,labelInline:N},Ve),{applyDateRangeStyling:!!he,maxWidth:ae,inputWidth:re}),B("date",{"data-element":T,"data-role":V})),{onMouseDown:Ie,className:"date",children:[t(w,M(F({},j(de)),{"data-component":"date-input",value:(()=>{if(c(te)&&We.current)return y(je,p(te));const e=v(te),t=v(je),r=()=>te.split("").map((r=>r===e?t:r)).join("");if(We.current&&e!==t&&f(d(je,r()))){We.current=!1;const[e,t]=m(r(),ke);return y(je,d(...b(e,t)))}return te})(),onBlur:e=>{if(K||Y)return;let t;if(f(Ce)){t=Se(e);const r=c(te)?y(je,p(te)):te,[,n]=m(r,ke);y(je,Ce)!==n&&H(t)}else{const{id:r,name:n}=e.target;t={target:M(F({},n&&{name:n},r&&{id:r}),{value:{formattedValue:e.target.value,rawValue:Ae(e.target.value)}})}}ve.current||$&&$(t)},onChange:e=>{We.current=!1,H(Se(e))},onClick:Ee,onFocus:e=>{K||Y||(ve.current=!1,Q&&Q(e))},onKeyDown:e=>{if(U&&U(e),De&&_.isTabKey(e)){if(_.isShiftKey(e))Le(!1),null==le||le();else if(!z){var t,r;e.preventDefault(),null===(r=document)||void 0===r||null===(t=r.querySelector(`[id="${Fe.current}"]`))||void 0===t||t.focus()}ye.current=!1}},iconOnClick:Ee,onMouseDown:()=>{we&&(ve.current=!0),De||null==ie||ie()},iconOnMouseDown:()=>{ve.current=!0,ye.current=!0,De?(Le(!1),null==le||le()):(Le(!0),null==ie||ie())},inputIcon:"calendar",labelInline:N,ref:Te,adaptiveLabelBreakpoint:S,tooltipPosition:ee,helpAriaLabel:R,autoFocus:E,size:Z,disabled:K,readOnly:Y,inputWidth:re,labelWidth:ne,maxWidth:null!=ae?ae:A[Z],m:0,validationMessagePositionTop:Me})),t(x,{disablePortal:z,inputElement:fe,pickerProps:X,selectedDays:Ce,onDayClick:(e,t)=>{var r;Be(e),H(Se(M(F({},t),{target:M(F({},t.target),{value:y(je,e)})}))),ge.current=!0,null===(r=be.current)||void 0===r||r.focus(),Le(!1)},minDate:q,maxDate:G,pickerMouseDown:()=>{ve.current=!0},open:De,setOpen:Le,pickerTabGuardId:Fe.current,onPickerClose:le,ariaLabel:se,ariaLabelledBy:ce})]}))}));export{S as DateInput,S as default};

package/esm/components/date/date.style.js

@@ -1 +1 @@
-import t,{css as e}from"styled-components";import{margin as i}from"styled-system";import a from"../../style/themes/apply-base-theme.js";import l from"../../__internal__/input/input.style.js";import n from"../../__internal__/input/input-presentation.style.js";import{FieldLineStyle as m}from"../../__internal__/form-field/form-field.style.js";import r from"../../__internal__/validation-message/validation-message.style.js";import o from"../../__internal__/label/label.style.js";const s={large:"140px",medium:"135px",small:"120px"},p=t.div.attrs(a).withConfig({displayName:"date.style__StyledDateInput",componentId:"sc-7be40934-0"})(["margin-bottom:var(--fieldSpacing);"," & ","{flex:none;width:",";","{margin-right:-8px;}}",""],i,n,(({inputWidth:t,maxWidth:e,size:i})=>e||t?"":s[i]),l,(({applyDateRangeStyling:t,maxWidth:i,size:a,labelInline:l})=>t&&!l&&e(["","{max-width:",";}",",","{overflow-wrap:anywhere;}"],m,i||s[a],r,o)));export{p as default};
+import e,{css as t}from"styled-components";import{margin as a}from"styled-system";import l from"../../style/themes/apply-base-theme.js";import o from"../../__internal__/validation-message/validation-message.style.js";import s from"../../__internal__/label/label.style.js";const i=e.div.attrs(l).withConfig({displayName:"date.style__StyledDateInput",componentId:"sc-24718135-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],a,(({applyDateRangeStyling:e,labelInline:a})=>e&&!a&&t(["",",","{overflow-wrap:anywhere;}"],o,s)));export{i as default};

package/esm/components/date-range/date-range.style.js

@@ -1 +1 @@
-import t from"styled-components";import{margin as e}from"styled-system";import a from"../date/date.style.js";import{StyledLabelContainer as i}from"../../__internal__/label/label.style.js";import{StyledInputPresentationContainer as o}from"../../__internal__/input/input-presentation.style.js";import l from"../../style/themes/apply-base-theme.js";const n=t.div.attrs(l).withConfig({displayName:"date-range.style__StyledDateRange",componentId:"sc-39b770fa-0"})([""," margin-bottom:var(--fieldSpacing);"," & ","{width:auto;display:inline-block;vertical-align:",";}& ",":first-of-type{margin-right:var(--spacing300);}","{width:auto;}","{flex:auto;}"],(({validationMessagePositionTop:t})=>`\n    display: flex;\n    align-items: ${t?"flex-end":"flex-start"};\n  `),e,a,(({labelsInline:t})=>t?"top":"bottom"),a,i,o);export{n as default};
+import t from"styled-components";import{margin as e}from"styled-system";import a from"../date/date.style.js";import i from"../../style/themes/apply-base-theme.js";const o=t.div.attrs(i).withConfig({displayName:"date-range.style__StyledDateRange",componentId:"sc-d672a1b1-0"})([""," margin-bottom:var(--fieldSpacing);"," & ","{width:auto;display:inline-block;vertical-align:",";}& ",":first-of-type{margin-right:var(--spacing300);}"],(({validationMessagePositionTop:t})=>`\n    display: flex;\n    align-items: ${t?"flex-end":"flex-start"};\n  `),e,a,(({labelsInline:t})=>t?"top":"bottom"),a);export{o as default};

package/esm/components/file-input/file-input.component.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { MarginProps } from "styled-system";
 import { ValidationProps } from "../../__internal__/validations";
-import { InputProps } from "../../__internal__/input";
+import { InputProps } from "../../__internal__/legacy-input";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
 import { FileUploadStatusProps } from "./__internal__/file-upload-status";
 export interface FileInputProps extends Pick<ValidationProps, "error">, Pick<InputProps, "id" | "name" | "required">, TagProps, MarginProps {

package/esm/components/file-input/file-input.component.js

@@ -1 +1 @@
-import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import n,{useState as i,useRef as o,useEffect as a,createElement as l}from"react";import"../../style/utils/filter-styled-system-padding-props.js";import s from"../../style/utils/filter-styled-system-margin-props.js";import{InputBehaviour as d}from"../../__internal__/input-behaviour/input-behaviour.component.js";import p from"../../__internal__/form-field/form-field.component.js";import m from"../../hooks/__internal__/useUniqueId/index.js";import u from"../../hooks/__internal__/useInputAccessibility/useInputAccessibility.js";import c from"../../__internal__/validation-message/validation-message.component.js";import{StyledHiddenFileInput as f,StyledFileInputPresentation as g}from"./file-input.style.js";import v from"../textbox/textbox.style.js";import{ButtonMinor as b}from"../button-minor/button-minor.component.js";import{Typography as y}from"../typography/typography.component.js";import{FileUploadStatus as h}from"./__internal__/file-upload-status/file-upload-status.component.js";import{Box as j}from"../box/box.component.js";import O from"../../hooks/__internal__/useLocale/useLocale.js";import{HintText as _}from"../../__internal__/hint-text/hint-text.component.js";function x(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function P(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){x(e,t,r[t])}))}return e}function D(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const w=n.forwardRef(((n,x)=>{var{accept:w,buttonText:I,"data-element":T,"data-role":k,dragAndDropText:E,error:L,label:S,id:H,inputHint:A,isVertical:W,maxHeight:q,maxWidth:F,minHeight:C,minWidth:M="280px",name:R,onChange:V,required:U,uploadStatus:N=[],validationMessagePositionTop:z=!0}=n,B=function(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}(n,["accept","buttonText","data-element","data-role","dragAndDropText","error","label","id","inputHint","isVertical","maxHeight","maxWidth","minHeight","minWidth","name","onChange","required","uploadStatus","validationMessagePositionTop"]);const G=O(),J=I||G.fileInput.selectFile(),K=E||G.fileInput.dragAndDrop(),Q={maxHeight:q||void 0,maxWidth:F||M,minHeight:C,minWidth:M},[X,Y]=m(H,R),[Z,$]=i(!1),[ee,te]=i(!1),re=o(null),ne=e=>{var t;e.preventDefault(),(null===(t=e.dataTransfer)||void 0===t?void 0:t.types.includes("Files"))&&te(!0)},ie=e=>{e.preventDefault(),te(!1)};a((()=>(document.addEventListener("dragover",ne),document.addEventListener("drop",ie),document.addEventListener("dragleave",ie),()=>{document.removeEventListener("dragover",ne),document.removeEventListener("drop",ie),document.removeEventListener("dragleave",ie)})),[]);const oe=e=>{null==V||V(e)},{labelId:ae,validationId:le}=u({id:X,validationRedesignOptIn:!0,error:L,label:S}),se=Array.isArray(N)?N:[N],de=e(t,{children:[A&&r(_,{children:A}),e(j,{position:"relative",children:[z&&e(t,{children:[r(c,{error:L,validationId:le,validationMessagePositionTop:z,"data-role":"validation-message-top"}),L&&r(v,{warning:!1})]}),r(f,P(D(P({},U&&{required:U}),{accept:w,"aria-invalid":!!L,id:X,ref:e=>{re.current=e,"function"==typeof x?x(e):x&&(x.current=e)},name:Y,onChange:e=>{oe(e.target.files)},type:"file"}),B)),e(g,D(P({"data-role":"file-input-presentation",isDraggedOver:Z,isDraggingFile:ee,error:L,onDragLeave:e=>{e.preventDefault(),e.stopPropagation(),$(!1)},onDragOver:e=>{var t;e.preventDefault(),(null===(t=e.dataTransfer)||void 0===t?void 0:t.types.includes("Files"))&&$(!0)},onDrop:e=>{e.preventDefault(),$(!1),oe(e.dataTransfer.files)},isVertical:W},Q),{children:[r(b,{buttonType:"primary",onClick:()=>{var e;null===(e=re.current)||void 0===e||e.click()},children:J}),r(y,{m:0,children:K})]})),!z&&e(t,{children:[r(c,{error:L,validationId:le,validationMessagePositionTop:z,"data-role":"validation-message-bottom"}),L&&r(v,{warning:!1})]})]})]});return r(d,{children:r(p,D(P({error:L,label:S,labelId:ae,id:X,isRequired:U,"data-component":"file-input","data-role":k,"data-element":T,validationRedesignOptIn:!0},s(B)),{children:0===se.length?de:se.map((e=>l(g,D(P({hasUploadStatus:!0},Q),{key:e.filename}),r(h,P({},e)))))}))})}));w.displayName="FileInput";export{w as FileInput,w as default};
+import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import n,{useState as i,useRef as o,useEffect as a,createElement as l}from"react";import"../../style/utils/filter-styled-system-padding-props.js";import s from"../../style/utils/filter-styled-system-margin-props.js";import{InputBehaviour as d}from"../../__internal__/input-behaviour/input-behaviour.component.js";import p from"../../__internal__/form-field/form-field.component.js";import m from"../../hooks/__internal__/useUniqueId/index.js";import c from"../../hooks/__internal__/useInputAccessibility/useInputAccessibility.js";import u from"../../__internal__/validation-message/validation-message.component.js";import{StyledHiddenFileInput as f,StyledFileInputPresentation as g}from"./file-input.style.js";import v from"../../__internal__/legacy-error-border/error-border.style.js";import{ButtonMinor as y}from"../button-minor/button-minor.component.js";import{Typography as b}from"../typography/typography.component.js";import{FileUploadStatus as h}from"./__internal__/file-upload-status/file-upload-status.component.js";import{Box as _}from"../box/box.component.js";import j from"../../hooks/__internal__/useLocale/useLocale.js";import{HintText as O}from"../../__internal__/legacy-hint-text/hint-text.component.js";function x(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function P(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){x(e,t,r[t])}))}return e}function D(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const w=n.forwardRef(((n,x)=>{var{accept:w,buttonText:I,"data-element":T,"data-role":k,dragAndDropText:E,error:L,label:S,id:H,inputHint:A,isVertical:W,maxHeight:q,maxWidth:F,minHeight:C,minWidth:M="280px",name:R,onChange:V,required:U,uploadStatus:N=[],validationMessagePositionTop:z=!0}=n,B=function(e,t){if(null==e)return{};var r,n,i=function(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(i[r]=e[r]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}(n,["accept","buttonText","data-element","data-role","dragAndDropText","error","label","id","inputHint","isVertical","maxHeight","maxWidth","minHeight","minWidth","name","onChange","required","uploadStatus","validationMessagePositionTop"]);const G=j(),J=I||G.fileInput.selectFile(),K=E||G.fileInput.dragAndDrop(),Q={maxHeight:q||void 0,maxWidth:F||M,minHeight:C,minWidth:M},[X,Y]=m(H,R),[Z,$]=i(!1),[ee,te]=i(!1),re=o(null),ne=e=>{var t;e.preventDefault(),(null===(t=e.dataTransfer)||void 0===t?void 0:t.types.includes("Files"))&&te(!0)},ie=e=>{e.preventDefault(),te(!1)};a((()=>(document.addEventListener("dragover",ne),document.addEventListener("drop",ie),document.addEventListener("dragleave",ie),()=>{document.removeEventListener("dragover",ne),document.removeEventListener("drop",ie),document.removeEventListener("dragleave",ie)})),[]);const oe=e=>{null==V||V(e)},{labelId:ae,validationId:le}=c({id:X,validationRedesignOptIn:!0,error:L,label:S}),se=Array.isArray(N)?N:[N],de=e(t,{children:[A&&r(O,{children:A}),e(_,{position:"relative",children:[z&&e(t,{children:[r(u,{error:L,validationId:le,validationMessagePositionTop:z,"data-role":"validation-message-top"}),L&&r(v,{warning:!1})]}),r(f,P(D(P({},U&&{required:U}),{accept:w,"aria-invalid":!!L,id:X,ref:e=>{re.current=e,"function"==typeof x?x(e):x&&(x.current=e)},name:Y,onChange:e=>{oe(e.target.files)},type:"file"}),B)),e(g,D(P({"data-role":"file-input-presentation",isDraggedOver:Z,isDraggingFile:ee,error:L,onDragLeave:e=>{e.preventDefault(),e.stopPropagation(),$(!1)},onDragOver:e=>{var t;e.preventDefault(),(null===(t=e.dataTransfer)||void 0===t?void 0:t.types.includes("Files"))&&$(!0)},onDrop:e=>{e.preventDefault(),$(!1),oe(e.dataTransfer.files)},isVertical:W},Q),{children:[r(y,{buttonType:"primary",onClick:()=>{var e;null===(e=re.current)||void 0===e||e.click()},children:J}),r(b,{m:0,children:K})]})),!z&&e(t,{children:[r(u,{error:L,validationId:le,validationMessagePositionTop:z,"data-role":"validation-message-bottom"}),L&&r(v,{warning:!1})]})]})]});return r(d,{children:r(p,D(P({error:L,label:S,labelId:ae,id:X,isRequired:U,"data-component":"file-input","data-role":k,"data-element":T,validationRedesignOptIn:!0},s(B)),{children:0===se.length?de:se.map((e=>l(g,D(P({hasUploadStatus:!0},Q),{key:e.filename}),r(h,P({},e)))))}))})}));w.displayName="FileInput";export{w as FileInput,w as default};

package/esm/components/file-input/file-input.style.d.ts

@@ -1,4 +1,4 @@
-import type { InputProps } from "../../__internal__/input";
+import type { InputProps } from "../../__internal__/legacy-input";
 import type { ValidationProps } from "../../__internal__/validations";
 type CustomFileInputProps = Omit<InputProps, "value"> & {
     value?: string;

package/esm/components/file-input/file-input.style.js

@@ -1 +1 @@
-import i,{css as t}from"styled-components";import e from"../typography/typography.style.js";const r=i.input.withConfig({displayName:"file-input.style__StyledHiddenFileInput",componentId:"sc-6e60ad6-0"})(["display:none;"]),o=i.div.withConfig({displayName:"file-input.style__StyledFileInputPresentation",componentId:"sc-6e60ad6-1"})([""," ",""],(({hasUploadStatus:i,minWidth:e,minHeight:r,maxWidth:o,maxHeight:a})=>t(["min-width:",";min-height:",";max-width:",";",""],e,r,o,!i&&t(["padding:11px;max-height:",";box-sizing:border-box;"],a))),(({hasUploadStatus:i,isDraggedOver:r,isDraggingFile:o,error:a,isVertical:n})=>{let l="colorsUtilityMajor300",d="colorsUtilityYang100";return r?(l="colorsUtilityMajor400",d="colorsUtilityMajor100"):o&&(l="colorsUtilityMajor400"),a&&(l="colorsSemanticNegative"+(o?600:500)),!i&&t(["display:flex;"," flex-wrap:wrap;justify-content:center;align-content:center;align-items:center;text-align:center;gap:var(--spacing100);border-radius:var(--borderRadius050);border:var(--",") dashed var(--",");background:var(--",");","{color:var(--colorsUtilityYin055);}"],n&&"flex-direction: column;",a||o?"borderWidth200":"borderWidth100",l,d,e)}));export{o as StyledFileInputPresentation,r as StyledHiddenFileInput};
+import i,{css as t}from"styled-components";import e from"../typography/typography.style.js";const r=i.input.withConfig({displayName:"file-input.style__StyledHiddenFileInput",componentId:"sc-f1cdfaa4-0"})(["display:none;"]),o=i.div.withConfig({displayName:"file-input.style__StyledFileInputPresentation",componentId:"sc-f1cdfaa4-1"})([""," ",""],(({hasUploadStatus:i,minWidth:e,minHeight:r,maxWidth:o,maxHeight:a})=>t(["min-width:",";min-height:",";max-width:",";",""],e,r,o,!i&&t(["padding:11px;max-height:",";box-sizing:border-box;"],a))),(({hasUploadStatus:i,isDraggedOver:r,isDraggingFile:o,error:a,isVertical:n})=>{let l="colorsUtilityMajor300",d="colorsUtilityYang100";return r?(l="colorsUtilityMajor400",d="colorsUtilityMajor100"):o&&(l="colorsUtilityMajor400"),a&&(l="colorsSemanticNegative"+(o?600:500)),!i&&t(["display:flex;"," flex-wrap:wrap;justify-content:center;align-content:center;align-items:center;text-align:center;gap:var(--spacing100);border-radius:var(--borderRadius050);border:var(--",") dashed var(--",");background:var(--",");","{color:var(--colorsUtilityYin055);}"],n&&"flex-direction: column;",a||o?"borderWidth200":"borderWidth100",l,d,e)}));export{o as StyledFileInputPresentation,r as StyledHiddenFileInput};

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

@@ -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";import{StyledButton as g}from"../button/__next__/button.style.js";const p=o.span.attrs(n).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-c60a91e8-0"})([""," "," &{color:currentColor;}.mentions-list-item &&{color:currentColor;}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:currentColor;}"],(({theme:o,color:n,bg:g,isInteractive:p,bgSize:u,bgShape:h,type:b,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,h?`border-radius: ${d.backgroundShape[h]}`:"",p&&e(["&:not(:focus):hover{filter:brightness(0.9);}"]),f[b],y&&e(["font-size:",";line-height:",";"],d.iconSize[y],d.iconSize[y]),v&&"services"===b&&c(v)&&e(["margin-top:",";"],"small"===y?"-7px":"-8px"),x&&v&&"services"===b&&m(x)&&!c(v)&&e(["margin-top:-6px;"]),z&&`\n        :focus {\n          ${r()}\n        }\n      `,t)}),g);export{p as default};
+import o,{css as e}from"styled-components";import{margin as t}from"styled-system";import r from"../../__internal__/utils/logger/index.js";import i from"../../style/themes/apply-base-theme.js";import n from"../../style/utils/add-focus-styling.js";import l from"../../style/utils/color.js";import{getWindow as s,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 g from"./icon-unicodes.js";import{StyledButton as f}from"../button/__next__/button.style.js";const p=e([""," &{color:currentColor;}.mentions-list-item &&{color:currentColor;}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:currentColor;}.search &{color:var(--colorsUtilityYin065);:hover{color:var(--colorsUtilityYin100);}}.search.dark-background:not(.with-button) &{color:var(--colorsUtilityYang080);:hover{color:var(--colorsUtilityYang100);}}.multi-select &,.filterable-select &{cursor:pointer;}"],f),u=o.span.attrs(i).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-56ac9ede-0"})(["",""],(({theme:o,color:i,bg:f,isInteractive:u,bgSize:h,bgShape:b,type:y,fontSize:_,disabled:v,hasTooltip:z})=>{let S="var(--colorsYin090)",j="transparent";const k=s(),x=a(),w=function(o,e){const t={small:1,medium:2,large:3,"extra-large":4};return o&&e?t[e]<t[o]?(r.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}(_,h);if(v)S="var(--colorsYin030)";else if(i){const{color:e}=l({color:i,theme:o});S=e}if(f){const{backgroundColor:e}=l({bg:f,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,w,w,b?`border-radius: ${d.backgroundShape[b]}`:"",u&&e(["&:not(:focus):hover{filter:brightness(0.9);}"]),g[y],_&&e(["font-size:",";line-height:",";"],d.iconSize[_],d.iconSize[_]),k&&"services"===y&&c(k)&&e(["margin-top:",";"],"small"===_?"-7px":"-8px"),x&&k&&"services"===y&&m(x)&&!c(k)&&e(["margin-top:-6px;"]),z&&`\n        :focus {\n          ${n()}\n        }\n      `,t,p)}));export{u as default};

package/esm/components/inline-inputs/inline-inputs.component.d.ts

@@ -6,7 +6,11 @@ import { TagProps } from "../../__internal__/utils/helpers/tags";
  * @deprecated `InlineInputs` has been deprecated. See the Carbon documentation for migration details.
  */
 export interface InlineInputsProps extends MarginProps, StyledContentContainerProps, StyledInlineInputsProps, TagProps {
-    /** Breakpoint for adaptive label (inline label change to top aligned). Enables the adaptive behaviour when set */
+    /**
+     * @deprecated `adaptiveLabelBreakpoint` has been deprecated.
+     * It is recommended to use `useMediaQuery` hook to implement adaptive behaviour.
+     * Breakpoint for adaptive label (inline label change to top aligned). Enables the adaptive behaviour when set
+     **/
     adaptiveLabelBreakpoint?: number;
     /** Children elements */
     children?: React.ReactNode;

package/esm/components/inline-inputs/inline-inputs.component.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useRef as n,useEffect as l}from"react";import i from"../../__internal__/label/label.component.js";import o,{StyledContentContainer as a,StyledInlineInput as u}from"./inline-inputs.style.js";import p from"../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js";import s from"../../__internal__/utils/helpers/tags/tags.js";import"../../style/utils/filter-styled-system-padding-props.js";import c from"../../style/utils/filter-styled-system-margin-props.js";function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const f=(e,n)=>r.Children.map(e,(e=>t(u,{gutter:n,"data-element":"inline-input",children:e}))),d=r=>{var{adaptiveLabelBreakpoint:u,label:d,labelAlign:m,labelId:y,htmlFor:O,children:g=null,gutter:h="none",inputWidth:j,labelInline:v=!0,labelWidth:P,required:_}=r,w=function(e,t){if(null==e)return{};var r,n,l=function(e,t){if(null==e)return{};var r,n,l={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(l[r]=e[r]);return l}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r])}return l}(r,["adaptiveLabelBreakpoint","label","labelAlign","labelId","htmlFor","children","gutter","inputWidth","labelInline","labelWidth","required"]);const I=p(u),k=n(null);let A=v;u&&(A=I);const S=c(w);return l((()=>{var e;_&&Array.from((null===(e=k.current)||void 0===e?void 0:e.querySelectorAll("input"))||[]).forEach((e=>e.setAttribute("required","")))}),[_]),e(o,(W=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){b(e,t,r[t])}))}return e}({gutter:h,labelWidth:P,labelInline:A,ref:k},S,s("inline-inputs",w)),q=null!=(q={children:[d?t(i,{align:m,labelId:y,inline:A,htmlFor:O,isRequired:_,children:d}):null,t(a,{gutter:h,"data-element":"inline-inputs-container","data-role":"inline-inputs-container",inputWidth:j,children:f(g,h)})]})?q:{},Object.getOwnPropertyDescriptors?Object.defineProperties(W,Object.getOwnPropertyDescriptors(q)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(q)).forEach((function(e){Object.defineProperty(W,e,Object.getOwnPropertyDescriptor(q,e))})),W));var W,q};d.displayName="InlineInputs";export{d as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useRef as n,useEffect as l}from"react";import i from"../../__internal__/legacy-label/label.component.js";import o,{StyledContentContainer as a,StyledInlineInput as u}from"./inline-inputs.style.js";import p from"../../hooks/__internal__/useIsAboveBreakpoint/useIsAboveBreakpoint.js";import s from"../../__internal__/utils/helpers/tags/tags.js";import"../../style/utils/filter-styled-system-padding-props.js";import c from"../../style/utils/filter-styled-system-margin-props.js";function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const f=(e,n)=>r.Children.map(e,(e=>t(u,{gutter:n,"data-element":"inline-input",children:e}))),d=r=>{var{adaptiveLabelBreakpoint:u,label:d,labelAlign:m,labelId:y,htmlFor:O,children:g=null,gutter:h="none",inputWidth:j,labelInline:v=!0,labelWidth:P,required:_}=r,w=function(e,t){if(null==e)return{};var r,n,l=function(e,t){if(null==e)return{};var r,n,l={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(l[r]=e[r]);return l}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(l[r]=e[r])}return l}(r,["adaptiveLabelBreakpoint","label","labelAlign","labelId","htmlFor","children","gutter","inputWidth","labelInline","labelWidth","required"]);const I=p(u),k=n(null);let A=v;u&&(A=I);const S=c(w);return l((()=>{var e;_&&Array.from((null===(e=k.current)||void 0===e?void 0:e.querySelectorAll("input"))||[]).forEach((e=>e.setAttribute("required","")))}),[_]),e(o,(W=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){b(e,t,r[t])}))}return e}({gutter:h,labelWidth:P,labelInline:A,ref:k,role:"group"},S,s("inline-inputs",w)),q=null!=(q={children:[d?t(i,{align:m,labelId:y,inline:A,htmlFor:O,isRequired:_,children:d}):null,t(a,{gutter:h,"data-element":"inline-inputs-container","data-role":"inline-inputs-container",inputWidth:j,children:f(g,h)})]})?q:{},Object.getOwnPropertyDescriptors?Object.defineProperties(W,Object.getOwnPropertyDescriptors(q)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(q)).forEach((function(e){Object.defineProperty(W,e,Object.getOwnPropertyDescriptor(q,e))})),W));var W,q};d.displayName="InlineInputs";export{d as default};

package/esm/components/inline-inputs/inline-inputs.style.js

@@ -1 +1 @@
-import t,{css as e}from"styled-components";import{margin as r}from"styled-system";import i from"../../__internal__/input/input-presentation.style.js";import{StyledLabelContainer as o}from"../../__internal__/label/label.style.js";import a from"../../style/themes/apply-base-theme.js";const n={none:0,"extra-small":8,small:16,"medium-small":20,medium:24,"medium-large":28,large:32,"extra-large":40},d=t.div.withConfig({displayName:"inline-inputs.style__StyledInlineInput",componentId:"sc-9639cce8-0"})(["flex:1;",""],(({gutter:t})=>t&&e(["margin-bottom:0;padding-left:","px;"],n[t]))),l=t.div.withConfig({displayName:"inline-inputs.style__StyledContentContainer",componentId:"sc-9639cce8-1"})(["display:flex;flex:",";",""],(({inputWidth:t})=>t?`0 0 ${t}%`:1),(({gutter:t})=>t&&e(["margin-bottom:0;margin-left:-","px;",""],n[t],"none"===t&&e([""," + "," ","{border-left:none;}",":not(:first-of-type):not(:last-of-type) ","{border-radius:var(--borderRadius000);}",":first-of-type:not(:last-of-type) ","{border-top-right-radius:var(--borderRadius000);border-bottom-right-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius050);border-bottom-left-radius:var(--borderRadius050);}",":last-of-type:not(:first-of-type) ","{border-top-left-radius:var(--borderRadius000);border-bottom-left-radius:var(--borderRadius000);border-top-right-radius:var(--borderRadius050);border-bottom-right-radius:var(--borderRadius050);}"],d,d,i,d,i,d,i,d,i)))),s=t.div.attrs(a).withConfig({displayName:"inline-inputs.style__StyledInlineInputs",componentId:"sc-9639cce8-2"})(["margin-bottom:var(--fieldSpacing);"," display:",";align-items:center;","{width:auto;margin-bottom:",";padding-right:16px;flex:0 0 ",';}input{width:1px;}[data-component="carbon-select"] input{width:30px;}'],r,(({labelInline:t})=>t?"flex":"block"),o,(({labelInline:t})=>t?"0px":"8px"),(({labelWidth:t})=>t?`${t}%`:"auto"));export{l as StyledContentContainer,d as StyledInlineInput,s as default};
+import t,{css as e}from"styled-components";import{margin as r}from"styled-system";import i from"../../__internal__/legacy-input/input-presentation.style.js";import{StyledLabelContainer as o}from"../../__internal__/legacy-label/label.style.js";import a from"../../style/themes/apply-base-theme.js";const n={none:0,"extra-small":8,small:16,"medium-small":20,medium:24,"medium-large":28,large:32,"extra-large":40},d=t.div.withConfig({displayName:"inline-inputs.style__StyledInlineInput",componentId:"sc-7bef1a9c-0"})(["flex:1;",""],(({gutter:t})=>t&&e(["margin-bottom:0;padding-left:","px;"],n[t]))),l=t.div.withConfig({displayName:"inline-inputs.style__StyledContentContainer",componentId:"sc-7bef1a9c-1"})(["display:flex;flex:",";",""],(({inputWidth:t})=>t?`0 0 ${t}%`:1),(({gutter:t})=>t&&e(["margin-bottom:0;margin-left:-","px;",""],n[t],"none"===t&&e([""," + "," ","{border-left:none;}",":not(:first-of-type):not(:last-of-type) ","{border-radius:var(--borderRadius000);}",":first-of-type:not(:last-of-type) ","{border-top-right-radius:var(--borderRadius000);border-bottom-right-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius050);border-bottom-left-radius:var(--borderRadius050);}",":last-of-type:not(:first-of-type) ","{border-top-left-radius:var(--borderRadius000);border-bottom-left-radius:var(--borderRadius000);border-top-right-radius:var(--borderRadius050);border-bottom-right-radius:var(--borderRadius050);}"],d,d,i,d,i,d,i,d,i)))),s=t.div.attrs(a).withConfig({displayName:"inline-inputs.style__StyledInlineInputs",componentId:"sc-7bef1a9c-2"})(["margin-bottom:var(--fieldSpacing);"," display:",";align-items:center;","{width:auto;margin-bottom:",";padding-right:16px;flex:0 0 ",';}input{width:1px;}[data-component="carbon-select"] input{width:30px;}'],r,(({labelInline:t})=>t?"flex":"block"),o,(({labelInline:t})=>t?"0px":"8px"),(({labelWidth:t})=>t?`${t}%`:"auto"));export{l as StyledContentContainer,d as StyledInlineInput,s as default};