npm - @lax-wp/design-system - Versions diffs - 0.14.4 → 0.14.5 - Mend

@lax-wp/design-system 0.14.4 → 0.14.5

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

Files changed (6) hide show

package/dist/components/forms/date-range/DateRange.cjs.js CHANGED Viewed

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),re=require("antd"),Y=require("../../../_virtual/index.cjs.js"),r=require("react"),A=require("dayjs"),ne=require("../../button/IconButton.cjs.js"),se=require("../shared/InputLabel.cjs.js"),p=require("../../icon/icons.generated.cjs.js"),{RangePicker:V}=re.DatePicker,W={ENTER:"Enter"},J=()=>Math.random().toString(36).substring(2,9),ae=(i,s)=>{const k=r.useRef(s);r.useEffect(()=>{k.current=s},[s]),r.useEffect(()=>{const f=o=>k.current(o);return document.addEventListener(i,f),()=>{document.removeEventListener(i,f)}},[i])},Q=({onCalendarChange:i=void 0,onChange:s,required:k,label:f,startDate:o,endDate:d,errorMessage:m,className:M,id:l,disabled:j=!1,dateFormat:v,shouldPopOnParent:B=!0,getPopupContainer:b,maxDateRange:u,open:C,onOpenChange:S,placement:L="bottomLeft",renderAsIconButton:N=!1,iconButtonClassName:X,iconClassName:Z,labelExtra:T,inputEmphasis:F="default"})=>{const q=F==="modified"&&!m,y=F==="deleted"&&!m,R=F==="success"&&!m,P=q?"var(--Warning-50, #FFFAEB)":y?"var(--Error-50, #FEF2F2)":R?"var(--Success-50, #F0FDF4)":"",E=q?"var(--Warning-200, #FEDF89)":y?"var(--Error-200, #FECACA)":R?"var(--Success-200, #BBF7D0)":"",[D,x]=r.useState(!1),[$,z]=r.useState(!1),h=r.useRef(null),K=r.useRef(null),I=r.useRef(!1),g=r.useRef(!1),a=e=>e?A(e):null,w=`date-range-start-${J()}`,O=`date-range-end-${J()}`,G=()=>{x(!0),setTimeout(()=>{h.current&&h.current.focus()},0)};ae("keydown",e=>{if(e.key===W.ENTER&&document.activeElement instanceof HTMLInputElement){if(document?.activeElement?.id===w){const n=A(document?.activeElement?.value);n.isValid()&&s([n,a(d)])}if(document?.activeElement?.id===O){const n=A(document?.activeElement?.value);n.isValid()&&s([a(o),n])}}});const _=r.useCallback(e=>{const[n,c]=[a(o),a(d)];return u?n?e.isBefore(n.startOf("day"))||e.isAfter(n.add(u,"day").endOf("day")):c?e.isBefore(c.subtract(u,"day").startOf("day"))||e.isAfter(c.endOf("day")):!1:!1},[o,d,u]),H=r.useCallback(e=>{if(e.key===W.ENTER&&!(N?D:C??$)){e.preventDefault(),e.stopPropagation();const c=e.target.closest("form");if(c){const U=c.querySelector('button[type="submit"]');U?U.click():c.requestSubmit()}}},[N,D,C,$]),ee=r.useCallback(e=>{if(e&&I.current){I.current=!1,x(!1);return}x(e),e||(I.current=!0,requestAnimationFrame(()=>{h.current?.focus(),requestAnimationFrame(()=>{I.current=!1})}))},[]),te=r.useCallback(e=>{if(e&&g.current){g.current=!1,z(!1),S?.(!1);return}z(e),S?.(e),e||(g.current=!0,requestAnimationFrame(()=>{K.current?.focus(),requestAnimationFrame(()=>{g.current=!1})}))},[S]);return N?t.jsxs("div",{id:l,className:M,onKeyDownCapture:H,children:[t.jsx(ne,{onClick:G,disabled:j,variant:"default",className:X,children:t.jsx(p.CalendarMonthIcon,{size:20,className:Y("w-5 h-5",Z)})}),t.jsx(V,{ref:h,onChange:e=>{s(e),x(!1)},onCalendarChange:i,value:[a(o),a(d)],id:{start:w,end:O},allowClear:!0,format:v||"DD MMM, YYYY",separator:t.jsx(p.CheckIndeterminateSmallFilledIcon,{size:20,className:"text-neutral-400 dark:text-gray-100"}),suffixIcon:t.jsx(p.CalendarMonthIcon,{size:14,className:"text-neutral-400 dark:text-gray-100"}),getPopupContainer:b||(B?e=>e.parentElement:()=>document.body),disabled:j,disabledDate:u?_:void 0,autoComplete:"off",open:D,onOpenChange:ee,placement:L,style:{position:"absolute",opacity:0,pointerEvents:"none",width:0,height:0}})]}):t.jsxs("div",{id:l,className:Y("flex flex-col",M),onKeyDownCapture:H,children:[(f||T)&&t.jsxs("div",{className:"mb-1 flex items-center justify-between gap-1",children:[t.jsx(se.InputLabel,{label:f||"",required:k||!1}),T]}),(P||E)&&t.jsx("style",{children:`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),ne=require("antd"),Y=require("../../../_virtual/index.cjs.js"),r=require("react"),A=require("dayjs"),se=require("../../button/IconButton.cjs.js"),ae=require("../shared/InputLabel.cjs.js"),p=require("../../icon/icons.generated.cjs.js"),{RangePicker:W}=ne.DatePicker,J={ENTER:"Enter"},Q=()=>Math.random().toString(36).substring(2,9),oe=(i,s)=>{const k=r.useRef(s);r.useEffect(()=>{k.current=s},[s]),r.useEffect(()=>{const f=o=>k.current(o);return document.addEventListener(i,f),()=>{document.removeEventListener(i,f)}},[i])},X=({onCalendarChange:i=void 0,onChange:s,required:k,label:f,startDate:o,endDate:d,errorMessage:m,className:M,id:l,disabled:j=!1,dateFormat:v,shouldPopOnParent:B=!0,getPopupContainer:b,maxDateRange:u,open:C,onOpenChange:S,placement:L="bottomLeft",renderAsIconButton:N=!1,iconButtonClassName:Z,iconClassName:G,labelExtra:T,inputEmphasis:F="default",presets:P})=>{const q=F==="modified"&&!m,y=F==="deleted"&&!m,R=F==="success"&&!m,z=q?"var(--Warning-50, #FFFAEB)":y?"var(--Error-50, #FEF2F2)":R?"var(--Success-50, #F0FDF4)":"",E=q?"var(--Warning-200, #FEDF89)":y?"var(--Error-200, #FECACA)":R?"var(--Success-200, #BBF7D0)":"",[D,x]=r.useState(!1),[$,K]=r.useState(!1),h=r.useRef(null),_=r.useRef(null),I=r.useRef(!1),g=r.useRef(!1),a=e=>e?A(e):null,w=`date-range-start-${Q()}`,O=`date-range-end-${Q()}`,ee=()=>{x(!0),setTimeout(()=>{h.current&&h.current.focus()},0)};oe("keydown",e=>{if(e.key===J.ENTER&&document.activeElement instanceof HTMLInputElement){if(document?.activeElement?.id===w){const n=A(document?.activeElement?.value);n.isValid()&&s([n,a(d)])}if(document?.activeElement?.id===O){const n=A(document?.activeElement?.value);n.isValid()&&s([a(o),n])}}});const H=r.useCallback(e=>{const[n,c]=[a(o),a(d)];return u?n?e.isBefore(n.startOf("day"))||e.isAfter(n.add(u,"day").endOf("day")):c?e.isBefore(c.subtract(u,"day").startOf("day"))||e.isAfter(c.endOf("day")):!1:!1},[o,d,u]),U=r.useCallback(e=>{if(e.key===J.ENTER&&!(N?D:C??$)){e.preventDefault(),e.stopPropagation();const c=e.target.closest("form");if(c){const V=c.querySelector('button[type="submit"]');V?V.click():c.requestSubmit()}}},[N,D,C,$]),te=r.useCallback(e=>{if(e&&I.current){I.current=!1,x(!1);return}x(e),e||(I.current=!0,requestAnimationFrame(()=>{h.current?.focus(),requestAnimationFrame(()=>{I.current=!1})}))},[]),re=r.useCallback(e=>{if(e&&g.current){g.current=!1,K(!1),S?.(!1);return}K(e),S?.(e),e||(g.current=!0,requestAnimationFrame(()=>{_.current?.focus(),requestAnimationFrame(()=>{g.current=!1})}))},[S]);return N?t.jsxs("div",{id:l,className:M,onKeyDownCapture:U,children:[t.jsx(se,{onClick:ee,disabled:j,variant:"default",className:Z,children:t.jsx(p.CalendarMonthIcon,{size:20,className:Y("w-5 h-5",G)})}),t.jsx(W,{ref:h,onChange:e=>{s(e),x(!1)},onCalendarChange:i,value:[a(o),a(d)],id:{start:w,end:O},allowClear:!0,format:v||"DD MMM, YYYY",separator:t.jsx(p.CheckIndeterminateSmallFilledIcon,{size:20,className:"text-neutral-400 dark:text-gray-100"}),suffixIcon:t.jsx(p.CalendarMonthIcon,{size:14,className:"text-neutral-400 dark:text-gray-100"}),getPopupContainer:b||(B?e=>e.parentElement:()=>document.body),disabled:j,disabledDate:u?H:void 0,autoComplete:"off",open:D,onOpenChange:te,placement:L,presets:P,style:{position:"absolute",opacity:0,pointerEvents:"none",width:0,height:0}})]}):t.jsxs("div",{id:l,className:Y("flex flex-col",M),onKeyDownCapture:U,children:[(f||T)&&t.jsxs("div",{className:"mb-1 flex items-center justify-between gap-1",children:[t.jsx(ae.InputLabel,{label:f||"",required:k||!1}),T]}),(z||E)&&t.jsx("style",{children:`
           #${l} .ant-picker {
-            background-color: ${P} !important;
+            background-color: ${z} !important;
             border-color: ${E} !important;
           }
           #${l} .ant-picker:hover {
@@ -13,5 +13,5 @@
           #${l} .ant-picker .ant-picker-input > input {
             color: ${y?"#475467":R?"#101828":"inherit"};
           }
-        `}),t.jsx(V,{ref:K,onChange:s,onCalendarChange:i,value:[a(o),a(d)],id:{start:w,end:O},allowClear:!0,format:v||"DD MMM, YYYY",separator:t.jsx(p.CheckIndeterminateSmallFilledIcon,{size:20,className:"text-neutral-400 dark:text-gray-100"}),suffixIcon:t.jsx(p.CalendarMonthIcon,{size:14,className:"text-neutral-400 dark:text-gray-100"}),getPopupContainer:b||(B?e=>e.parentElement:()=>document.body),disabled:j,disabledDate:u?_:void 0,open:C??$,onOpenChange:te,autoComplete:"off",placement:L}),m&&t.jsx("p",{className:Y("text-sm font-inter font-normal text-left pt-[6px]","text-red-500"),children:m})]})};Q.displayName="DateRange";exports.DateRange=Q;
+        `}),t.jsx(W,{ref:_,onChange:s,onCalendarChange:i,value:[a(o),a(d)],id:{start:w,end:O},allowClear:!0,format:v||"DD MMM, YYYY",separator:t.jsx(p.CheckIndeterminateSmallFilledIcon,{size:20,className:"text-neutral-400 dark:text-gray-100"}),suffixIcon:t.jsx(p.CalendarMonthIcon,{size:14,className:"text-neutral-400 dark:text-gray-100"}),getPopupContainer:b||(B?e=>e.parentElement:()=>document.body),disabled:j,disabledDate:u?H:void 0,open:C??$,onOpenChange:re,autoComplete:"off",placement:L,presets:P}),m&&t.jsx("p",{className:Y("text-sm font-inter font-normal text-left pt-[6px]","text-red-500"),children:m})]})};X.displayName="DateRange";exports.DateRange=X;
 //# sourceMappingURL=DateRange.cjs.js.map

