acinguiux-ds-react-framework 0.1.16 → 0.1.19

package/build/cjs/components/Checkbox/Checkbox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.styles.js","sources":["../../../../src/components/Checkbox/Checkbox.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { getLabelFontStyles, getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { InputUtils } from 'acinguiux-ds-react-base/components/Input';\nimport { CheckboxConsts, CheckboxStyles, CheckboxUtils } from 'acinguiux-ds-react-base/components/Checkbox';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\n\nimport type { ICheckboxProps } from './Checkbox.types';\n\ntype WrapperPropsKeys = 'checked' | 'disabled' | 'invalid' | 'indeterminate' | 'multiline' | 'mirrored';\ntype WrapperProps = Required<PickTransient<ICheckboxProps, 'size'>> & PickTransient<ICheckboxProps, WrapperPropsKeys>;\n\nconst FakeCheckbox = styled.div`\n  ${CheckboxStyles.FakeCheckboxStyles};\n\n  svg {\n    ${CheckboxStyles.FakeCheckboxIconStyles};\n  }\n`;\n\nconst Checkbox = styled.input`\n  ${CheckboxStyles.CheckboxStyles};\n`;\n\nconst CheckboxLabel = styled.span<PickTransient<ICheckboxProps, 'size'>>`\n  ${({ $size, theme }) => theme.typography('label', getLabelTypographySize($size))};\n`;\n\nconst getBorderKind = (invalid = false, checked = false, disabled = false, indeterminate = false) => {\n  if (invalid) {\n    return 'invalid';\n  }\n\n  if (!checked || (!checked && disabled) || indeterminate) {\n    return 'normal';\n  }\n\n  return 'none';\n};\n\nconst CheckboxWrapper = styled.label<WrapperProps>`\n  ${({ $size, $checked, $disabled, $invalid, $indeterminate, $mirrored, $multiline, theme }) => {\n    const getStyles = (state: FabricsVariables.StateType = FabricsVariables.States.Resting, checked = false) =>\n      CheckboxUtils.getStyles(theme, state, $disabled, $invalid, $checked ?? checked, $indeterminate);\n\n    return css`\n      position: relative;\n      width: fit-content;\n      display: flex;\n      flex-direction: ${$mirrored ? 'row-reverse' : 'row'};\n      align-items: ${$multiline ? 'flex-start' : 'center'};\n      gap: ${CheckboxConsts.consts[$size].labelSpacing}px;\n      cursor: ${$disabled ? 'default' : 'pointer'};\n\n      ${!$multiline &&\n      css`\n        max-width: 100%;\n        min-width: 0;\n      `};\n\n      ${CheckboxLabel} {\n        ${getLabelFontStyles(theme, $disabled)};\n        ${!$multiline\n          ? css`\n              white-space: nowrap;\n              text-overflow: ellipsis;\n              overflow: hidden;\n            `\n          : css`\n              white-space: pre-line;\n\n              ${[`${Sizes.Large}`, `${Sizes.Medium}`].includes($size) &&\n              css`\n                padding-top: 2px;\n              `};\n            `};\n      }\n\n      ${FakeCheckbox} {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        min-width: ${CheckboxConsts.consts[$size].width}px;\n        width: ${CheckboxConsts.consts[$size].width}px;\n        height: ${CheckboxConsts.consts[$size].height}px;\n        ${InputUtils.getInputBorderStyles(\n          $size,\n          getBorderKind($invalid, $checked, $disabled, $indeterminate),\n          false,\n          CheckboxConsts.consts[$size].borderRadius,\n        )};\n\n        ${getStyles()};\n\n        ${($indeterminate ?? $checked) &&\n        css`\n          svg {\n            display: inline-flex;\n          }\n        `}\n      }\n\n      ${!$indeterminate &&\n      !$disabled &&\n      css`\n        &:hover {\n          ${FakeCheckbox} {\n            ${getStyles(FabricsVariables.States.Hover)};\n            svg {\n              display: inline-flex;\n            }\n          }\n        }\n\n        &:active {\n          ${FakeCheckbox} {\n            ${getStyles(FabricsVariables.States.Press)};\n            svg {\n              display: inline-flex;\n              width: ${CheckboxConsts.consts[$size].width - 4}px;\n              height: ${CheckboxConsts.consts[$size].height - 4}px;\n            }\n          }\n        }\n      `};\n\n      ${Checkbox}:checked ~ ${FakeCheckbox} {\n        ${getStyles(FabricsVariables.States.Resting, true)};\n        ${InputUtils.getInputBorderStyles(\n          $size,\n          getBorderKind($invalid, $checked, $disabled, $indeterminate),\n          false,\n          CheckboxConsts.consts[$size].borderRadius,\n        )};\n        svg {\n          display: inline-flex;\n        }\n\n        &:hover {\n          ${getStyles(FabricsVariables.States.Hover, true)};\n        }\n\n        &:active {\n          ${getStyles(FabricsVariables.States.Press, true)};\n        }\n      }\n\n      ${Checkbox}:focus-visible ~ ${FakeCheckbox} {\n        ${getFocusStyles(theme)};\n      }\n    `;\n  }}\n`;\n\nexport { CheckboxWrapper, Checkbox, FakeCheckbox, CheckboxLabel };\n"],"names":["FakeCheckbox","styled","CheckboxStyles.FakeCheckboxStyles","CheckboxStyles.FakeCheckboxIconStyles","Checkbox","CheckboxStyles.CheckboxStyles","CheckboxLabel","$size","theme","getLabelTypographySize","getBorderKind","invalid","checked","disabled","indeterminate","CheckboxWrapper","$checked","$disabled","$invalid","$indeterminate","$mirrored","$multiline","getStyles","state","FabricsVariables","CheckboxUtils.getStyles","css","CheckboxConsts.consts","getLabelFontStyles","Sizes","InputUtils.getInputBorderStyles","getFocusStyles"],"mappings":"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"}
+{"version":3,"file":"Checkbox.styles.js","sources":["../../../../src/components/Checkbox/Checkbox.styles.ts"],"sourcesContent":["import { styled, css } from 'styled-components';\nimport type { PickTransient } from 'acinguiux-ds-react-base/types';\nimport { getLabelFontStyles, getFocusStyles } from 'acinguiux-ds-react-base/utils/stylesUtils';\nimport { InputUtils } from 'acinguiux-ds-react-base/components/Input';\nimport { CheckboxConsts, CheckboxUtils } from 'acinguiux-ds-react-base/components/Checkbox';\nimport { FabricsVariables } from 'acinguiux-ds-fabrics';\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\n\nimport type { ICheckboxProps } from './Checkbox.types';\n\ntype WrapperPropsKeys = 'checked' | 'disabled' | 'invalid' | 'indeterminate' | 'multiline' | 'mirrored';\ntype WrapperProps = Required<PickTransient<ICheckboxProps, 'size'>> & PickTransient<ICheckboxProps, WrapperPropsKeys>;\n\nconst { consts } = CheckboxConsts;\n\nconst CheckboxIcon = styled.div`\n  position: relative;\n  pointer-events: none;\n\n  svg {\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n  }\n`;\n\nconst Checkbox = styled.input`\n  position: absolute;\n  opacity: 0;\n`;\n\nconst CheckboxLabel = styled.label<PickTransient<ICheckboxProps, 'size'>>`\n  ${({ $size, theme }) => theme.typography('label', getLabelTypographySize($size))};\n`;\n\nconst CheckboxWrapper = styled.div<WrapperProps>`\n  ${({ $size, $checked, $disabled, $invalid, $indeterminate, $mirrored, $multiline, theme }) => {\n    const getStyles = (state: FabricsVariables.StateType = FabricsVariables.States.Resting, checked = false) =>\n      CheckboxUtils.getStyles(theme, state, $disabled, $invalid, $checked ?? checked, $indeterminate);\n\n    return css`\n      position: relative;\n      width: fit-content;\n      display: flex;\n      flex-direction: ${$mirrored ? 'row-reverse' : 'row'};\n      align-items: ${$multiline ? 'flex-start' : 'center'};\n      gap: ${consts[$size].labelSpacing}px;\n\n      ${!$multiline &&\n      css`\n        min-width: 0;\n      `};\n\n      ${CheckboxLabel} {\n        ${getLabelFontStyles(theme, $disabled)};\n        ${!$multiline\n          ? css`\n              white-space: nowrap;\n              text-overflow: ellipsis;\n              overflow: hidden;\n            `\n          : css`\n              white-space: pre-line;\n\n              ${[`${Sizes.Large}`, `${Sizes.Medium}`].includes($size) &&\n              css`\n                padding-top: 2px;\n              `};\n            `};\n      }\n\n      ${Checkbox} {\n        width: ${consts[$size].width}px;\n        height: ${consts[$size].height}px;\n      }\n\n      ${CheckboxIcon} {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        min-width: ${consts[$size].width}px;\n        width: ${consts[$size].width}px;\n        height: ${consts[$size].height}px;\n        ${InputUtils.getInputBorderStyles($size, $invalid ? 'invalid' : 'normal', false, consts[$size].borderRadius)};\n        transition:\n          background-color 200ms,\n          border 200ms,\n          color 200ms;\n\n        ${getStyles()};\n\n        ${CheckboxIcon} {\n          svg {\n            transition:\n              opacity 200ms,\n              transform 200ms;\n          }\n        }\n\n        ${($indeterminate ?? $checked) &&\n        css`\n          svg {\n            display: inline-flex;\n          }\n        `}\n      }\n\n      ${!$disabled &&\n      css`\n        &:hover {\n          ${CheckboxIcon} {\n            ${getStyles(FabricsVariables.States.Hover)};\n            svg {\n              opacity: 1;\n            }\n          }\n        }\n\n        &:active {\n          ${CheckboxIcon} {\n            ${getStyles(FabricsVariables.States.Press)};\n            svg {\n              opacity: 1;\n              transform: scale(0.85);\n            }\n          }\n        }\n      `};\n\n      ${Checkbox}[aria-checked=\"mixed\"] ~ ${CheckboxIcon},\n      ${Checkbox}:checked ~ ${CheckboxIcon} {\n        ${getStyles(FabricsVariables.States.Resting, true)};\n        ${InputUtils.getInputBorderStyles($size, $invalid ? 'invalid' : 'normal', false, consts[$size].borderRadius)};\n        svg {\n          opacity: 1;\n          display: inline-flex;\n        }\n\n        &:hover {\n          ${getStyles(FabricsVariables.States.Hover, true)};\n        }\n\n        &:active {\n          ${getStyles(FabricsVariables.States.Press, true)};\n        }\n      }\n\n      ${Checkbox}:focus-visible ~ ${CheckboxIcon} {\n        ${getFocusStyles(theme)};\n      }\n    `;\n  }}\n`;\n\nexport { CheckboxWrapper, Checkbox, CheckboxIcon, CheckboxLabel };\n"],"names":["consts","CheckboxConsts","CheckboxIcon","styled","Checkbox","CheckboxLabel","$size","theme","getLabelTypographySize","CheckboxWrapper","$checked","$disabled","$invalid","$indeterminate","$mirrored","$multiline","getStyles","state","FabricsVariables","checked","CheckboxUtils.getStyles","css","getLabelFontStyles","Sizes","InputUtils.getInputBorderStyles","getFocusStyles"],"mappings":"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"}

package/build/cjs/components/DateInput/DateInput.js

@@ -1,2 +1,2 @@
-"use strict";const r=require("react/jsx-runtime"),E=require("react"),S=require("classnames"),$=require("../../react-base/src/consts/index.js"),q=require("./DateInput.styles.js"),_=require("./components/DateInputField/DateInputField.js"),t=require("../../react-base/src/consts/classes.js"),x=E.forwardRef(({className:c,id:a=t.DATE_PICKER_CLASS,size:n=`${$.Sizes.Medium}`,invalid:e,disabled:o,day:I,month:D,year:p,...T},A)=>{const u=s=>({...(s==null?void 0:s.value)&&{value:s.value},...(s==null?void 0:s.onChange)&&{onChange:s.onChange},...(o||(s==null?void 0:s.disabled))&&{disabled:o||(s==null?void 0:s.disabled)},...(e||(s==null?void 0:s.invalid))&&{invalid:e||(s==null?void 0:s.invalid)}});return r.jsxs(q.DateInputWrapper,{ref:A,id:a,className:S(c,t.DATE_PICKER_CLASS),$size:n,...T,children:[r.jsx(_,{size:n,id:`${a}-${t.DATE_INPUT_DAY_ID_SUFFIX}`,dateType:"Day",...u(I)}),r.jsx(_,{size:n,id:`${a}-${t.DATE_INPUT_MONTH_ID_SUFFIX}`,dateType:"Month",...u(D)}),r.jsx(_,{size:n,id:`${a}-${t.DATE_INPUT_YEAR_ID_SUFFIX}`,dateType:"Year",...u(p)})]})});module.exports=x;
+"use strict";const n=require("react/jsx-runtime"),A=require("react"),E=require("classnames"),S=require("../../react-base/src/consts/index.js"),$=require("./DateInput.styles.js"),u=require("./components/DateInputField/DateInputField.js"),s=require("../../react-base/src/consts/classes.js"),d=A.forwardRef(({className:c,id:t=s.DATE_PICKER_CLASS,size:a=`${S.Sizes.Medium}`,invalid:_,disabled:o,day:I,month:D,year:p,...T},i)=>{const r=e=>({...e?.value&&{value:e.value},...e?.onChange&&{onChange:e.onChange},...(o||e?.disabled)&&{disabled:o||e?.disabled},...(_||e?.invalid)&&{invalid:_||e?.invalid}});return n.jsxs($.DateInputWrapper,{ref:i,id:t,className:E(c,s.DATE_PICKER_CLASS),$size:a,...T,children:[n.jsx(u,{size:a,id:`${t}-${s.DATE_INPUT_DAY_ID_SUFFIX}`,dateType:"Day",...r(I)}),n.jsx(u,{size:a,id:`${t}-${s.DATE_INPUT_MONTH_ID_SUFFIX}`,dateType:"Month",...r(D)}),n.jsx(u,{size:a,id:`${t}-${s.DATE_INPUT_YEAR_ID_SUFFIX}`,dateType:"Year",...r(p)})]})});module.exports=d;
 //# sourceMappingURL=DateInput.js.map

package/build/cjs/components/DateInput/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport {\n  Sizes,\n  DATE_PICKER_CLASS,\n  DATE_INPUT_DAY_ID_SUFFIX,\n  DATE_INPUT_MONTH_ID_SUFFIX,\n  DATE_INPUT_YEAR_ID_SUFFIX,\n} from 'acinguiux-ds-react-base/consts';\n\nimport * as Styled from './DateInput.styles';\nimport DateInputField from './components/DateInputField/DateInputField';\nimport type { DateInputDateField, IDateInputProps } from './DateInput.types';\n\nconst DateInput = forwardRef(\n  (\n    {\n      className,\n      id = DATE_PICKER_CLASS,\n      size = `${Sizes.Medium}`,\n      invalid,\n      disabled,\n      day,\n      month,\n      year,\n      ...rest\n    }: IDateInputProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const props = (field?: DateInputDateField) => ({\n      ...(field?.value && { value: field.value }),\n      ...(field?.onChange && { onChange: field.onChange }),\n      ...((disabled || field?.disabled) && { disabled: disabled || field?.disabled }),\n      ...((invalid || field?.invalid) && { invalid: invalid || field?.invalid }),\n    });\n\n    return (\n      <Styled.DateInputWrapper\n        ref={ref}\n        id={id}\n        className={classNames(className, DATE_PICKER_CLASS)}\n        $size={size}\n        {...rest}\n      >\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_DAY_ID_SUFFIX}`} dateType=\"Day\" {...props(day)} />\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_MONTH_ID_SUFFIX}`} dateType=\"Month\" {...props(month)} />\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_YEAR_ID_SUFFIX}`} dateType=\"Year\" {...props(year)} />\n      </Styled.DateInputWrapper>\n    );\n  },\n);\n\nexport default DateInput;\n"],"names":["DateInput","forwardRef","className","id","DATE_PICKER_CLASS","size","Sizes","invalid","disabled","day","month","year","rest","ref","props","field","jsxs","Styled.DateInputWrapper","classNames","jsx","DateInputField","DATE_INPUT_DAY_ID_SUFFIX","DATE_INPUT_MONTH_ID_SUFFIX","DATE_INPUT_YEAR_ID_SUFFIX"],"mappings":"iSAeMA,EAAYC,EAAAA,WAChB,CACE,CACE,UAAAC,EACA,GAAAC,EAAKC,EAAAA,kBACL,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,QAAAC,EACA,SAAAC,EACA,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAASC,IAAgC,CAC7C,IAAIA,GAAA,YAAAA,EAAO,QAAS,CAAE,MAAOA,EAAM,KAAA,EACnC,IAAIA,GAAA,YAAAA,EAAO,WAAY,CAAE,SAAUA,EAAM,QAAA,EACzC,IAAKP,IAAYO,GAAA,YAAAA,EAAO,YAAa,CAAE,SAAUP,IAAYO,GAAA,YAAAA,EAAO,SAAA,EACpE,IAAKR,IAAWQ,GAAA,YAAAA,EAAO,WAAY,CAAE,QAASR,IAAWQ,GAAA,YAAAA,EAAO,QAAA,CAAQ,GAG1E,OACEC,EAAAA,KAACC,EAAAA,iBAAA,CACC,IAAAJ,EACA,GAAAV,EACA,UAAWe,EAAWhB,EAAWE,mBAAiB,EAClD,MAAOC,EACN,GAAGO,EAEJ,SAAA,CAAAO,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAIkB,EAAAA,wBAAwB,GAAI,SAAS,MAAO,GAAGP,EAAML,CAAG,EAAG,EACpGU,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAImB,EAAAA,0BAA0B,GAAI,SAAS,QAAS,GAAGR,EAAMJ,CAAK,EAAG,EAC1GS,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAIoB,EAAAA,yBAAyB,GAAI,SAAS,OAAQ,GAAGT,EAAMH,CAAI,CAAA,CAAG,CAAA,CAAA,CAAA,CAG7G,CACF"}
+{"version":3,"file":"DateInput.js","sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef } from 'react';\n\nimport classNames from 'classnames';\nimport {\n  Sizes,\n  DATE_PICKER_CLASS,\n  DATE_INPUT_DAY_ID_SUFFIX,\n  DATE_INPUT_MONTH_ID_SUFFIX,\n  DATE_INPUT_YEAR_ID_SUFFIX,\n} from 'acinguiux-ds-react-base/consts';\n\nimport * as Styled from './DateInput.styles';\nimport DateInputField from './components/DateInputField/DateInputField';\nimport type { DateInputDateField, IDateInputProps } from './DateInput.types';\n\nconst DateInput = forwardRef(\n  (\n    {\n      className,\n      id = DATE_PICKER_CLASS,\n      size = `${Sizes.Medium}`,\n      invalid,\n      disabled,\n      day,\n      month,\n      year,\n      ...rest\n    }: IDateInputProps,\n    ref: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const props = (field?: DateInputDateField) => ({\n      ...(field?.value && { value: field.value }),\n      ...(field?.onChange && { onChange: field.onChange }),\n      ...((disabled || field?.disabled) && { disabled: disabled || field?.disabled }),\n      ...((invalid || field?.invalid) && { invalid: invalid || field?.invalid }),\n    });\n\n    return (\n      <Styled.DateInputWrapper\n        ref={ref}\n        id={id}\n        className={classNames(className, DATE_PICKER_CLASS)}\n        $size={size}\n        {...rest}\n      >\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_DAY_ID_SUFFIX}`} dateType=\"Day\" {...props(day)} />\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_MONTH_ID_SUFFIX}`} dateType=\"Month\" {...props(month)} />\n        <DateInputField size={size} id={`${id}-${DATE_INPUT_YEAR_ID_SUFFIX}`} dateType=\"Year\" {...props(year)} />\n      </Styled.DateInputWrapper>\n    );\n  },\n);\n\nexport default DateInput;\n"],"names":["DateInput","forwardRef","className","id","DATE_PICKER_CLASS","size","Sizes","invalid","disabled","day","month","year","rest","ref","props","field","jsxs","Styled.DateInputWrapper","classNames","jsx","DateInputField","DATE_INPUT_DAY_ID_SUFFIX","DATE_INPUT_MONTH_ID_SUFFIX","DATE_INPUT_YEAR_ID_SUFFIX"],"mappings":"iSAeMA,EAAYC,EAAAA,WAChB,CACE,CACE,UAAAC,EACA,GAAAC,EAAKC,EAAAA,kBACL,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,QAAAC,EACA,SAAAC,EACA,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAASC,IAAgC,CAC7C,GAAIA,GAAO,OAAS,CAAE,MAAOA,EAAM,KAAA,EACnC,GAAIA,GAAO,UAAY,CAAE,SAAUA,EAAM,QAAA,EACzC,IAAKP,GAAYO,GAAO,WAAa,CAAE,SAAUP,GAAYO,GAAO,QAAA,EACpE,IAAKR,GAAWQ,GAAO,UAAY,CAAE,QAASR,GAAWQ,GAAO,OAAA,CAAQ,GAG1E,OACEC,EAAAA,KAACC,EAAAA,iBAAA,CACC,IAAAJ,EACA,GAAAV,EACA,UAAWe,EAAWhB,EAAWE,mBAAiB,EAClD,MAAOC,EACN,GAAGO,EAEJ,SAAA,CAAAO,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAIkB,EAAAA,wBAAwB,GAAI,SAAS,MAAO,GAAGP,EAAML,CAAG,EAAG,EACpGU,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAImB,EAAAA,0BAA0B,GAAI,SAAS,QAAS,GAAGR,EAAMJ,CAAK,EAAG,EAC1GS,EAAAA,IAACC,EAAA,CAAe,KAAAf,EAAY,GAAI,GAAGF,CAAE,IAAIoB,EAAAA,yBAAyB,GAAI,SAAS,OAAQ,GAAGT,EAAMH,CAAI,CAAA,CAAG,CAAA,CAAA,CAAA,CAG7G,CACF"}

