carbon-react 162.12.0-beta.1 → 162.13.0

package/esm/components/card/card.style.js

@@ -0,0 +1 @@
+import a,{css as o}from"styled-components";import{margin as e}from"styled-system";import r from"../../style/themes/apply-base-theme.js";import l from"../../style/utils/add-focus-styling.js";const t={none:"var(--global-space-comp-none)","extra-small":"var(--global-space-comp-s)",small:"var(--global-space-comp-l)",medium:"var(--global-space-comp-xl)",large:"var(--global-space-comp-2-xl)"},n={none:"var(--global-space-comp-none)","extra-small":"var(--global-size-none) calc(-1 * var(--global-space-comp-s))",small:"var(--global-size-none) calc(-1 * var(--global-space-comp-l))",medium:"var(--global-size-none) calc(-1 * var(--global-space-comp-xl))",large:"var(--global-size-none) calc(-1 * var(--global-space-comp-2-xl))"},i=a.div.attrs(r).withConfig({displayName:"card.style__StyledCard",componentId:"carbon_v162_12_0__sc-f131a6b5-0"})(["",""],(({$cardWidth:a,$interactive:r,$height:l,$roundness:n,$spacing:i,$variant:s="standard"})=>o(["background-color:var(--container-action-bg-default);border-radius:",";box-shadow:",";color:var(--container-standard-txt-default);display:flex;flex-direction:column;height:",";justify-content:space-between;align-items:normal;margin:var(--global-space-comp-xl);outline:none;transition:all 0.3s ease-in-out;vertical-align:top;width:",";padding:var(--global-size-none) ",";"," "," ::-moz-focus-inner{border:var(--global-size-none);}"],"moderate"===n||"default"===n?"var(--global-radius-container-l)":"var(--global-radius-container-xl)","outlined"===s?"var(--global-depth-none)":"var(--global-depth-lvl1)",l,a,t[i],e,r&&o([":hover,:focus-within{box-shadow:",";}"],"outlined"===s?"none":"var(--global-depth-lvl2)")))),s=a.div.attrs(r).attrs((({href:a,onClick:o})=>a?{as:"a"}:o?{as:"button",role:"button",type:"button"}:{})).withConfig({displayName:"card.style__StyledCardContent",componentId:"carbon_v162_12_0__sc-f131a6b5-1"})([""," align-items:stretch;outline:none;text-decoration:none;background-color:inherit;border:none;padding:0;"," ",""],(({$interactive:a})=>a&&o(["cursor:pointer;display:inline-flex;flex-direction:column;height:100%;:focus{",";position:relative;}"],l())),(({$spacing:a})=>`\n    padding: ${t[a]};\n    margin: ${n[a]};\n    ${"extra-small"===a?"display: flex; flex-direction: column; align-items: stretch; align-self: stretch;":""}\n  `),(({$roundness:a,$hasHeader:e,$hasFooter:r})=>o([""," ",""],("moderate"===a||"default"===a)&&o([""," ",""],!e&&o(["border-top-left-radius:var(--global-radius-container-l);border-top-right-radius:var(--global-radius-container-l);"]),!r&&o(["border-bottom-left-radius:var(--global-radius-container-l);border-bottom-right-radius:var(--global-radius-container-l);"])),("curved"===a||"large"===a)&&o([""," ",""],!e&&o(["border-top-left-radius:var(--global-radius-container-xl);border-top-right-radius:var(--global-radius-container-xl);"]),!r&&o(["border-bottom-left-radius:var(--global-radius-container-xl);border-bottom-right-radius:var(--global-radius-container-xl);"]))))),d=a.div.withConfig({displayName:"card.style__StyledDragRow",componentId:"carbon_v162_12_0__sc-f131a6b5-2"})(["display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;margin-top:",";"],(({$spacing:a})=>t[a])),c=a.div.withConfig({displayName:"card.style__StyledDragHandle",componentId:"carbon_v162_12_0__sc-f131a6b5-3"})(["cursor:grab;&:active{cursor:grabbing;}"]);export{i as StyledCard,s as StyledCardContent,c as StyledDragHandle,d as StyledDragRow,n as marginSizes,t as paddingSizes};

package/esm/components/card/index.d.ts

@@ -0,0 +1,8 @@
+export { default, default as Card } from "./card.component";
+export type { CardProps } from "./card.component";
+export { default as CardColumn } from "./card-column";
+export type { CardColumnProps } from "./card-column";
+export { default as CardFooter } from "./card-footer";
+export type { CardFooterProps } from "./card-footer";
+export { default as CardRow } from "./card-row";
+export type { CardRowProps } from "./card-row";

package/esm/components/card/index.js

@@ -0,0 +1 @@
+export{default as Card,default}from"./card.component.js";export{default as CardColumn}from"./card-column/card-column.component.js";export{default as CardFooter}from"./card-footer/card-footer.component.js";export{default as CardRow}from"./card-row/card-row.component.js";

package/esm/components/checkbox/__internal__/checkbox-group.context.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { CheckboxSizes } from "../checkbox-group/checkbox-group.component";
+type CheckboxGroupContext = {
+    inline?: boolean;
+    error?: boolean;
+    warning?: boolean;
+    size?: CheckboxSizes;
+    disabled?: boolean;
+    required?: boolean;
+};
+declare const _default: React.Context<CheckboxGroupContext>;
+export default _default;

package/esm/components/checkbox/__internal__/checkbox-group.context.js

@@ -0,0 +1 @@
+import t from"react";var e=t.createContext({});export{e as default};

package/esm/components/checkbox/__internal__/checkbox-svg.component.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+type CheckboxSvgProps = {
+    indeterminate?: boolean;
+};
+declare const CheckboxSvg: ({ indeterminate }: CheckboxSvgProps) => React.JSX.Element;
+export default CheckboxSvg;

package/esm/components/checkbox/__internal__/checkbox-svg.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import"react";const t=({indeterminate:t})=>e("div",{"data-role":"checkable-input-svg-wrapper",children:e("svg",t?{"data-role":"indeterminate-svg",focusable:"false",viewBox:"0 0 20 20",fill:"none",children:e("rect",{y:"8",width:"20",height:"4",rx:"2",fill:"transparent"})}:{focusable:"false",viewBox:"0 0 16 12",fill:"none",children:e("path",{d:"M15.3254 0.231177C15.0768 0.0725131 14.7858 -0.0078498 14.4904 0.000604729C14.1106 0.0116071 13.7498 0.168628 13.4841 0.43853L5.39406 8.47955L2.522 5.62489C2.38757 5.48677 2.22699 5.37639 2.04948 5.30014C1.87029 5.22317 1.67746 5.1825 1.48226 5.18053C1.28706 5.17856 1.09344 5.21532 0.912713 5.28865C0.731991 5.36199 0.567806 5.47043 0.429775 5.60762C0.291743 5.74482 0.182642 5.90801 0.108858 6.08764C0.035074 6.26727 -0.00190855 6.45972 7.58261e-05 6.65373C0.0020602 6.84775 0.0429724 7.03941 0.120415 7.21751C0.197135 7.39395 0.308179 7.55356 0.447147 7.68717L4.35671 11.573C4.63187 11.8464 5.005 12 5.39406 12C5.78312 12 6.15633 11.8464 6.43149 11.573L15.559 2.50077C15.7693 2.29623 15.9128 2.03357 15.971 1.74686C16.0294 1.45899 15.9991 1.16029 15.8839 0.889848C15.7687 0.619408 15.574 0.389838 15.3254 0.231177Z",fill:"transparent"})})});export{t as default};

package/esm/components/checkbox/checkbox-group/checkbox-group.component.d.ts

