carbon-react 162.12.0-beta.1 → 162.13.0

package/esm/components/date/__internal__/navbar/button.style.js

@@ -0,0 +1 @@
+import t from"styled-components";import o from"../../../../style/utils/add-focus-styling.js";import r from"../../../../style/themes/apply-base-theme.js";const e=t.button.attrs(r).attrs({type:"button"}).withConfig({displayName:"button.style__StyledButton",componentId:"carbon_v162_12_0__sc-ce836932-0"})(["justify-content:center;align-items:center;display:flex;border:var(--borderWidth200) solid var(--colorsActionMinorTransparent);background:none;box-shadow:none;cursor:pointer;height:var(--sizing500);width:var(--sizing500);padding:var(--spacing150);box-sizing:border-box;border-radius:var(--borderRadius050);&:focus{","}"],o());export{e as default};

package/esm/components/date/__internal__/navbar/index.d.ts

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

package/esm/components/date/__internal__/navbar/index.js

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

package/esm/components/date/__internal__/navbar/navbar.component.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { NavProps } from "react-day-picker";
+export interface NavbarProps {
+    onPreviousClick?: () => void;
+    onNextClick?: () => void;
+    className?: string;
+}
+export declare const Navbar: ({ onPreviousClick, onNextClick, className, }: NavProps) => React.JSX.Element;
+export default Navbar;

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

@@ -0,0 +1 @@
+import{jsxs as e,jsx as o}from"react/jsx-runtime";import"react";import t from"./button.style.js";import n from"./navbar.style.js";import r from"../../../icon/icon.component.js";import"../../../icon/icon.style.js";import i from"../../../../__internal__/utils/helpers/events/events.js";import a from"../../../../hooks/__internal__/useLocale/useLocale.js";const s=({onPreviousClick:s,onNextClick:l,className:c})=>{const m=a(),{previousMonthButton:p,nextMonthButton:u}=m.date.ariaLabels,h=e=>{(i.isLeftKey(e)||i.isRightKey(e)||i.isUpKey(e)||i.isDownKey(e))&&(e.stopPropagation(),e.preventDefault())};return e(n,{className:c,"data-role":"date-navbar",children:[o(t,{"aria-label":p(),onClick:e=>{null==s||s(e)},onKeyDown:h,children:o(r,{type:"chevron_left"})}),o(t,{"aria-label":u(),onClick:e=>null==l?void 0:l(e),onKeyDown:h,children:o(r,{type:"chevron_right"})})]})};export{s as Navbar,s as default};

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

@@ -0,0 +1,2 @@
+declare const StyledNavbar: import("styled-components").StyledComponent<"div", any, {}, never>;
+export default StyledNavbar;

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

@@ -0,0 +1 @@
+import t from"styled-components";const e=t.div.withConfig({displayName:"navbar.style__StyledNavbar",componentId:"carbon_v162_12_0__sc-d6686bc9-0"})(["&.rdp-nav{display:flex;justify-content:space-between;padding:0;top:0;height:var(--sizing500);}"]);export{e as default};

package/esm/components/date/__internal__/utils.d.ts

@@ -0,0 +1,15 @@
+import type { Locale, Matcher } from "react-day-picker";
+export declare function isValidLocaleDate(date: string, locale: Locale): boolean;
+export declare function parseDate(formatString?: string, valueString?: string): Date | undefined;
+export declare function isDateValid(date?: Date): boolean | undefined;
+export declare function formatToISO(formatString?: string, valueString?: string): string | null;
+export declare function formattedValue(formatString: string, value?: Date): string;
+export declare function additionalYears(formatString: string, value: string): string[];
+export declare const getSeparator: (value: string) => string;
+export declare function findMatchedFormatAndValue(valueString: string, formats: string[]): string[];
+export declare function parseISODate(value: string): Date;
+export declare function checkISOFormatAndLength(value: string): boolean;
+/**
+ * Returns the disabled array of days specified by props maxDate and minDate
+ */
+export declare function getDisabledDays(minDate?: string, maxDate?: string): NonNullable<Matcher> | NonNullable<Matcher[]> | undefined;

package/esm/components/date/__internal__/utils.js

@@ -0,0 +1 @@
+import{format as t}from"date-fns/fp/format";import{formatISO as n}from"date-fns/fp/formatISO";import{isMatch as r}from"date-fns/fp/isMatch";import{isValid as e}from"date-fns/fp/isValid";import{parse as i}from"date-fns/fp/parse";import{parseWithOptions as o}from"date-fns/fp/parseWithOptions";import{parseISO as f}from"date-fns/fp/parseISO";function u(t,n){const r=o({locale:n})(new Date,"P",t);return e(r)}function s(t,n){if(n&&t)return i(new Date,t,n)}function l(t){return t&&"Invalid Date"!==t.toString()}function c(t,r){const e=s(t,r);return e&&l(e)?n(e).split("T")[0]:null}function p(n,r){return r?t(n,r):""}function g(t,n){if(t.split("y").length-1!=2)return[t,n];const r=t.startsWith("yy"),e=r?0:n.length-2,i=r?2:n.length,o=r?i:0,f=r?n.length:n.length-2;let u=n.substring(e,i);const s=n.substring(o,f),l=Number(u);return u=String(l<69?2e3+l:1900+l),r?[`yyyy${t.substring(2,t.length)}`,`${u}${s}`]:[`${t.substring(0,t.length-2)}yyyy`,`${s}${u}`]}function a(t,n){return t.map(((r,e)=>n.substring(t[e],t[e+1])))}function h(t,n){return t.every(((e,i)=>function(t,n,e,i){return t.includes("d")?t.length===n.length&&r(e.join("."),i.join(".")):t.length===n.length&&r(t,n)}(e,n[i],t,n)))}const m=t=>["",".",",","-","/"," ",":"].slice(1).find((n=>t.includes(n)))||"";function d(t,n){if(!t)return["",""];const r=m(t),e=n.filter((n=>n.length===t.length&&m(n)===r)).reduce(((n,e)=>{const i=m(e);if(""===r&&""===i){const n=function(t,n){const r=n.split("").reduce(((t,r,e)=>0===e||r!==n[e-1]?[...t,e]:t),[]),e=a(r,n),i=a(r,t);return h(e,i)?[e.join(" "),i.join(" ")]:null}(t,e);if(n)return n}if(r&&i&&r===i){const n=function(t,n,r){return h(n.split(r),t.split(r))?[n,t]:null}(t,e,r);if(n)return n}return n}),[]);return e}function y(t){return f(t)}function b(t){if(10!==t.length||"Invalid Date"===y(t).toString())return!1;const n=t.split("-");return 3===n.length&&4===n[0].length&&2===n[1].length&&2===n[2].length}function $(t="",n=""){const r=[];if(t||n)return b(t)&&r.push({before:y(t)}),b(n)&&r.push({after:y(n)}),r}export{g as additionalYears,b as checkISOFormatAndLength,d as findMatchedFormatAndValue,c as formatToISO,p as formattedValue,$ as getDisabledDays,m as getSeparator,l as isDateValid,u as isValidLocaleDate,s as parseDate,y as parseISODate};