package/dist/components/forms/date-range/DateRange.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRange.cjs.js","sources":["../../../../src/components/forms/date-range/DateRange.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport { DatePicker } from \"antd\";\nimport cn from \"classnames\";\nimport React from \"react\";\nimport dayjs from \"dayjs\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { CalendarMonthIcon, CheckIndeterminateSmallFilledIcon } from '../../icon';\n\nconst { RangePicker } = DatePicker;\n\n// Keyboard keys constant\nconst KEYBOARD_KEYS = {\n ENTER: \"Enter\",\n} as const;\n\n/\n Generate a short UUID\n /\nconst generateShortUUID = (): string => {\n return Math.random().toString(36).substring(2, 9);\n};\n\n/\n Hook to add event listeners\n /\nconst useEventListener = <K extends keyof DocumentEventMap>(\n eventName: K,\n handler: (event: DocumentEventMap[K]) => void\n) => {\n const savedHandler = useRef(handler);\n\n useEffect(() => {\n savedHandler.current = handler;\n }, [handler]);\n\n useEffect(() => {\n const eventListener = (event: DocumentEventMap[K]) =>\n savedHandler.current(event);\n document.addEventListener(eventName, eventListener);\n return () => {\n document.removeEventListener(eventName, eventListener);\n };\n }, [eventName]);\n};\n\n/\n Props for the DateRange component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TDateRangeProps = {\n /* Unique identifier for the date range /\n id: string;\n /* Label text to display above the date range /\n label?: string;\n /* Start date value (ISO string or formatted date string) /\n startDate: string;\n /* End date value (ISO string or formatted date string) /\n endDate: string;\n /* Callback function called when date range changes /\n onChange(data: any): void;\n /* Callback function called when calendar selection changes /\n onCalendarChange?(data: any): void;\n /* Whether the field is required /\n required?: boolean;\n /* Error message to display below the date range /\n errorMessage?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether the date range is disabled /\n disabled?: boolean;\n /* Custom date format /\n dateFormat?: string;\n /* Whether popup should render inside parent element /\n shouldPopOnParent?: boolean;\n /* Custom function to get popup container /\n getPopupContainer?: (trigger: HTMLElement \| null) => HTMLElement;\n /* Maximum date range in days /\n maxDateRange?: number;\n /* Whether the picker is open /\n open?: boolean;\n /* Callback function called when open state changes /\n onOpenChange?(open: boolean): void;\n /* Placement of the dropdown /\n placement?: \"bottomLeft\" \| \"bottomRight\" \| \"topLeft\" \| \"topRight\";\n /* Whether to render as an icon button that triggers the date picker /\n renderAsIconButton?: boolean;\n /* Additional CSS classes for the icon button /\n iconButtonClassName?: string;\n /* Additional CSS classes for the calendar icon inside the button /\n iconClassName?: string;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors; `'success'` — Success colors. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n};\n\n/\n A date range picker component with label, validation, and styling support.\n * Features proper date handling, validation, and comprehensive prop support.\n * Built on top of Ant Design's RangePicker for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * DateRange component.\n \n @example\n * ```tsx\n * <DateRange\n * id=\"event-dates\"\n * label=\"Event Duration\"\n * startDate={startDate}\n * endDate={endDate}\n * onChange={(dates) => {\n * setStartDate(dates[0]);\n * setEndDate(dates[1]);\n * }}\n * required\n * />\n * ```\n */\nexport const DateRange = ({\n onCalendarChange = undefined,\n onChange,\n required,\n label,\n startDate,\n endDate,\n errorMessage,\n className,\n id,\n disabled = false,\n dateFormat,\n shouldPopOnParent = true,\n getPopupContainer: customGetPopupContainer,\n maxDateRange,\n open,\n onOpenChange,\n placement = \"bottomLeft\",\n renderAsIconButton = false,\n iconButtonClassName,\n iconClassName,\n labelExtra,\n inputEmphasis = \"default\",\n}: TDateRangeProps) => {\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage;\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage;\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage;\n const emphasisBg =\n emphasisModifiedSkin ? \"var(--Warning-50, #FFFAEB)\" :\n emphasisDeletedSkin ? \"var(--Error-50, #FEF2F2)\" :\n emphasisSuccessSkin ? \"var(--Success-50, #F0FDF4)\" : \"\";\n const emphasisBorder =\n emphasisModifiedSkin ? \"var(--Warning-200, #FEDF89)\" :\n emphasisDeletedSkin ? \"var(--Error-200, #FECACA)\" :\n emphasisSuccessSkin ? \"var(--Success-200, #BBF7D0)\" : \"\";\n const [isOpen, setIsOpen] = useState(false);\n const [isNormalPickerOpen, setIsNormalPickerOpen] = useState(false);\n const pickerRef = useRef<any>(null);\n const normalPickerRef = useRef<any>(null);\n const suppressNextIconOpenRef = useRef(false);\n const suppressNextNormalOpenRef = useRef(false);\n\n const parseDate = (str: string \| number \| Date \| dayjs.Dayjs) => {\n if (!str) return null;\n return dayjs(str);\n };\n\n const START_ID = `date-range-start-${generateShortUUID()}`;\n const END_ID = `date-range-end-${generateShortUUID()}`;\n\n const handleIconClick = () => {\n setIsOpen(true);\n setTimeout(() => {\n if (pickerRef.current) {\n pickerRef.current.focus();\n }\n }, 0);\n };\n\n useEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (\n e.key === KEYBOARD_KEYS.ENTER &&\n document.activeElement instanceof HTMLInputElement\n ) {\n if (document?.activeElement?.id === START_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([date, parseDate(endDate)]);\n }\n }\n if (document?.activeElement?.id === END_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([parseDate(startDate), date]);\n }\n }\n }\n });\n\n const disabledDate = useCallback(\n (current: dayjs.Dayjs) => {\n const [start, end] = [parseDate(startDate), parseDate(endDate)];\n\n if (!maxDateRange) return false;\n\n if (start) {\n return (\n current.isBefore(start.startOf(\"day\")) \|\|\n current.isAfter(start.add(maxDateRange, \"day\").endOf(\"day\"))\n );\n }\n\n if (end) {\n return (\n current.isBefore(end.subtract(maxDateRange, \"day\").startOf(\"day\")) \|\|\n current.isAfter(end.endOf(\"day\"))\n );\n }\n\n return false;\n },\n [startDate, endDate, maxDateRange]\n );\n\n const handleKeyDownCapture = useCallback((e: React.KeyboardEvent) => {\n if (e.key === KEYBOARD_KEYS.ENTER) {\n const pickerIsOpen = renderAsIconButton ? isOpen : (open ?? isNormalPickerOpen);\n if (!pickerIsOpen) {\n e.preventDefault();\n e.stopPropagation();\n\n const form = (e.target as HTMLElement).closest('form');\n if (form) {\n const submitBtn = form.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n if (submitBtn) {\n submitBtn.click();\n } else {\n form.requestSubmit();\n }\n }\n }\n }\n }, [renderAsIconButton, isOpen, open, isNormalPickerOpen]);\n\n const handleIconPickerOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextIconOpenRef.current) {\n suppressNextIconOpenRef.current = false;\n setIsOpen(false);\n return;\n }\n\n setIsOpen(nextOpen);\n if (!nextOpen) {\n suppressNextIconOpenRef.current = true;\n requestAnimationFrame(() => {\n pickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextIconOpenRef.current = false;\n });\n });\n }\n }, []);\n\n const handleNormalOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextNormalOpenRef.current) {\n suppressNextNormalOpenRef.current = false;\n setIsNormalPickerOpen(false);\n onOpenChange?.(false);\n return;\n }\n\n setIsNormalPickerOpen(nextOpen);\n onOpenChange?.(nextOpen);\n if (!nextOpen) {\n suppressNextNormalOpenRef.current = true;\n requestAnimationFrame(() => {\n normalPickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextNormalOpenRef.current = false;\n });\n });\n }\n }, [onOpenChange]);\n\n if (renderAsIconButton) {\n return (\n <div id={id} className={className} onKeyDownCapture={handleKeyDownCapture}>\n <IconButton\n onClick={handleIconClick}\n disabled={disabled}\n variant=\"default\"\n className={iconButtonClassName}\n >\n <CalendarMonthIcon size={20} className={cn(\"w-5 h-5\", iconClassName)} />\n </IconButton>\n <RangePicker\n ref={pickerRef}\n onChange={(dates) => {\n onChange(dates);\n setIsOpen(false);\n }}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={<CheckIndeterminateSmallFilledIcon size={20} className=\"text-neutral-400 dark:text-gray-100\" />}\n suffixIcon={<CalendarMonthIcon size={14} className=\"text-neutral-400 dark:text-gray-100\" />}\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n autoComplete=\"off\"\n open={isOpen}\n onOpenChange={handleIconPickerOpenChange}\n placement={placement}\n style={{ position: \"absolute\", opacity: 0, pointerEvents: \"none\", width: 0, height: 0 }}\n />\n </div>\n );\n }\n\n return (\n <div id={id} className={cn(\"flex flex-col\", className)} onKeyDownCapture={handleKeyDownCapture}>\n {(label \|\| labelExtra) && (\n <div className=\"mb-1 flex items-center justify-between gap-1\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n {labelExtra}\n </div>\n )}\n {(emphasisBg \|\| emphasisBorder) && (\n <style>{`\n #${id} .ant-picker {\n background-color: ${emphasisBg} !important;\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker:hover {\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker.ant-picker-focused {\n border-color: ${emphasisBorder} !important;\n box-shadow: 0 0 0 2px ${emphasisDeletedSkin ? \"rgba(254,202,202,0.45)\" : emphasisModifiedSkin ? \"rgba(254,223,137,0.45)\" : \"rgba(187,247,208,0.45)\"} !important;\n }\n #${id} .ant-picker .ant-picker-input > input {\n color: ${emphasisDeletedSkin ? \"#475467\" : emphasisSuccessSkin ? \"#101828\" : \"inherit\"};\n }\n `}</style>\n )}\n <RangePicker\n ref={normalPickerRef}\n onChange={onChange}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={\n <CheckIndeterminateSmallFilledIcon size={20} className='text-neutral-400 dark:text-gray-100' />\n }\n suffixIcon={\n <CalendarMonthIcon size={14} className='text-neutral-400 dark:text-gray-100' />\n }\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n open={open ?? isNormalPickerOpen}\n onOpenChange={handleNormalOpenChange}\n autoComplete=\"off\"\n placement={placement}\n />\n {errorMessage && (\n <p\n className={cn(\n \"text-sm font-inter font-normal text-left pt-[6px]\",\n \"text-red-500\"\n )}\n >\n {errorMessage}\n </p>\n )}\n </div>\n );\n};\n\nDateRange.displayName = \"DateRange\";\n\n"],"names":["RangePicker","DatePicker","KEYBOARD_KEYS","generateShortUUID","useEventListener","eventName","handler","savedHandler","useRef","useEffect","eventListener","event","DateRange","onCalendarChange","onChange","required","label","startDate","endDate","errorMessage","className","id","disabled","dateFormat","shouldPopOnParent","customGetPopupContainer","maxDateRange","open","onOpenChange","placement","renderAsIconButton","iconButtonClassName","iconClassName","labelExtra","inputEmphasis","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","emphasisBg","emphasisBorder","isOpen","setIsOpen","useState","isNormalPickerOpen","setIsNormalPickerOpen","pickerRef","normalPickerRef","suppressNextIconOpenRef","suppressNextNormalOpenRef","parseDate","str","dayjs","START_ID","END_ID","handleIconClick","date","disabledDate","useCallback","current","start","end","handleKeyDownCapture","form","submitBtn","handleIconPickerOpenChange","nextOpen","handleNormalOpenChange","jsxs","jsx","IconButton","CalendarMonthIcon","cn","dates","CheckIndeterminateSmallFilledIcon","trigger","InputLabel"],"mappings":"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"}
1	+ {"version":3,"file":"DateRange.cjs.js","sources":["../../../../src/components/forms/date-range/DateRange.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport { DatePicker } from \"antd\";\nimport cn from \"classnames\";\nimport React from \"react\";\nimport dayjs from \"dayjs\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { CalendarMonthIcon, CheckIndeterminateSmallFilledIcon } from '../../icon';\n\nconst { RangePicker } = DatePicker;\n\n// Keyboard keys constant\nconst KEYBOARD_KEYS = {\n ENTER: \"Enter\",\n} as const;\n\n/\n Generate a short UUID\n /\nconst generateShortUUID = (): string => {\n return Math.random().toString(36).substring(2, 9);\n};\n\n/\n Hook to add event listeners\n /\nconst useEventListener = <K extends keyof DocumentEventMap>(\n eventName: K,\n handler: (event: DocumentEventMap[K]) => void\n) => {\n const savedHandler = useRef(handler);\n\n useEffect(() => {\n savedHandler.current = handler;\n }, [handler]);\n\n useEffect(() => {\n const eventListener = (event: DocumentEventMap[K]) =>\n savedHandler.current(event);\n document.addEventListener(eventName, eventListener);\n return () => {\n document.removeEventListener(eventName, eventListener);\n };\n }, [eventName]);\n};\n\n/\n Props for the DateRange component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TDateRangeProps = {\n /* Unique identifier for the date range /\n id: string;\n /* Label text to display above the date range /\n label?: string;\n /* Start date value (ISO string or formatted date string) /\n startDate: string;\n /* End date value (ISO string or formatted date string) /\n endDate: string;\n /* Callback function called when date range changes /\n onChange(data: any): void;\n /* Callback function called when calendar selection changes /\n onCalendarChange?(data: any): void;\n /* Whether the field is required /\n required?: boolean;\n /* Error message to display below the date range /\n errorMessage?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether the date range is disabled /\n disabled?: boolean;\n /* Custom date format /\n dateFormat?: string;\n /* Whether popup should render inside parent element /\n shouldPopOnParent?: boolean;\n /* Custom function to get popup container /\n getPopupContainer?: (trigger: HTMLElement \| null) => HTMLElement;\n /* Maximum date range in days /\n maxDateRange?: number;\n /* Whether the picker is open /\n open?: boolean;\n /* Callback function called when open state changes /\n onOpenChange?(open: boolean): void;\n /* Placement of the dropdown /\n placement?: \"bottomLeft\" \| \"bottomRight\" \| \"topLeft\" \| \"topRight\";\n /* Preset date ranges shown in the picker dropdown /\n presets?: { label: React.ReactNode; value: any }[];\n /* Whether to render as an icon button that triggers the date picker /\n renderAsIconButton?: boolean;\n /* Additional CSS classes for the icon button /\n iconButtonClassName?: string;\n /* Additional CSS classes for the calendar icon inside the button /\n iconClassName?: string;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors; `'success'` — Success colors. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n};\n\n/\n A date range picker component with label, validation, and styling support.\n * Features proper date handling, validation, and comprehensive prop support.\n * Built on top of Ant Design's RangePicker for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * DateRange component.\n \n @example\n * ```tsx\n * <DateRange\n * id=\"event-dates\"\n * label=\"Event Duration\"\n * startDate={startDate}\n * endDate={endDate}\n * onChange={(dates) => {\n * setStartDate(dates[0]);\n * setEndDate(dates[1]);\n * }}\n * required\n * />\n * ```\n */\nexport const DateRange = ({\n onCalendarChange = undefined,\n onChange,\n required,\n label,\n startDate,\n endDate,\n errorMessage,\n className,\n id,\n disabled = false,\n dateFormat,\n shouldPopOnParent = true,\n getPopupContainer: customGetPopupContainer,\n maxDateRange,\n open,\n onOpenChange,\n placement = \"bottomLeft\",\n renderAsIconButton = false,\n iconButtonClassName,\n iconClassName,\n labelExtra,\n inputEmphasis = \"default\",\n presets,\n}: TDateRangeProps) => {\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage;\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage;\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage;\n const emphasisBg =\n emphasisModifiedSkin ? \"var(--Warning-50, #FFFAEB)\" :\n emphasisDeletedSkin ? \"var(--Error-50, #FEF2F2)\" :\n emphasisSuccessSkin ? \"var(--Success-50, #F0FDF4)\" : \"\";\n const emphasisBorder =\n emphasisModifiedSkin ? \"var(--Warning-200, #FEDF89)\" :\n emphasisDeletedSkin ? \"var(--Error-200, #FECACA)\" :\n emphasisSuccessSkin ? \"var(--Success-200, #BBF7D0)\" : \"\";\n const [isOpen, setIsOpen] = useState(false);\n const [isNormalPickerOpen, setIsNormalPickerOpen] = useState(false);\n const pickerRef = useRef<any>(null);\n const normalPickerRef = useRef<any>(null);\n const suppressNextIconOpenRef = useRef(false);\n const suppressNextNormalOpenRef = useRef(false);\n\n const parseDate = (str: string \| number \| Date \| dayjs.Dayjs) => {\n if (!str) return null;\n return dayjs(str);\n };\n\n const START_ID = `date-range-start-${generateShortUUID()}`;\n const END_ID = `date-range-end-${generateShortUUID()}`;\n\n const handleIconClick = () => {\n setIsOpen(true);\n setTimeout(() => {\n if (pickerRef.current) {\n pickerRef.current.focus();\n }\n }, 0);\n };\n\n useEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (\n e.key === KEYBOARD_KEYS.ENTER &&\n document.activeElement instanceof HTMLInputElement\n ) {\n if (document?.activeElement?.id === START_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([date, parseDate(endDate)]);\n }\n }\n if (document?.activeElement?.id === END_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([parseDate(startDate), date]);\n }\n }\n }\n });\n\n const disabledDate = useCallback(\n (current: dayjs.Dayjs) => {\n const [start, end] = [parseDate(startDate), parseDate(endDate)];\n\n if (!maxDateRange) return false;\n\n if (start) {\n return (\n current.isBefore(start.startOf(\"day\")) \|\|\n current.isAfter(start.add(maxDateRange, \"day\").endOf(\"day\"))\n );\n }\n\n if (end) {\n return (\n current.isBefore(end.subtract(maxDateRange, \"day\").startOf(\"day\")) \|\|\n current.isAfter(end.endOf(\"day\"))\n );\n }\n\n return false;\n },\n [startDate, endDate, maxDateRange]\n );\n\n const handleKeyDownCapture = useCallback((e: React.KeyboardEvent) => {\n if (e.key === KEYBOARD_KEYS.ENTER) {\n const pickerIsOpen = renderAsIconButton ? isOpen : (open ?? isNormalPickerOpen);\n if (!pickerIsOpen) {\n e.preventDefault();\n e.stopPropagation();\n\n const form = (e.target as HTMLElement).closest('form');\n if (form) {\n const submitBtn = form.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n if (submitBtn) {\n submitBtn.click();\n } else {\n form.requestSubmit();\n }\n }\n }\n }\n }, [renderAsIconButton, isOpen, open, isNormalPickerOpen]);\n\n const handleIconPickerOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextIconOpenRef.current) {\n suppressNextIconOpenRef.current = false;\n setIsOpen(false);\n return;\n }\n\n setIsOpen(nextOpen);\n if (!nextOpen) {\n suppressNextIconOpenRef.current = true;\n requestAnimationFrame(() => {\n pickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextIconOpenRef.current = false;\n });\n });\n }\n }, []);\n\n const handleNormalOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextNormalOpenRef.current) {\n suppressNextNormalOpenRef.current = false;\n setIsNormalPickerOpen(false);\n onOpenChange?.(false);\n return;\n }\n\n setIsNormalPickerOpen(nextOpen);\n onOpenChange?.(nextOpen);\n if (!nextOpen) {\n suppressNextNormalOpenRef.current = true;\n requestAnimationFrame(() => {\n normalPickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextNormalOpenRef.current = false;\n });\n });\n }\n }, [onOpenChange]);\n\n if (renderAsIconButton) {\n return (\n <div id={id} className={className} onKeyDownCapture={handleKeyDownCapture}>\n <IconButton\n onClick={handleIconClick}\n disabled={disabled}\n variant=\"default\"\n className={iconButtonClassName}\n >\n <CalendarMonthIcon size={20} className={cn(\"w-5 h-5\", iconClassName)} />\n </IconButton>\n <RangePicker\n ref={pickerRef}\n onChange={(dates) => {\n onChange(dates);\n setIsOpen(false);\n }}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={<CheckIndeterminateSmallFilledIcon size={20} className=\"text-neutral-400 dark:text-gray-100\" />}\n suffixIcon={<CalendarMonthIcon size={14} className=\"text-neutral-400 dark:text-gray-100\" />}\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n autoComplete=\"off\"\n open={isOpen}\n onOpenChange={handleIconPickerOpenChange}\n placement={placement}\n presets={presets}\n style={{ position: \"absolute\", opacity: 0, pointerEvents: \"none\", width: 0, height: 0 }}\n />\n </div>\n );\n }\n\n return (\n <div id={id} className={cn(\"flex flex-col\", className)} onKeyDownCapture={handleKeyDownCapture}>\n {(label \|\| labelExtra) && (\n <div className=\"mb-1 flex items-center justify-between gap-1\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n {labelExtra}\n </div>\n )}\n {(emphasisBg \|\| emphasisBorder) && (\n <style>{`\n #${id} .ant-picker {\n background-color: ${emphasisBg} !important;\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker:hover {\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker.ant-picker-focused {\n border-color: ${emphasisBorder} !important;\n box-shadow: 0 0 0 2px ${emphasisDeletedSkin ? \"rgba(254,202,202,0.45)\" : emphasisModifiedSkin ? \"rgba(254,223,137,0.45)\" : \"rgba(187,247,208,0.45)\"} !important;\n }\n #${id} .ant-picker .ant-picker-input > input {\n color: ${emphasisDeletedSkin ? \"#475467\" : emphasisSuccessSkin ? \"#101828\" : \"inherit\"};\n }\n `}</style>\n )}\n <RangePicker\n ref={normalPickerRef}\n onChange={onChange}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={\n <CheckIndeterminateSmallFilledIcon size={20} className='text-neutral-400 dark:text-gray-100' />\n }\n suffixIcon={\n <CalendarMonthIcon size={14} className='text-neutral-400 dark:text-gray-100' />\n }\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n open={open ?? isNormalPickerOpen}\n onOpenChange={handleNormalOpenChange}\n autoComplete=\"off\"\n placement={placement}\n presets={presets}\n />\n {errorMessage && (\n <p\n className={cn(\n \"text-sm font-inter font-normal text-left pt-[6px]\",\n \"text-red-500\"\n )}\n >\n {errorMessage}\n </p>\n )}\n </div>\n );\n};\n\nDateRange.displayName = \"DateRange\";\n\n"],"names":["RangePicker","DatePicker","KEYBOARD_KEYS","generateShortUUID","useEventListener","eventName","handler","savedHandler","useRef","useEffect","eventListener","event","DateRange","onCalendarChange","onChange","required","label","startDate","endDate","errorMessage","className","id","disabled","dateFormat","shouldPopOnParent","customGetPopupContainer","maxDateRange","open","onOpenChange","placement","renderAsIconButton","iconButtonClassName","iconClassName","labelExtra","inputEmphasis","presets","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","emphasisBg","emphasisBorder","isOpen","setIsOpen","useState","isNormalPickerOpen","setIsNormalPickerOpen","pickerRef","normalPickerRef","suppressNextIconOpenRef","suppressNextNormalOpenRef","parseDate","str","dayjs","START_ID","END_ID","handleIconClick","date","disabledDate","useCallback","current","start","end","handleKeyDownCapture","form","submitBtn","handleIconPickerOpenChange","nextOpen","handleNormalOpenChange","jsxs","jsx","IconButton","CalendarMonthIcon","cn","dates","CheckIndeterminateSmallFilledIcon","trigger","InputLabel"],"mappings":"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"}