@@ -0,0 +1,83 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { TagProps } from "../../../__internal__/utils/helpers/tags/tags";
+export type CheckboxSizes = "small" | "medium" | "large";
+export interface CheckboxGroupProps extends MarginProps, TagProps {
+    /**
+     * Unique identifier for the component.
+     * Will use a randomly generated GUID if none is provided.
+     */
+    id?: string;
+    /** The content for the CheckboxGroup Legend */
+    legend?: string;
+    /** Content for the hint text below the legend. */
+    legendHint?: string;
+    /** Size of the CheckboxGroup. */
+    size?: CheckboxSizes;
+    /** Error message to be displayed when validation fails. */
+    error?: string;
+    /**
+     * Warning message to be displayed when validation warning occurs.
+     * @deprecated The `warning` state is deprecated and will be removed in a future release.
+     */
+    warning?: string;
+    /**
+     * [Legacy] Indicate additional information.
+     * @deprecated Information validation is no longer supported on this component.
+     */
+    info?: string | boolean;
+    /**
+     * The content for the RadioButtonGroup hint text,
+     * will only be rendered when `validationRedesignOptIn` is true.
+     * @deprecated The `legendHelp` prop is deprecated and will be removed in a future release. Please use the `legendHint` prop instead.
+     */
+    legendHelp?: string;
+    /**
+     * [Legacy] When true, legend is placed in line with the Checkboxes.
+     * @deprecated Inline legends are no longer supported on this component.
+     */
+    legendInline?: boolean;
+    /**
+     * [Legacy] Percentage width of legend (only when legend is inline)
+     * @deprecated Inline legends are no longer supported on this component.
+     */
+    legendWidth?: number;
+    /**
+     * [Legacy] Alignment of the legend.
+     * @deprecated Right legend alignment is no longer supported.
+     */
+    legendAlign?: "left" | "right";
+    /**
+     * [Legacy] Spacing between legend and field for inline legend, number multiplied by base spacing unit (8)
+     * @deprecated Custom spacing for legends is no longer supported on this component.
+     */
+    legendSpacing?: 1 | 2;
+    /** The Checkboxes to be rendered in the group */
+    children: React.ReactNode;
+    /**
+     * Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)
+     * @deprecated Custom spacing for labels is no longer supported on this component.
+     */
+    labelSpacing?: 1 | 2;
+    /** Flag to disable the CheckboxGroup. */
+    disabled?: boolean;
+    /** Flag to configure CheckboxGroup as mandatory*/
+    required?: boolean;
+    /**
+     * Overrides the default tooltip position
+     * @deprecated Tooltips are no longer supported on this component.
+     */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** When true, Checkbox children are inline. */
+    inline?: boolean;
+    /**
+     * Render the ValidationMessage above the CheckboxGroup
+     * @deprecated The `validationMessagePositionTop` prop is deprecated and will be removed in a future release.
+     */
+    validationMessagePositionTop?: boolean;
+}
+export declare const CheckboxGroup: {
+    ({ children, legend, legendHint, size, error, warning, info, disabled, required, legendInline, legendWidth, legendAlign, legendSpacing, legendHelp, tooltipPosition, inline, id, validationMessagePositionTop, ...rest }: CheckboxGroupProps): React.JSX.Element;
+    displayName: string;
+};
+export default CheckboxGroup;

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

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{useRef as r}from"react";import t from"../../../__internal__/utils/helpers/tags/tags.js";import n from"../../../__internal__/fieldset/__next__/fieldset.component.js";import"../../../style/utils/filter-styled-system-padding-props.js";import i from"../../../style/utils/filter-styled-system-margin-props.js";import o from"../__internal__/checkbox-group.context.js";import l from"./checkbox-group.style.js";import s from"../../../__internal__/utils/helpers/guid/index.js";function c(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}const d=d=>{var{children:p,legend:a,legendHint:g,size:u="medium",error:f,warning:b,info:m,disabled:y,required:O,legendInline:j,legendWidth:h,legendAlign:_,legendSpacing:P,legendHelp:v,tooltipPosition:w,inline:x,id:k,validationMessagePositionTop:S=!0}=d,z=function(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(d,["children","legend","legendHint","size","error","warning","info","disabled","required","legendInline","legendWidth","legendAlign","legendSpacing","legendHelp","tooltipPosition","inline","id","validationMessagePositionTop"]);const D=r(s()),H=k||D.current;return e(n,(q=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){c(e,r,t[r])}))}return e}({id:H,legend:a,legendHint:g||v,isDisabled:y,isRequired:O,error:f,warning:b,validationMessagePositionTop:S,size:u},t("checkbox-group",z),i(z)),E=null!=(E={children:e(o.Provider,{value:{error:!!f,warning:!!b,inline:x,size:u,disabled:y,required:O},children:e(l,{"data-role":"checkbox-group-content",$inline:x,$size:u,children:p})})})?E:{},Object.getOwnPropertyDescriptors?Object.defineProperties(q,Object.getOwnPropertyDescriptors(E)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(E)).forEach((function(e){Object.defineProperty(q,e,Object.getOwnPropertyDescriptor(E,e))})),q));var q,E};d.displayName="CheckboxGroup";export{d as CheckboxGroup,d as default};

package/esm/components/checkbox/checkbox-group/checkbox-group.style.d.ts

@@ -0,0 +1,6 @@
+import type { CheckboxSizes } from "../checkbox-group/checkbox-group.component";
+declare const StyledCheckboxGroupContent: import("styled-components").StyledComponent<"div", any, {
+    $size: CheckboxSizes;
+    $inline?: boolean;
+}, never>;
+export default StyledCheckboxGroupContent;

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

@@ -0,0 +1 @@
+import l,{css as a}from"styled-components";const o={small:{gap:"var(--global-space-comp-s)",labelFont:"var(--global-font-static-comp-regular-s)"},medium:{gap:"var(--global-space-comp-m)",labelFont:"var(--global-font-static-comp-regular-m)"},large:{gap:"var(--global-space-comp-l)",labelFont:"var(--global-font-static-comp-regular-l)"}},e=l.div.withConfig({displayName:"checkbox-group.style__StyledCheckboxGroupContent",componentId:"carbon_v162_12_0__sc-87d1bb91-0"})(["",""],(({$size:l,$inline:e})=>a(["display:flex;flex-direction:column;gap:",";.checkable-label{font:",";}",""],o[l].gap,o[l].labelFont,e&&a(["flex-direction:row;gap:var(--global-space-comp-l);"]))));export{e as default};

package/esm/components/checkbox/checkbox.component.d.ts