package/build/cjs/components/DatePicker/components/Calendar/Calendar.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("react/jsx-runtime"),d=require("react"),o=require("../../../Flexbox/Flexbox.js"),b=require("../../../Button/Button.js"),g=require("./Calendar.styles.js"),k=({variant:s="single",size:a="medium",picker:i="day",selected:x,onSelect:n,month:y,footer:c,onMonthChange:r,showToday:D=!0,...m})=>{const[f,h]=d.useState(y??new Date),[j,p]=d.useState(x);if(i!=="day")return null;const l=e=>{h(e),r==null||r(e)},u=(e,q,C,O)=>{n==null||n(e,q,C,O),p(e)},w=e=>{u(new Date,new Date,{},e),l(new Date)};return t.jsx(o,{flexDirection:"column",gap:"16px",alignItems:"flex-start",children:t.jsx(g.CalendarStyled,{$size:a,mode:s,month:f,onMonthChange:l,selected:j,onSelect:u,captionLayout:"dropdown",showOutsideDays:!0,footer:s==="single"&&D?t.jsxs(o,{flexDirection:"row",justifyContent:"space-between",children:[t.jsx(b,{size:a,onClick:w,children:"Today"}),c]}):c,...s==="range"?{numberOfMonths:2}:{},...m})})};module.exports=k;
+"use strict";const n=require("react/jsx-runtime"),y=require("react"),C=require("date-fns"),j=require("../../../Flexbox/Flexbox.js"),I=require("../../../Button/Button.js"),T=require("./Calendar.styles.js"),$=({variant:s="single",size:f="medium",picker:q="day",selected:w,zIndex:O,onSelect:d,month:b,footer:l,onMonthChange:p,showToday:D=!0,...r})=>{const[M,k]=y.useState(b??new Date),[i,u]=y.useState(w);if(q!=="day")return null;const{bound:m}=r,c=o=>{k(o),p?.(o)},B=(o,e,t)=>{if(!(s!=="range"||o instanceof Date||e instanceof Date))return m==="end"?o?.from&&C.isBefore(t,o.from)?{from:t,to:o.from}:{from:o?.from,to:t}:m==="start"?o?.to&&C.isAfter(t,o.to)?{from:o?.to,to:t}:{from:t,to:o?.to}:!o?.from&&!o?.to||o?.from&&o?.to?{from:t}:e},a=(o,e,t,h)=>{if(o instanceof Date)u(o),d?.(o,e,t,h);else{const x=B(i,o,e);u(x),d?.(x,e,t,h)}},F=o=>{a(new Date,new Date,{},o),c(new Date)};return n.jsx(j,{flexDirection:"column",gap:"16px",alignItems:"flex-start",children:n.jsx(T.CalendarStyled,{$size:f,$zIndex:O,mode:s,month:M,onMonthChange:c,selected:i,onSelect:a,captionLayout:"dropdown",showOutsideDays:!0,footer:s==="single"&&D?n.jsxs(j,{flexDirection:"row",justifyContent:"space-between",children:[n.jsx(I,{size:f,onClick:F,children:"Today"}),l]}):l,...s==="range"?{numberOfMonths:2}:{},...r})})};module.exports=$;
 //# sourceMappingURL=Calendar.js.map