package/dist/components/forms/date-range/DateRange.d.ts CHANGED Viewed

@@ -38,6 +38,11 @@ export type TDateRangeProps = {
     onOpenChange?(open: boolean): void;
     /** Placement of the dropdown */
     placement?: "bottomLeft" | "bottomRight" | "topLeft" | "topRight";
+    /** Preset date ranges shown in the picker dropdown */
+    presets?: {
+        label: React.ReactNode;
+        value: any;
+    }[];
     /** Whether to render as an icon button that triggers the date picker */
     renderAsIconButton?: boolean;
     /** Additional CSS classes for the icon button */
@@ -73,6 +78,6 @@ export type TDateRangeProps = {
  * ```
  */
 export declare const DateRange: {
-    ({ onCalendarChange, onChange, required, label, startDate, endDate, errorMessage, className, id, disabled, dateFormat, shouldPopOnParent, getPopupContainer: customGetPopupContainer, maxDateRange, open, onOpenChange, placement, renderAsIconButton, iconButtonClassName, iconClassName, labelExtra, inputEmphasis, }: TDateRangeProps): import("react/jsx-runtime").JSX.Element;
+    ({ onCalendarChange, onChange, required, label, startDate, endDate, errorMessage, className, id, disabled, dateFormat, shouldPopOnParent, getPopupContainer: customGetPopupContainer, maxDateRange, open, onOpenChange, placement, renderAsIconButton, iconButtonClassName, iconClassName, labelExtra, inputEmphasis, presets, }: TDateRangeProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/components/forms/date-range/DateRange.es.js CHANGED Viewed

@@ -1,29 +1,29 @@
 import { jsxs as R, jsx as t } from "react/jsx-runtime";
-import { DatePicker as ie } from "antd";
+import { DatePicker as ae } from "antd";
 import q from "../../../_virtual/index.es.js";
-import { useState as J, useRef as m, useCallback as I, useEffect as Q } from "react";
+import { useState as Q, useRef as m, useCallback as I, useEffect as X } from "react";
 import L from "dayjs";
-import ae from "../../button/IconButton.es.js";
-import { InputLabel as ce } from "../shared/InputLabel.es.js";
-import { CalendarMonthIcon as T, CheckIndeterminateSmallFilledIcon as X } from "../../icon/icons.generated.es.js";
-const { RangePicker: Z } = ie, G = {
+import ce from "../../button/IconButton.es.js";
+import { InputLabel as le } from "../shared/InputLabel.es.js";
+import { CalendarMonthIcon as T, CheckIndeterminateSmallFilledIcon as Z } from "../../icon/icons.generated.es.js";
+const { RangePicker: G } = ae, ee = {
   ENTER: "Enter"
-}, ee = () => Math.random().toString(36).substring(2, 9), le = (a, n) => {
+}, te = () => Math.random().toString(36).substring(2, 9), fe = (a, n) => {
   const p = m(n);
-  Q(() => {
+  X(() => {
     p.current = n;
-  }, [n]), Q(() => {
-    const f = (o) => p.current(o);
+  }, [n]), X(() => {
+    const f = (s) => p.current(s);
     return document.addEventListener(a, f), () => {
       document.removeEventListener(a, f);
     };
   }, [a]);
-}, fe = ({
+}, ue = ({
   onCalendarChange: a = void 0,
   onChange: n,
   required: p,
   label: f,
-  startDate: o,
+  startDate: s,
   endDate: u,
   errorMessage: d,
   className: M,
@@ -37,41 +37,42 @@ const { RangePicker: Z } = ie, G = {
   onOpenChange: x,
   placement: K = "bottomLeft",
   renderAsIconButton: C = !1,
-  iconButtonClassName: te,
-  iconClassName: re,
+  iconButtonClassName: re,
+  iconClassName: ne,
   labelExtra: P,
-  inputEmphasis: $ = "default"
+  inputEmphasis: $ = "default",
+  presets: j
 }) => {
-  const D = $ === "modified" && !d, y = $ === "deleted" && !d, w = $ === "success" && !d, j = D ? "var(--Warning-50, #FFFAEB)" : y ? "var(--Error-50, #FEF2F2)" : w ? "var(--Success-50, #F0FDF4)" : "", E = D ? "var(--Warning-200, #FEDF89)" : y ? "var(--Error-200, #FECACA)" : w ? "var(--Success-200, #BBF7D0)" : "", [Y, b] = J(!1), [A, _] = J(!1), h = m(null), H = m(null), N = m(!1), g = m(!1), s = (e) => e ? L(e) : null, O = `date-range-start-${ee()}`, B = `date-range-end-${ee()}`, ne = () => {
+  const D = $ === "modified" && !d, y = $ === "deleted" && !d, w = $ === "success" && !d, _ = D ? "var(--Warning-50, #FFFAEB)" : y ? "var(--Error-50, #FEF2F2)" : w ? "var(--Success-50, #F0FDF4)" : "", E = D ? "var(--Warning-200, #FEDF89)" : y ? "var(--Error-200, #FECACA)" : w ? "var(--Success-200, #BBF7D0)" : "", [Y, b] = Q(!1), [A, H] = Q(!1), h = m(null), U = m(null), N = m(!1), g = m(!1), o = (e) => e ? L(e) : null, O = `date-range-start-${te()}`, B = `date-range-end-${te()}`, oe = () => {
     b(!0), setTimeout(() => {
       h.current && h.current.focus();
     }, 0);
   };
-  le("keydown", (e) => {
-    if (e.key === G.ENTER && document.activeElement instanceof HTMLInputElement) {
+  fe("keydown", (e) => {
+    if (e.key === ee.ENTER && document.activeElement instanceof HTMLInputElement) {
       if (document?.activeElement?.id === O) {
         const r = L(document?.activeElement?.value);
-        r.isValid() && n([r, s(u)]);
+        r.isValid() && n([r, o(u)]);
       }
       if (document?.activeElement?.id === B) {
         const r = L(document?.activeElement?.value);
-        r.isValid() && n([s(o), r]);
+        r.isValid() && n([o(s), r]);
       }
     }
   });
-  const U = I(
+  const V = I(
     (e) => {
-      const [r, i] = [s(o), s(u)];
+      const [r, i] = [o(s), o(u)];
       return l ? r ? e.isBefore(r.startOf("day")) || e.isAfter(r.add(l, "day").endOf("day")) : i ? e.isBefore(i.subtract(l, "day").startOf("day")) || e.isAfter(i.endOf("day")) : !1 : !1;
     },
-    [o, u, l]
-  ), V = I((e) => {
-    if (e.key === G.ENTER && !(C ? Y : S ?? A)) {
+    [s, u, l]
+  ), W = I((e) => {
+    if (e.key === ee.ENTER && !(C ? Y : S ?? A)) {
       e.preventDefault(), e.stopPropagation();
       const i = e.target.closest("form");
       if (i) {
-        const W = i.querySelector('button[type="submit"]');
-        W ? W.click() : i.requestSubmit();
+        const J = i.querySelector('button[type="submit"]');
+        J ? J.click() : i.requestSubmit();
       }
     }
   }, [C, Y, S, A]), se = I((e) => {
@@ -84,60 +85,61 @@ const { RangePicker: Z } = ie, G = {
         N.current = !1;
       });
     }));
-  }, []), oe = I((e) => {
+  }, []), ie = I((e) => {
     if (e && g.current) {
-      g.current = !1, _(!1), x?.(!1);
+      g.current = !1, H(!1), x?.(!1);
       return;
     }
-    _(e), x?.(e), e || (g.current = !0, requestAnimationFrame(() => {
-      H.current?.focus(), requestAnimationFrame(() => {
+    H(e), x?.(e), e || (g.current = !0, requestAnimationFrame(() => {
+      U.current?.focus(), requestAnimationFrame(() => {
         g.current = !1;
       });
     }));
   }, [x]);
-  return C ? /* @__PURE__ */ R("div", { id: c, className: M, onKeyDownCapture: V, children: [
+  return C ? /* @__PURE__ */ R("div", { id: c, className: M, onKeyDownCapture: W, children: [
     /* @__PURE__ */ t(
-      ae,
+      ce,
       {
-        onClick: ne,
+        onClick: oe,
         disabled: F,
         variant: "default",
-        className: te,
-        children: /* @__PURE__ */ t(T, { size: 20, className: q("w-5 h-5", re) })
+        className: re,
+        children: /* @__PURE__ */ t(T, { size: 20, className: q("w-5 h-5", ne) })
       }
     ),
     /* @__PURE__ */ t(
-      Z,
+      G,
       {
         ref: h,
         onChange: (e) => {
           n(e), b(!1);
         },
         onCalendarChange: a,
-        value: [s(o), s(u)],
+        value: [o(s), o(u)],
         id: { start: O, end: B },
         allowClear: !0,
         format: k || "DD MMM, YYYY",
-        separator: /* @__PURE__ */ t(X, { size: 20, className: "text-neutral-400 dark:text-gray-100" }),
+        separator: /* @__PURE__ */ t(Z, { size: 20, className: "text-neutral-400 dark:text-gray-100" }),
         suffixIcon: /* @__PURE__ */ t(T, { size: 14, className: "text-neutral-400 dark:text-gray-100" }),
         getPopupContainer: v || (z ? (e) => e.parentElement : () => document.body),
         disabled: F,
-        disabledDate: l ? U : void 0,
+        disabledDate: l ? V : void 0,
         autoComplete: "off",
         open: Y,
         onOpenChange: se,
         placement: K,
+        presets: j,
         style: { position: "absolute", opacity: 0, pointerEvents: "none", width: 0, height: 0 }
       }
     )
-  ] }) : /* @__PURE__ */ R("div", { id: c, className: q("flex flex-col", M), onKeyDownCapture: V, children: [
+  ] }) : /* @__PURE__ */ R("div", { id: c, className: q("flex flex-col", M), onKeyDownCapture: W, children: [
     (f || P) && /* @__PURE__ */ R("div", { className: "mb-1 flex items-center justify-between gap-1", children: [
-      /* @__PURE__ */ t(ce, { label: f || "", required: p || !1 }),
+      /* @__PURE__ */ t(le, { label: f || "", required: p || !1 }),
       P
     ] }),
-    (j || E) && /* @__PURE__ */ t("style", { children: `
+    (_ || E) && /* @__PURE__ */ t("style", { children: `
           #${c} .ant-picker {
-            background-color: ${j} !important;
+            background-color: ${_} !important;
             border-color: ${E} !important;
           }
           #${c} .ant-picker:hover {
@@ -152,24 +154,25 @@ const { RangePicker: Z } = ie, G = {
           }
         ` }),
     /* @__PURE__ */ t(
-      Z,
+      G,
       {
-        ref: H,
+        ref: U,
         onChange: n,
         onCalendarChange: a,
-        value: [s(o), s(u)],
+        value: [o(s), o(u)],
         id: { start: O, end: B },
         allowClear: !0,
         format: k || "DD MMM, YYYY",
-        separator: /* @__PURE__ */ t(X, { size: 20, className: "text-neutral-400 dark:text-gray-100" }),
+        separator: /* @__PURE__ */ t(Z, { size: 20, className: "text-neutral-400 dark:text-gray-100" }),
         suffixIcon: /* @__PURE__ */ t(T, { size: 14, className: "text-neutral-400 dark:text-gray-100" }),
         getPopupContainer: v || (z ? (e) => e.parentElement : () => document.body),
         disabled: F,
-        disabledDate: l ? U : void 0,
+        disabledDate: l ? V : void 0,
         open: S ?? A,
-        onOpenChange: oe,
+        onOpenChange: ie,
         autoComplete: "off",
-        placement: K
+        placement: K,
+        presets: j
       }
     ),
     d && /* @__PURE__ */ t(
@@ -184,8 +187,8 @@ const { RangePicker: Z } = ie, G = {
     )
   ] });
 };