package/esm/components/date/__internal__/weekday/abbr.style.d.ts

@@ -0,0 +1,2 @@
+declare const StyledAbbr: import("styled-components").StyledComponent<"abbr", any, {}, never>;
+export default StyledAbbr;

package/esm/components/date/__internal__/weekday/abbr.style.js

@@ -0,0 +1 @@
+import e from"styled-components";const o=e.abbr.withConfig({displayName:"abbr.style__StyledAbbr",componentId:"carbon_v162_12_0__sc-e967dee-0"})(["text-decoration:none;"]);export{o as default};

package/esm/components/date/__internal__/weekday/index.d.ts

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

package/esm/components/date/__internal__/weekday/index.js

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

package/esm/components/date/__internal__/weekday/weekday.component.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export interface WeekdayProps {
+    className?: string;
+    title?: string;
+    children?: React.ReactNode;
+}
+export declare const Weekday: ({ className, title, children, ...props }: WeekdayProps) => React.JSX.Element;
+export default Weekday;

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

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import"react";import r from"./weekday.style.js";import t from"./abbr.style.js";function n(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}const o=o=>{var c,l,{className:i,title:a,children:b}=o,s=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},c=Object.keys(e);for(n=0;n<c.length;n++)t=c[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(e);for(n=0;n<c.length;n++)t=c[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(o,["className","title","children"]);return e(r,(c=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){n(e,r,t[r])}))}return e}({className:i,role:"columnheader"},s),l=null!=(l={children:e(t,{title:a,children:b})})?l:{},Object.getOwnPropertyDescriptors?Object.defineProperties(c,Object.getOwnPropertyDescriptors(l)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(l)).forEach((function(e){Object.defineProperty(c,e,Object.getOwnPropertyDescriptor(l,e))})),c))};export{o as Weekday,o as default};

package/esm/components/date/__internal__/weekday/weekday.style.d.ts

@@ -0,0 +1,2 @@
+declare const StyledWeekday: import("styled-components").StyledComponent<"th", any, {}, never>;
+export default StyledWeekday;

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

@@ -0,0 +1 @@
+import o from"styled-components";import e from"./abbr.style.js";const t=o.th.withConfig({displayName:"weekday.style__StyledWeekday",componentId:"carbon_v162_12_0__sc-fb3dbb5c-0"})(["&,& ","{border:none;height:var(--sizing500);min-width:var(--sizing500);font-weight:800;color:var(--colorsActionMinor500);text-transform:uppercase;font-size:12px;text-align:center;padding:20px 0 5px;box-sizing:border-box;}"],e);export{t as default};

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

@@ -0,0 +1,53 @@
+import React from "react";
+import { TextboxProps } from "../textbox";
+import { PickerProps } from "./__internal__/date-picker";
+import { InputName } from "../date-range/__internal__/date-range.context";
+export interface DateChangeEvent {
+    target: {
+        id?: string;
+        name?: string;
+        value: {
+            formattedValue: string;
+            rawValue: string | null;
+        };
+    };
+}
+export interface DateInputProps extends Omit<TextboxProps, "value" | "formattedValue" | "rawValue" | "onChange" | "onBlur" | "onMouseDown" | "onChangeDeferred" | "deferTimeout" | "children" | "leftChildren" | "placeholder" | "iconOnClick" | "iconOnMouseDown" | "characterLimit" | "warnOverLimit" | "iconTabIndex" | "inputIcon" | "data-component"> {
+    /** Boolean to allow the input to have an empty value */
+    allowEmptyValue?: boolean;
+    /** Boolean to toggle where DatePicker is rendered in relation to the Date Input */
+    disablePortal?: boolean;
+    /** Minimum possible date YYYY-MM-DD */
+    minDate?: string;
+    /** Maximum possible date YYYY-MM-DD */
+    maxDate?: string;
+    /** Specify a callback triggered on change */
+    onChange: (ev: DateChangeEvent) => void;
+    /** Specify a callback triggered on blur */
+    onBlur?: (ev: DateChangeEvent) => void;
+    /** The current date string */
+    value: 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;
+    /**
+     * @private
+     * @ignore
+     * Name passed from DateRange to allow it to know which input is updating
+     * */
+    inputName?: InputName;
+    /** Callback triggered when the picker is opened */
+    onPickerOpen?: () => void;
+    /** Callback triggered when the picker is closed */
+    onPickerClose?: () => void;
+    /** Date format string to be applied to the date inputs */
+    dateFormatOverride?: string;
+    /** Prop to specify the aria-label attribute of the date picker */
+    datePickerAriaLabel?: string;
+    /** Prop to specify the aria-labelledby attribute of the date picker */
+    datePickerAriaLabelledBy?: string;
+}
+export declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<HTMLInputElement>>;
+export default DateInput;

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

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

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