package/build/cjs/components/DatePicker/components/Calendar/Calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../../../../../../src/components/DatePicker/components/Calendar/Calendar.tsx"],"sourcesContent":["import { MouseEventHandler, useState } from 'react';\n\nimport {\n  DateRange,\n  OnSelectHandler,\n  PropsBase,\n  PropsRange,\n  PropsRangeRequired,\n  PropsSingle,\n  PropsSingleRequired,\n} from 'react-day-picker';\nimport { type DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport Flexbox from '../../../Flexbox/Flexbox';\nimport Button from '../../../Button/Button';\nimport { CalendarStyled } from './Calendar.styles';\n\ntype DayPickerPropsSingle = Omit<PropsSingle | PropsSingleRequired, 'mode'> & { variant: 'single' };\ntype DayPickerPropsRange = Omit<PropsRange | PropsRangeRequired, 'mode'> & { variant: 'range' };\n\nexport type DayPickerProps<T extends 'single' | 'range'> = PropsBase &\n  (DayPickerPropsSingle | DayPickerPropsRange) & {\n    variant: T;\n  };\n\n/**\n * Calendar component based on react-day-picker and originally implemented in geneva-component.\n * @param {DatePickerTypes.PickerType} picker right now, will only render for 'day'\n * @returns the Calendar component for selecting dates\n */\nconst Calendar = <T extends 'single' | 'range'>({\n  variant = 'single' as T,\n  size = 'medium',\n  picker = 'day',\n  selected,\n  onSelect,\n  month,\n  footer,\n  onMonthChange,\n  showToday = true,\n  ...props\n}: DatePickerTypes.ICalendarProps & DayPickerProps<T>) => {\n  const [currentMonth, setCurrentMonth] = useState(month ?? new Date());\n  const [selectedDate, setSelectedDate] = useState<typeof selected>(selected);\n  if (picker !== 'day') {\n    return null;\n  }\n\n  const handleOnMonthChange = (newMonth: Date) => {\n    setCurrentMonth(newMonth);\n    onMonthChange?.(newMonth);\n  };\n\n  const handleOnSelect: OnSelectHandler<typeof selected> = (newSelection, triggerDate, selectModifiers, e) => {\n    onSelect?.(newSelection as Date & DateRange, triggerDate, selectModifiers, e);\n    setSelectedDate(newSelection);\n  };\n\n  const handleOnTodayClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    handleOnSelect(new Date(), new Date(), {}, event);\n    handleOnMonthChange(new Date());\n  };\n\n  return (\n    <Flexbox flexDirection=\"column\" gap=\"16px\" alignItems=\"flex-start\">\n      <CalendarStyled\n        $size={size}\n        mode={variant}\n        month={currentMonth}\n        onMonthChange={handleOnMonthChange}\n        selected={selectedDate as Date & DateRange & Date[]}\n        onSelect={handleOnSelect as OnSelectHandler<unknown>}\n        captionLayout=\"dropdown\"\n        showOutsideDays={true}\n        footer={\n          variant === 'single' && showToday ? (\n            <Flexbox flexDirection=\"row\" justifyContent=\"space-between\">\n              <Button size={size} onClick={handleOnTodayClick}>\n                Today\n              </Button>\n              {footer}\n            </Flexbox>\n          ) : (\n            footer\n          )\n        }\n        {...(variant === 'range' ? { numberOfMonths: 2 } : {})}\n        {...props}\n      />\n    </Flexbox>\n  );\n};\n\nexport default Calendar;\n"],"names":["Calendar","variant","size","picker","selected","onSelect","month","footer","onMonthChange","showToday","props","currentMonth","setCurrentMonth","useState","selectedDate","setSelectedDate","handleOnMonthChange","newMonth","handleOnSelect","newSelection","triggerDate","selectModifiers","e","handleOnTodayClick","event","Flexbox","jsx","CalendarStyled","Button"],"mappings":"uLA8BMA,EAAW,CAA+B,CAC9C,QAAAC,EAAU,SACV,KAAAC,EAAO,SACP,OAAAC,EAAS,MACT,SAAAC,EACA,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,cAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,IAA0D,CACxD,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAAA,SAASP,GAAS,IAAI,IAAM,EAC9D,CAACQ,EAAcC,CAAe,EAAIF,EAAAA,SAA0BT,CAAQ,EAC1E,GAAID,IAAW,MACb,OAAO,KAGT,MAAMa,EAAuBC,GAAmB,CAC9CL,EAAgBK,CAAQ,EACxBT,GAAA,MAAAA,EAAgBS,EAClB,EAEMC,EAAmD,CAACC,EAAcC,EAAaC,EAAiBC,IAAM,CAC1GjB,GAAA,MAAAA,EAAWc,EAAkCC,EAAaC,EAAiBC,GAC3EP,EAAgBI,CAAY,CAC9B,EAEMI,EAA4DC,GAAU,CAC1EN,EAAe,IAAI,KAAQ,IAAI,KAAQ,CAAA,EAAIM,CAAK,EAChDR,EAAoB,IAAI,IAAM,CAChC,EAEA,aACGS,EAAA,CAAQ,cAAc,SAAS,IAAI,OAAO,WAAW,aACpD,SAAAC,EAAAA,IAACC,EAAAA,eAAA,CACC,MAAOzB,EACP,KAAMD,EACN,MAAOU,EACP,cAAeK,EACf,SAAUF,EACV,SAAUI,EACV,cAAc,WACd,gBAAiB,GACjB,OACEjB,IAAY,UAAYQ,SACrBgB,EAAA,CAAQ,cAAc,MAAM,eAAe,gBAC1C,SAAA,CAAAC,EAAAA,IAACE,EAAA,CAAO,KAAA1B,EAAY,QAASqB,EAAoB,SAAA,QAEjD,EACChB,CAAA,CAAA,CACH,EAEAA,EAGH,GAAIN,IAAY,QAAU,CAAE,eAAgB,CAAA,EAAM,CAAA,EAClD,GAAGS,CAAA,CAAA,EAER,CAEJ"}
+{"version":3,"file":"Calendar.js","sources":["../../../../../../src/components/DatePicker/components/Calendar/Calendar.tsx"],"sourcesContent":["import { MouseEventHandler, useState } from 'react';\n\nimport type { DateRange, OnSelectHandler } from 'react-day-picker';\nimport type { DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\nimport { isAfter, isBefore } from 'date-fns';\n\nimport Flexbox from '../../../Flexbox/Flexbox';\nimport Button from '../../../Button/Button';\nimport { CalendarStyled } from './Calendar.styles';\nimport type { ICalendarProps } from './Calendar.types';\n\n/**\n * Calendar component based on react-day-picker and originally implemented in geneva-component.\n * @param {DatePickerTypes.PickerType} picker right now, will only render for 'day'\n * @returns the Calendar component for selecting dates\n */\nconst Calendar = <T extends 'single' | 'range'>({\n  variant = 'single' as T,\n  size = 'medium',\n  picker = 'day',\n  selected,\n  zIndex,\n  onSelect,\n  month,\n  footer,\n  onMonthChange,\n  showToday = true,\n  ...props\n}: ICalendarProps<T>) => {\n  const [currentMonth, setCurrentMonth] = useState(month ?? new Date());\n  const [selectedDate, setSelectedDate] = useState<typeof selected>(selected);\n  if (picker !== 'day') {\n    return null;\n  }\n\n  const { bound } = props as DatePickerTypes.IRangeCalendarProps;\n\n  const handleOnMonthChange = (newMonth: Date) => {\n    setCurrentMonth(newMonth);\n    onMonthChange?.(newMonth);\n  };\n\n  const getNewRange = (\n    currentRange: Date | DateRange | undefined,\n    newSelection: Date | DateRange | undefined,\n    triggerDate: Date,\n  ) => {\n    if (variant !== 'range' || currentRange instanceof Date || newSelection instanceof Date) {\n      return undefined;\n    }\n\n    if (bound === 'end') {\n      if (currentRange?.from && isBefore(triggerDate, currentRange.from)) {\n        return { from: triggerDate, to: currentRange.from };\n      }\n      return { from: currentRange?.from, to: triggerDate };\n    }\n\n    if (bound === 'start') {\n      if (currentRange?.to && isAfter(triggerDate, currentRange.to)) {\n        return { from: currentRange?.to, to: triggerDate };\n      }\n      return { from: triggerDate, to: currentRange?.to };\n    }\n\n    if ((!currentRange?.from && !currentRange?.to) || (currentRange?.from && currentRange?.to)) {\n      return { from: triggerDate };\n    }\n\n    return newSelection;\n  };\n\n  const handleOnSelect: OnSelectHandler<typeof selected> = (newSelection, triggerDate, selectModifiers, e) => {\n    if (newSelection instanceof Date) {\n      setSelectedDate(newSelection);\n      onSelect?.(newSelection as Date & DateRange, triggerDate, selectModifiers, e);\n    } else {\n      const newRange = getNewRange(selectedDate, newSelection, triggerDate);\n      setSelectedDate(newRange);\n      onSelect?.(newRange as Date & DateRange, triggerDate, selectModifiers, e);\n    }\n  };\n\n  const handleOnTodayClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    handleOnSelect(new Date(), new Date(), {}, event);\n    handleOnMonthChange(new Date());\n  };\n\n  return (\n    <Flexbox flexDirection=\"column\" gap=\"16px\" alignItems=\"flex-start\">\n      <CalendarStyled\n        $size={size}\n        $zIndex={zIndex}\n        mode={variant}\n        month={currentMonth}\n        onMonthChange={handleOnMonthChange}\n        selected={selectedDate as Date & DateRange & Date[]}\n        onSelect={handleOnSelect as OnSelectHandler<unknown>}\n        captionLayout=\"dropdown\"\n        showOutsideDays={true}\n        footer={\n          variant === 'single' && showToday ? (\n            <Flexbox flexDirection=\"row\" justifyContent=\"space-between\">\n              <Button size={size} onClick={handleOnTodayClick}>\n                Today\n              </Button>\n              {footer}\n            </Flexbox>\n          ) : (\n            footer\n          )\n        }\n        {...(variant === 'range' ? { numberOfMonths: 2 } : {})}\n        {...props}\n      />\n    </Flexbox>\n  );\n};\n\nexport default Calendar;\n"],"names":["Calendar","variant","size","picker","selected","zIndex","onSelect","month","footer","onMonthChange","showToday","props","currentMonth","setCurrentMonth","useState","selectedDate","setSelectedDate","bound","handleOnMonthChange","newMonth","getNewRange","currentRange","newSelection","triggerDate","isBefore","isAfter","handleOnSelect","selectModifiers","e","newRange","handleOnTodayClick","event","Flexbox","jsx","CalendarStyled","Button"],"mappings":"6MAgBMA,EAAW,CAA+B,CAC9C,QAAAC,EAAU,SACV,KAAAC,EAAO,SACP,OAAAC,EAAS,MACT,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,cAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,IAAyB,CACvB,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAAAA,SAASP,GAAS,IAAI,IAAM,EAC9D,CAACQ,EAAcC,CAAe,EAAIF,EAAAA,SAA0BV,CAAQ,EAC1E,GAAID,IAAW,MACb,OAAO,KAGT,KAAM,CAAE,MAAAc,GAAUN,EAEZO,EAAuBC,GAAmB,CAC9CN,EAAgBM,CAAQ,EACxBV,IAAgBU,CAAQ,CAC1B,EAEMC,EAAc,CAClBC,EACAC,EACAC,IACG,CACH,GAAI,EAAAtB,IAAY,SAAWoB,aAAwB,MAAQC,aAAwB,MAInF,OAAIL,IAAU,MACRI,GAAc,MAAQG,EAAAA,SAASD,EAAaF,EAAa,IAAI,EACxD,CAAE,KAAME,EAAa,GAAIF,EAAa,IAAA,EAExC,CAAE,KAAMA,GAAc,KAAM,GAAIE,CAAA,EAGrCN,IAAU,QACRI,GAAc,IAAMI,EAAAA,QAAQF,EAAaF,EAAa,EAAE,EACnD,CAAE,KAAMA,GAAc,GAAI,GAAIE,CAAA,EAEhC,CAAE,KAAMA,EAAa,GAAIF,GAAc,EAAA,EAG3C,CAACA,GAAc,MAAQ,CAACA,GAAc,IAAQA,GAAc,MAAQA,GAAc,GAC9E,CAAE,KAAME,CAAA,EAGVD,CACT,EAEMI,EAAmD,CAACJ,EAAcC,EAAaI,EAAiBC,IAAM,CAC1G,GAAIN,aAAwB,KAC1BN,EAAgBM,CAAY,EAC5BhB,IAAWgB,EAAkCC,EAAaI,EAAiBC,CAAC,MACvE,CACL,MAAMC,EAAWT,EAAYL,EAAcO,EAAcC,CAAW,EACpEP,EAAgBa,CAAQ,EACxBvB,IAAWuB,EAA8BN,EAAaI,EAAiBC,CAAC,CAC1E,CACF,EAEME,EAA4DC,GAAU,CAC1EL,EAAe,IAAI,KAAQ,IAAI,KAAQ,CAAA,EAAIK,CAAK,EAChDb,EAAoB,IAAI,IAAM,CAChC,EAEA,aACGc,EAAA,CAAQ,cAAc,SAAS,IAAI,OAAO,WAAW,aACpD,SAAAC,EAAAA,IAACC,EAAAA,eAAA,CACC,MAAOhC,EACP,QAASG,EACT,KAAMJ,EACN,MAAOW,EACP,cAAeM,EACf,SAAUH,EACV,SAAUW,EACV,cAAc,WACd,gBAAiB,GACjB,OACEzB,IAAY,UAAYS,SACrBsB,EAAA,CAAQ,cAAc,MAAM,eAAe,gBAC1C,SAAA,CAAAC,EAAAA,IAACE,EAAA,CAAO,KAAAjC,EAAY,QAAS4B,EAAoB,SAAA,QAEjD,EACCtB,CAAA,CAAA,CACH,EAEAA,EAGH,GAAIP,IAAY,QAAU,CAAE,eAAgB,CAAA,EAAM,CAAA,EAClD,GAAGU,CAAA,CAAA,EAER,CAEJ"}

package/build/cjs/components/DatePicker/components/Calendar/Calendar.styles.js

@@ -1,16 +1,16 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("../../../../react-base/src/components/DatePicker/DatePicker.consts.js"),r=require("../../../../react-base/src/theme/types/layer.js"),a=require("../../../../react-base/src/utils/sizesUtils.js"),n=require("../../../../react-base/src/utils/stylesUtils.js"),u=require("react-day-picker"),p=require("styled-components"),g=p.styled(u.DayPicker)(({theme:t,$size:e})=>{const o=t.layer(),i=t.layer({foundation:"section"}),c=t.layer({foundation:"section",disabled:!0}),s=t.layer({selectedProminence:"subtle"}),l=t.layer({state:"hover"});return p.css`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../../../../react-base/src/components/DatePicker/DatePicker.consts.js"),g=require("../../../../react-base/src/consts/index.js"),r=require("../../../../react-base/src/theme/types/layer.js"),a=require("../../../../react-base/src/utils/sizesUtils.js"),n=require("../../../../react-base/src/utils/stylesUtils.js"),b=require("react-day-picker"),l=require("styled-components"),y=l.styled(b.DayPicker)(({theme:d,$size:e,$zIndex:c})=>{const o=d.layer(),i=d.layer({foundation:"section"}),u=d.layer({foundation:"section",disabled:!0}),s=d.layer({selectedProminence:"subtle"}),p=d.layer({state:"hover"});return l.css`
     /* stylelint-disable custom-property-pattern */
-    --rdp-day-height: ${d.consts[e].boxSize}px;
-    --rdp-day-width: ${d.consts[e].boxSize}px;
+    --rdp-day-height: ${t.consts[e].boxSize}px;
+    --rdp-day-width: ${t.consts[e].boxSize}px;
     --rdp-border-radius: 8px;
     --rdp-day_button-height: var(--rdp-day-width);
     --rdp-day_button-width: var(--rdp-day-height);
     --rdp-selected-border: ${o[r.Variables.BackgroundSelected]};
-    --rdp-months-gap: ${d.consts[e].panelGap}px;
+    --rdp-months-gap: ${t.consts[e].panelGap}px;
     --rdp-nav_button-disabled-opacity: 0.5;
-    --rdp-nav_button-height: ${d.consts[e].height}px;
-    --rdp-nav_button-width: ${d.consts[e].boxSize}px;
-    --rdp-nav-height: ${d.consts[e].height}px;
+    --rdp-nav_button-height: ${t.consts[e].height}px;
+    --rdp-nav_button-width: ${t.consts[e].boxSize}px;
+    --rdp-nav-height: ${t.consts[e].height}px;
     --rdp-range_middle-background-color: ${s[r.Variables.BackgroundSelected]};
     --rdp-range_middle-color: ${s[r.Variables.TextOnSelectedBackgroundStrong]};
     --rdp-range_start-color: ${o[r.Variables.TextOnSelectedBackgroundStrong]};
@@ -34,7 +34,7 @@
     }
 
     .rdp-day {
-      ${t.typography("label",a.getLabelTypographySize(e))};
+      ${d.typography("label",a.getLabelTypographySize(e))};
       width: var(--rdp-day-width);
       height: var(--rdp-day-height);
       text-align: center;
@@ -91,19 +91,19 @@
       }
 
       &:hover {
-        background-color: ${l[r.Variables.BackgroundFoundation]};
+        background-color: ${p[r.Variables.BackgroundFoundation]};
       }
 
       &:focus-visible {
-        ${n.getFocusStyles(t)};
+        ${n.getFocusStyles(d)};
       }
     }
 
     .rdp-chevron {
       display: inline-block;
       fill: ${o[r.Variables.TextOnFoundationStrong]};
-      width: ${d.consts[e].chevronSize}px;
-      height: ${d.consts[e].chevronSize}px;
+      width: ${t.consts[e].chevronSize}px;
+      height: ${t.consts[e].chevronSize}px;
     }
 
     .rdp-dropdowns {
@@ -113,7 +113,7 @@
     }
 
     .rdp-dropdown {
-      z-index: 2;
+      z-index: ${c??g.ZIndexes.DATE_PICKER};
       opacity: 0;
       appearance: none;
       position: absolute;
@@ -127,7 +127,7 @@
       line-height: inherit;
 
       &:focus-visible {
-        ${n.getFocusStyles(t)};
+        ${n.getFocusStyles(d)};
       }
     }
 
@@ -140,11 +140,11 @@
       border-radius: var(--rdp-border-radius);
 
       &:hover {
-        background-color: ${l[r.Variables.BackgroundFoundation]};
+        background-color: ${p[r.Variables.BackgroundFoundation]};
       }
 
       &:has(:focus-visible) {
-        ${n.getFocusStyles(t)};
+        ${n.getFocusStyles(d)};
       }
 
       .rdp-chevron {
@@ -153,7 +153,7 @@
     }
 
     .rdp-month_caption {
-      ${t.typography("heading",a.getHeadingTypographySize(a.getSmallerSize(e)))};
+      ${d.typography("heading",a.getHeadingTypographySize(a.getSmallerSize(e)))};
       display: flex;
       place-content: center center;
       height: var(--rdp-nav-height);
@@ -187,7 +187,7 @@
     }
 
     .rdp-weekday {
-      ${t.typography("label",a.getLabelTypographySize(e))};
+      ${d.typography("label",a.getLabelTypographySize(e))};
       padding: var(--rdp-weekday-padding);
       text-align: var(--rdp-weekday-text-align);
       text-transform: var(--rdp-weekday-text-transform);
@@ -199,9 +199,9 @@
       &::before {
         content: '';
         position: absolute;
-        bottom: ${d.selectedDateUnderline[e].bottom}px;
-        height: ${d.selectedDateUnderline[e].height}px;
-        width: ${d.selectedDateUnderline[e].width}px;
+        bottom: ${t.selectedDateUnderline[e].bottom}px;
+        height: ${t.selectedDateUnderline[e].height}px;
+        width: ${t.selectedDateUnderline[e].width}px;
         left: 50%;
         transform: translateX(-50%);
         border-radius: var(--rdp-border-radius);
@@ -217,7 +217,7 @@
       display: flex;
       flex-direction: column;
       align-items: flex-start;
-      gap: ${d.consts[e].panelPadding}px;
+      gap: ${t.consts[e].panelPadding}px;
     }
 
     .rdp-outside {
@@ -264,7 +264,7 @@
     }
 
     .rdp-disabled {
-      color: ${c[r.Variables.TextOnFoundationSubtle]};
+      color: ${u[r.Variables.TextOnFoundationSubtle]};
       text-decoration: line-through;
     }
 
@@ -296,13 +296,20 @@
     }
 
     .rdp-day_button:focus-visible {
-      ${n.getFocusStyles(t)};
+      ${n.getFocusStyles(d)};
     }
 