@@ -0,0 +1,96 @@
+import React, { ReactNode } from "react";
+import { MarginProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+import { CommonCheckableInputProps } from "../../__internal__/checkable-input/checkable-input.component";
+import type { CheckboxSizes } from "./checkbox-group/checkbox-group.component";
+export interface CheckboxProps extends CommonCheckableInputProps, MarginProps, TagProps {
+    /**
+     * Breakpoint for adaptive spacing (left margin changes to 0). Enables the adaptive behaviour when set.
+     * @deprecated Adaptive spacing is no longer supported on this component.
+     */
+    adaptiveSpacingBreakpoint?: number;
+    /**
+     * [Legacy] Aria label for rendered help component
+     * @deprecated Help tooltips are no longer supported on this component.
+     */
+    helpAriaLabel?: string;
+    /**
+     * When true label is inline.
+     * @deprecated The checkbox label always renders in line with the input.
+     */
+    labelInline?: boolean;
+    /** Accepts a callback function which is triggered on click event */
+    onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
+    /**
+     * [Legacy] Overrides the default tooltip position.
+     * @deprecated Tooltips are no longer supported on this component.
+     */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** The value of the checkbox, passed on form submit */
+    value?: string;
+    /** Handler for change events */
+    onChange: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Checked state of the input. */
+    checked: boolean;
+    /** Indeterminate state of the input, will override checked value. */
+    indeterminate?: boolean;
+    /** Size of the CheckboxGroup. */
+    size?: CheckboxSizes;
+    /** Flag to configure Checkbox as mandatory. */
+    required?: boolean;
+    /** Error message to be displayed when validation fails. */
+    error?: string | boolean;
+    /**
+     * Warning message to be displayed when validation warning occurs.
+     * @deprecated The `warning` state is deprecated and will be removed in a future release.
+     */
+    warning?: string | boolean;
+    /**
+     * [Legacy] Indicate additional information.
+     * @deprecated Information validation is no longer supported on this component.
+     */
+    info?: string | boolean;
+    /**
+     * Help content to be displayed under an input
+     * @deprecated The `fieldHelp` prop is no longer supported, please use the `inputHint` prop instead.
+     */
+    fieldHelp?: ReactNode;
+    /**
+     * If true, the FieldHelp will be displayed inline
+     * To be used with labelInline prop set to true
+     * @deprecated The `fieldHelpInline` prop is no longer supported on this component.
+     */
+    fieldHelpInline?: boolean;
+    /**
+     * [Legacy] The content for the help tooltip, to appear next to the Label
+     * @deprecated The `labelHelp` prop is deprecated and will be removed in a future release. Please use the `inputHint` prop instead.
+     */
+    labelHelp?: ReactNode;
+    /**
+     * [Legacy] Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8)
+     * @deprecated Custom spacing for labels is no longer supported on this component.
+     */
+    labelSpacing?: 1 | 2;
+    /**
+     * [Legacy] Label width
+     * @deprecated Custom label widths are no longer supported on this component.
+     */
+    labelWidth?: number;
+    /**
+     * If true the label switches position with the input
+     * @deprecated Reversed layout is no longer supported on this component.
+     */
+    reverse?: boolean;
+    /**
+     * Sets percentage-based input width
+     * @deprecated Custom input widths are no longer supported on this component.
+     */
+    inputWidth?: number;
+    /**
+     * Render the ValidationMessage above the Checkbox
+     * @deprecated The `validationMessagePositionTop` prop is deprecated and will be removed in a future release.
+     */
+    validationMessagePositionTop?: boolean;
+}
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export default Checkbox;

package/esm/components/checkbox/checkbox.component.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import i,{useRef as n,useContext as o,useEffect as a}from"react";import l from"../../__internal__/utils/helpers/tags/tags.js";import{StyledCheckbox as s,StyledCheckboxContentWrapper as c}from"./checkbox.style.js";import p from"../../__internal__/checkable-input/checkable-input.component.js";import d from"./__internal__/checkbox-svg.component.js";import u from"./__internal__/checkbox-group.context.js";import b from"../../__internal__/error-border/error-border.style.js";import m from"../../__internal__/validation-message/__next__/validation-message.component.js";import f from"../../__internal__/utils/helpers/guid/index.js";import"../../style/utils/filter-styled-system-padding-props.js";import g from"../../style/utils/filter-styled-system-margin-props.js";import y from"../fieldset/__internal__/fieldset.context.js";function _(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]:{},i=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),i.forEach((function(r){_(e,r,t[r])}))}return e}function j(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 O=i.forwardRef(((i,_)=>{var{"aria-describedby":O,"data-element":v,"data-role":k,id:w,label:P,inputHint:x,name:S,value:H,fieldHelp:$,autoFocus:z,labelHelp:D,labelSpacing:q,labelWidth:E,adaptiveSpacingBreakpoint:I,required:W,error:A,warning:B,info:F,fieldHelpInline:L,reverse:M,checked:R,indeterminate:T,disabled:C,inputWidth:G,size:N="medium",tooltipPosition:J,helpAriaLabel:K,progressiveDisclosure:Q,validationMessagePositionTop:U=!0}=i,V=function(e,r){if(null==e)return{};var t,i,n=function(e,r){if(null==e)return{};var t,i,n={},o=Object.keys(e);for(i=0;i<o.length;i++)t=o[i],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(i=0;i<o.length;i++)t=o[i],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(i,["aria-describedby","data-element","data-role","id","label","inputHint","name","value","fieldHelp","autoFocus","labelHelp","labelSpacing","labelWidth","adaptiveSpacingBreakpoint","required","error","warning","info","fieldHelpInline","reverse","checked","indeterminate","disabled","inputWidth","size","tooltipPosition","helpAriaLabel","progressiveDisclosure","validationMessagePositionTop"]);const X=n(f()),Y=n(null),Z=w||X.current,ee=A||B?`${Z}-validation-message`:void 0,re=[ee,O].filter(Boolean).join(" "),{error:te,warning:ie,inline:ne,size:oe,disabled:ae,required:le}=o(u),se=void 0!==oe,{size:ce,hasError:pe}=o(y),de=ce||oe||N,ue=te||pe||!!A,be=!!T;a((()=>{Y.current&&(Y.current.indeterminate=be)}),[be]);const me=()=>A||B?r(t,{children:[e(m,{error:A,warning:B,id:ee,size:ce||N}),e(b,{$warning:!(A||!B)})]}):null,fe=e(p,j(h({type:"checkbox",id:w,name:S,value:H,label:P,inputHint:x||D,disabled:ae||C,required:le||W,showRequiredAsterisk:W,checked:R,ref:e=>{Y.current=e,"function"==typeof _?_(e):_&&(_.current=e)},autoFocus:z,size:de,error:ue,warning:ie||!!B,"aria-describedby":re,"aria-checked":T?"mixed":R},!ne&&{progressiveDisclosure:Q},V),{children:e(d,{indeterminate:be})}));return e(s,j(h({$isDisabled:C||ae,$size:de,$error:ue,$checked:!!R,$indeterminate:be,$isInGroup:se},g(V),l("checkbox",{"data-element":v,"data-role":k})),{children:se?fe:r(c,{$size:ce||N,children:[U&&me(),fe,!U&&me()]})}))}));O.displayName="Checkbox";export{O as Checkbox,O as default};

package/esm/components/checkbox/checkbox.style.d.ts

@@ -0,0 +1,16 @@
+import type { CheckboxSizes } from "./checkbox-group/checkbox-group.component";
+interface StyledCheckboxProps {
+    $isDisabled?: boolean;
+    $size: CheckboxSizes;
+    $error?: boolean;
+    $checked?: boolean;
+    $indeterminate?: boolean;
+    $isInGroup?: boolean;
+}
+export declare const StyledCheckbox: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledCheckboxProps, "theme">;
+export declare const StyledCheckboxContentWrapper: import("styled-components").StyledComponent<"div", any, {
+    $size: CheckboxSizes;
+}, never>;
+export {};

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

@@ -0,0 +1 @@
+import i,{css as e}from"styled-components";import{margin as a}from"styled-system";import t from"../../__internal__/checkable-input/hidden-checkable-input.style.js";import o from"../../style/themes/apply-base-theme.js";import r from"../../style/utils/add-focus-styling.js";const l={small:{inputSize:"var(--global-size-3-xs)",checkSvgSize:"12px",indeterminateSvgSize:"10px",validationGap:"var(--global-space-comp-xs)"},medium:{inputSize:"var(--global-size-xs)",checkSvgSize:"16px",indeterminateSvgSize:"16px",validationGap:"var(--global-space-comp-s)"},large:{inputSize:"var(--global-size-s)",checkSvgSize:"22px",indeterminateSvgSize:"20px",validationGap:"var(--global-space-comp-s)"}},n=i.div.attrs(o).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"carbon_v162_12_0__sc-1a3950c1-0"})(["",""],(({$isDisabled:i,$size:o,$error:n,$checked:s,$indeterminate:d,$isInGroup:p})=>e([""," ",';[data-role="checkable-input-svg-wrapper"]{display:flex;justify-content:center;align-items:center;box-sizing:border-box;background-color:var(--input-typical-bg-default);border:var(--global-borderwidth-xs) solid var(--input-typical-border-default);border-radius:',";height:",";width:",";"," "," "," ","}","{position:absolute;box-sizing:border-box;min-height:var(--global-size-xs);height:",";width:",";}"," ",':not([disabled]){&:focus + [data-role="checkable-input-svg-wrapper"]{',"}}"],!p&&e(["margin-bottom:var(--fieldSpacing);"]),a,"large"===o?"var(--global-radius-action-m)":"var(--global-radius-action-s)",l[o].inputSize,l[o].inputSize,s&&e(["svg{width:",";}"],l[o].checkSvgSize),d&&e(["svg{width:",";}"],l[o].indeterminateSvgSize),!i&&n&&e(["border:var(--global-borderwidth-s) solid var(--input-validation-border-error);"]),i&&e(["border-color:var(--input-typical-border-disabled);background-color:var(--input-typical-bg-disabled);"]),t,l[o].inputSize,l[o].inputSize,(s||d)&&e(["svg path,svg rect{fill:var(--input-typical-icon-active);","}"],i&&e(["fill:var(--input-typical-icon-disabled);"])),t,r()))),s=i.div.withConfig({displayName:"checkbox.style__StyledCheckboxContentWrapper",componentId:"carbon_v162_12_0__sc-1a3950c1-1"})(["",";"],(({$size:i})=>e(["display:flex;flex-direction:column;position:relative;gap:",";"],l[i].validationGap)));export{n as StyledCheckbox,s as StyledCheckboxContentWrapper};

package/esm/components/checkbox/index.d.ts

@@ -0,0 +1,4 @@
+export { default as CheckboxGroup } from "./checkbox-group/checkbox-group.component";
+export type { CheckboxGroupProps } from "./checkbox-group/checkbox-group.component";
+export { default as Checkbox } from "./checkbox.component";
+export type { CheckboxProps } from "./checkbox.component";

package/esm/components/checkbox/index.js

@@ -0,0 +1 @@
+export{CheckboxGroup}from"./checkbox-group/checkbox-group.component.js";export{Checkbox}from"./checkbox.component.js";

package/esm/components/confirm/confirm.component.d.ts

@@ -0,0 +1,48 @@
+import React from "react";
+import { DialogProps } from "../dialog";
+import { IconType } from "../icon";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+/**
+ * @deprecated `Confirm` has been deprecated. See the Carbon documentation for migration details.
+ */
+export interface ConfirmProps extends Omit<DialogProps, "className" | "disableFocusTrap" | "bespokeFocusTrap" | "focusableSelectors" | "help" | "role" | "contentPadding" | "focusableContainers" | "ariaRole" | "timeout" | "enableBackgroundUI" | "disableClose" | "data-component"> {
+    /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
+    cancelButtonType?: "primary" | "secondary" | "tertiary" | "darkBackground";
+    /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
+    confirmButtonType?: "primary" | "secondary" | "tertiary" | "darkBackground";
+    /** Customise the cancel button label */
+    cancelLabel?: string;
+    /** Customise the confirm button label */
+    confirmLabel?: string;
+    /** Apply destructive style to the cancel button */
+    cancelButtonDestructive?: boolean;
+    /** Apply destructive style to the confirm button */
+    confirmButtonDestructive?: boolean;
+    /** Defines a cancel button Icon position related to the children: "before" | "after" */
+    cancelButtonIconPosition?: "before" | "after";
+    /** Defines an Icon type within the cancel button (see Icon for options) */
+    cancelButtonIconType?: IconType;
+    /** Defines a cancel button Icon position related to the children: "before" | "after" */
+    confirmButtonIconPosition?: "before" | "after";
+    /** Defines an Icon type within the confirm button (see Icon for options) */
+    confirmButtonIconType?: IconType;
+    /** Data tag prop bag for cancelButton */
+    cancelButtonDataProps?: TagProps;
+    /** Data tag prop bag for confirmButton */
+    confirmButtonDataProps?: TagProps;
+    /** Makes cancel button disabled */
+    disableCancel?: boolean;
+    /** Makes confirm button disabled */
+    disableConfirm?: boolean;
+    /** Defines an Icon type within the button (see Icon for options) */
+    iconType?: "error" | "warning";
+    /** Adds isLoading state into confirm button */
+    isLoadingConfirm?: boolean;
+    /** A custom event handler when a confirmation takes place */
+    onConfirm: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+}
+/**
+ * @deprecated See the Carbon documentation for migration details.
+ */
+export declare const Confirm: ({ "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, open, children, cancelButtonDestructive, confirmButtonDestructive, cancelButtonType, confirmButtonType, cancelButtonIconType, cancelButtonIconPosition, confirmButtonIconType, confirmButtonIconPosition, cancelButtonDataProps, confirmButtonDataProps, cancelLabel, onCancel, disableCancel, onConfirm, isLoadingConfirm, disableConfirm, confirmLabel, iconType, subtitle, title, size, showCloseIcon, topModalOverride, ...rest }: ConfirmProps) => React.JSX.Element;
+export default Confirm;

package/esm/components/confirm/confirm.component.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as o}from"react";import n from"../../__internal__/utils/helpers/guid/index.js";import{Dialog as r}from"../dialog/dialog.component.js";import{StyledConfirmButtons as i,StyledConfirmHeading as c}from"./confirm.style.js";import a from"../button/button.component.js";import l from"../icon/icon.component.js";import"../icon/icon.style.js";import{Loader as s}from"../loader/loader.component.js";import{Typography as p}from"../typography/typography.component.js";import u from"../../hooks/__internal__/useLocale/useLocale.js";import m from"../../__internal__/utils/helpers/tags/tags.js";function b(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function d(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{},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(t){b(e,t,o[t])}))}return e}function f(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 o=Object.getOwnPropertySymbols(e);t.push.apply(t,o)}return t}(Object(t)).forEach((function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(t,o))})),e}const y=b=>{var{"aria-labelledby":y,"aria-describedby":O,"aria-label":j,open:g,children:h,cancelButtonDestructive:P=!1,confirmButtonDestructive:B=!1,cancelButtonType:v="secondary",confirmButtonType:w="primary",cancelButtonIconType:C,cancelButtonIconPosition:T,confirmButtonIconType:I,confirmButtonIconPosition:D,cancelButtonDataProps:_,confirmButtonDataProps:k,cancelLabel:L,onCancel:S,disableCancel:x,onConfirm:z,isLoadingConfirm:E,disableConfirm:M,confirmLabel:A,iconType:K,subtitle:W,title:q,size:F="extra-small",showCloseIcon:G=!1,topModalOverride:H}=b,J=function(e,t){if(null==e)return{};var o,n,r=function(e,t){if(null==e)return{};var o,n,r={},i=Object.keys(e);for(n=0;n<i.length;n++)o=i[n],t.indexOf(o)>=0||(r[o]=e[o]);return r}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)o=i[n],t.indexOf(o)>=0||Object.prototype.propertyIsEnumerable.call(e,o)&&(r[o]=e[o])}return r}(b,["aria-labelledby","aria-describedby","aria-label","open","children","cancelButtonDestructive","confirmButtonDestructive","cancelButtonType","confirmButtonType","cancelButtonIconType","cancelButtonIconPosition","confirmButtonIconType","confirmButtonIconPosition","cancelButtonDataProps","confirmButtonDataProps","cancelLabel","onCancel","disableCancel","onConfirm","isLoadingConfirm","disableConfirm","confirmLabel","iconType","subtitle","title","size","showCloseIcon","topModalOverride"]);const N=u(),{current:Q}=o(n()),{current:R}=o(n()),U={"aria-labelledby":y,"aria-describedby":O,"aria-label":j};return q&&K&&(U["aria-labelledby"]=Q),W&&K&&(U["aria-describedby"]=R),e(r,f(d({open:g,onCancel:S,disableEscKey:x,subtitle:W,title:K?e(c,{type:K,"data-element":K,children:[t(l,{type:K,fontSize:"medium"}),t(p,{wordWrap:"break-word",wordBreak:"normal",variant:"h1","data-element":"dialog-title",id:Q,children:q})]}):q,role:"alertdialog",size:F,showCloseIcon:G,topModalOverride:H},U,J),{"data-component":"confirm",children:[h,e(i,{children:[S?t(a,f(d({onClick:S,buttonType:v,destructive:P,disabled:x,iconType:C,iconPosition:T},m("cancel",d({"data-element":"cancel"},_))),{children:L||N.confirm.no()})):null,t(a,f(d({onClick:z,buttonType:w,destructive:B,disabled:E||M,ml:2,iconType:I,iconPosition:D},m("confirm",d({"data-element":"confirm"},k))),{children:E?t(s,{"data-role":"confirm-loader",isInsideButton:!0,isActive:!0}):A||N.confirm.yes()}))]})]}))};export{y as Confirm,y as default};