@@ -0,0 +1,14 @@
+import { DateInputProps } from "./date.component";
+interface StyledDateInputProps extends Pick<DateInputProps, "inputWidth" | "maxWidth" | "labelInline"> {
+    applyDateRangeStyling?: boolean;
+    size: Required<DateInputProps>["size"];
+}
+export declare const datePickerWidth: {
+    large: string;
+    medium: string;
+    small: string;
+};
+declare const StyledDateInput: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledDateInputProps, "theme">;
+export default StyledDateInput;

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

@@ -0,0 +1 @@
+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 i from"../../__internal__/label/label.style.js";const s={large:"140px",medium:"135px",small:"120px"},m=e.div.attrs(l).withConfig({displayName:"date.style__StyledDateInput",componentId:"carbon_v162_12_0__sc-48d2712c-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],a,(({applyDateRangeStyling:e,labelInline:a,maxWidth:l,size:m})=>e&&t(['[data-role="input-wrapper"]{width:',";flex:0 0 auto;}",""],null!=l?l:s[m],!a&&t(["",",","{overflow-wrap:anywhere;}"],o,i))));export{s as datePickerWidth,m as default};

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

@@ -0,0 +1,2 @@
+export { default } from "./date.component";
+export type { DateChangeEvent, DateInputProps } from "./date.component";

package/esm/components/date/index.js

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

package/esm/components/date-range/__internal__/date-range.context.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+export type InputName = "start" | "end";
+type IsBlurBlocked = {
+    current: boolean;
+};
+type SetOpen = null | ((value: boolean) => void);
+export type SetInputRefMapValue = {
+    [id in InputName]?: {
+        isBlurBlocked: IsBlurBlocked;
+        setOpen: SetOpen;
+    };
+};
+interface DateInputRefMap {
+    isBlurBlocked: IsBlurBlocked;
+    setOpen: SetOpen;
+}
+export interface DateRangeContextProps {
+    inputRefMap?: Partial<Record<InputName, DateInputRefMap>>;
+    setInputRefMap?: (value: SetInputRefMapValue) => void;
+    validationMessagePositionTop?: boolean;
+}
+declare const _default: React.Context<DateRangeContextProps>;
+export default _default;

package/esm/components/date-range/__internal__/date-range.context.js

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

package/esm/components/date-range/date-range.component.d.ts

@@ -0,0 +1,103 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { DateInputProps } from "../date";
+import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
+import { StyledDateRangeProps } from "./date-range.style";
+interface DateInputValue {
+    formattedValue: string;
+    rawValue: string | null;
+}
+export interface DateRangeChangeEvent {
+    target: {
+        name?: string;
+        id?: string;
+        value: [DateInputValue, DateInputValue];
+    };
+}
+export interface DateRangeProps extends StyledDateRangeProps, MarginProps, TagProps {
+    /** Props for the child end Date component */
+    endDateProps?: Omit<Partial<DateInputProps>, "required">;
+    /** Optional label for endDate field */
+    endLabel?: string;
+    /**
+     * Indicate that error has occurred on end date.
+     * Pass string to display icon, tooltip and red border.
+     * Pass true boolean to only display red border.
+     */
+    endError?: boolean | string;
+    /**
+     * [Legacy] Indicate additional information for end date.
+     * Pass string to display icon, tooltip and blue border.
+     * Pass true boolean to only display blue border.
+     */
+    endInfo?: boolean | string;
+    /**
+     * Indicate that warning has occurred on end date.
+     * Pass string to display icon, tooltip and orange border.
+     * Pass true boolean to only display orange border.
+     */
+    endWarning?: boolean | string;
+    /**
+     * A React ref to pass to the second of the two Date Input fields
+     */
+    endRef?: React.ForwardedRef<HTMLInputElement>;
+    /** An optional string prop to provide an id to the component */
+    id?: string;
+    /** An optional string prop to provide a name to the component */
+    name?: string;
+    /** Specify a callback triggered on change */
+    onChange: (ev: DateRangeChangeEvent) => void;
+    /** Specify a callback triggered on blur */
+    onBlur?: (ev: DateRangeChangeEvent) => void;
+    /** Props for the child start Date component */
+    startDateProps?: Omit<Partial<DateInputProps>, "required">;
+    /** Optional label for startDate field */
+    startLabel?: string;
+    /**
+     * Indicate that error has occurred on start date.
+     * Pass string to display icon, tooltip and red border.
+     * Pass true boolean to only display red border.
+     */
+    startError?: boolean | string;
+    /**
+     * Indicate that warning has occurred on start date.
+     * Pass string to display icon, tooltip and orange border.
+     * Pass true boolean to only display orange border.
+     */
+    startWarning?: boolean | string;
+    /**
+     * [Legacy] Indicate additional information for start date.
+     * Pass string to display icon, tooltip and blue border.
+     * Pass true boolean to only display blue border.
+     */
+    startInfo?: boolean | string;
+    /**
+     * A React ref to pass to the first of the two Date Input fields
+     */
+    startRef?: React.ForwardedRef<HTMLInputElement>;
+    /** An array containing the value of startDate and endDate */
+    value: string[];
+    /** [Legacy] When true, validation icons will be placed on labels instead of being placed on the inputs */
+    validationOnLabel?: boolean;
+    /** [Legacy] Overrides the default tooltip position */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** Flag to configure component as mandatory. */
+    required?: boolean;
+    /** Date format string to be applied to the date inputs */
+    dateFormatOverride?: string;
+    /** Prop to specify the aria-label attribute of the start date picker */
+    datePickerStartAriaLabel?: string;
+    /** Prop to specify the aria-labelledby attribute of the start date picker */
+    datePickerStartAriaLabelledBy?: string;
+    /** Prop to specify the aria-label attribute of the end date picker */
+    datePickerEndAriaLabel?: string;
+    /** Prop to specify the aria-labelledby attribute of the end date picker */
+    datePickerEndAriaLabelledBy?: string;
+    /** Render the ValidationMessage above the Date inputs when validationRedesignOptIn flag is set */
+    validationMessagePositionTop?: boolean;
+}
+export declare const DateRange: {
+    ({ endDateProps, id, labelsInline, name, onBlur, onChange, startDateProps, tooltipPosition, validationOnLabel, value, startRef, endRef, required, dateFormatOverride: dateFormatOverrideProp, datePickerStartAriaLabel, datePickerStartAriaLabelledBy, datePickerEndAriaLabel, datePickerEndAriaLabelledBy, validationMessagePositionTop, ...rest }: DateRangeProps): React.JSX.Element;
+    displayName: string;
+};
+export default DateRange;

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

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as r,useMemo as a,useState as n,useCallback as l,useEffect as o}from"react";import{checkISOFormatAndLength as i,formattedValue as s,parseISODate as d,formatToISO as u}from"../date/__internal__/utils.js";import{DateInput as c}from"../date/date.component.js";import"../../style/utils/filter-styled-system-padding-props.js";import p from"../../style/utils/filter-styled-system-margin-props.js";import m from"../../__internal__/utils/helpers/tags/tags.js";import f from"./date-range.style.js";import b from"../../__internal__/utils/helpers/events/events.js";import y from"../../hooks/__internal__/useLocale/useLocale.js";import v from"../../hooks/__internal__/usePrevious/index.js";import O from"../date/__internal__/date-formats/index.js";import g from"./__internal__/date-range.context.js";import P from"../carbon-provider/__internal__/new-validation.context.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 j(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},a=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),a.forEach((function(t){_(e,t,r[t])}))}return e}function k(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=_=>{var{endDateProps:w={},id:B,labelsInline:h,name:L,onBlur:V,onChange:E,startDateProps:A={},tooltipPosition:S,validationOnLabel:D,value:x,startRef:I,endRef:R,required:F,dateFormatOverride:M,datePickerStartAriaLabel:T,datePickerStartAriaLabelledBy:K,datePickerEndAriaLabel:$,datePickerEndAriaLabelledBy:q,validationMessagePositionTop:C=!0}=_,N=function(e,t){if(null==e)return{};var r,a,n=function(e,t){if(null==e)return{};var r,a,n={},l=Object.keys(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(_,["endDateProps","id","labelsInline","name","onBlur","onChange","startDateProps","tooltipPosition","validationOnLabel","value","startRef","endRef","required","dateFormatOverride","datePickerStartAriaLabel","datePickerStartAriaLabelledBy","datePickerEndAriaLabel","datePickerEndAriaLabelledBy","validationMessagePositionTop"]);const{validationRedesignOptIn:W}=r(P),z=!W&&h,G=y(),{dateFnsLocale:H,dateFormatOverride:J}=G.date,{format:Q}=a((()=>O(H(),M||J)),[H,M,J]),[U,X]=n(""),Y=l((e=>i(e)?s(Q,d(e)):e),[Q]),Z=l((()=>{const{value:e}=A;return Y(e||x[0])}),[A,x,Y]),ee=l((()=>{const{value:e}=w;return Y(e||x[1])}),[w,x,Y]),[te,re]=n({start:{isBlurBlocked:{current:!1},setOpen:null},end:{isBlurBlocked:{current:!1},setOpen:null}});function ae(e,t){return e&&!t.length}const[ne,le]=n({formattedValue:Z(),rawValue:ae(!!A.allowEmptyValue,Z())?"":u(Q,Z())}),[oe,ie]=n({formattedValue:ee(),rawValue:ae(!!w.allowEmptyValue,ee())?"":u(Q,ee())}),se=v(x);o((()=>{(null==se?void 0:se.length)&&(x[0]!==se[0]||x[1]!==se[1])&&(le({formattedValue:Z(),rawValue:ae(!!A.allowEmptyValue,Z())?"":u(Q,Z())}),ie({formattedValue:ee(),rawValue:ae(!!w.allowEmptyValue,ee())?"":u(Q,ee())}))}),[x,se,w.allowEmptyValue,Q,ee,Z,A.allowEmptyValue]);const de=l(((e,t)=>{const r="start"===e?t:ne,a="end"===e?t:oe;return X(e),{target:k(j({},L&&{name:L},B&&{id:B}),{value:[r,a]})}}),[oe,B,L,ne]),ue=(e,t)=>{"start"===e?le(j({},t.target.value)):ie(j({},t.target.value));const r=de(e,t.target.value);E(r)},ce=e=>{ue("start",e)},pe=e=>{ue("end",e)},me=e=>{var t,r;if(!(null==te||null===(t=te.start)||void 0===t?void 0:t.isBlurBlocked.current)&&!(null==te||null===(r=te.end)||void 0===r?void 0:r.isBlurBlocked.current)&&V){const t=de(U,e.target.value);V(t)}},fe=e=>{(e=>{const t=null==te?void 0:te[e];var r;t&&(null===(r=t.setOpen)||void 0===r||r.call(t,!1),t.isBlurBlocked.current=!1)})(e),X("start"===e?"end":"start")},be=e=>{const t="start"===e?A:w,{formattedValue:r}="start"===e?ne:oe,a="start"===e?ce:pe;return k(j({label:N[`${e}Label`],labelInline:z,value:r,error:N[`${e}Error`],warning:N[`${e}Warning`],info:N[`${e}Info`],validationOnLabel:D,onBlur:me,onChange:a,onKeyDown:t=>((e,t)=>{b.isTabKey(e)&&b.isShiftKey(e)&&(null==te?void 0:te.start)?te.start.isBlurBlocked.current=!("start"===t):b.isTabKey(e)&&(null==te?void 0:te.end)&&(te.end.isBlurBlocked.current=!("end"===t))})(t,e)},t),{required:F})};return e(f,k(j(k(j({},m("date-range",N)),{labelsInline:z}),p(N)),{validationMessagePositionTop:C,children:t(g.Provider,{value:{inputRefMap:te,setInputRefMap:e=>{re((t=>j({},t,e)))},validationMessagePositionTop:C},children:[e(c,k(j({my:0},be("start")),{onFocus:()=>fe("end"),"data-element":"start-date",inputName:"start",labelWidth:40,tooltipPosition:S,ref:I,datePickerAriaLabel:T,datePickerAriaLabelledBy:K})),e(c,k(j({my:0},be("end")),{onFocus:()=>fe("start"),"data-element":"end-date",inputName:"end",labelWidth:40,tooltipPosition:S,ref:R,datePickerAriaLabel:$,datePickerAriaLabelledBy:q}))]})}))};w.displayName="DateRange";export{w as DateRange,w as default};