-    &[data-mode='single'] .rdp-selected > button {
+    &[data-mode='single'] .rdp-selected > button,
+    &[data-mode='range']
+      .rdp-selected[aria-selected='true'][data-selected='true']:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end)
+      > button,
+    &[data-mode='range']
+      .rdp-focused[data-focused='true']:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end)
+      > button,
+    &[data-mode='range'] .rdp-selected.rdp-focused:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end) > button {
       border-radius: var(--rdp-border-radius);
       background-color: ${o[r.Variables.BackgroundSelected]};
       color: ${o[r.Variables.TextOnSelectedBackgroundStrong]};
     }
-  `});exports.CalendarStyled=g;
+  `});exports.CalendarStyled=y;
 //# sourceMappingURL=Calendar.styles.js.map

package/build/cjs/components/DatePicker/components/Calendar/Calendar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.styles.js","sources":["../../../../../../src/components/DatePicker/components/Calendar/Calendar.styles.ts"],"sourcesContent":["import { DatePickerConsts, type DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport {\n  getFocusStyles,\n  getHeadingTypographySize,\n  getLabelTypographySize,\n  getSmallerSize,\n} from 'acinguiux-ds-react-base/utils';\nimport { DayPicker } from 'react-day-picker';\nimport { styled, css } from 'styled-components';\n\nexport const CalendarStyled = styled(DayPicker)<{ $size: DatePickerTypes.CalendarSize }>(({ theme, $size }) => {\n  const strongLayer = theme.layer();\n  const sectionLayer = theme.layer({ foundation: 'section' });\n  const disabledLayer = theme.layer({ foundation: 'section', disabled: true });\n  const subtleLayer = theme.layer({ selectedProminence: 'subtle' });\n  const hoverLayer = theme.layer({ state: 'hover' });\n\n  return css`\n    /* stylelint-disable custom-property-pattern */\n    --rdp-day-height: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-day-width: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-border-radius: 8px;\n    --rdp-day_button-height: var(--rdp-day-width);\n    --rdp-day_button-width: var(--rdp-day-height);\n    --rdp-selected-border: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-months-gap: ${DatePickerConsts.consts[$size].panelGap}px;\n    --rdp-nav_button-disabled-opacity: 0.5;\n    --rdp-nav_button-height: ${DatePickerConsts.consts[$size].height}px;\n    --rdp-nav_button-width: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-nav-height: ${DatePickerConsts.consts[$size].height}px;\n    --rdp-range_middle-background-color: ${subtleLayer[Variables.BackgroundSelected]};\n    --rdp-range_middle-color: ${subtleLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_start-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_start-date-background-color: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-range_end-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_end-date-background-color: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-weekday-padding: 0;\n    --rdp-weekday-text-align: center;\n\n    position: relative;\n    box-sizing: border-box;\n\n    button {\n      border: none;\n      background: none;\n      padding: 0;\n      margin: 0;\n      cursor: pointer;\n      font: inherit;\n      color: inherit;\n    }\n\n    .rdp-day {\n      ${theme.typography('label', getLabelTypographySize($size))};\n      width: var(--rdp-day-width);\n      height: var(--rdp-day-height);\n      text-align: center;\n      padding: 0;\n    }\n\n    .rdp-day_button {\n      justify-content: center;\n      align-items: center;\n      display: flex;\n\n      width: var(--rdp-day_button-width);\n      height: var(--rdp-day_button-height);\n      border-radius: var(--rdp-border-radius);\n\n      &:disabled {\n        cursor: revert;\n      }\n\n      .rdp-caption_label {\n        z-index: 1;\n\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n\n        white-space: nowrap;\n        border: 0;\n      }\n    }\n\n    .rdp-button_next,\n    .rdp-button_previous {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      margin: 0;\n      padding: 0;\n      position: relative;\n      font: inherit;\n      appearance: none;\n      background: none;\n      border: 0;\n      border-radius: var(--rdp-border-radius);\n      color: inherit;\n      cursor: pointer;\n\n      width: var(--rdp-nav_button-width);\n      height: var(--rdp-nav_button-height);\n\n      &:disabled {\n        cursor: revert;\n        opacity: var(--rdp-nav_button-disabled-opacity);\n      }\n\n      &:hover {\n        background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n      }\n\n      &:focus-visible {\n        ${getFocusStyles(theme)};\n      }\n    }\n\n    .rdp-chevron {\n      display: inline-block;\n      fill: ${strongLayer[Variables.TextOnFoundationStrong]};\n      width: ${DatePickerConsts.consts[$size].chevronSize}px;\n      height: ${DatePickerConsts.consts[$size].chevronSize}px;\n    }\n\n    .rdp-dropdowns {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n    }\n\n    .rdp-dropdown {\n      z-index: 2;\n      opacity: 0;\n      appearance: none;\n      position: absolute;\n      inset-block: 0 0;\n      inset-inline-start: 0;\n      width: 100%;\n      margin: 0;\n      padding: 0;\n      cursor: inherit;\n      border: none;\n      line-height: inherit;\n\n      &:focus-visible {\n        ${getFocusStyles(theme)};\n      }\n    }\n\n    .rdp-dropdown_root {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      color: ${strongLayer[Variables.TextOnFoundationStrong]};\n      padding: 6px;\n      border-radius: var(--rdp-border-radius);\n\n      &:hover {\n        background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n      }\n\n      &:has(:focus-visible) {\n        ${getFocusStyles(theme)};\n      }\n\n      .rdp-chevron {\n        display: none;\n      }\n    }\n\n    .rdp-month_caption {\n      ${theme.typography('heading', getHeadingTypographySize(getSmallerSize($size)))};\n      display: flex;\n      place-content: center center;\n      height: var(--rdp-nav-height);\n    }\n\n    .rdp-months {\n      position: relative;\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--rdp-months-gap);\n      max-width: fit-content;\n    }\n\n    .rdp-month_grid {\n      border-spacing: 0 2px;\n      border-collapse: separate;\n      padding-top: 0.5rem;\n    }\n\n    .rdp-nav {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-end: 0;\n\n      display: flex;\n      align-items: center;\n      left: 0;\n      justify-content: space-between;\n\n      height: var(--rdp-nav-height);\n    }\n\n    .rdp-weekday {\n      ${theme.typography('label', getLabelTypographySize($size))};\n      padding: var(--rdp-weekday-padding);\n      text-align: var(--rdp-weekday-text-align);\n      text-transform: var(--rdp-weekday-text-transform);\n    }\n\n    .rdp-today:not(.rdp-outside) {\n      position: relative;\n\n      &::before {\n        content: '';\n        position: absolute;\n        bottom: ${DatePickerConsts.selectedDateUnderline[$size].bottom}px;\n        height: ${DatePickerConsts.selectedDateUnderline[$size].height}px;\n        width: ${DatePickerConsts.selectedDateUnderline[$size].width}px;\n        left: 50%;\n        transform: translateX(-50%);\n        border-radius: var(--rdp-border-radius);\n        background-color: var(--rdp-selected-border);\n      }\n\n      &.rdp-selected::before {\n        background-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n      }\n    }\n\n    &.rdp-root {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      gap: ${DatePickerConsts.consts[$size].panelPadding}px;\n    }\n\n    .rdp-outside {\n      color: ${sectionLayer[Variables.TextOnFoundationStrong]};\n      background-color: ${sectionLayer[Variables.BackgroundFoundation]};\n    }\n\n    .rdp-outside:last-of-type,\n    .rdp-outside:not(.rdp-outside:has(+ .rdp-day.rdp-outside)) {\n      border-top-right-radius: var(--rdp-border-radius);\n      border-bottom-right-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-day:not(.rdp-outside) + .rdp-outside,\n    .rdp-outside:first-of-type {\n      border-top-left-radius: var(--rdp-border-radius);\n      border-bottom-left-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-hidden {\n      visibility: hidden;\n      color: var(--rdp-range_start-color);\n    }\n\n    .rdp-range_start .rdp-day_button {\n      background-color: var(--rdp-range_start-date-background-color);\n      color: var(--rdp-range_start-color);\n      border-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-range_middle:not(.rdp-outside) {\n      background-color: var(--rdp-range_middle-background-color);\n    }\n\n    .rdp-range_middle .rdp-day_button {\n      border: unset;\n      border-radius: unset;\n      color: var(--rdp-range_middle-color);\n      background-color: transparent;\n    }\n\n    .rdp-range_end {\n      color: var(--rdp-range_end-color);\n    }\n\n    .rdp-disabled {\n      color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n      text-decoration: line-through;\n    }\n\n    .rdp-range_end .rdp-day_button {\n      color: var(--rdp-range_start-color);\n      background-color: var(--rdp-range_end-date-background-color);\n    }\n\n    .rdp-range_start.rdp-range_end {\n      background: revert;\n    }\n\n    .rdp-focusable {\n      cursor: pointer;\n    }\n\n    .rdp-weekdays {\n      color: ${strongLayer[Variables.TextOnFoundationSubtle]};\n    }\n\n    .rdp-range_start:not(.rdp-range_end) > button {\n      border-top-right-radius: unset;\n      border-bottom-right-radius: unset;\n    }\n\n    .rdp-range_end:not(.rdp-range_start) > button {\n      border-top-left-radius: unset;\n      border-bottom-left-radius: unset;\n    }\n\n    .rdp-day_button:focus-visible {\n      ${getFocusStyles(theme)};\n    }\n\n    &[data-mode='single'] .rdp-selected > button {\n      border-radius: var(--rdp-border-radius);\n      background-color: ${strongLayer[Variables.BackgroundSelected]};\n      color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    }\n  `;\n});\n"],"names":["CalendarStyled","styled","DayPicker","theme","$size","strongLayer","sectionLayer","disabledLayer","subtleLayer","hoverLayer","css","DatePickerConsts.consts","Variables","getLabelTypographySize","getFocusStyles","getHeadingTypographySize","getSmallerSize","DatePickerConsts.selectedDateUnderline"],"mappings":"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"}
+{"version":3,"file":"Calendar.styles.js","sources":["../../../../../../src/components/DatePicker/components/Calendar/Calendar.styles.ts"],"sourcesContent":["import { DatePickerConsts, type DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\nimport { ZIndexes } from 'acinguiux-ds-react-base/consts';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport {\n  getFocusStyles,\n  getHeadingTypographySize,\n  getLabelTypographySize,\n  getSmallerSize,\n} from 'acinguiux-ds-react-base/utils';\nimport { DayPicker } from 'react-day-picker';\nimport { styled, css } from 'styled-components';\n\nexport interface CalendarStyledProps {\n  $size: DatePickerTypes.CalendarSize;\n  $zIndex?: number;\n}\n\nexport const CalendarStyled = styled(DayPicker)<CalendarStyledProps>(({ theme, $size, $zIndex }) => {\n  const strongLayer = theme.layer();\n  const sectionLayer = theme.layer({ foundation: 'section' });\n  const disabledLayer = theme.layer({ foundation: 'section', disabled: true });\n  const subtleLayer = theme.layer({ selectedProminence: 'subtle' });\n  const hoverLayer = theme.layer({ state: 'hover' });\n\n  return css`\n    /* stylelint-disable custom-property-pattern */\n    --rdp-day-height: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-day-width: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-border-radius: 8px;\n    --rdp-day_button-height: var(--rdp-day-width);\n    --rdp-day_button-width: var(--rdp-day-height);\n    --rdp-selected-border: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-months-gap: ${DatePickerConsts.consts[$size].panelGap}px;\n    --rdp-nav_button-disabled-opacity: 0.5;\n    --rdp-nav_button-height: ${DatePickerConsts.consts[$size].height}px;\n    --rdp-nav_button-width: ${DatePickerConsts.consts[$size].boxSize}px;\n    --rdp-nav-height: ${DatePickerConsts.consts[$size].height}px;\n    --rdp-range_middle-background-color: ${subtleLayer[Variables.BackgroundSelected]};\n    --rdp-range_middle-color: ${subtleLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_start-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_start-date-background-color: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-range_end-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    --rdp-range_end-date-background-color: ${strongLayer[Variables.BackgroundSelected]};\n    --rdp-weekday-padding: 0;\n    --rdp-weekday-text-align: center;\n\n    position: relative;\n    box-sizing: border-box;\n\n    button {\n      border: none;\n      background: none;\n      padding: 0;\n      margin: 0;\n      cursor: pointer;\n      font: inherit;\n      color: inherit;\n    }\n\n    .rdp-day {\n      ${theme.typography('label', getLabelTypographySize($size))};\n      width: var(--rdp-day-width);\n      height: var(--rdp-day-height);\n      text-align: center;\n      padding: 0;\n    }\n\n    .rdp-day_button {\n      justify-content: center;\n      align-items: center;\n      display: flex;\n\n      width: var(--rdp-day_button-width);\n      height: var(--rdp-day_button-height);\n      border-radius: var(--rdp-border-radius);\n\n      &:disabled {\n        cursor: revert;\n      }\n\n      .rdp-caption_label {\n        z-index: 1;\n\n        position: relative;\n        display: inline-flex;\n        align-items: center;\n\n        white-space: nowrap;\n        border: 0;\n      }\n    }\n\n    .rdp-button_next,\n    .rdp-button_previous {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      margin: 0;\n      padding: 0;\n      position: relative;\n      font: inherit;\n      appearance: none;\n      background: none;\n      border: 0;\n      border-radius: var(--rdp-border-radius);\n      color: inherit;\n      cursor: pointer;\n\n      width: var(--rdp-nav_button-width);\n      height: var(--rdp-nav_button-height);\n\n      &:disabled {\n        cursor: revert;\n        opacity: var(--rdp-nav_button-disabled-opacity);\n      }\n\n      &:hover {\n        background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n      }\n\n      &:focus-visible {\n        ${getFocusStyles(theme)};\n      }\n    }\n\n    .rdp-chevron {\n      display: inline-block;\n      fill: ${strongLayer[Variables.TextOnFoundationStrong]};\n      width: ${DatePickerConsts.consts[$size].chevronSize}px;\n      height: ${DatePickerConsts.consts[$size].chevronSize}px;\n    }\n\n    .rdp-dropdowns {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n    }\n\n    .rdp-dropdown {\n      z-index: ${$zIndex ?? ZIndexes.DATE_PICKER};\n      opacity: 0;\n      appearance: none;\n      position: absolute;\n      inset-block: 0 0;\n      inset-inline-start: 0;\n      width: 100%;\n      margin: 0;\n      padding: 0;\n      cursor: inherit;\n      border: none;\n      line-height: inherit;\n\n      &:focus-visible {\n        ${getFocusStyles(theme)};\n      }\n    }\n\n    .rdp-dropdown_root {\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      color: ${strongLayer[Variables.TextOnFoundationStrong]};\n      padding: 6px;\n      border-radius: var(--rdp-border-radius);\n\n      &:hover {\n        background-color: ${hoverLayer[Variables.BackgroundFoundation]};\n      }\n\n      &:has(:focus-visible) {\n        ${getFocusStyles(theme)};\n      }\n\n      .rdp-chevron {\n        display: none;\n      }\n    }\n\n    .rdp-month_caption {\n      ${theme.typography('heading', getHeadingTypographySize(getSmallerSize($size)))};\n      display: flex;\n      place-content: center center;\n      height: var(--rdp-nav-height);\n    }\n\n    .rdp-months {\n      position: relative;\n      display: flex;\n      flex-wrap: wrap;\n      gap: var(--rdp-months-gap);\n      max-width: fit-content;\n    }\n\n    .rdp-month_grid {\n      border-spacing: 0 2px;\n      border-collapse: separate;\n      padding-top: 0.5rem;\n    }\n\n    .rdp-nav {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-end: 0;\n\n      display: flex;\n      align-items: center;\n      left: 0;\n      justify-content: space-between;\n\n      height: var(--rdp-nav-height);\n    }\n\n    .rdp-weekday {\n      ${theme.typography('label', getLabelTypographySize($size))};\n      padding: var(--rdp-weekday-padding);\n      text-align: var(--rdp-weekday-text-align);\n      text-transform: var(--rdp-weekday-text-transform);\n    }\n\n    .rdp-today:not(.rdp-outside) {\n      position: relative;\n\n      &::before {\n        content: '';\n        position: absolute;\n        bottom: ${DatePickerConsts.selectedDateUnderline[$size].bottom}px;\n        height: ${DatePickerConsts.selectedDateUnderline[$size].height}px;\n        width: ${DatePickerConsts.selectedDateUnderline[$size].width}px;\n        left: 50%;\n        transform: translateX(-50%);\n        border-radius: var(--rdp-border-radius);\n        background-color: var(--rdp-selected-border);\n      }\n\n      &.rdp-selected::before {\n        background-color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n      }\n    }\n\n    &.rdp-root {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      gap: ${DatePickerConsts.consts[$size].panelPadding}px;\n    }\n\n    .rdp-outside {\n      color: ${sectionLayer[Variables.TextOnFoundationStrong]};\n      background-color: ${sectionLayer[Variables.BackgroundFoundation]};\n    }\n\n    .rdp-outside:last-of-type,\n    .rdp-outside:not(.rdp-outside:has(+ .rdp-day.rdp-outside)) {\n      border-top-right-radius: var(--rdp-border-radius);\n      border-bottom-right-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-day:not(.rdp-outside) + .rdp-outside,\n    .rdp-outside:first-of-type {\n      border-top-left-radius: var(--rdp-border-radius);\n      border-bottom-left-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-hidden {\n      visibility: hidden;\n      color: var(--rdp-range_start-color);\n    }\n\n    .rdp-range_start .rdp-day_button {\n      background-color: var(--rdp-range_start-date-background-color);\n      color: var(--rdp-range_start-color);\n      border-radius: var(--rdp-border-radius);\n    }\n\n    .rdp-range_middle:not(.rdp-outside) {\n      background-color: var(--rdp-range_middle-background-color);\n    }\n\n    .rdp-range_middle .rdp-day_button {\n      border: unset;\n      border-radius: unset;\n      color: var(--rdp-range_middle-color);\n      background-color: transparent;\n    }\n\n    .rdp-range_end {\n      color: var(--rdp-range_end-color);\n    }\n\n    .rdp-disabled {\n      color: ${disabledLayer[Variables.TextOnFoundationSubtle]};\n      text-decoration: line-through;\n    }\n\n    .rdp-range_end .rdp-day_button {\n      color: var(--rdp-range_start-color);\n      background-color: var(--rdp-range_end-date-background-color);\n    }\n\n    .rdp-range_start.rdp-range_end {\n      background: revert;\n    }\n\n    .rdp-focusable {\n      cursor: pointer;\n    }\n\n    .rdp-weekdays {\n      color: ${strongLayer[Variables.TextOnFoundationSubtle]};\n    }\n\n    .rdp-range_start:not(.rdp-range_end) > button {\n      border-top-right-radius: unset;\n      border-bottom-right-radius: unset;\n    }\n\n    .rdp-range_end:not(.rdp-range_start) > button {\n      border-top-left-radius: unset;\n      border-bottom-left-radius: unset;\n    }\n\n    .rdp-day_button:focus-visible {\n      ${getFocusStyles(theme)};\n    }\n\n    &[data-mode='single'] .rdp-selected > button,\n    &[data-mode='range']\n      .rdp-selected[aria-selected='true'][data-selected='true']:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end)\n      > button,\n    &[data-mode='range']\n      .rdp-focused[data-focused='true']:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end)\n      > button,\n    &[data-mode='range'] .rdp-selected.rdp-focused:not(.rdp-range_start, .rdp-range_middle, .rdp-range_end) > button {\n      border-radius: var(--rdp-border-radius);\n      background-color: ${strongLayer[Variables.BackgroundSelected]};\n      color: ${strongLayer[Variables.TextOnSelectedBackgroundStrong]};\n    }\n  `;\n});\n"],"names":["CalendarStyled","styled","DayPicker","theme","$size","$zIndex","strongLayer","sectionLayer","disabledLayer","subtleLayer","hoverLayer","css","DatePickerConsts.consts","Variables","getLabelTypographySize","getFocusStyles","ZIndexes","getHeadingTypographySize","getSmallerSize","DatePickerConsts.selectedDateUnderline"],"mappings":"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"}

package/build/cjs/components/DatePicker/components/NativeDatePicker/NativeDatePicker.js

@@ -1,2 +1,2 @@
-"use strict";const t=require("react/jsx-runtime"),r=require("react"),C=require("classnames"),k=require("../../../../react-base/src/consts/index.js"),m=require("../../../../react-base/src/components/DatePicker/DatePicker.consts.js"),c=require("../../../Icon/components/CalendarEvent.js"),v=require("../../../TextInput/TextInput.js"),R=require("../../../../react-base/src/consts/classes.js"),j=r.forwardRef(({className:u,size:o=`${k.Sizes.Medium}`,prefix:l,suffix:f=!0,background:n=!0,allowClear:x=!0,type:d="date",...q},p)=>{const s=r.useRef(null);r.useImperativeHandle(p,()=>s.current);const i=r.useCallback(()=>{var e,a;(a=(e=s.current)==null?void 0:e.showPicker)==null||a.call(e)},[]);return t.jsx(v,{className:C(u,R.DATE_PICKER_CLASS),"aria-label":m.ariaLabel,size:o,prefix:l?{transparent:!n,node:t.jsx(c,{}),onClick:i}:void 0,suffix:f?{transparent:!n,node:t.jsx(c,{}),onClick:i}:void 0,ref:s,type:d,allowClear:x,...q})});module.exports=j;
+"use strict";const t=require("react/jsx-runtime"),e=require("react"),q=require("classnames"),k=require("../../../../react-base/src/consts/index.js"),p=require("../../../../react-base/src/components/DatePicker/DatePicker.consts.js"),n=require("../../../Icon/components/CalendarEvent.js"),C=require("./NativeDatePicker.styles.js"),v=require("../../../../react-base/src/consts/classes.js"),m=e.forwardRef(({className:a,size:c=`${k.Sizes.Medium}`,prefix:u,suffix:o=!0,background:s=!0,allowClear:l=!0,type:d="date",...x},f)=>{const r=e.useRef(null);e.useImperativeHandle(f,()=>r.current);const i=e.useCallback(()=>{r.current?.showPicker?.()},[]);return t.jsx(C.TextInputStyled,{className:q(a,v.DATE_PICKER_CLASS),"aria-label":p.ariaLabel,size:c,prefix:u?{transparent:!s,node:t.jsx(n,{}),onClick:i}:void 0,suffix:o?{transparent:!s,node:t.jsx(n,{}),onClick:i}:void 0,inputRef:r,type:d,allowClear:l,...x})});module.exports=m;
 //# sourceMappingURL=NativeDatePicker.js.map

package/build/cjs/components/DatePicker/components/NativeDatePicker/NativeDatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"NativeDatePicker.js","sources":["../../../../../../src/components/DatePicker/components/NativeDatePicker/NativeDatePicker.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useCallback, useImperativeHandle, useRef } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, DATE_PICKER_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { DatePickerConsts } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport CalendarEvent from '../../../Icon/components/CalendarEvent';\nimport type { INativeDatePickerProps } from './NativeDatePicker.types';\nimport TextInput from '../../../TextInput/TextInput';\n\nconst NativeDatePicker = forwardRef(\n  (\n    {\n      className,\n      size = `${Sizes.Medium}`,\n      prefix,\n      suffix = true,\n      background = true,\n      allowClear = true,\n      type = 'date',\n      ...rest\n    }: INativeDatePickerProps,\n    ref: ForwardedRef<HTMLInputElement>,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle(ref, () => inputRef.current!);\n\n    const onSuffixClick = useCallback(() => {\n      inputRef.current?.showPicker?.();\n    }, []);\n\n    return (\n      <TextInput\n        className={classNames(className, DATE_PICKER_CLASS)}\n        aria-label={DatePickerConsts.ariaLabel}\n        size={size}\n        prefix={prefix ? { transparent: !background, node: <CalendarEvent />, onClick: onSuffixClick } : undefined}\n        suffix={suffix ? { transparent: !background, node: <CalendarEvent />, onClick: onSuffixClick } : undefined}\n        ref={inputRef}\n        type={type}\n        allowClear={allowClear}\n        {...rest}\n      />\n    );\n  },\n);\n\nexport default NativeDatePicker;\n"],"names":["NativeDatePicker","forwardRef","className","size","Sizes","prefix","suffix","background","allowClear","type","rest","ref","inputRef","useRef","useImperativeHandle","onSuffixClick","useCallback","_b","_a","jsx","TextInput","classNames","DATE_PICKER_CLASS","DatePickerConsts.ariaLabel","CalendarEvent"],"mappings":"sYAUMA,EAAmBC,EAAAA,WACvB,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,OAAAC,EACA,OAAAC,EAAS,GACT,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,KAAAC,EAAO,OACP,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAWC,EAAAA,OAAyB,IAAI,EAC9CC,EAAAA,oBAAoBH,EAAK,IAAMC,EAAS,OAAQ,EAEhD,MAAMG,EAAgBC,EAAAA,YAAY,IAAM,UACtCC,GAAAC,EAAAN,EAAS,UAAT,YAAAM,EAAkB,aAAlB,MAAAD,EAAA,KAAAC,EACF,EAAG,CAAA,CAAE,EAEL,OACEC,EAAAA,IAACC,EAAA,CACC,UAAWC,EAAWnB,EAAWoB,mBAAiB,EAClD,aAAYC,EAAAA,UACZ,KAAApB,EACA,OAAQE,EAAS,CAAE,YAAa,CAACE,EAAY,KAAMY,MAACK,EAAA,CAAA,CAAc,EAAI,QAAST,CAAA,EAAkB,OACjG,OAAQT,EAAS,CAAE,YAAa,CAACC,EAAY,KAAMY,MAACK,EAAA,CAAA,CAAc,EAAI,QAAST,CAAA,EAAkB,OACjG,IAAKH,EACL,KAAAH,EACA,WAAAD,EACC,GAAGE,CAAA,CAAA,CAGV,CACF"}
+{"version":3,"file":"NativeDatePicker.js","sources":["../../../../../../src/components/DatePicker/components/NativeDatePicker/NativeDatePicker.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useCallback, useImperativeHandle, useRef } from 'react';\n\nimport classNames from 'classnames';\nimport { Sizes, DATE_PICKER_CLASS } from 'acinguiux-ds-react-base/consts';\nimport { DatePickerConsts } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport CalendarEvent from '../../../Icon/components/CalendarEvent';\nimport type { INativeDatePickerProps } from './NativeDatePicker.types';\nimport { TextInputStyled } from './NativeDatePicker.styles';\n\nconst NativeDatePicker = forwardRef(\n  (\n    {\n      className,\n      size = `${Sizes.Medium}`,\n      prefix,\n      suffix = true,\n      background = true,\n      allowClear = true,\n      type = 'date',\n      ...rest\n    }: INativeDatePickerProps,\n    ref: ForwardedRef<HTMLInputElement>,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle(ref, () => inputRef.current!);\n\n    const onSuffixClick = useCallback(() => {\n      inputRef.current?.showPicker?.();\n    }, []);\n\n    return (\n      <TextInputStyled\n        className={classNames(className, DATE_PICKER_CLASS)}\n        aria-label={DatePickerConsts.ariaLabel}\n        size={size}\n        prefix={prefix ? { transparent: !background, node: <CalendarEvent />, onClick: onSuffixClick } : undefined}\n        suffix={suffix ? { transparent: !background, node: <CalendarEvent />, onClick: onSuffixClick } : undefined}\n        inputRef={inputRef}\n        type={type}\n        allowClear={allowClear}\n        {...rest}\n      />\n    );\n  },\n);\n\nexport default NativeDatePicker;\n"],"names":["NativeDatePicker","forwardRef","className","size","Sizes","prefix","suffix","background","allowClear","type","rest","ref","inputRef","useRef","useImperativeHandle","onSuffixClick","useCallback","jsx","TextInputStyled","classNames","DATE_PICKER_CLASS","DatePickerConsts.ariaLabel","CalendarEvent"],"mappings":"mYAUMA,EAAmBC,EAAAA,WACvB,CACE,CACE,UAAAC,EACA,KAAAC,EAAO,GAAGC,QAAM,MAAM,GACtB,OAAAC,EACA,OAAAC,EAAS,GACT,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,KAAAC,EAAO,OACP,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAWC,EAAAA,OAAyB,IAAI,EAC9CC,EAAAA,oBAAoBH,EAAK,IAAMC,EAAS,OAAQ,EAEhD,MAAMG,EAAgBC,EAAAA,YAAY,IAAM,CACtCJ,EAAS,SAAS,aAAA,CACpB,EAAG,CAAA,CAAE,EAEL,OACEK,EAAAA,IAACC,EAAAA,gBAAA,CACC,UAAWC,EAAWjB,EAAWkB,mBAAiB,EAClD,aAAYC,EAAAA,UACZ,KAAAlB,EACA,OAAQE,EAAS,CAAE,YAAa,CAACE,EAAY,KAAMU,MAACK,EAAA,CAAA,CAAc,EAAI,QAASP,CAAA,EAAkB,OACjG,OAAQT,EAAS,CAAE,YAAa,CAACC,EAAY,KAAMU,MAACK,EAAA,CAAA,CAAc,EAAI,QAASP,CAAA,EAAkB,OACjG,SAAAH,EACA,KAAAH,EACA,WAAAD,EACC,GAAGE,CAAA,CAAA,CAGV,CACF"}