package/esm/components/confirm/confirm.config.d.ts

@@ -0,0 +1 @@
+export declare const CONFIRM_SIZES: string[];

package/esm/components/confirm/confirm.config.js

@@ -0,0 +1 @@
+const e=["extra-small","small","medium-small","medium","medium-large","large","extra-large"];export{e as CONFIRM_SIZES};

package/esm/components/confirm/confirm.style.d.ts

@@ -0,0 +1,5 @@
+import { ConfirmProps } from ".";
+export declare const StyledConfirmButtons: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledConfirmHeading: import("styled-components").StyledComponent<"div", any, {
+    type: ConfirmProps["iconType"];
+}, never>;

package/esm/components/confirm/confirm.style.js

@@ -0,0 +1 @@
+import o,{css as i}from"styled-components";import n from"../icon/icon.style.js";import{StyledHeadingTitle as t}from"../heading/heading.style.js";const e=o.div.withConfig({displayName:"confirm.style__StyledConfirmButtons",componentId:"carbon_v162_12_0__sc-1b5d4dde-0"})(["margin-top:48px;display:flex;justify-content:flex-end;"]),r=o.div.withConfig({displayName:"confirm.style__StyledConfirmHeading",componentId:"carbon_v162_12_0__sc-1b5d4dde-1"})(["display:flex;align-items:center;","{padding:0px;}","{margin-right:16px;margin-bottom:20px;"," ","}"],t,n,(({type:o})=>"warning"===o&&i(["color:var(--colorsSemanticCaution500);"])),(({type:o})=>"error"===o&&i(["color:var(--colorsSemanticNegative500);"])));export{e as StyledConfirmButtons,r as StyledConfirmHeading};