-fe.displayName = "DateRange";
+ue.displayName = "DateRange";
 export {
-  fe as DateRange
+  ue as DateRange
 };
 //# sourceMappingURL=DateRange.es.js.map

package/dist/components/forms/date-range/DateRange.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRange.es.js","sources":["../../../../src/components/forms/date-range/DateRange.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport { DatePicker } from \"antd\";\nimport cn from \"classnames\";\nimport React from \"react\";\nimport dayjs from \"dayjs\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { CalendarMonthIcon, CheckIndeterminateSmallFilledIcon } from '../../icon';\n\nconst { RangePicker } = DatePicker;\n\n// Keyboard keys constant\nconst KEYBOARD_KEYS = {\n ENTER: \"Enter\",\n} as const;\n\n/\n Generate a short UUID\n /\nconst generateShortUUID = (): string => {\n return Math.random().toString(36).substring(2, 9);\n};\n\n/\n Hook to add event listeners\n /\nconst useEventListener = <K extends keyof DocumentEventMap>(\n eventName: K,\n handler: (event: DocumentEventMap[K]) => void\n) => {\n const savedHandler = useRef(handler);\n\n useEffect(() => {\n savedHandler.current = handler;\n }, [handler]);\n\n useEffect(() => {\n const eventListener = (event: DocumentEventMap[K]) =>\n savedHandler.current(event);\n document.addEventListener(eventName, eventListener);\n return () => {\n document.removeEventListener(eventName, eventListener);\n };\n }, [eventName]);\n};\n\n/\n Props for the DateRange component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TDateRangeProps = {\n /* Unique identifier for the date range /\n id: string;\n /* Label text to display above the date range /\n label?: string;\n /* Start date value (ISO string or formatted date string) /\n startDate: string;\n /* End date value (ISO string or formatted date string) /\n endDate: string;\n /* Callback function called when date range changes /\n onChange(data: any): void;\n /* Callback function called when calendar selection changes /\n onCalendarChange?(data: any): void;\n /* Whether the field is required /\n required?: boolean;\n /* Error message to display below the date range /\n errorMessage?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether the date range is disabled /\n disabled?: boolean;\n /* Custom date format /\n dateFormat?: string;\n /* Whether popup should render inside parent element /\n shouldPopOnParent?: boolean;\n /* Custom function to get popup container /\n getPopupContainer?: (trigger: HTMLElement \| null) => HTMLElement;\n /* Maximum date range in days /\n maxDateRange?: number;\n /* Whether the picker is open /\n open?: boolean;\n /* Callback function called when open state changes /\n onOpenChange?(open: boolean): void;\n /* Placement of the dropdown /\n placement?: \"bottomLeft\" \| \"bottomRight\" \| \"topLeft\" \| \"topRight\";\n /* Whether to render as an icon button that triggers the date picker /\n renderAsIconButton?: boolean;\n /* Additional CSS classes for the icon button /\n iconButtonClassName?: string;\n /* Additional CSS classes for the calendar icon inside the button /\n iconClassName?: string;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors; `'success'` — Success colors. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n};\n\n/\n A date range picker component with label, validation, and styling support.\n * Features proper date handling, validation, and comprehensive prop support.\n * Built on top of Ant Design's RangePicker for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * DateRange component.\n \n @example\n * ```tsx\n * <DateRange\n * id=\"event-dates\"\n * label=\"Event Duration\"\n * startDate={startDate}\n * endDate={endDate}\n * onChange={(dates) => {\n * setStartDate(dates[0]);\n * setEndDate(dates[1]);\n * }}\n * required\n * />\n * ```\n */\nexport const DateRange = ({\n onCalendarChange = undefined,\n onChange,\n required,\n label,\n startDate,\n endDate,\n errorMessage,\n className,\n id,\n disabled = false,\n dateFormat,\n shouldPopOnParent = true,\n getPopupContainer: customGetPopupContainer,\n maxDateRange,\n open,\n onOpenChange,\n placement = \"bottomLeft\",\n renderAsIconButton = false,\n iconButtonClassName,\n iconClassName,\n labelExtra,\n inputEmphasis = \"default\",\n}: TDateRangeProps) => {\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage;\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage;\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage;\n const emphasisBg =\n emphasisModifiedSkin ? \"var(--Warning-50, #FFFAEB)\" :\n emphasisDeletedSkin ? \"var(--Error-50, #FEF2F2)\" :\n emphasisSuccessSkin ? \"var(--Success-50, #F0FDF4)\" : \"\";\n const emphasisBorder =\n emphasisModifiedSkin ? \"var(--Warning-200, #FEDF89)\" :\n emphasisDeletedSkin ? \"var(--Error-200, #FECACA)\" :\n emphasisSuccessSkin ? \"var(--Success-200, #BBF7D0)\" : \"\";\n const [isOpen, setIsOpen] = useState(false);\n const [isNormalPickerOpen, setIsNormalPickerOpen] = useState(false);\n const pickerRef = useRef<any>(null);\n const normalPickerRef = useRef<any>(null);\n const suppressNextIconOpenRef = useRef(false);\n const suppressNextNormalOpenRef = useRef(false);\n\n const parseDate = (str: string \| number \| Date \| dayjs.Dayjs) => {\n if (!str) return null;\n return dayjs(str);\n };\n\n const START_ID = `date-range-start-${generateShortUUID()}`;\n const END_ID = `date-range-end-${generateShortUUID()}`;\n\n const handleIconClick = () => {\n setIsOpen(true);\n setTimeout(() => {\n if (pickerRef.current) {\n pickerRef.current.focus();\n }\n }, 0);\n };\n\n useEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (\n e.key === KEYBOARD_KEYS.ENTER &&\n document.activeElement instanceof HTMLInputElement\n ) {\n if (document?.activeElement?.id === START_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([date, parseDate(endDate)]);\n }\n }\n if (document?.activeElement?.id === END_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([parseDate(startDate), date]);\n }\n }\n }\n });\n\n const disabledDate = useCallback(\n (current: dayjs.Dayjs) => {\n const [start, end] = [parseDate(startDate), parseDate(endDate)];\n\n if (!maxDateRange) return false;\n\n if (start) {\n return (\n current.isBefore(start.startOf(\"day\")) \|\|\n current.isAfter(start.add(maxDateRange, \"day\").endOf(\"day\"))\n );\n }\n\n if (end) {\n return (\n current.isBefore(end.subtract(maxDateRange, \"day\").startOf(\"day\")) \|\|\n current.isAfter(end.endOf(\"day\"))\n );\n }\n\n return false;\n },\n [startDate, endDate, maxDateRange]\n );\n\n const handleKeyDownCapture = useCallback((e: React.KeyboardEvent) => {\n if (e.key === KEYBOARD_KEYS.ENTER) {\n const pickerIsOpen = renderAsIconButton ? isOpen : (open ?? isNormalPickerOpen);\n if (!pickerIsOpen) {\n e.preventDefault();\n e.stopPropagation();\n\n const form = (e.target as HTMLElement).closest('form');\n if (form) {\n const submitBtn = form.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n if (submitBtn) {\n submitBtn.click();\n } else {\n form.requestSubmit();\n }\n }\n }\n }\n }, [renderAsIconButton, isOpen, open, isNormalPickerOpen]);\n\n const handleIconPickerOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextIconOpenRef.current) {\n suppressNextIconOpenRef.current = false;\n setIsOpen(false);\n return;\n }\n\n setIsOpen(nextOpen);\n if (!nextOpen) {\n suppressNextIconOpenRef.current = true;\n requestAnimationFrame(() => {\n pickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextIconOpenRef.current = false;\n });\n });\n }\n }, []);\n\n const handleNormalOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextNormalOpenRef.current) {\n suppressNextNormalOpenRef.current = false;\n setIsNormalPickerOpen(false);\n onOpenChange?.(false);\n return;\n }\n\n setIsNormalPickerOpen(nextOpen);\n onOpenChange?.(nextOpen);\n if (!nextOpen) {\n suppressNextNormalOpenRef.current = true;\n requestAnimationFrame(() => {\n normalPickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextNormalOpenRef.current = false;\n });\n });\n }\n }, [onOpenChange]);\n\n if (renderAsIconButton) {\n return (\n <div id={id} className={className} onKeyDownCapture={handleKeyDownCapture}>\n <IconButton\n onClick={handleIconClick}\n disabled={disabled}\n variant=\"default\"\n className={iconButtonClassName}\n >\n <CalendarMonthIcon size={20} className={cn(\"w-5 h-5\", iconClassName)} />\n </IconButton>\n <RangePicker\n ref={pickerRef}\n onChange={(dates) => {\n onChange(dates);\n setIsOpen(false);\n }}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={<CheckIndeterminateSmallFilledIcon size={20} className=\"text-neutral-400 dark:text-gray-100\" />}\n suffixIcon={<CalendarMonthIcon size={14} className=\"text-neutral-400 dark:text-gray-100\" />}\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n autoComplete=\"off\"\n open={isOpen}\n onOpenChange={handleIconPickerOpenChange}\n placement={placement}\n style={{ position: \"absolute\", opacity: 0, pointerEvents: \"none\", width: 0, height: 0 }}\n />\n </div>\n );\n }\n\n return (\n <div id={id} className={cn(\"flex flex-col\", className)} onKeyDownCapture={handleKeyDownCapture}>\n {(label \|\| labelExtra) && (\n <div className=\"mb-1 flex items-center justify-between gap-1\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n {labelExtra}\n </div>\n )}\n {(emphasisBg \|\| emphasisBorder) && (\n <style>{`\n #${id} .ant-picker {\n background-color: ${emphasisBg} !important;\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker:hover {\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker.ant-picker-focused {\n border-color: ${emphasisBorder} !important;\n box-shadow: 0 0 0 2px ${emphasisDeletedSkin ? \"rgba(254,202,202,0.45)\" : emphasisModifiedSkin ? \"rgba(254,223,137,0.45)\" : \"rgba(187,247,208,0.45)\"} !important;\n }\n #${id} .ant-picker .ant-picker-input > input {\n color: ${emphasisDeletedSkin ? \"#475467\" : emphasisSuccessSkin ? \"#101828\" : \"inherit\"};\n }\n `}</style>\n )}\n <RangePicker\n ref={normalPickerRef}\n onChange={onChange}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={\n <CheckIndeterminateSmallFilledIcon size={20} className='text-neutral-400 dark:text-gray-100' />\n }\n suffixIcon={\n <CalendarMonthIcon size={14} className='text-neutral-400 dark:text-gray-100' />\n }\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n open={open ?? isNormalPickerOpen}\n onOpenChange={handleNormalOpenChange}\n autoComplete=\"off\"\n placement={placement}\n />\n {errorMessage && (\n <p\n className={cn(\n \"text-sm font-inter font-normal text-left pt-[6px]\",\n \"text-red-500\"\n )}\n >\n {errorMessage}\n </p>\n )}\n </div>\n );\n};\n\nDateRange.displayName = \"DateRange\";\n\n"],"names":["RangePicker","DatePicker","KEYBOARD_KEYS","generateShortUUID","useEventListener","eventName","handler","savedHandler","useRef","useEffect","eventListener","event","DateRange","onCalendarChange","onChange","required","label","startDate","endDate","errorMessage","className","id","disabled","dateFormat","shouldPopOnParent","customGetPopupContainer","maxDateRange","open","onOpenChange","placement","renderAsIconButton","iconButtonClassName","iconClassName","labelExtra","inputEmphasis","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","emphasisBg","emphasisBorder","isOpen","setIsOpen","useState","isNormalPickerOpen","setIsNormalPickerOpen","pickerRef","normalPickerRef","suppressNextIconOpenRef","suppressNextNormalOpenRef","parseDate","str","dayjs","START_ID","END_ID","handleIconClick","date","disabledDate","useCallback","current","start","end","handleKeyDownCapture","form","submitBtn","handleIconPickerOpenChange","nextOpen","handleNormalOpenChange","jsxs","jsx","IconButton","CalendarMonthIcon","cn","dates","CheckIndeterminateSmallFilledIcon","trigger","InputLabel"],"mappings":"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"}
1	+ {"version":3,"file":"DateRange.es.js","sources":["../../../../src/components/forms/date-range/DateRange.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport { DatePicker } from \"antd\";\nimport cn from \"classnames\";\nimport React from \"react\";\nimport dayjs from \"dayjs\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport { CalendarMonthIcon, CheckIndeterminateSmallFilledIcon } from '../../icon';\n\nconst { RangePicker } = DatePicker;\n\n// Keyboard keys constant\nconst KEYBOARD_KEYS = {\n ENTER: \"Enter\",\n} as const;\n\n/\n Generate a short UUID\n /\nconst generateShortUUID = (): string => {\n return Math.random().toString(36).substring(2, 9);\n};\n\n/\n Hook to add event listeners\n /\nconst useEventListener = <K extends keyof DocumentEventMap>(\n eventName: K,\n handler: (event: DocumentEventMap[K]) => void\n) => {\n const savedHandler = useRef(handler);\n\n useEffect(() => {\n savedHandler.current = handler;\n }, [handler]);\n\n useEffect(() => {\n const eventListener = (event: DocumentEventMap[K]) =>\n savedHandler.current(event);\n document.addEventListener(eventName, eventListener);\n return () => {\n document.removeEventListener(eventName, eventListener);\n };\n }, [eventName]);\n};\n\n/\n Props for the DateRange component\n * Matches the lax-web-portal implementation for drop-in replacement\n /\nexport type TDateRangeProps = {\n /* Unique identifier for the date range /\n id: string;\n /* Label text to display above the date range /\n label?: string;\n /* Start date value (ISO string or formatted date string) /\n startDate: string;\n /* End date value (ISO string or formatted date string) /\n endDate: string;\n /* Callback function called when date range changes /\n onChange(data: any): void;\n /* Callback function called when calendar selection changes /\n onCalendarChange?(data: any): void;\n /* Whether the field is required /\n required?: boolean;\n /* Error message to display below the date range /\n errorMessage?: string;\n /* Additional CSS classes for the wrapper /\n className?: string;\n /* Whether the date range is disabled /\n disabled?: boolean;\n /* Custom date format /\n dateFormat?: string;\n /* Whether popup should render inside parent element /\n shouldPopOnParent?: boolean;\n /* Custom function to get popup container /\n getPopupContainer?: (trigger: HTMLElement \| null) => HTMLElement;\n /* Maximum date range in days /\n maxDateRange?: number;\n /* Whether the picker is open /\n open?: boolean;\n /* Callback function called when open state changes /\n onOpenChange?(open: boolean): void;\n /* Placement of the dropdown /\n placement?: \"bottomLeft\" \| \"bottomRight\" \| \"topLeft\" \| \"topRight\";\n /* Preset date ranges shown in the picker dropdown /\n presets?: { label: React.ReactNode; value: any }[];\n /* Whether to render as an icon button that triggers the date picker /\n renderAsIconButton?: boolean;\n /* Additional CSS classes for the icon button /\n iconButtonClassName?: string;\n /* Additional CSS classes for the calendar icon inside the button /\n iconClassName?: string;\n /* Optional extra content in the label row (e.g. actions, badges) /\n labelExtra?: React.ReactNode;\n /* Input surface style: `'modified'` — Warning colors; `'deleted'` — Error colors; `'success'` — Success colors. /\n inputEmphasis?: \"default\" \| \"modified\" \| \"deleted\" \| \"success\";\n};\n\n/\n A date range picker component with label, validation, and styling support.\n * Features proper date handling, validation, and comprehensive prop support.\n * Built on top of Ant Design's RangePicker for advanced functionality.\n \n This component is designed as a drop-in replacement for the lax-web-portal\n * DateRange component.\n \n @example\n * ```tsx\n * <DateRange\n * id=\"event-dates\"\n * label=\"Event Duration\"\n * startDate={startDate}\n * endDate={endDate}\n * onChange={(dates) => {\n * setStartDate(dates[0]);\n * setEndDate(dates[1]);\n * }}\n * required\n * />\n * ```\n */\nexport const DateRange = ({\n onCalendarChange = undefined,\n onChange,\n required,\n label,\n startDate,\n endDate,\n errorMessage,\n className,\n id,\n disabled = false,\n dateFormat,\n shouldPopOnParent = true,\n getPopupContainer: customGetPopupContainer,\n maxDateRange,\n open,\n onOpenChange,\n placement = \"bottomLeft\",\n renderAsIconButton = false,\n iconButtonClassName,\n iconClassName,\n labelExtra,\n inputEmphasis = \"default\",\n presets,\n}: TDateRangeProps) => {\n const emphasisModifiedSkin = inputEmphasis === \"modified\" && !errorMessage;\n const emphasisDeletedSkin = inputEmphasis === \"deleted\" && !errorMessage;\n const emphasisSuccessSkin = inputEmphasis === \"success\" && !errorMessage;\n const emphasisBg =\n emphasisModifiedSkin ? \"var(--Warning-50, #FFFAEB)\" :\n emphasisDeletedSkin ? \"var(--Error-50, #FEF2F2)\" :\n emphasisSuccessSkin ? \"var(--Success-50, #F0FDF4)\" : \"\";\n const emphasisBorder =\n emphasisModifiedSkin ? \"var(--Warning-200, #FEDF89)\" :\n emphasisDeletedSkin ? \"var(--Error-200, #FECACA)\" :\n emphasisSuccessSkin ? \"var(--Success-200, #BBF7D0)\" : \"\";\n const [isOpen, setIsOpen] = useState(false);\n const [isNormalPickerOpen, setIsNormalPickerOpen] = useState(false);\n const pickerRef = useRef<any>(null);\n const normalPickerRef = useRef<any>(null);\n const suppressNextIconOpenRef = useRef(false);\n const suppressNextNormalOpenRef = useRef(false);\n\n const parseDate = (str: string \| number \| Date \| dayjs.Dayjs) => {\n if (!str) return null;\n return dayjs(str);\n };\n\n const START_ID = `date-range-start-${generateShortUUID()}`;\n const END_ID = `date-range-end-${generateShortUUID()}`;\n\n const handleIconClick = () => {\n setIsOpen(true);\n setTimeout(() => {\n if (pickerRef.current) {\n pickerRef.current.focus();\n }\n }, 0);\n };\n\n useEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (\n e.key === KEYBOARD_KEYS.ENTER &&\n document.activeElement instanceof HTMLInputElement\n ) {\n if (document?.activeElement?.id === START_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([date, parseDate(endDate)]);\n }\n }\n if (document?.activeElement?.id === END_ID) {\n const date = dayjs(document?.activeElement?.value);\n if (date.isValid()) {\n onChange([parseDate(startDate), date]);\n }\n }\n }\n });\n\n const disabledDate = useCallback(\n (current: dayjs.Dayjs) => {\n const [start, end] = [parseDate(startDate), parseDate(endDate)];\n\n if (!maxDateRange) return false;\n\n if (start) {\n return (\n current.isBefore(start.startOf(\"day\")) \|\|\n current.isAfter(start.add(maxDateRange, \"day\").endOf(\"day\"))\n );\n }\n\n if (end) {\n return (\n current.isBefore(end.subtract(maxDateRange, \"day\").startOf(\"day\")) \|\|\n current.isAfter(end.endOf(\"day\"))\n );\n }\n\n return false;\n },\n [startDate, endDate, maxDateRange]\n );\n\n const handleKeyDownCapture = useCallback((e: React.KeyboardEvent) => {\n if (e.key === KEYBOARD_KEYS.ENTER) {\n const pickerIsOpen = renderAsIconButton ? isOpen : (open ?? isNormalPickerOpen);\n if (!pickerIsOpen) {\n e.preventDefault();\n e.stopPropagation();\n\n const form = (e.target as HTMLElement).closest('form');\n if (form) {\n const submitBtn = form.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n if (submitBtn) {\n submitBtn.click();\n } else {\n form.requestSubmit();\n }\n }\n }\n }\n }, [renderAsIconButton, isOpen, open, isNormalPickerOpen]);\n\n const handleIconPickerOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextIconOpenRef.current) {\n suppressNextIconOpenRef.current = false;\n setIsOpen(false);\n return;\n }\n\n setIsOpen(nextOpen);\n if (!nextOpen) {\n suppressNextIconOpenRef.current = true;\n requestAnimationFrame(() => {\n pickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextIconOpenRef.current = false;\n });\n });\n }\n }, []);\n\n const handleNormalOpenChange = useCallback((nextOpen: boolean) => {\n if (nextOpen && suppressNextNormalOpenRef.current) {\n suppressNextNormalOpenRef.current = false;\n setIsNormalPickerOpen(false);\n onOpenChange?.(false);\n return;\n }\n\n setIsNormalPickerOpen(nextOpen);\n onOpenChange?.(nextOpen);\n if (!nextOpen) {\n suppressNextNormalOpenRef.current = true;\n requestAnimationFrame(() => {\n normalPickerRef.current?.focus();\n requestAnimationFrame(() => {\n suppressNextNormalOpenRef.current = false;\n });\n });\n }\n }, [onOpenChange]);\n\n if (renderAsIconButton) {\n return (\n <div id={id} className={className} onKeyDownCapture={handleKeyDownCapture}>\n <IconButton\n onClick={handleIconClick}\n disabled={disabled}\n variant=\"default\"\n className={iconButtonClassName}\n >\n <CalendarMonthIcon size={20} className={cn(\"w-5 h-5\", iconClassName)} />\n </IconButton>\n <RangePicker\n ref={pickerRef}\n onChange={(dates) => {\n onChange(dates);\n setIsOpen(false);\n }}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={<CheckIndeterminateSmallFilledIcon size={20} className=\"text-neutral-400 dark:text-gray-100\" />}\n suffixIcon={<CalendarMonthIcon size={14} className=\"text-neutral-400 dark:text-gray-100\" />}\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n autoComplete=\"off\"\n open={isOpen}\n onOpenChange={handleIconPickerOpenChange}\n placement={placement}\n presets={presets}\n style={{ position: \"absolute\", opacity: 0, pointerEvents: \"none\", width: 0, height: 0 }}\n />\n </div>\n );\n }\n\n return (\n <div id={id} className={cn(\"flex flex-col\", className)} onKeyDownCapture={handleKeyDownCapture}>\n {(label \|\| labelExtra) && (\n <div className=\"mb-1 flex items-center justify-between gap-1\">\n <InputLabel label={label \|\| \"\"} required={required \|\| false} />\n {labelExtra}\n </div>\n )}\n {(emphasisBg \|\| emphasisBorder) && (\n <style>{`\n #${id} .ant-picker {\n background-color: ${emphasisBg} !important;\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker:hover {\n border-color: ${emphasisBorder} !important;\n }\n #${id} .ant-picker.ant-picker-focused {\n border-color: ${emphasisBorder} !important;\n box-shadow: 0 0 0 2px ${emphasisDeletedSkin ? \"rgba(254,202,202,0.45)\" : emphasisModifiedSkin ? \"rgba(254,223,137,0.45)\" : \"rgba(187,247,208,0.45)\"} !important;\n }\n #${id} .ant-picker .ant-picker-input > input {\n color: ${emphasisDeletedSkin ? \"#475467\" : emphasisSuccessSkin ? \"#101828\" : \"inherit\"};\n }\n `}</style>\n )}\n <RangePicker\n ref={normalPickerRef}\n onChange={onChange}\n onCalendarChange={onCalendarChange}\n value={[parseDate(startDate), parseDate(endDate)]}\n id={{ start: START_ID, end: END_ID }}\n allowClear\n format={dateFormat ? dateFormat : \"DD MMM, YYYY\"}\n separator={\n <CheckIndeterminateSmallFilledIcon size={20} className='text-neutral-400 dark:text-gray-100' />\n }\n suffixIcon={\n <CalendarMonthIcon size={14} className='text-neutral-400 dark:text-gray-100' />\n }\n getPopupContainer={\n customGetPopupContainer\n ? customGetPopupContainer\n : shouldPopOnParent\n ? (trigger) => trigger.parentElement as HTMLElement\n : () => document.body\n }\n disabled={disabled}\n disabledDate={maxDateRange ? disabledDate : undefined}\n open={open ?? isNormalPickerOpen}\n onOpenChange={handleNormalOpenChange}\n autoComplete=\"off\"\n placement={placement}\n presets={presets}\n />\n {errorMessage && (\n <p\n className={cn(\n \"text-sm font-inter font-normal text-left pt-[6px]\",\n \"text-red-500\"\n )}\n >\n {errorMessage}\n </p>\n )}\n </div>\n );\n};\n\nDateRange.displayName = \"DateRange\";\n\n"],"names":["RangePicker","DatePicker","KEYBOARD_KEYS","generateShortUUID","useEventListener","eventName","handler","savedHandler","useRef","useEffect","eventListener","event","DateRange","onCalendarChange","onChange","required","label","startDate","endDate","errorMessage","className","id","disabled","dateFormat","shouldPopOnParent","customGetPopupContainer","maxDateRange","open","onOpenChange","placement","renderAsIconButton","iconButtonClassName","iconClassName","labelExtra","inputEmphasis","presets","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","emphasisBg","emphasisBorder","isOpen","setIsOpen","useState","isNormalPickerOpen","setIsNormalPickerOpen","pickerRef","normalPickerRef","suppressNextIconOpenRef","suppressNextNormalOpenRef","parseDate","str","dayjs","START_ID","END_ID","handleIconClick","date","disabledDate","useCallback","current","start","end","handleKeyDownCapture","form","submitBtn","handleIconPickerOpenChange","nextOpen","handleNormalOpenChange","jsxs","jsx","IconButton","CalendarMonthIcon","cn","dates","CheckIndeterminateSmallFilledIcon","trigger","InputLabel"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@lax-wp/design-system",
   "private": false,
-  "version": "0.14.4",
+  "version": "0.14.5",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",