package/build/cjs/components/DatePicker/components/NativeDatePicker/NativeDatePicker.styles.js

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("styled-components"),s=require("../../../../react-base/src/utils/sizesUtils.js"),i=require("../../../TextInput/TextInput.js"),n=e.styled(i)(({theme:t,size:l})=>e.css`
+    input {
+      line-height: calc(${t.typography("label",s.getLabelTypographySize(l)).lineHeight} - 2px);
+    }
+  `);exports.TextInputStyled=n;
+//# sourceMappingURL=NativeDatePicker.styles.js.map

package/build/cjs/components/DatePicker/components/NativeDatePicker/NativeDatePicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeDatePicker.styles.js","sources":["../../../../../../src/components/DatePicker/components/NativeDatePicker/NativeDatePicker.styles.ts"],"sourcesContent":["import { css, styled } from 'styled-components';\nimport { getLabelTypographySize } from 'acinguiux-ds-react-base/utils/sizesUtils';\nimport { TextInputTypes } from 'acinguiux-ds-react-base/components/TextInput';\n\nimport TextInput from '../../../TextInput/TextInput';\n\nexport const TextInputStyled = styled(TextInput)<{ size: TextInputTypes.Size }>(({ theme, size }) => {\n  return css`\n    input {\n      line-height: calc(${theme.typography('label', getLabelTypographySize(size)).lineHeight} - 2px);\n    }\n  `;\n});\n"],"names":["TextInputStyled","styled","TextInput","theme","size","css","getLabelTypographySize"],"mappings":"0PAMaA,EAAkBC,EAAAA,OAAOC,CAAS,EAAiC,CAAC,CAAE,MAAAC,EAAO,KAAAC,KACjFC,EAAAA;AAAAA;AAAAA,0BAEiBF,EAAM,WAAW,QAASG,EAAAA,uBAAuBF,CAAI,CAAC,EAAE,UAAU;AAAA;AAAA,GAG3F"}