package/esm/components/confirm/index.d.ts

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

package/esm/components/confirm/index.js

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

package/esm/components/content/content.component.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { StyledContentProps, StyledContentTitleProps, StyledContentBodyProps } from "./content.style";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+/**
+ * @deprecated `Content` has been deprecated. See the Carbon documentation for migration details.
+ */
+export interface ContentProps extends StyledContentProps, StyledContentTitleProps, StyledContentBodyProps, TagProps {
+    /** The body of the content component */
+    children?: React.ReactNode;
+    /** The title of the content component */
+    title?: React.ReactNode;
+}
+/**
+ * @deprecated `Content` has been deprecated. See the Carbon documentation for migration details.
+ */
+export declare const Content: {
+    ({ variant, children, title, inline, align, titleWidth, bodyFullWidth, ...rest }: ContentProps): React.JSX.Element;
+    displayName: string;
+};
+export default Content;

package/esm/components/content/content.component.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import"react";import{StyledContent as r,StyledContentTitle as n,StyledContentBody as i}from"./content.style.js";import l from"../../__internal__/utils/helpers/tags/tags.js";function o(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}const c=c=>{var a,b,{variant:u="primary",children:y,title:p,inline:f=!1,align:d="left",titleWidth:O,bodyFullWidth:s=!1}=c,g=function(t,e){if(null==t)return{};var r,n,i=function(t,e){if(null==t)return{};var r,n,i={},l=Object.keys(t);for(n=0;n<l.length;n++)r=l[n],e.indexOf(r)>=0||(i[r]=t[r]);return i}(t,e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(t);for(n=0;n<l.length;n++)r=l[n],e.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(t,r)&&(i[r]=t[r])}return i}(c,["variant","children","title","inline","align","titleWidth","bodyFullWidth"]);return t(r,(a=function(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(t){return Object.getOwnPropertyDescriptor(r,t).enumerable})))),n.forEach((function(e){o(t,e,r[e])}))}return t}({align:d,bodyFullWidth:s},g,l("content",g)),b=null!=(b={children:[e(n,{variant:u,inline:f,"data-element":"content-title","data-role":"content-title",titleWidth:O,align:d,children:p}),e(i,{variant:u,inline:f,"data-element":"content-body","data-role":"content-body",bodyFullWidth:s,titleWidth:O,align:d,children:y})]})?b:{},Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):function(t){var e=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e.push.apply(e,r)}return e}(Object(b)).forEach((function(t){Object.defineProperty(a,t,Object.getOwnPropertyDescriptor(b,t))})),a))};c.displayName="Content";export{c as Content,c as default};

package/esm/components/content/content.style.d.ts

@@ -0,0 +1,43 @@
+import { MarginProps } from "styled-system";
+export type AlignOptions = "left" | "center" | "right";
+export type VariantOptions = "primary" | "secondary";
+export interface StyledContentProps extends MarginProps {
+    /** Aligns the content (left, center or right) */
+    align?: AlignOptions;
+    /**
+     * Over-rides the calculation of body width based on titleWidth.
+     * Sometimes we need the body to be full width while keeping a title width similar to other widths
+     */
+    bodyFullWidth?: boolean;
+}
+declare const StyledContent: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledContentProps, "theme">;
+export interface StyledContentTitleProps {
+    /** Aligns the content (left, center or right) */
+    align?: AlignOptions;
+    /** Displays the content inline with the title */
+    inline?: boolean;
+    /** Sets a custom width for the title element */
+    titleWidth?: string;
+    /** Applies a theme to the Content Value: primary, secondary */
+    variant?: VariantOptions;
+}
+declare const StyledContentTitle: import("styled-components").StyledComponent<"div", any, StyledContentTitleProps, never>;
+export interface StyledContentBodyProps {
+    /** Aligns the content (left, center or right) */
+    align?: AlignOptions;
+    /**
+     * Over-rides the calculation of body width based on titleWidth.
+     * Sometimes we need the body to be full width while keeping a title width similar to other widths
+     */
+    bodyFullWidth?: boolean;
+    /** Displays the content inline with the title */
+    inline?: boolean;
+    /** Sets a custom width for the title element */
+    titleWidth?: string;
+    /** Applies a theme to the Content Value: primary, secondary */
+    variant?: VariantOptions;
+}
+declare const StyledContentBody: import("styled-components").StyledComponent<"div", any, StyledContentBodyProps, never>;
+export { StyledContent, StyledContentTitle, StyledContentBody };

package/esm/components/content/content.style.js