package/esm/components/date-range/date-range.style.d.ts

@@ -0,0 +1,10 @@
+export interface StyledDateRangeProps {
+    /** [Legacy] Display labels inline */
+    labelsInline?: boolean;
+    /** Render the ValidationMessage above the inputs when validationRedesignOptIn flag is set */
+    validationMessagePositionTop?: boolean;
+}
+declare const StyledDateRange: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledDateRangeProps, "theme">;
+export default StyledDateRange;

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

@@ -0,0 +1 @@
+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:"carbon_v162_12_0__sc-91656d90-0"})([""," margin-bottom:var(--fieldSpacing);"," & ","{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/date-range/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from "./date-range.component";
+export type { DateRangeChangeEvent, DateRangeProps, } from "./date-range.component";
+export type { DateRangeContextProps } from "./__internal__/date-range.context";

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

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

package/esm/components/decimal/__internal__/decimal-popover-button.component.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { ButtonProps } from "../../button/__next__";
+import { RenderOpenProps } from "../../popover-container";
+declare const DecimalPopoverButton: React.ForwardRefExoticComponent<Pick<RenderOpenProps, "data-element" | "id" | "aria-expanded" | "aria-haspopup" | "aria-label" | "onClick"> & {
+    size?: ButtonProps["size"];
+} & React.RefAttributes<HTMLButtonElement>>;
+export default DecimalPopoverButton;

package/esm/components/decimal/__internal__/decimal-popover-button.component.js

@@ -0,0 +1 @@
+import{jsx as a}from"react/jsx-runtime";import{forwardRef as e}from"react";import i from"./decimal-popover-button.style.js";const r=e((({onClick:e,"data-element":r,"aria-label":t,"aria-expanded":o,"aria-haspopup":p,id:l,size:s},m)=>a(i,{ref:m,onClick:e,"data-element":r,"aria-label":t,"aria-haspopup":p,"aria-expanded":o,id:l,iconType:"ellipsis_vertical",variantType:"subtle",size:s})));r.displayName="DecimalPopoverButton";export{r as default};

package/esm/components/decimal/__internal__/decimal-popover-button.style.d.ts

@@ -0,0 +1,2 @@
+declare const StyledDecimalPopoverButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../button/__next__").ButtonProps & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>>, any, {}, never>;
+export default StyledDecimalPopoverButton;

package/esm/components/decimal/__internal__/decimal-popover-button.style.js

@@ -0,0 +1 @@
+import o from"styled-components";import{Button as t}from"../../button/__next__/button.component.js";const e=o(t).withConfig({displayName:"decimal-popover-button.style__StyledDecimalPopoverButton",componentId:"carbon_v162_12_0__sc-2527bb44-0"})(["border-radius:0 var(--global-radius-action-m) var(--global-radius-action-m) 0;border-left:none;"]);export{e as default};

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

@@ -0,0 +1,49 @@
+import React from "react";
+import { CommonTextboxProps } from "../textbox";
+import { PopoverContainerProps } from "../popover-container";
+export interface CustomEvent {
+    target: {
+        name?: string;
+        id?: string;
+        value: {
+            formattedValue: string;
+            rawValue: string;
+        };
+    };
+}
+export interface DecimalProps extends Omit<CommonTextboxProps, "onChange" | "onBlur" | "data-component"> {
+    /** Text alignment of the label */
+    align?: "left" | "right";
+    /** Allow an empty value instead of defaulting to 0.00 */
+    allowEmptyValue?: boolean;
+    /** The input id */
+    id?: string;
+    /** The width of the input as a percentage */
+    inputWidth?: number;
+    /** The locale string - default en */
+    locale?: string;
+    /** The input name */
+    name?: string;
+    /** Handler for blur event */
+    onBlur?: (ev: CustomEvent) => void;
+    /** Handler for change event */
+    onChange: (ev: CustomEvent) => void;
+    /** Sets the accessible name (aria-label) on the PopoverContainer dialog */
+    popoverContainerAriaLabel?: string;
+    /** Content to render inside a PopoverContainer, displayed via a button at the right of the input */
+    popoverContainerContent?: React.ReactNode;
+    /** Sets the position of the PopoverContainer dialog relative to its trigger button */
+    popoverPosition?: PopoverContainerProps["position"];
+    /** Sets the aria-label on the popover trigger button */
+    popoverTriggerAriaLabel?: string;
+    /** The decimal precision of the value in the input */
+    precision?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15;
+    /** If true, the component will be read-only */
+    readOnly?: boolean;
+    /** A suffix to display alongside the input. Please note that if a prefix is also provided, only the prefix will be rendered. */
+    suffix?: string;
+    /** The value of the input */
+    value: string;
+}
+export declare const Decimal: React.ForwardRefExoticComponent<DecimalProps & React.RefAttributes<HTMLInputElement>>;
+export default Decimal;

package/esm/components/decimal/decimal.component.js

@@ -0,0 +1 @@
+import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import n,{useContext as o,useCallback as a,useEffect as i,useState as l}from"react";import p from"invariant";import{Textbox as c}from"../textbox/textbox.component.js";import{PopoverContainer as u}from"../popover-container/popover-container.component.js";import s from"../../__internal__/i18n-context/index.js";import m from"./__internal__/decimal-popover-button.component.js";import d from"../../hooks/__internal__/usePrevious/index.js";import f from"../../__internal__/utils/logger/index.js";import g from"../../__internal__/utils/helpers/tags/tags.js";import b from"./decimal.style.js";function v(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function h(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){v(e,r,t[r])}))}return e}const y=n.forwardRef(((n,v)=>{var{align:y="right",allowEmptyValue:O=!1,fieldHelp:x,id:j,inputMode:w="decimal",inputWidth:_,labelHelp:P,locale:C,name:D,onBlur:E,onChange:z,popoverContainerAriaLabel:A,popoverContainerContent:L,popoverPosition:N,popoverTriggerAriaLabel:$,precision:k=2,prefix:H,readOnly:S,size:V,suffix:R,value:W}=n,F=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(n,["align","allowEmptyValue","fieldHelp","id","inputMode","inputWidth","labelHelp","locale","name","onBlur","onChange","popoverContainerAriaLabel","popoverContainerContent","popoverPosition","popoverTriggerAriaLabel","precision","prefix","readOnly","size","suffix","value"]);const T=o(s),B=a((e=>{var r;return null===(r=Intl.NumberFormat(C||T.locale()).formatToParts(10000.1).find((r=>r.type===e)))||void 0===r?void 0:r.value}),[T,C]),I=a((e=>Number.isNaN(Number(e))),[]),M=a((e=>{if(I(e))return e;if(""===e||e.match(/\s+/g))return e;const r=e.startsWith("+")?"+":"",t=B("decimal"),[n,o]=e.split(".");let a=r+Intl.NumberFormat(C||T.locale(),{maximumFractionDigits:0}).format(+n);return(null==o?void 0:o.length)>k?a+=`${t+o}`:(null==o?void 0:o.length)<=k?a+=`${t+o+"0".repeat(k-o.length)}`:a+=`${k?t+"0".repeat(k):""}`,a}),[B,I,T,C,k]),Z=O?"":M((0).toFixed(k)),q=a((e=>(p("string"==typeof e,"Decimal `value` prop must be a string"),e&&!O&&p(""!==e,"Decimal `value` must not be an empty string. Please use `allowEmptyValue` or specify a non-empty initialValue"),e)),[O]),G=d(k);i((()=>{G&&G!==k&&f.error("Decimal `precision` prop has changed value. Changing the Decimal `precision` prop has no effect.")}),[k,G]);const J=a((e=>{const r=new RegExp(`[\\${B("group")} ]*`,"g");return e.replace(r,"")}),[B]),K=a((e=>{var r;const t=(null===(r=B("group"))||void 0===r?void 0:r.match(/\s+/))&&!e.match(/\s{2,}/)?e.replace(/\s+/g,""):e,n=new RegExp("([^A-Za-z0-9]{2,})|(^[^A-Za-z0-9-]+)|([^0-9a-z-,.])|([^0-9-,.]+)|([W,.])$","g"),o=B("decimal"),a=new RegExp("."===o?`\\${o}`:o,"g");return t.match(n)||(t.match(a)||[]).length>1?t:J(t).replace(new RegExp(`\\${o}`,"g"),".")}),[B,J]),Q=q(W||Z),[U,X]=l(I(K(Q))?Q:M(Q)),Y=(e,r)=>({target:{name:D,id:j,value:{formattedValue:M(K(e)),rawValue:r||K(e)}}}),ee=d(W);return i((()=>{const e=K(U),r=q(W);e!==r&&X(M(""===r&&""===ee?Z:r))}),[Z,M,q,ee,U,K,W]),e(r,{children:[e(c,(re=h({align:y,readOnly:S,inputWidth:_,onChange:e=>{const{value:r}=e.target;X(r),z(Y(r))},onBlur:e=>{const{value:r}=e.target;let t;if(r){const e=K(r),n=I(e)?r:M(e);t=Y(n,e),X(n)}else t=Y(Z),X(Z);E&&E(t)},value:U,"data-component":"decimal",id:j,inputMode:w,ref:v,prefix:H,fieldHelp:x,labelHelp:P,size:V},F,g("decimal",F)),te={children:[!H&&R&&t(b,{"data-element":"textbox-suffix",children:R}),L&&t(u,{position:N,containerAriaLabel:A||T.decimal.ariaLabels.popoverContent(),renderOpenComponent:({ref:e,onClick:r,"data-element":n,"aria-label":o,"aria-expanded":a,"aria-haspopup":i,id:l})=>t(m,{ref:e,onClick:r,"data-element":n,"aria-label":$||o||T.decimal.ariaLabels.popoverTrigger(),"aria-haspopup":i,"aria-expanded":a,id:l,size:V}),children:L})]},te=null!=te?te:{},Object.getOwnPropertyDescriptors?Object.defineProperties(re,Object.getOwnPropertyDescriptors(te)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(te)).forEach((function(e){Object.defineProperty(re,e,Object.getOwnPropertyDescriptor(te,e))})),re)),t("input",{name:D,value:K(U),type:"hidden","data-component":"hidden-input","data-role":"hidden-input"})]});var re,te}));y.displayName="Decimal";export{y as Decimal,y as default};

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