package/build/cjs/components/DatePicker/components/RangeDatePicker/RangeDatePicker.js

@@ -1,2 +1,2 @@
-"use strict";const s=require("react/jsx-runtime"),o=require("react"),S=require("date-fns"),k=require("../../../../react-base/src/consts/index.js"),B=require("classnames"),q=require("../../../Popover/Popover.js"),W=require("../Calendar/Calendar.js"),X=require("../../../Icon/components/ArrowRight.js"),z=require("../../../Icon/components/CalendarEvent.js"),G=require("./RangeDatePicker.styles.js"),K=require("../../../TextInput/TextInput.js"),y=require("../../../../react-base/src/consts/classes.js"),H=({size:f=k.Sizes.Medium,picker:$="day",format:p="dd/MM/yyyy",disabled:c,invalid:g,defaultValue:C,value:D,onChange:r,open:w,calendarProps:F,placeholder:u,allowClear:N,className:L,...M})=>{const V=o.useId(),b=o.useRef(null),O=o.useRef(null),E=o.useRef(null),[i,m]=o.useState(C),[a,R]=o.useState();o.useEffect(()=>{m(D)},[D]);const[x,P]=o.useState({from:"",to:""}),[I,j]=o.useState(w);o.useEffect(()=>{j(w)},[w]);const d=o.useCallback(e=>{R(e),j(t=>!t)},[]),v=o.useCallback((e,t=a)=>{j(e),t&&(t==="from"&&setTimeout(()=>{var n;return(n=O.current)==null?void 0:n.focus()},0),t==="to"&&setTimeout(()=>{var n;return(n=E.current)==null?void 0:n.focus()},0),R(void 0))},[a]),T=o.useCallback(e=>{e?(P(t=>({...t,from:S.format(e.from??t.from,p),...e.to?{to:S.format(e.to,p)}:{}})),m(e),r==null||r(e)):(P({from:"",to:""}),m(void 0),r==null||r(void 0)),a==="from"&&(i==null?void 0:i.from)===(e==null?void 0:e.from)?v(!1,"to"):a==="to"&&(e!=null&&e.from)?v(!1):a==="from"&&(e!=null&&e.from)&&R("to")},[p,v,r,a,i]),A=e=>t=>{P(l=>({...l,[e]:t.target.value}));const n=S.parse(t.target.value,p,new Date);S.isValid(n)?(P(l=>({...l,[e]:S.format(n??l[e],p)})),m(l=>({...l,[e]:n})),r==null||r({...i,[e]:n})):(m(void 0),r==null||r(void 0))},_=e=>t=>{t.key===" "&&(t.preventDefault(),d(e))};return s.jsxs(q.Popover,{open:I,modal:!0,onOpenChange:v,children:[s.jsx("p",{"aria-live":"polite","aria-atomic":"true",style:{position:"absolute",width:"1px",height:"1px",padding:"0px",margin:"-1px",overflow:"hidden",clip:"rect(0px, 0px, 0px, 0px)",whiteSpace:"nowrap",borderWidth:"0px"},children:x.to?`Selected date ${x.from} to ${x.to}`:"Please type or pick a date. Press space to open the calendar."}),$==="day"&&s.jsx(q.PopoverTrigger,{asChild:!0,children:s.jsx(G.SingleDatePickerTextInput,{inputRef:b,className:B(`${y.DATE_PICKER_CLASS}-range`,L),size:f,disabled:c,invalid:g,readOnly:!0,allowClear:!1,customPrefix:s.jsx(K,{inputRef:O,className:`${y.DATE_PICKER_CLASS}-range-from`,placeholder:(u==null?void 0:u.from)??"Start date",disabled:c,size:f,value:x.from,onKeyDown:_("from"),onChange:A("from"),wrapperProps:{onClick:()=>!c&&d("from")}}),customSuffix:s.jsxs(s.Fragment,{children:[s.jsx(X,{}),s.jsx(K,{inputRef:E,className:`${y.DATE_PICKER_CLASS}-range-to`,placeholder:(u==null?void 0:u.to)??"End date",size:f,value:x.to,disabled:c,wrapperProps:{onClick:()=>!c&&d("to")},onKeyDown:_("to"),onChange:A("to"),allowClear:N?()=>!!i:void 0,onClear:()=>T(void 0)})]}),suffix:{node:s.jsx(z,{}),onClick:()=>!c&&d("from")},type:"text","aria-controls":"dialog","aria-expanded":I,"aria-label":"Open calendar to choose date",...M})}),s.jsx(q.PopoverContent,{arrow:!0,sideOffset:12,children:s.jsx(W,{id:`calendar-${V}`,...F,autoFocus:!0,variant:"range",selected:i,month:(i==null?void 0:i.from)??new Date,size:f===k.Sizes.XSmall?k.Sizes.Small:f,onSelect:T})})]})};module.exports=H;
+"use strict";const r=require("react/jsx-runtime"),t=require("react"),a=require("date-fns"),v=require("../../../../react-base/src/consts/index.js"),z=require("classnames"),y=require("../../../Popover/Popover.js"),G=require("../../../Icon/components/ArrowRight.js"),H=require("../../../Icon/components/CalendarEvent.js"),_=require("./RangeDatePicker.styles.js"),K=require("../../../TextInput/TextInput.js"),$=require("../../utils/range.js"),O=require("../../../../react-base/src/consts/classes.js"),J=({size:f=v.Sizes.Medium,picker:N="day",format:n="dd/MM/yyyy",disabled:l,invalid:F,defaultValue:d,value:u,onChange:m,open:P,calendarProps:L,placeholder:j,allowClear:M,closeOnComplete:k=!0,className:b,...B})=>{const W=t.useId(),X=t.useRef(null),q=t.useRef(null),E=t.useRef(null),[p,x]=t.useState(d),[g,S]=t.useState({from:d?.from?a.format(d.from,n):"",to:d?.to?a.format(d.to,n):""}),[i,w]=t.useState();t.useEffect(()=>{x(u),S({from:u?.from?a.format(u.from,n):"",to:u?.to?a.format(u.to,n):""})},[u,n]);const[h,D]=t.useState(P);t.useEffect(()=>{D(P)},[P]);const C=t.useCallback(e=>{w(e),D(o=>!o)},[]),R=t.useCallback((e,o=i)=>{D(e),o&&(o==="from"&&setTimeout(()=>q.current?.focus(),0),o==="to"&&setTimeout(()=>E.current?.focus(),0),w(void 0))},[i]),I=t.useCallback(e=>{e?(S(s=>({from:e.from??s.from?a.format(e.from??s.from,n):"",to:e.to?a.format(e.to,n):""})),x(e),m?.(e)):(S({from:"",to:""}),x(void 0),m?.(void 0));const{shouldClose:o,newOrigin:c}=$.getNextOriginState(e,p,i);o&&k&&R(!1,c),w(c)},[n,k,R,m,i,p]),T=e=>o=>{S(s=>({...s,[e]:o.target.value}));const c=a.parse(o.target.value,n,new Date);a.isValid(c)?(S(s=>({...s,[e]:a.format(c??s[e],n)})),x(s=>({...s,[e]:c})),m?.({...p,[e]:c})):(x(void 0),m?.(void 0))},A=e=>o=>{o.key===" "&&(o.preventDefault(),C(e))};return r.jsxs(y.Popover,{open:h,modal:!0,onOpenChange:R,children:[r.jsx("p",{"aria-live":"polite","aria-atomic":"true",style:{position:"absolute",width:"1px",height:"1px",padding:"0px",margin:"-1px",overflow:"hidden",clip:"rect(0px, 0px, 0px, 0px)",whiteSpace:"nowrap",borderWidth:"0px"},children:g.to?`Selected date ${g.from} to ${g.to}`:"Please type or pick a date. Press space to open the calendar."}),N==="day"&&r.jsx(y.PopoverTrigger,{asChild:!0,children:r.jsx(_.SingleDatePickerTextInput,{inputRef:X,className:z(`${O.DATE_PICKER_CLASS}-range`,b),size:f,disabled:l,invalid:F,readOnly:!0,allowClear:!1,customPrefix:r.jsx(K,{inputRef:q,className:`${O.DATE_PICKER_CLASS}-range-from`,placeholder:j?.from??"Start date","data-focused-popover":h&&i==="from",disabled:l,size:f,value:g.from,onKeyDown:A("from"),onChange:T("from"),wrapperProps:{onClick:()=>!l&&C("from")}}),customSuffix:r.jsxs(r.Fragment,{children:[r.jsx(G,{}),r.jsx(K,{inputRef:E,className:`${O.DATE_PICKER_CLASS}-range-to`,placeholder:j?.to??"End date",size:f,value:g.to,"data-focused-popover":h&&i==="to",disabled:l,wrapperProps:{onClick:()=>!l&&C("to")},onKeyDown:A("to"),onChange:T("to"),allowClear:M?()=>!!p:void 0,onClear:()=>I(void 0)})]}),suffix:{node:r.jsx(H,{}),onClick:()=>!l&&C("from")},type:"text","aria-controls":"dialog","aria-expanded":h,"aria-label":"Open calendar to choose date",...B})}),r.jsx(y.PopoverContent,{arrow:!0,sideOffset:12,children:r.jsx(_.StyledCalendar,{id:`calendar-${W}`,...L,autoFocus:!0,variant:"range",bound:$.originToBound(i),selected:p,month:p?.from??new Date,size:f===v.Sizes.XSmall?v.Sizes.Small:f,onSelect:I})})]})};module.exports=J;
 //# sourceMappingURL=RangeDatePicker.js.map