@@ -0,0 +1 @@
+import t,{css as i}from"styled-components";import{margin as n}from"styled-system";import e from"../../style/themes/apply-base-theme.js";const o=t.div.attrs(e).withConfig({displayName:"content.style__StyledContent",componentId:"carbon_v162_12_0__sc-273b17cd-0"})(["",""],(({bodyFullWidth:t,align:e})=>i([""," & + &{margin-top:15px;}"," ",""],n,e&&i(["text-align:",";"],e),t&&i(["text-align:left;"])))),l=t.div.withConfig({displayName:"content.style__StyledContentTitle",componentId:"carbon_v162_12_0__sc-273b17cd-1"})(["",";"],(({titleWidth:t,inline:n,variant:e,align:o})=>i(["display:",";font-weight:500;width:",";text-align:",";"," ",""],n?"inline-block":"block",t&&`calc(${t}% - 30px)`,!n&&o,"center"===o&&n&&i(["text-align:right;width:calc(50% - 30px);"]),"secondary"===e&&i(["color:var(--colorsUtilityYin055);font-weight:normal;"])))),a=t.div.withConfig({displayName:"content.style__StyledContentBody",componentId:"carbon_v162_12_0__sc-273b17cd-2"})(["",";"],(({bodyFullWidth:t,titleWidth:n,inline:e,align:o})=>i(["display:",";margin-top:2px;white-space:pre-wrap;word-wrap:break-word;font-weight:normal;"," "," "," "," ",""],e?"inline-block":"block","center"===o&&e&&i(["width:50%;"]),n&&i(["width:","%;"],100-Number(n)),t&&i(["width:100%;"]),e&&t&&i(["margin-top:15px;"]),e&&!t&&i(["margin-top:0;margin-left:var(--spacing300);text-align:left;"]))));export{o as StyledContent,a as StyledContentBody,l as StyledContentTitle};

package/esm/components/content/index.d.ts

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

package/esm/components/content/index.js

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

package/esm/components/date/__internal__/date-fns-fp/index.d.ts

@@ -0,0 +1,7 @@
+export { format } from "date-fns/fp/format";
+export { formatISO } from "date-fns/fp/formatISO";
+export { isMatch } from "date-fns/fp/isMatch";
+export { isValid } from "date-fns/fp/isValid";
+export { parse } from "date-fns/fp/parse";
+export { parseWithOptions } from "date-fns/fp/parseWithOptions";
+export { parseISO } from "date-fns/fp/parseISO";

package/esm/components/date/__internal__/date-fns-fp/index.js

@@ -0,0 +1 @@
+export{format}from"date-fns/fp/format";export{formatISO}from"date-fns/fp/formatISO";export{isMatch}from"date-fns/fp/isMatch";export{isValid}from"date-fns/fp/isValid";export{parse}from"date-fns/fp/parse";export{parseWithOptions}from"date-fns/fp/parseWithOptions";export{parseISO}from"date-fns/fp/parseISO";

package/esm/components/date/__internal__/date-formats/index.d.ts

@@ -0,0 +1,7 @@
+import { Locale as DateFnsLocale } from "date-fns";
+interface LocaleFormats {
+    formats: string[];
+    format: string;
+}
+declare const getFormatData: (locale?: Partial<Pick<DateFnsLocale, "code">>, dateFormatOverride?: string) => LocaleFormats;
+export default getFormatData;

package/esm/components/date/__internal__/date-formats/index.js

@@ -0,0 +1 @@
+const y=["d M yyyy","dd M yyyy","d MM yyyy","dd MM yyyy","d M yy","dd M yy","d MM yy","dd MM yy","d","d M","dd","d MM","dd M","dd MM"],d=["M","M d","MM","M dd","MM d","MM dd","M d yy","MM d yy","M dd yy","MM dd yy","M d yyyy","MM d yyyy","M dd yyyy","MM dd yyyy"],M=["yyyy M","yyyy M d","yyyy MM d","yyyy M dd","yyyy MM dd","yy M","yy MM","yy M d","yy MM d","yy M dd","yy MM dd","M","M d","MM","M dd","MM d","MM dd"],t=["",".",",","-","/",":"],r=(y,d,M)=>{const r=t.includes(d)?t:[...t,d];return y.reduce(((y,t)=>{const a=[...y,t];return t.includes(" ")&&r.forEach((y=>{d===y&&M&&a.push(`${t.replace(/ /g,y)}${M}`),a.push(t.replace(/ /g,y))})),a}),[])},a=t=>t.startsWith("y")?M:t.startsWith("M")?d:y,o=y=>{const d=y.split("").pop();return["y","M","d"].includes(d)?"":d},e=(y,d)=>{const M=(null==y?void 0:y.code)||"en-GB",{format:t,separator:e}=(y=>{const d={day:"dd",month:"MM",year:"yyyy"},M=new Intl.DateTimeFormat(y);let t="";const r=M.formatToParts(new Date).map((({type:y,value:M})=>["day","month","year"].includes(y)?d[y]:(t||(t=M),M))).join("");return y.startsWith("bg")?{format:r.substring(0,10),separator:t}:{format:r,separator:t}})(M),n={"en-CA":{format:"MM/dd/yyyy",separator:"/"},"en-US":{format:"MM/dd/yyyy",separator:"/"},"fr-CA":{format:"dd/MM/yyyy"},"en-ZA":{format:"dd/MM/yyyy"},"ar-EG":{format:"dd/MM/yyyy"}}[M]||{};var s;const l=null!==(s=null!=d?d:n.format)&&void 0!==s?s:t;var u;const c=null!==(u=n.separator)&&void 0!==u?u:e;return{format:l,formats:r(a(l),c,o(l))}};export{e as default};

package/esm/components/date/__internal__/date-picker/date-picker.component.d.ts

@@ -0,0 +1,46 @@
+import React, { RefObject } from "react";
+import { DayPickerProps, Modifiers } from "react-day-picker";
+export interface PickerProps extends Omit<DayPickerProps, "mode" | "modifiers"> {
+    modifiers?: Partial<Modifiers>;
+}
+export interface DatePickerProps {
+    /**
+     * [Legacy] Boolean to toggle where DatePicker is rendered in relation to the Date Input
+     * @deprecated
+     */
+    disablePortal?: boolean;
+    /** Minimum possible date YYYY-MM-DD */
+    minDate?: string;
+    /** Maximum possible date YYYY-MM-DD */
+    maxDate?: string;
+    /**
+     * Pass any props that match the DayPickerProps interface to override default behaviors
+     * See [DayPickerProps](https://daypicker.dev/api/type-aliases/DayPickerProps) for a full list of available props
+     * */
+    pickerProps?: PickerProps;
+    /** Element that the DatePicker will be displayed under */
+    inputElement: RefObject<HTMLElement>;
+    /** Currently selected date */
+    selectedDays?: Date | undefined;
+    /** Callback to handle mousedown event on picker container */
+    pickerMouseDown?: () => void;
+    /** Sets whether the picker should be displayed */
+    open?: boolean;
+    /** Callback triggered when a Day is clicked */
+    onDayClick?: (date: Date, ev: React.MouseEvent<HTMLDivElement>) => void;
+    /** Sets the picker open state */
+    setOpen: (isOpen: boolean) => void;
+    /** Id passed to tab guard element */
+    pickerTabGuardId?: string;
+    /** Callback triggered when the picker is closed */
+    onPickerClose?: () => void;
+    /** Prop to specify the aria-label attribute of the date picker */
+    ariaLabel?: string;
+    /** Prop to specify the aria-labelledby attribute of the date picker */
+    ariaLabelledBy?: string;
+}
+export declare const DatePicker: {
+    ({ inputElement, minDate, maxDate, selectedDays, disablePortal, onDayClick, pickerMouseDown, pickerProps, open, setOpen, pickerTabGuardId, onPickerClose, ariaLabel: datePickerAriaLabel, ariaLabelledBy: datePickerAriaLabelledBy, }: DatePickerProps): React.JSX.Element | null;
+    displayName: string;
+};
+export default DatePicker;

package/esm/components/date/__internal__/date-picker/date-picker.component.js