@@ -0,0 +1,2 @@
+declare const StyledSuffix: import("styled-components").StyledComponent<"span", any, {}, never>;
+export default StyledSuffix;

package/esm/components/decimal/decimal.style.js

@@ -0,0 +1 @@
+import o from"styled-components";const t=o.span.withConfig({displayName:"decimal.style__StyledSuffix",componentId:"carbon_v162_12_0__sc-821f41bb-0"})(["font:var(--global-font-static-comp-medium-m);margin-right:var(--global-space-comp-m);"]);export{t as default};

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

@@ -0,0 +1,2 @@
+export { default } from "./decimal.component";
+export type { DecimalProps, CustomEvent } from "./decimal.component";

package/esm/components/decimal/index.js

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

package/esm/components/definition-list/__internal__/dl.context.d.ts

@@ -0,0 +1,3 @@
+import { DlProps } from "../dl.component";
+declare const DlProvider: import("react").Provider<Required<Pick<DlProps, "asSingleColumn" | "dtTextAlign" | "ddTextAlign">> | null>, useDlContext: () => Required<Pick<DlProps, "asSingleColumn" | "dtTextAlign" | "ddTextAlign">>;
+export { DlProvider, useDlContext };

package/esm/components/definition-list/__internal__/dl.context.js

@@ -0,0 +1 @@
+import t from"../../../__internal__/utils/createStrictContext/createStrictContext.js";const[e,o]=t({name:"DlContext",errorMessage:"Carbon DefinitionList: Context not found. Have you wrapped your Carbon subcomponents properly? See stack trace for more details.",defaultValue:{asSingleColumn:!1,dtTextAlign:"left",ddTextAlign:"left"}});export{e as DlProvider,o as useDlContext};