package/build/cjs/components/DatePicker/components/RangeDatePicker/RangeDatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeDatePicker.js","sources":["../../../../../../src/components/DatePicker/components/RangeDatePicker/RangeDatePicker.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, useState } from 'react';\n\nimport { format as formatDate, isValid, parse } from 'date-fns';\nimport { DATE_PICKER_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport classNames from 'classnames';\nimport type { DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../../../Popover/Popover';\nimport Calendar from '../Calendar/Calendar';\nimport { CalendarEvent, ArrowRight } from '../../../Icon/components';\nimport { SingleDatePickerTextInput } from './RangeDatePicker.styles';\nimport type { IRangeDatePickerProps } from './RangeDatePicker.types';\nimport TextInput from '../../../TextInput/TextInput';\n\nconst RangeDatePicker = ({\n  size = Sizes.Medium,\n  picker = 'day',\n  format = 'dd/MM/yyyy',\n  disabled,\n  invalid,\n  defaultValue,\n  value,\n  onChange,\n  open,\n  calendarProps,\n  placeholder,\n  allowClear,\n  className,\n  ...ariaProps\n}: IRangeDatePickerProps) => {\n  const calendarId = useId();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const inputRefFrom = useRef<HTMLInputElement>(null);\n  const inputRefTo = useRef<HTMLInputElement>(null);\n\n  // Hold the selected date in state\n  const [selectedDate, setSelectedDate] = useState<DatePickerTypes.RangeDate | undefined>(defaultValue);\n  // openOrigin is used to track which input is currently open ('from' or 'to')\n  const [openOrigin, setOpenOrigin] = useState<'from' | 'to' | undefined>();\n\n  useEffect(() => {\n    setSelectedDate(value);\n  }, [value]);\n\n  // Hold the input value in state\n  const [inputValue, setInputValue] = useState<{ from: string; to: string }>({ from: '', to: '' });\n\n  // Hold the dialog visibility in state\n  const [isPickerOpen, setIsPickerOpen] = useState(open);\n\n  useEffect(() => {\n    setIsPickerOpen(open);\n  }, [open]);\n\n  const togglePicker = useCallback((origin: 'from' | 'to') => {\n    setOpenOrigin(origin);\n    setIsPickerOpen((prev) => !prev);\n  }, []);\n\n  const handleOnPickerOpenChange = useCallback(\n    (isOpen: boolean, origin: 'from' | 'to' | undefined = openOrigin) => {\n      setIsPickerOpen(isOpen);\n\n      if (origin) {\n        if (origin === 'from') {\n          setTimeout(() => inputRefFrom.current?.focus(), 0);\n        }\n        if (origin === 'to') {\n          setTimeout(() => inputRefTo.current?.focus(), 0);\n        }\n        setOpenOrigin(undefined);\n      }\n    },\n    [openOrigin],\n  );\n\n  const handleDayPickerSelect = useCallback(\n    (date: DatePickerTypes.RangeDate | undefined) => {\n      if (!date) {\n        setInputValue({ from: '', to: '' });\n        setSelectedDate(undefined);\n        onChange?.(undefined);\n      } else {\n        setInputValue((prev) => ({\n          ...prev,\n          from: formatDate(date.from ?? prev.from, format),\n          ...(date.to ? { to: formatDate(date.to, format) } : {}),\n        }));\n        setSelectedDate(date);\n        onChange?.(date);\n      }\n\n      // if the picker openOrigin is 'from', and the selected from date is the same as the new date, then close the picker (we assume the user is done selecting the range)\n      if (openOrigin === 'from' && selectedDate?.from === date?.from) {\n        handleOnPickerOpenChange(false, 'to');\n        // if the picker openOrigin is 'to', and the selected from date exists, then close the picker (we assume the user is done selecting the range)\n      } else if (openOrigin === 'to' && date?.from) {\n        handleOnPickerOpenChange(false);\n        // if the picker openOrigin is 'from' and the selected from date exists, then switch to 'to' picker\n      } else if (openOrigin === 'from' && date?.from) {\n        setOpenOrigin('to');\n      }\n    },\n    [format, handleOnPickerOpenChange, onChange, openOrigin, selectedDate],\n  );\n\n  const handleInputChange = (key: 'from' | 'to') => (e: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue((prev) => ({\n      ...prev,\n      [key]: e.target.value,\n    }));\n    const parsedDate = parse(e.target.value, format, new Date());\n    if (isValid(parsedDate)) {\n      setInputValue((prev) => ({\n        ...prev,\n        [key]: formatDate(parsedDate ?? prev[key], format),\n      }));\n\n      setSelectedDate(\n        (prev) =>\n          ({\n            ...prev,\n            [key]: parsedDate,\n          }) as DatePickerTypes.RangeDate,\n      );\n      onChange?.({ ...selectedDate, [key]: parsedDate } as DatePickerTypes.RangeDate);\n    } else {\n      setSelectedDate(undefined);\n      onChange?.(undefined);\n    }\n  };\n\n  const handleOnKeyDown = (origin: 'from' | 'to') => (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === ' ') {\n      event.preventDefault();\n      togglePicker(origin);\n    }\n  };\n\n  return (\n    <Popover open={isPickerOpen} modal={true} onOpenChange={handleOnPickerOpenChange}>\n      <p\n        aria-live=\"polite\"\n        aria-atomic=\"true\"\n        style={{\n          position: 'absolute',\n          width: '1px',\n          height: '1px',\n          padding: '0px',\n          margin: '-1px',\n          overflow: 'hidden',\n          clip: 'rect(0px, 0px, 0px, 0px)',\n          whiteSpace: 'nowrap',\n          borderWidth: '0px',\n        }}\n      >\n        {inputValue.to\n          ? `Selected date ${inputValue.from} to ${inputValue.to}`\n          : 'Please type or pick a date. Press space to open the calendar.'}\n      </p>\n      {picker === 'day' && (\n        <PopoverTrigger asChild={true}>\n          <SingleDatePickerTextInput\n            inputRef={inputRef}\n            className={classNames(`${DATE_PICKER_CLASS}-range`, className)}\n            size={size}\n            disabled={disabled}\n            invalid={invalid}\n            readOnly={true}\n            allowClear={false}\n            customPrefix={\n              <TextInput\n                inputRef={inputRefFrom}\n                className={`${DATE_PICKER_CLASS}-range-from`}\n                placeholder={placeholder?.from ?? 'Start date'}\n                disabled={disabled}\n                size={size}\n                value={inputValue.from}\n                onKeyDown={handleOnKeyDown('from')}\n                onChange={handleInputChange('from')}\n                wrapperProps={{\n                  onClick: () => !disabled && togglePicker('from'),\n                }}\n              />\n            }\n            customSuffix={\n              <>\n                <ArrowRight />\n                <TextInput\n                  inputRef={inputRefTo}\n                  className={`${DATE_PICKER_CLASS}-range-to`}\n                  placeholder={placeholder?.to ?? 'End date'}\n                  size={size}\n                  value={inputValue.to}\n                  disabled={disabled}\n                  wrapperProps={{\n                    onClick: () => !disabled && togglePicker('to'),\n                  }}\n                  onKeyDown={handleOnKeyDown('to')}\n                  onChange={handleInputChange('to')}\n                  allowClear={allowClear ? () => Boolean(selectedDate) : undefined}\n                  onClear={() => handleDayPickerSelect(undefined)}\n                />\n              </>\n            }\n            suffix={{\n              node: <CalendarEvent />,\n              onClick: () => !disabled && togglePicker('from'),\n            }}\n            type=\"text\"\n            aria-controls=\"dialog\"\n            aria-expanded={isPickerOpen}\n            aria-label=\"Open calendar to choose date\"\n            {...ariaProps}\n          />\n        </PopoverTrigger>\n      )}\n      <PopoverContent arrow={true} sideOffset={12}>\n        <Calendar\n          id={`calendar-${calendarId}`}\n          {...calendarProps}\n          autoFocus={true}\n          variant=\"range\"\n          selected={selectedDate}\n          month={selectedDate?.from ?? new Date()}\n          size={size === Sizes.XSmall ? Sizes.Small : size}\n          onSelect={handleDayPickerSelect}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","size","Sizes","picker","format","disabled","invalid","defaultValue","value","onChange","open","calendarProps","placeholder","allowClear","className","ariaProps","calendarId","useId","inputRef","useRef","inputRefFrom","inputRefTo","selectedDate","setSelectedDate","useState","openOrigin","setOpenOrigin","useEffect","inputValue","setInputValue","isPickerOpen","setIsPickerOpen","togglePicker","useCallback","origin","prev","handleOnPickerOpenChange","isOpen","_a","handleDayPickerSelect","date","formatDate","handleInputChange","key","e","parsedDate","parse","isValid","handleOnKeyDown","event","Popover","jsx","PopoverTrigger","SingleDatePickerTextInput","classNames","DATE_PICKER_CLASS","TextInput","jsxs","Fragment","ArrowRight","CalendarEvent","PopoverContent","Calendar"],"mappings":"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"}
+{"version":3,"file":"RangeDatePicker.js","sources":["../../../../../../src/components/DatePicker/components/RangeDatePicker/RangeDatePicker.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, useState } from 'react';\n\nimport { format as formatDate, isValid, parse } from 'date-fns';\nimport { DATE_PICKER_CLASS, Sizes } from 'acinguiux-ds-react-base/consts';\nimport classNames from 'classnames';\nimport type { DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport { Popover, PopoverContent, PopoverTrigger } from '../../../Popover/Popover';\nimport { CalendarEvent, ArrowRight } from '../../../Icon/components';\nimport { StyledCalendar, SingleDatePickerTextInput } from './RangeDatePicker.styles';\nimport type { IRangeDatePickerProps } from './RangeDatePicker.types';\nimport TextInput from '../../../TextInput/TextInput';\nimport { getNextOriginState, Origin, originToBound } from '../../utils/range';\n\nconst RangeDatePicker = ({\n  size = Sizes.Medium,\n  picker = 'day',\n  format = 'dd/MM/yyyy',\n  disabled,\n  invalid,\n  defaultValue,\n  value,\n  onChange,\n  open,\n  calendarProps,\n  placeholder,\n  allowClear,\n  closeOnComplete = true,\n  className,\n  ...ariaProps\n}: IRangeDatePickerProps) => {\n  const calendarId = useId();\n  const inputRef = useRef<HTMLInputElement>(null);\n  const inputRefFrom = useRef<HTMLInputElement>(null);\n  const inputRefTo = useRef<HTMLInputElement>(null);\n\n  // Hold the selected date in state\n  const [selectedDate, setSelectedDate] = useState<DatePickerTypes.RangeDate | undefined>(defaultValue);\n  // Hold the input value in state\n  const [inputValue, setInputValue] = useState<{ from: string; to: string }>({\n    from: defaultValue?.from ? formatDate(defaultValue.from, format) : '',\n    to: defaultValue?.to ? formatDate(defaultValue.to, format) : '',\n  });\n  // openOrigin is used to track which input is currently open ('from' or 'to')\n  const [openOrigin, setOpenOrigin] = useState<Origin>();\n\n  useEffect(() => {\n    setSelectedDate(value);\n    setInputValue({\n      from: value?.from ? formatDate(value.from, format) : '',\n      to: value?.to ? formatDate(value.to, format) : '',\n    });\n  }, [value, format]);\n\n  // Hold the dialog visibility in state\n  const [isPickerOpen, setIsPickerOpen] = useState(open);\n\n  useEffect(() => {\n    setIsPickerOpen(open);\n  }, [open]);\n\n  const togglePicker = useCallback((origin: 'from' | 'to') => {\n    setOpenOrigin(origin);\n    setIsPickerOpen((prev) => !prev);\n  }, []);\n\n  const handleOnPickerOpenChange = useCallback(\n    (isOpen: boolean, origin: Origin = openOrigin) => {\n      setIsPickerOpen(isOpen);\n\n      if (origin) {\n        if (origin === 'from') {\n          setTimeout(() => inputRefFrom.current?.focus(), 0);\n        }\n        if (origin === 'to') {\n          setTimeout(() => inputRefTo.current?.focus(), 0);\n        }\n        setOpenOrigin(undefined);\n      }\n    },\n    [openOrigin],\n  );\n\n  const handleDayPickerSelect = useCallback(\n    (date: DatePickerTypes.RangeDate | undefined) => {\n      if (!date) {\n        setInputValue({ from: '', to: '' });\n        setSelectedDate(undefined);\n        onChange?.(undefined);\n      } else {\n        setInputValue((prev) => ({\n          from: (date.from ?? prev.from) ? formatDate(date.from ?? prev.from, format) : '',\n          to: date.to ? formatDate(date.to, format) : '',\n        }));\n        setSelectedDate(date);\n        onChange?.(date);\n      }\n\n      const { shouldClose, newOrigin } = getNextOriginState(date, selectedDate, openOrigin);\n\n      if (shouldClose && closeOnComplete) {\n        handleOnPickerOpenChange(false, newOrigin);\n      }\n      setOpenOrigin(newOrigin);\n    },\n    [format, closeOnComplete, handleOnPickerOpenChange, onChange, openOrigin, selectedDate],\n  );\n\n  const handleInputChange = (key: 'from' | 'to') => (e: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue((prev) => ({\n      ...prev,\n      [key]: e.target.value,\n    }));\n    const parsedDate = parse(e.target.value, format, new Date());\n    if (isValid(parsedDate)) {\n      setInputValue((prev) => ({\n        ...prev,\n        [key]: formatDate(parsedDate ?? prev[key], format),\n      }));\n\n      setSelectedDate(\n        (prev) =>\n          ({\n            ...prev,\n            [key]: parsedDate,\n          }) as DatePickerTypes.RangeDate,\n      );\n      onChange?.({ ...selectedDate, [key]: parsedDate } as DatePickerTypes.RangeDate);\n    } else {\n      setSelectedDate(undefined);\n      onChange?.(undefined);\n    }\n  };\n\n  const handleOnKeyDown = (origin: 'from' | 'to') => (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === ' ') {\n      event.preventDefault();\n      togglePicker(origin);\n    }\n  };\n\n  return (\n    <Popover open={isPickerOpen} modal={true} onOpenChange={handleOnPickerOpenChange}>\n      <p\n        aria-live=\"polite\"\n        aria-atomic=\"true\"\n        style={{\n          position: 'absolute',\n          width: '1px',\n          height: '1px',\n          padding: '0px',\n          margin: '-1px',\n          overflow: 'hidden',\n          clip: 'rect(0px, 0px, 0px, 0px)',\n          whiteSpace: 'nowrap',\n          borderWidth: '0px',\n        }}\n      >\n        {inputValue.to\n          ? `Selected date ${inputValue.from} to ${inputValue.to}`\n          : 'Please type or pick a date. Press space to open the calendar.'}\n      </p>\n      {picker === 'day' && (\n        <PopoverTrigger asChild={true}>\n          <SingleDatePickerTextInput\n            inputRef={inputRef}\n            className={classNames(`${DATE_PICKER_CLASS}-range`, className)}\n            size={size}\n            disabled={disabled}\n            invalid={invalid}\n            readOnly={true}\n            allowClear={false}\n            customPrefix={\n              <TextInput\n                inputRef={inputRefFrom}\n                className={`${DATE_PICKER_CLASS}-range-from`}\n                placeholder={placeholder?.from ?? 'Start date'}\n                data-focused-popover={isPickerOpen && openOrigin === 'from'}\n                disabled={disabled}\n                size={size}\n                value={inputValue.from}\n                onKeyDown={handleOnKeyDown('from')}\n                onChange={handleInputChange('from')}\n                wrapperProps={{\n                  onClick: () => !disabled && togglePicker('from'),\n                }}\n              />\n            }\n            customSuffix={\n              <>\n                <ArrowRight />\n                <TextInput\n                  inputRef={inputRefTo}\n                  className={`${DATE_PICKER_CLASS}-range-to`}\n                  placeholder={placeholder?.to ?? 'End date'}\n                  size={size}\n                  value={inputValue.to}\n                  data-focused-popover={isPickerOpen && openOrigin === 'to'}\n                  disabled={disabled}\n                  wrapperProps={{\n                    onClick: () => !disabled && togglePicker('to'),\n                  }}\n                  onKeyDown={handleOnKeyDown('to')}\n                  onChange={handleInputChange('to')}\n                  allowClear={allowClear ? () => Boolean(selectedDate) : undefined}\n                  onClear={() => handleDayPickerSelect(undefined)}\n                />\n              </>\n            }\n            suffix={{\n              node: <CalendarEvent />,\n              onClick: () => !disabled && togglePicker('from'),\n            }}\n            type=\"text\"\n            aria-controls=\"dialog\"\n            aria-expanded={isPickerOpen}\n            aria-label=\"Open calendar to choose date\"\n            {...ariaProps}\n          />\n        </PopoverTrigger>\n      )}\n      <PopoverContent arrow={true} sideOffset={12}>\n        <StyledCalendar\n          id={`calendar-${calendarId}`}\n          {...calendarProps}\n          autoFocus={true}\n          variant=\"range\"\n          bound={originToBound(openOrigin)}\n          selected={selectedDate}\n          month={selectedDate?.from ?? new Date()}\n          size={size === Sizes.XSmall ? Sizes.Small : size}\n          onSelect={handleDayPickerSelect}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n};\n\nexport default RangeDatePicker;\n"],"names":["RangeDatePicker","size","Sizes","picker","format","disabled","invalid","defaultValue","value","onChange","open","calendarProps","placeholder","allowClear","closeOnComplete","className","ariaProps","calendarId","useId","inputRef","useRef","inputRefFrom","inputRefTo","selectedDate","setSelectedDate","useState","inputValue","setInputValue","formatDate","openOrigin","setOpenOrigin","useEffect","isPickerOpen","setIsPickerOpen","togglePicker","useCallback","origin","prev","handleOnPickerOpenChange","isOpen","handleDayPickerSelect","date","shouldClose","newOrigin","getNextOriginState","handleInputChange","key","e","parsedDate","parse","isValid","handleOnKeyDown","event","Popover","jsx","PopoverTrigger","SingleDatePickerTextInput","classNames","DATE_PICKER_CLASS","TextInput","jsxs","Fragment","ArrowRight","CalendarEvent","PopoverContent","StyledCalendar","originToBound"],"mappings":"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"}

package/build/cjs/components/DatePicker/components/RangeDatePicker/RangeDatePicker.styles.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("styled-components"),t=require("../../../../react-base/src/theme/types/layer.js"),n=require("../../../../react-base/src/components/Input/Input.consts.js"),i=require("../../../../react-base/src/consts/index.js"),s=require("../../../TextInput/TextInput.styles.js"),a=require("../../../TextInput/TextInput.js"),u=require("../../../Flexbox/Flexbox.styles.js"),c=o.styled(a)(({theme:e,size:r=`${i.Sizes.Medium}`})=>`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("styled-components"),t=require("../../../../react-base/src/theme/types/layer.js"),n=require("../../../../react-base/src/components/Input/Input.consts.js"),a=require("../../../../react-base/src/consts/index.js"),i=require("../../../TextInput/TextInput.styles.js"),s=require("../../../TextInput/TextInput.js"),u=require("../../../Flexbox/Flexbox.styles.js"),l=require("../Calendar/Calendar.js"),c=o.styled(l)``,d=o.styled(s)(({theme:e,size:r=`${a.Sizes.Medium}`})=>`
   &, &:hover, &:active {
     background-color: ${e.layer({foundation:"surface"})[t.Variables.BackgroundFoundation]};
   }
@@ -11,11 +11,11 @@
       display: none;
     }
 
-    > ${s.TextInputWrapper} {
+    > ${i.TextInputWrapper} {
       border-radius: ${n.consts[r].affixBorderRadius}px;
-     &:hover, &:active, &:focus-within {
-        background-color: ${e.layer({selectedProminence:"subtle"})[t.Variables.BackgroundSelected]};
-     }
+      &:hover, &:active, &:focus-within, &:has([data-focused-popover="true"]) {
+          background-color: ${e.layer({selectedProminence:"subtle"})[t.Variables.BackgroundSelected]};
+      }
       flex: 1 1 0;
       width: auto;
       border-color: transparent;
@@ -28,5 +28,5 @@
       display: inline-flex;
     }
   }
-`);exports.SingleDatePickerTextInput=c;
+`);exports.SingleDatePickerTextInput=d;exports.StyledCalendar=c;
 //# sourceMappingURL=RangeDatePicker.styles.js.map

package/build/cjs/components/DatePicker/components/RangeDatePicker/RangeDatePicker.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeDatePicker.styles.js","sources":["../../../../../../src/components/DatePicker/components/RangeDatePicker/RangeDatePicker.styles.ts"],"sourcesContent":["import type { FC } from 'react';\n\nimport { styled } from 'styled-components';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { InputConsts } from 'acinguiux-ds-react-base/components/Input/index.js';\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\n\nimport { TextInputWrapper } from '../../../TextInput/TextInput.styles';\nimport TextInput from '../../../TextInput/TextInput';\nimport type { ITextInputPropsImpl } from '../../../TextInput/TextInput.types';\nimport { Flexbox } from '../../../Flexbox/Flexbox.styles';\n\nexport const SingleDatePickerTextInput = styled(TextInput as FC<ITextInputPropsImpl>)(\n  ({ theme, size = `${Sizes.Medium}` }) => `\n  &, &:hover, &:active {\n    background-color: ${theme.layer({ foundation: 'surface' })[Variables.BackgroundFoundation]};\n  }\n\n  & > ${Flexbox} {\n    flex-direction: row;\n    gap: ${InputConsts.consts[size].containerGap}px;\n\n    > input {\n      display: none;\n    }\n\n    > ${TextInputWrapper} {\n      border-radius: ${InputConsts.consts[size].affixBorderRadius}px;\n     &:hover, &:active, &:focus-within {\n        background-color: ${theme.layer({ selectedProminence: 'subtle' })[Variables.BackgroundSelected]};\n     }\n      flex: 1 1 0;\n      width: auto;\n      border-color: transparent;\n      background: none;\n      padding: 0;\n      min-height: auto;\n    }\n\n    > svg {\n      display: inline-flex;\n    }\n  }\n`,\n);\n"],"names":["SingleDatePickerTextInput","styled","TextInput","theme","size","Sizes","Variables","Flexbox","InputConsts.consts","TextInputWrapper"],"mappings":"geAYaA,EAA4BC,EAAAA,OAAOC,CAAoC,EAClF,CAAC,CAAE,MAAAC,EAAO,KAAAC,EAAO,GAAGC,EAAAA,MAAM,MAAM,MAAS;AAAA;AAAA,wBAEnBF,EAAM,MAAM,CAAE,WAAY,UAAW,EAAEG,EAAAA,UAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGtFC,SAAO;AAAA;AAAA,WAEJC,EAAAA,OAAmBJ,CAAI,EAAE,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMxCK,kBAAgB;AAAA,uBACDD,EAAAA,OAAmBJ,CAAI,EAAE,iBAAiB;AAAA;AAAA,4BAErCD,EAAM,MAAM,CAAE,mBAAoB,SAAU,EAAEG,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAevG"}
+{"version":3,"file":"RangeDatePicker.styles.js","sources":["../../../../../../src/components/DatePicker/components/RangeDatePicker/RangeDatePicker.styles.ts"],"sourcesContent":["import type { FC } from 'react';\n\nimport { styled } from 'styled-components';\nimport { Variables } from 'acinguiux-ds-react-base/theme';\nimport { InputConsts } from 'acinguiux-ds-react-base/components/Input';\nimport { Sizes } from 'acinguiux-ds-react-base/consts';\nimport type { DatePickerTypes } from 'acinguiux-ds-react-base/components/DatePicker';\n\nimport { TextInputWrapper } from '../../../TextInput/TextInput.styles';\nimport TextInput from '../../../TextInput/TextInput';\nimport type { ITextInputPropsImpl } from '../../../TextInput/TextInput.types';\nimport { Flexbox } from '../../../Flexbox/Flexbox.styles';\nimport Calendar from '../Calendar/Calendar';\n\nexport const StyledCalendar = styled(Calendar)<DatePickerTypes.ICalendarProps & DatePickerTypes.IRangeCalendarProps>``;\n\nexport const SingleDatePickerTextInput = styled(TextInput as FC<ITextInputPropsImpl>)(\n  ({ theme, size = `${Sizes.Medium}` }) => `\n  &, &:hover, &:active {\n    background-color: ${theme.layer({ foundation: 'surface' })[Variables.BackgroundFoundation]};\n  }\n\n  & > ${Flexbox} {\n    flex-direction: row;\n    gap: ${InputConsts.consts[size].containerGap}px;\n\n    > input {\n      display: none;\n    }\n\n    > ${TextInputWrapper} {\n      border-radius: ${InputConsts.consts[size].affixBorderRadius}px;\n      &:hover, &:active, &:focus-within, &:has([data-focused-popover=\"true\"]) {\n          background-color: ${theme.layer({ selectedProminence: 'subtle' })[Variables.BackgroundSelected]};\n      }\n      flex: 1 1 0;\n      width: auto;\n      border-color: transparent;\n      background: none;\n      padding: 0;\n      min-height: auto;\n    }\n\n    > svg {\n      display: inline-flex;\n    }\n  }\n`,\n);\n"],"names":["StyledCalendar","styled","Calendar","SingleDatePickerTextInput","TextInput","theme","size","Sizes","Variables","Flexbox","InputConsts.consts","TextInputWrapper"],"mappings":"qgBAcaA,EAAiBC,EAAAA,OAAOC,CAAQ,IAEhCC,EAA4BF,EAAAA,OAAOG,CAAoC,EAClF,CAAC,CAAE,MAAAC,EAAO,KAAAC,EAAO,GAAGC,EAAAA,MAAM,MAAM,MAAS;AAAA;AAAA,wBAEnBF,EAAM,MAAM,CAAE,WAAY,UAAW,EAAEG,EAAAA,UAAU,oBAAoB,CAAC;AAAA;AAAA;AAAA,QAGtFC,SAAO;AAAA;AAAA,WAEJC,EAAAA,OAAmBJ,CAAI,EAAE,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMxCK,kBAAgB;AAAA,uBACDD,EAAAA,OAAmBJ,CAAI,EAAE,iBAAiB;AAAA;AAAA,8BAEnCD,EAAM,MAAM,CAAE,mBAAoB,SAAU,EAAEG,EAAAA,UAAU,kBAAkB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAezG"}

package/build/cjs/components/DatePicker/components/SingleDatePicker/SingleDatePicker.js

@@ -1,2 +1,2 @@
-"use strict";const l=require("react/jsx-runtime"),o=require("react"),r=require("date-fns"),m=require("../../../../react-base/src/consts/index.js"),q=require("classnames"),_=require("../../../Select/Select.js"),w=require("../../../Popover/Popover.js"),U=require("../Calendar/Calendar.js"),Z=require("../../../Icon/components/CalendarEvent.js"),C=require("../../../../hooks/useFocusRingOnKeyboard.js"),ee=require("./SingleDatePicker.styles.js"),h=require("../../utils/dateAvailabilities.js"),O=require("../../../../react-base/src/consts/classes.js"),te=({size:p=m.Sizes.Medium,picker:S="day",format:u="dd/MM/yyyy",disabled:c,invalid:x,defaultValue:F,value:j,onChange:t,open:f,calendarProps:s,onFocus:L,onBlur:B,onClick:V,onMouseDownCapture:N,placeholder:v="DD/MM/YYYY",allowClear:A,className:D,...$})=>{const z=o.useId(),n=o.useRef(null),{focusKind:g,handleOnClick:E,handleOnFocus:M,handleOnMouseDownCapture:H,handleOnBlur:I}=C.useFocusRingOnKeyboard({onFocus:L,onBlur:B,onClick:V,onMouseDownCapture:N}),[b,a]=o.useState(F);o.useEffect(()=>{a(j)},[j]);const[y,d]=o.useState(""),[K,k]=o.useState(f),W=h.getAvailableMonths(s==null?void 0:s.startMonth,s==null?void 0:s.endMonth),X=h.getAvailableYears(s==null?void 0:s.startMonth,s==null?void 0:s.endMonth);o.useEffect(()=>{k(f)},[f]);const R=o.useCallback(()=>k(e=>!e),[]),T=e=>{k(e),e||setTimeout(()=>{var i;return(i=n.current)==null?void 0:i.focus()},0)},Y=e=>{e?(d(r.format(e,u)),a(e),t==null||t(e)):(d(""),a(void 0),t==null||t(void 0)),T(!1)},G=o.useCallback(e=>{var i;if(!e.relatedTarget||!e.relatedTarget.className.includes("rdp-")){if(I(e),(i=n.current)!=null&&i.value){const Q=r.parse(n.current.value,u,new Date);r.isValid(Q)||(a(void 0),t==null||t(void 0),d(""))}}else M(e)},[u,I,M,t]),J=e=>{d(e.target.value);const i=r.parse(e.target.value,u,new Date);r.isValid(i)?(a(i),t==null||t(i)):(a(void 0),t==null||t(void 0))},P=e=>{e.key===" "&&(e.preventDefault(),R())};return l.jsxs(w.Popover,{open:K,modal:!0,onOpenChange:T,children:[l.jsx("p",{"aria-live":"polite","aria-atomic":"true",style:{position:"absolute",width:"1px",height:"1px",padding:"0px",margin:"-1px",overflow:"hidden",clip:"rect(0px, 0px, 0px, 0px)",whiteSpace:"nowrap",borderWidth:"0px"},children:y!==""?`Selected date ${y}`:"Please type or pick a date. Press space to open the calendar."}),S==="day"&&l.jsx(w.PopoverTrigger,{asChild:!0,children:l.jsx(ee.SingleDatePickerTextInput,{inputRef:n,className:q(O.DATE_PICKER_CLASS,D),"data-focused":g,size:p,disabled:c,invalid:x,onFocus:M,onBlur:G,placeholder:v,allowClear:A?()=>!!b:void 0,onClear:()=>Y(void 0),wrapperProps:{onMouseDownCapture:H,onClick:E},onKeyDown:P,suffix:{node:l.jsx(Z,{}),onClick:e=>{c||(R(),E(e))}},value:y,onChange:J,type:"text","aria-controls":"dialog","aria-expanded":K,"aria-label":"Open calendar to choose date",...$})}),S==="month"&&l.jsx(_,{disabled:c,invalid:x,placeholder:v,className:q(O.DATE_PICKER_CLASS,D),optionLabelProp:"label",options:[{label:"Select Month",options:W.map(e=>({label:r.format(new Date(0,e),"MMMM"),value:`${e}`.padStart(2,"0")}))}]}),S==="year"&&l.jsx(_,{disabled:c,invalid:x,placeholder:v,allowClear:A,className:q(O.DATE_PICKER_CLASS,D),optionLabelProp:"label",options:[{label:"Select Year",options:X.map(e=>({label:e.toString(),value:e.toString()}))}]}),l.jsx(w.PopoverContent,{arrow:!0,sideOffset:12,children:l.jsx(U,{id:`calendar-${z}`,...s,autoFocus:!0,variant:"single",selected:b,month:b,size:p===m.Sizes.XSmall?m.Sizes.Small:p,onSelect:Y})})]})};module.exports=te;
+"use strict";const t=require("react/jsx-runtime"),a=require("react"),s=require("date-fns"),P=require("../../../../react-base/src/consts/index.js"),k=require("classnames"),R=require("../../../Select/Select.js"),q=require("../../../Popover/Popover.js"),J=require("../Calendar/Calendar.js"),Q=require("../../../Icon/components/CalendarEvent.js"),U=require("../../../../hooks/useFocusRingOnKeyboard.js"),Z=require("./SingleDatePicker.styles.js"),T=require("../../utils/dateAvailabilities.js"),w=require("../../../../react-base/src/consts/classes.js"),ee=({size:S=P.Sizes.Medium,picker:h="day",format:n="dd/MM/yyyy",disabled:u,invalid:x,defaultValue:g,value:d,onChange:o,open:D,calendarProps:i,onFocus:Y,onBlur:_,onClick:F,onMouseDownCapture:L,placeholder:f="DD/MM/YYYY",allowClear:O,className:v,...B})=>{const N=a.useId(),p=a.useRef(null),{focusKind:$,handleOnClick:m,handleOnFocus:M,handleOnMouseDownCapture:z,handleOnBlur:j}=U.useFocusRingOnKeyboard({onFocus:Y,onBlur:_,onClick:F,onMouseDownCapture:L}),[b,r]=a.useState(g),[C,l]=a.useState(g?s.format(g,n):"");a.useEffect(()=>{r(d),l(d?s.format(d,n):"")},[d,n]);const[A,y]=a.useState(D),V=T.getAvailableMonths(i?.startMonth,i?.endMonth),H=T.getAvailableYears(i?.startMonth,i?.endMonth);a.useEffect(()=>{y(D)},[D]);const E=a.useCallback(()=>y(e=>!e),[]),I=e=>{y(e),e||setTimeout(()=>p.current?.focus(),0)},K=e=>{e?(l(s.format(e,n)),r(e),o?.(e)):(l(""),r(void 0),o?.(void 0)),I(!1)},W=a.useCallback(e=>{if(!e.relatedTarget||!e.relatedTarget.className.includes("rdp-")){if(j(e),p.current?.value){const c=s.parse(p.current.value,n,new Date);s.isValid(c)||(r(void 0),o?.(void 0),l(""))}}else M(e)},[n,j,M,o]),X=e=>{l(e.target.value);const c=s.parse(e.target.value,n,new Date);s.isValid(c)?(r(c),o?.(c)):(r(void 0),o?.(void 0))},G=e=>{e.key===" "&&(e.preventDefault(),E())};return t.jsxs(q.Popover,{open:A,modal:!0,onOpenChange:I,children:[t.jsx("p",{"aria-live":"polite","aria-atomic":"true",style:{position:"absolute",width:"1px",height:"1px",padding:"0px",margin:"-1px",overflow:"hidden",clip:"rect(0px, 0px, 0px, 0px)",whiteSpace:"nowrap",borderWidth:"0px"},children:C!==""?`Selected date ${C}`:"Please type or pick a date. Press space to open the calendar."}),h==="day"&&t.jsx(q.PopoverTrigger,{asChild:!0,children:t.jsx(Z.SingleDatePickerTextInput,{inputRef:p,className:k(w.DATE_PICKER_CLASS,v),"data-focused":$,size:S,disabled:u,invalid:x,onFocus:M,onBlur:W,placeholder:f,allowClear:O?()=>!!b:void 0,onClear:()=>K(void 0),wrapperProps:{onMouseDownCapture:z,onClick:m},onKeyDown:G,suffix:{node:t.jsx(Q,{}),onClick:e=>{u||(E(),m(e))}},value:C,onChange:X,type:"text","aria-controls":"dialog","aria-expanded":A,"aria-label":"Open calendar to choose date",...B})}),h==="month"&&t.jsx(R,{disabled:u,invalid:x,placeholder:f,className:k(w.DATE_PICKER_CLASS,v),optionLabelProp:"label",options:[{label:"Select Month",options:V.map(e=>({label:s.format(new Date(0,e),"MMMM"),value:`${e}`.padStart(2,"0")}))}]}),h==="year"&&t.jsx(R,{disabled:u,invalid:x,placeholder:f,allowClear:O,className:k(w.DATE_PICKER_CLASS,v),optionLabelProp:"label",options:[{label:"Select Year",options:H.map(e=>({label:e.toString(),value:e.toString()}))}]}),t.jsx(q.PopoverContent,{arrow:!0,sideOffset:12,children:t.jsx(J,{id:`calendar-${N}`,...i,autoFocus:!0,variant:"single",selected:b,month:b,size:S===P.Sizes.XSmall?P.Sizes.Small:S,onSelect:K})})]})};module.exports=ee;
 //# sourceMappingURL=SingleDatePicker.js.map