@@ -0,0 +1 @@
+import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{offset as o,flip as n}from"@floating-ui/dom";import{useState as l,useMemo as a,useRef as i,useCallback as c,useContext as s,useEffect as u}from"react";import{DayPicker as d,defaultLocale as p}from"react-day-picker";import m from"../../../../hooks/__internal__/useLocale/useLocale.js";import y from"../../../../__internal__/popover/popover.component.js";import{Navbar as f}from"../navbar/navbar.component.js";import{Weekday as b}from"../weekday/weekday.component.js";import{getDisabledDays as v}from"../utils.js";import{defaultFocusableSelectors as g}from"../../../../__internal__/focus-trap/focus-trap-utils.js";import O from"../../../../__internal__/utils/helpers/events/events.js";import h from"../../../flat-table/__internal__/flat-table.context.js";import j from"../../../../__internal__/utils/logger/index.js";import w from"./day-picker.style.js";function _(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function k(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){_(e,t,r[t])}))}return e}const D=[o(3),n({fallbackStrategy:"initialPlacement"})],P=f;let S=!1;const x=({inputElement:o,minDate:n,maxDate:f,selectedDays:_,disablePortal:x=!0,onDayClick:q,pickerMouseDown:K,pickerProps:M,open:T,setOpen:A,pickerTabGuardId:I,onPickerClose:C,ariaLabel:E,ariaLabelledBy:F})=>{!S&&x&&(S=!0,j.deprecate("`disablePortal` is deprecated in DateInput and DateRange, and support will soon be removed."));const[L,N]=l(_||new Date),z=m(),{localize:W,options:B}=z.date.dateFnsLocale(),{weekStartsOn:U}=B||{},$=a((()=>Array.from({length:7}).map(((e,t)=>null==W?void 0:W.day(t)))),[W]),G=a((()=>{const e=e=>z.locale().includes(e);return Array.from({length:7}).map(((t,r)=>null==W?void 0:W.day(r,["de","pl"].some(e)?{width:"wide"}:{width:"abbreviated"}).substring(0,e("de")?2:3)))}),[z,W]),H=i(null),R=c((e=>{var t,r;T&&O.isEscKey(e)&&(N(_),null===(r=o.current)||void 0===r||null===(t=r.querySelector("input"))||void 0===t||t.focus(),A(!1),null==C||C(),e.stopPropagation())}),[o,C,T,_,A]),{isInFlatTable:Y,setHasOpenDatePicker:J}=s(h);return u((()=>{null==J||J(!!T)}),[T,J]),u((()=>{_&&N(_)}),[_]),u((()=>{!T&&_&&(null==L?void 0:L.getMonth())!==(null==_?void 0:_.getMonth())&&N(_)}),[L,T,_]),T?e(t,{children:e(y,{placement:"bottom-start",reference:o,middleware:D,disablePortal:x,disableBackgroundUI:Y,popoverStrategy:"fixed",children:r(w,{id:"styled-day-picker","data-role":"date-picker",ref:H,onMouseDown:K,onKeyUp:R,onKeyDown:e=>{var t,r,n;(null===(t=H.current)||void 0===t?void 0:t.querySelector(".rdp-nav button"))===document.activeElement&&O.isTabKey(e)&&O.isShiftKey(e)&&(e.preventDefault(),A(!1),null==C||C(),null===(n=o.current)||void 0===n||null===(r=n.querySelector("input"))||void 0===r||r.focus())},role:"region","aria-label":E,"aria-labelledby":F,children:[e("div",{id:I,tabIndex:0,onFocus:()=>{var e,t;null===(t=H.current)||void 0===t||null===(e=t.querySelector("button"))||void 0===e||e.focus()}}),e(d,(Q=k({formatters:{formatCaption:e=>`${null==W?void 0:W.month(e.getMonth())} ${e.getFullYear()}`},required:!1,weekStartsOn:U,onMonthChange:N,disabled:v(n,f),locale:{localize:k({},p.localize)},selected:_,month:L||new Date,onDayClick:(e,t,r)=>{((e,t)=>{e&&(null==q||q(e,t)),null==C||C()})(e,r)},components:{Nav:P,Weekday:t=>{const{className:r,"aria-label":o}=t,n={Sunday:0,Monday:1,Tuesday:2,Wednesday:3,Thursday:4,Friday:5,Saturday:6}[o];return e(b,{className:r,title:$[n],children:G[n]})}},fixedWeeks:!0,defaultMonth:_||void 0,onDayKeyDown:(e,t,r)=>{var n;n=r,setTimeout((()=>{if(O.isTabKey(n)&&!O.isShiftKey(n)){var e;n.preventDefault(),A(!1),null==C||C();const l=null===(e=o.current)||void 0===e?void 0:e.querySelector("input");if(l){var t,r;const e=Array.from(document.querySelectorAll(g)||[]),o=Array.from((null===(t=H.current)||void 0===t?void 0:t.querySelectorAll("button, [tabindex]"))||[]),n=e.filter((e=>-1!==Number(e.tabIndex)&&!o.includes(e))),a=n.indexOf(l)+1;null===(r=n[a])||void 0===r||r.focus()}}}),0)}},M),V={showOutsideDays:!0,mode:"single"},V=null!=V?V:{},Object.getOwnPropertyDescriptors?Object.defineProperties(Q,Object.getOwnPropertyDescriptors(V)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(V)).forEach((function(e){Object.defineProperty(Q,e,Object.getOwnPropertyDescriptor(V,e))})),Q))]})})}):null;var Q,V};x.displayName="DatePicker";export{x as DatePicker,x as default};

package/esm/components/date/__internal__/date-picker/day-picker.style.d.ts

@@ -0,0 +1,4 @@
+declare const StyledDayPicker: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+}, "theme">;
+export default StyledDayPicker;

package/esm/components/date/__internal__/date-picker/day-picker.style.js