package/esm/components/definition-list/__internal__/utils.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const flattenChildren: (children: React.ReactNode, parentKey?: string) => React.ReactNode[];
+export declare const isComponent: (child: React.ReactNode, component: React.ElementType) => boolean;
+export declare const groupPairs: (children: React.ReactNode) => React.ReactNode[][];

package/esm/components/definition-list/__internal__/utils.js

@@ -0,0 +1 @@
+import e from"react";import t from"../dt/dt.component.js";import n from"../dd/dd.component.js";const r=(t,n="")=>e.Children.toArray(t).flatMap((t=>{var l;const o=e.isValidElement(t)?`${n}${null!==(l=t.key)&&void 0!==l?l:""}`:n;return e.isValidElement(t)&&t.type===e.Fragment?r(t.props.children,`${o}.`):e.isValidElement(t)?e.cloneElement(t,{key:o}):t})),l=(t,n)=>e.isValidElement(t)&&t.type===n,o=e=>{const o=[];let i=[];return r(e).forEach((e=>{if(l(e,t))return i.length&&o.push(i),void(i=[e]);l(e,n)&&i.length?i.push(e):(i.length&&o.push(i),i=[],o.push([e]))})),i.length&&o.push(i),o};export{r as flattenChildren,o as groupPairs,l as isComponent};

package/esm/components/definition-list/dd/dd.component.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { SpaceProps } from "styled-system";
+import { TagProps } from "../../../__internal__/utils/helpers/tags";
+export interface DdProps extends SpaceProps, TagProps {
+    /** Prop for what will render in the `<Dd></Dd>` tags */
+    children: React.ReactNode;
+    /** Supplementary element, such as a Pill or Link, rendered to the right of the description. */
+    rightChildren?: React.ReactNode;
+}
+declare const Dd: {
+    ({ children, rightChildren, ...rest }: DdProps): React.JSX.Element;
+    displayName: string;
+};
+export default Dd;

package/esm/components/definition-list/dd/dd.component.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import"react";import{StyledDd as r}from"../definition-list.style.js";import{useDlContext as n}from"../__internal__/dl.context.js";import o from"../../../__internal__/utils/helpers/tags/tags.js";function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const l=l=>{var{children:c,rightChildren:a}=l,d=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(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)&&(o[r]=e[r])}return o}(l,["children","rightChildren"]);const{asSingleColumn:s,ddTextAlign:p}=n();return e(r,(u=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){i(e,t,r[t])}))}return e}({"data-element":"dd","data-role":"dd",asSingleColumn:s,ddTextAlign:p},d,o("dd",d)),f=null!=(f={children:[t("div",{"data-element":"dd-content",children:c}),a&&t("div",{"data-element":"dd-right-children","data-role":"dd-right-children",children:a})]})?f:{},Object.getOwnPropertyDescriptors?Object.defineProperties(u,Object.getOwnPropertyDescriptors(f)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(f)).forEach((function(e){Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(f,e))})),u));var u,f};l.displayName="Dd";export{l as default};

package/esm/components/definition-list/definition-list.style.d.ts

@@ -0,0 +1,14 @@
+import { SpaceProps } from "styled-system";
+import { DlProps } from "./dl.component";
+export declare const StyledDl: import("styled-components").StyledComponent<"dl", any, {
+    theme: object;
+}, "theme">;
+export declare const StyledDlPair: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & Pick<DlProps, "spacing" | "asSingleColumn" | "divider" | "w"> & {
+    isLast?: boolean;
+}, "theme">;
+export declare const StyledDt: import("styled-components").StyledComponent<"dt", any, {
+    theme: object;
+} & Pick<DlProps, "asSingleColumn" | "dtTextAlign"> & SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol>, "theme">;
+export declare const StyledDd: import("styled-components").StyledComponent<"dd", any, Pick<DlProps, "asSingleColumn" | "ddTextAlign"> & SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol>, never>;

package/esm/components/definition-list/definition-list.style.js