@@ -0,0 +1 @@
+import r,{css as o}from"styled-components";import d from"../../../../style/themes/apply-base-theme.js";import e from"../../../../style/utils/add-focus-styling.js";const t=r.div.attrs(d).withConfig({displayName:"day-picker.style__StyledDayPicker",componentId:"carbon_v162_12_0__sc-4198aa12-0"})([""," z-index:2000;.rdp-root{top:calc(100% + 1px);left:0;background-color:var(--colorsUtilityYang100);box-shadow:var(--boxShadow100);display:block;overflow:hidden;padding:var(--spacing300);text-align:center;user-select:none;border-radius:var(--borderRadius050);}.rdp-root *{box-sizing:border-box;}.rdp-root:focus{outline:none;}.rdp-root abbr[title]{border:none;cursor:initial;}.rdp-months{padding:0;}.rdp-month{margin:0 0 2px;}.rdp-month_grid,.rdp_weeks{width:100%;margin-top:8px;}.rdp-month_caption{color:var(--colorsActionMajorYin090);line-height:var(--sizing500);height:var(--sizing500);font-size:16px;font-weight:800;display:block;> div{margin:0 auto;width:80%;}}.rdp-weekday{border:medium;width:var(--sizing500);height:var(--sizing450);font-weight:800;color:var(--colorsActionMinor500);text-transform:uppercase;font-size:12px;text-align:center;}.rdp-day{min-width:var(--sizing500);height:var(--sizing450);padding:0;background-color:transparent;cursor:pointer;border:none;font-weight:var(--fontWeights500);font-size:var(--fontSizes100);line-height:var(--lineHeights500);border-radius:var(--borderRadius400);&:hover{background-color:var(--colorsActionMinor050);color:var(--colorsActionMajorYin090);}+ *{border-left:1px;}abbr{text-decoration:none;}}.rdp-today,.rdp-today.rdp-outside{color:var(--colorsActionMajorYin090);background-color:var(--colorsActionMinor200);}.rdp-outside{color:var(--colorsActionMajorYin055);background-color:transparent;}.rdp-today:not(.rdp-outside){font-weight:var(--fontWeights500);border-radius:var(--borderRadius400);color:inherit;}.rdp-disabled,.rdp-disabled:hover{color:var(--colorsActionMajorYin030);background-color:var(--colorsUtilityYang100);cursor:default;&.rdp-today{background-color:var(--colorsActionMinor200);}}.rdp-selected:not(.rdp-disabled):not(.rdp-outside){background-color:var(--colorsActionMajor500);color:var(--colorsUtilityYang100);border-radius:var(--borderRadius400);}.rdp-selected.rdp-disabled:not(.rdp-outside){background-color:var(--colorsActionMajor500);color:var(--colorsUtilityYang100);}.rdp-selected{&:focus-visible{outline:none;}}.rdp-selected .rdp-day_button{border:none;&:focus-visible{outline:none;}}.rdp-focused:not(.rdp-disabled):not(.rdp-outside){"," border-radius:var(--borderRadius400);}.rdp-day.rdp-selected{&:focus{","}}"],(()=>o(['.rdp-root{--rdp-accent-color:blue;--rdp-accent-background-color:#f0f0ff;--rdp-day-height:2.75rem;--rdp-day-width:2.75rem;--rdp-day_button-border-radius:100%;--rdp-day_button-border:2px solid transparent;--rdp-day_button-height:var(--rdp-day-height);--rdp-day_button-width:var(--rdp-day-width);--rdp-selected-border:2px solid var(--rdp-accent-color);--rdp-disabled-opacity:0.5;--rdp-outside-opacity:0.75;--rdp-today-color:var(--rdp-accent-color);--rdp-dropdown-gap:0.5rem;--rdp-months-gap:2rem;--rdp-nav_button-disabled-opacity:0.5;--rdp-nav_button-height:2.25rem;--rdp-nav_button-width:2.25rem;--rdp-nav-height:2.75rem;--rdp-range_middle-background-color:var(--rdp-accent-background-color);--rdp-range_middle-foreground-color:white;--rdp-range_middle-color:inherit;--rdp-range_start-color:white;--rdp-range_start-background:linear-gradient(var(--rdp-gradient-direction),transparent 50%,var(--rdp-range_middle-background-color) 50%);--rdp-range_start-date-background-color:var(--rdp-accent-color);--rdp-range_end-background:linear-gradient(var(--rdp-gradient-direction),var(--rdp-range_middle-background-color) 50%,transparent 50%);--rdp-range_end-color:white;--rdp-range_end-date-background-color:var(--rdp-accent-color);--rdp-week_number-border-radius:100%;--rdp-week_number-border:2px solid transparent;--rdp-week_number-height:var(--rdp-day-height);--rdp-week_number-opacity:0.75;--rdp-week_number-width:var(--rdp-day-width);--rdp-weeknumber-text-align:center;--rdp-weekday-opacity:0.75;--rdp-weekday-padding:0.5rem 0rem;--rdp-weekday-text-align:center;--rdp-gradient-direction:90deg;}.rdp-root[dir="rtl"]{--rdp-gradient-direction:-90deg;}.rdp-root{position:relative;box-sizing:border-box;}.rdp-root *{box-sizing:border-box;}.rdp-day{width:var(--sizing500);height:var(--sizing450);text-align:center;}.rdp-day_button{background:none;padding:0;margin:0;cursor:pointer;font:inherit;color:inherit;justify-content:center;align-items:center;display:flex;min-width:var(--sizing500);height:var(--sizing450);border:var(--rdp-day_button-border);border-radius:var(--rdp-day_button-border-radius);}.rdp-day_button:disabled{cursor:revert;}.rdp-day_button{outline:none;}.rdp-caption_label{z-index:1;position:relative;display:inline-flex;align-items:center;white-space:nowrap;border:0;}.rdp-button_next,.rdp-button_previous{border:none;background:none;padding:0;margin:0;cursor:pointer;font:inherit;color:inherit;-moz-appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;position:relative;appearance:none;width:var(--rdp-nav_button-width);height:var(--rdp-nav_button-height);}.rdp-button_next:disabled,.rdp-button_previous:disabled{cursor:revert;opacity:var(--rdp-nav_button-disabled-opacity);}.rdp-chevron{display:inline-block;fill:var(--rdp-accent-color);}.rdp-root[dir="rtl"] .rdp-nav .rdp-chevron{transform:rotate(180deg);}.rdp-root[dir="rtl"] .rdp-nav .rdp-chevron{transform:rotate(180deg);transform-origin:50%;}.rdp-dropdowns{position:relative;display:inline-flex;align-items:center;gap:var(--rdp-dropdown-gap);}.rdp-dropdown{z-index:2;opacity:0;appearance:none;position:absolute;inset-block-start:0;inset-block-end:0;inset-inline-start:0;width:100%;margin:0;padding:0;cursor:inherit;border:none;line-height:inherit;}.rdp-dropdown_root{position:relative;display:inline-flex;align-items:center;}.rdp-dropdown_root[data-disabled="true"] .rdp-chevron{opacity:var(--rdp-disabled-opacity);}.rdp-month_caption{display:flex;align-content:center;height:var(--rdp-nav-height);font-weight:bold;font-size:large;}.rdp-months{position:relative;display:flex;flex-wrap:wrap;gap:var(--rdp-months-gap);max-width:fit-content;}.rdp-month_grid{border-collapse:collapse;}.rdp-nav{position:absolute;inset-block-start:0;inset-inline-end:0;display:flex;align-items:center;height:var(--rdp-nav-height);width:100%;}.rdp-weekday{opacity:var(--rdp-weekday-opacity);padding:var(--rdp-weekday-padding);font-weight:500;font-size:smaller;text-align:var(--rdp-weekday-text-align);text-transform:var(--rdp-weekday-text-transform);}.rdp-week_number{opacity:var(--rdp-week_number-opacity);font-weight:400;font-size:small;height:var(--rdp-week_number-height);width:var(--rdp-week_number-width);border:var(--rdp-week_number-border);border-radius:var(--rdp-week_number-border-radius);text-align:var(--rdp-weeknumber-text-align);}.rdp-today:not(.rdp-outside){color:var(--rdp-today-color);}.rdp-selected{font-weight:bold;font-size:large;}.rdp-selected .rdp-day_button{border:var(--rdp-selected-border);}.rdp-outside{opacity:var(--rdp-outside-opacity);}.rdp-disabled{opacity:var(--rdp-disabled-opacity);}.rdp-hidden{visibility:hidden;color:var(--rdp-range_start-color);}.rdp-range_start{background:var(--rdp-range_start-background);}.rdp-range_start .rdp-day_button{background-color:var(--rdp-range_start-date-background-color);color:var(--rdp-range_start-color);}.rdp-range_middle{background-color:var(--rdp-range_middle-background-color);}.rdp-range_middle .rdp-day_button{border-color:transparent;border:unset;border-radius:unset;color:var(--rdp-range_middle-color);}.rdp-range_end{background:var(--rdp-range_end-background);color:var(--rdp-range_end-color);}.rdp-range_end .rdp-day_button{color:var(--rdp-range_start-color);background-color:var(--rdp-range_end-date-background-color);}.rdp-range_start.rdp-range_end{background:revert;}.rdp-focusable{cursor:pointer;}'])),e(!0),e(!0));export{t as default};

package/esm/components/date/__internal__/date-picker/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./date-picker.component";
+export type { DatePickerProps, PickerProps } from "./date-picker.component";

package/esm/components/date/__internal__/date-picker/index.js

@@ -0,0 +1 @@
+export{DatePicker as default}from"./date-picker.component.js";

package/esm/components/date/__internal__/navbar/button.style.d.ts

@@ -0,0 +1,6 @@
+declare const StyledButton: import("styled-components").StyledComponent<"button", any, {
+    theme: object;
+} & {
+    type: "button";
+}, "theme" | "type">;
+export default StyledButton;