@@ -0,0 +1 @@
+import t,{css as a}from"styled-components";import{space as e}from"styled-system";import i from"../../style/themes/apply-base-theme.js";const n=t.dl.attrs(i).withConfig({displayName:"definition-list.style__StyledDl",componentId:"carbon_v162_12_0__sc-4c92740a-0"})([""," width:100%;height:auto;background-color:transparent;"],e),l={small:"var(--global-space-comp-xs)",large:"var(--global-space-comp-m)"},o=t.div.attrs(i).withConfig({displayName:"definition-list.style__StyledDlPair",componentId:"carbon_v162_12_0__sc-4c92740a-1"})([""," "," ",""],(({asSingleColumn:t,w:e})=>t?a(["display:block;"]):a(["display:grid;grid-template-columns:","% minmax(0,1fr);"],e)),(({spacing:t,divider:e})=>a(["padding-bottom:",";",""],l[t||"large"],e&&a(["padding-top:",";"],l[t||"large"]))),(({divider:t,isLast:e})=>t&&!e&&a(["border-bottom:var(--global-borderwidth-xs) solid var(--container-standard-border-default);"]))),d=t.dt.attrs(i).withConfig({displayName:"definition-list.style__StyledDt",componentId:"carbon_v162_12_0__sc-4c92740a-2"})(["margin:var(--global-space-none);"," font:var(--global-font-static-comp-medium-s);color:var(--container-standard-txt-default);"," ",' > [data-element="dt-content"]{max-width:var(--container-size-layout-maxwidth-s);'," ","}"],e,(({asSingleColumn:t})=>!t&&a(["grid-column:1;"])),(({dtTextAlign:t})=>a(["text-align:",";"],t)),(({dtTextAlign:t})=>"center"===t&&a(["margin-inline:auto;"])),(({dtTextAlign:t})=>"right"===t&&a(["margin-left:auto;"]))),r=t.dd.withConfig({displayName:"definition-list.style__StyledDd",componentId:"carbon_v162_12_0__sc-4c92740a-3"})(["margin:var(--global-space-none);"," font:var(--global-font-static-comp-regular-s);color:var(--container-standard-txt-default);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--global-space-comp-l);"," ",' > [data-element="dd-content"]{flex:1;min-width:0;max-width:var(--container-size-layout-maxwidth-s);'," ",'}> [data-element="dd-right-children"]{flex-shrink:0;}'],e,(({asSingleColumn:t})=>!t&&a(["grid-column:2;"])),(({ddTextAlign:t})=>a(["text-align:",";"],t)),(({ddTextAlign:t})=>"center"===t&&a(["margin-inline:auto;"])),(({ddTextAlign:t})=>"right"===t&&a(["margin-left:auto;"])));export{r as StyledDd,n as StyledDl,o as StyledDlPair,d as StyledDt};

package/esm/components/definition-list/dl.component.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import { SpaceProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+type ElementAlignment = "left" | "center" | "right";
+export interface DlProps extends SpaceProps, TagProps {
+    /** HTML id attribute of the definition list. */
+    id?: string;
+    /** prop to render children. */
+    children: React.ReactNode;
+    /** Width of the term column as a percentage. Has no effect when `asSingleColumn` is set. */
+    w?: number;
+    /** Render the DefinitionList as a single column */
+    asSingleColumn?: boolean;
+    /** Sets vertical top and bottom padding on each definition pair. */
+    spacing?: "small" | "large";
+    /** Renders a divider between definition pairs. */
+    divider?: boolean;
+    /** This string will specify the text align styling of the `<dt></dt>`. */
+    dtTextAlign?: ElementAlignment;
+    /** This string will specify the text align styling of the `<dd></dd>`. */
+    ddTextAlign?: ElementAlignment;
+}
+declare const Dl: {
+    ({ children, w, dtTextAlign, ddTextAlign, asSingleColumn, spacing, divider, ...rest }: DlProps): React.JSX.Element;
+    displayName: string;
+};
+export default Dl;

package/esm/components/definition-list/dl.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import t from"react";import{StyledDl as r,StyledDlPair as n}from"./definition-list.style.js";import{DlProvider as i}from"./__internal__/dl.context.js";import{groupPairs as o,isComponent as l}from"./__internal__/utils.js";import c from"../../__internal__/utils/helpers/tags/tags.js";import a from"./dt/dt.component.js";function s(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const p=p=>{var{children:u,w:f=50,dtTextAlign:d="left",ddTextAlign:m="left",asSingleColumn:g=!1,spacing:O="large",divider:b=!1}=p,y=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}(p,["children","w","dtTextAlign","ddTextAlign","asSingleColumn","spacing","divider"]);const j=o(u),v=j.reduce(((e,t,r)=>l(t[0],a)?r:e),-1);return e(r,(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){s(e,t,r[t])}))}return e}({},y,c("dl",y)),P=null!=(P={children:e(i,{value:{asSingleColumn:g,dtTextAlign:d,ddTextAlign:m},children:j.map(((r,i)=>{const o=r[0],c=l(o,a),s=t.isValidElement(o)&&null!=o.key?o.key:i;return c?e(n,{asSingleColumn:g,"data-role":"dl-pair",divider:b,isLast:i===v,spacing:O,w:f,children:r},s):o}))})})?P:{},Object.getOwnPropertyDescriptors?Object.defineProperties(w,Object.getOwnPropertyDescriptors(P)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(P)).forEach((function(e){Object.defineProperty(w,e,Object.getOwnPropertyDescriptor(P,e))})),w));var w,P};p.displayName="Dl";export{p as default};

package/esm/components/definition-list/dt/dt.component.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { SpaceProps } from "styled-system";
+import { TagProps } from "../../../__internal__/utils/helpers/tags";
+export interface DtProps extends SpaceProps, TagProps {
+    /** Prop for what will render in the `<Dd></Dd>` tags */
+    children: React.ReactNode;
+}
+declare const Dt: {
+    ({ children, pr, ...rest }: DtProps): React.JSX.Element;
+    displayName: string;
+};
+export default Dt;

package/esm/components/definition-list/dt/dt.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import"react";import{StyledDt as t}from"../definition-list.style.js";import{useDlContext as r}from"../__internal__/dl.context.js";import n from"../../../__internal__/utils/helpers/tags/tags.js";function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const i=i=>{var{children:l,pr:c}=i,a=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(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)&&(o[r]=e[r])}return o}(i,["children","pr"]);const{asSingleColumn:p,dtTextAlign:s}=r();return e(t,(u=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){o(e,t,r[t])}))}return e}({"data-element":"dt","data-role":"dt",dtTextAlign:s,asSingleColumn:p,pr:null!=c?c:p?void 0:3},a,n("dt",a)),f=null!=(f={children:e("div",{"data-element":"dt-content",children:l})})?f:{},Object.getOwnPropertyDescriptors?Object.defineProperties(u,Object.getOwnPropertyDescriptors(f)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(f)).forEach((function(e){Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(f,e))})),u));var u,f};i.displayName="Dt";export{i as default};