@neo4j-ndl/react 4.14.4 → 4.14.5

package/lib/cjs/date-picker/DatePicker.js

@@ -55,16 +55,21 @@ const utils_1 = require("./utils");
 // into the custom input component on root level, since we use htmlAttributes
 // we need to help spread them there instead of the root level
 const DatePickerTextInputWrapper = (_a) => {
-    var { textInputProps, isDisabled, value, placeholder } = _a, restProps = __rest(_a, ["textInputProps", "isDisabled", "value", "placeholder"]);
+    var { textInputProps, isDisabled, isClearable, value, placeholder } = _a, restProps = __rest(_a, ["textInputProps", "isDisabled", "isClearable", "value", "placeholder"]);
     // deconstruct textInputProps to avoid bugs with react-datepicker injecting props
-    const _b = textInputProps !== null && textInputProps !== void 0 ? textInputProps : {}, { placeholder: textInputPlaceholder, htmlAttributes: textInputHtmlAttributes, ref } = _b, restTextInputProps = __rest(_b, ["placeholder", "htmlAttributes", "ref"]);
-    return ((0, jsx_runtime_1.jsx)(text_input_1.TextInput, Object.assign({ ref: ref, trailingElement: (0, jsx_runtime_1.jsx)(icons_1.CalendarDaysIconOutline, {}), value: value, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : textInputPlaceholder, isDisabled: isDisabled, 
+    const _b = textInputProps !== null && textInputProps !== void 0 ? textInputProps : {}, { placeholder: textInputPlaceholder, htmlAttributes: textInputHtmlAttributes, onChange: textInputOnChange, ref } = _b, restTextInputProps = __rest(_b, ["placeholder", "htmlAttributes", "onChange", "ref"]);
+    const { onChange: injectedOnChange } = restProps, restInjectedProps = __rest(restProps, ["onChange"]);
+    const handleChange = (event) => {
+        injectedOnChange === null || injectedOnChange === void 0 ? void 0 : injectedOnChange(event);
+        textInputOnChange === null || textInputOnChange === void 0 ? void 0 : textInputOnChange(event);
+    };
+    return ((0, jsx_runtime_1.jsx)(text_input_1.TextInput, Object.assign({ ref: ref, trailingElement: (0, jsx_runtime_1.jsx)(icons_1.CalendarDaysIconOutline, {}), value: value, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : textInputPlaceholder, isDisabled: isDisabled, isClearable: isClearable, onChange: handleChange, 
         // react-datepicker injects html attributes into the custom input
-        htmlAttributes: Object.assign(Object.assign({}, textInputHtmlAttributes), restProps) }, restTextInputProps)));
+        htmlAttributes: Object.assign(Object.assign({}, textInputHtmlAttributes), restInjectedProps) }, restTextInputProps)));
 };
 const DatePicker = (_a) => {
     var _b;
-    var { reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, ref, className, style, htmlAttributes } = _a, restProps = __rest(_a, ["reactDatePickerProps", "textInputProps", "timePickerProps", "timeZonePickerProps", "isDisabled", "ref", "className", "style", "htmlAttributes"]);
+    var { reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, isClearable = false, ref, className, style, htmlAttributes } = _a, restProps = __rest(_a, ["reactDatePickerProps", "textInputProps", "timePickerProps", "timeZonePickerProps", "isDisabled", "isClearable", "ref", "className", "style", "htmlAttributes"]);
     const classes = (0, classnames_1.default)(`ndl-datepicker`, className, {});
     const datetimeRef = (0, react_1.useRef)(null);
     const [picker, setPicker] = (0, react_1.useState)('day');
@@ -185,9 +190,9 @@ const DatePicker = (_a) => {
         (_a = reactDatePickerProps === null || reactDatePickerProps === void 0 ? void 0 : reactDatePickerProps.onChangeRaw) === null || _a === void 0 ? void 0 : _a.call(reactDatePickerProps, event);
     }, [reactDatePickerProps]);
     const datePickerProps = Object.assign(Object.assign({}, reactDatePickerProps), { onCalendarClose: interceptedOnCalendarClose, onChange: interceptedChange, onChangeRaw: interceptedOnChangeRaw, onMonthChange: handleMonthChange });
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes, ref: ref, style: style }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsx)(react_datepicker_1.default, Object.assign({ ref: datetimeRef, customInput: (0, jsx_runtime_1.jsx)(DatePickerTextInputWrapper, { isDisabled: isDisabled, textInputProps: textInputProps }), customTimeInput: (0, jsx_runtime_1.jsxs)("span", { className: "ndl-time-picker-wrapper", children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, {}), (0, jsx_runtime_1.jsx)(time_picker_1.TimePicker, Object.assign({ isFluid: true, value: preSelectedDate
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes, ref: ref, style: style }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsx)(react_datepicker_1.default, Object.assign({ ref: datetimeRef, customInput: (0, jsx_runtime_1.jsx)(DatePickerTextInputWrapper, { isDisabled: isDisabled, isClearable: isClearable, textInputProps: textInputProps }), customTimeInput: (0, jsx_runtime_1.jsxs)("span", { className: "ndl-time-picker-wrapper", children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, {}), (0, jsx_runtime_1.jsx)(time_picker_1.TimePicker, Object.assign({ isFluid: true, value: preSelectedDate
                             ? new time_picker_1.NeedleTime(preSelectedDate.getHours(), preSelectedDate.getMinutes())
-                            : undefined, onChange: handleTimeChange }, timePickerProps, { floatingStrategy: "absolute", isPortaled: false })), timeZonePickerProps && ((0, jsx_runtime_1.jsx)(timezone_picker_1.TimeZonePicker, Object.assign({ isFluid: true, value: selectedTimeZone, onChange: handleTimeZoneChange, referenceDate: preSelectedDate || undefined }, timeZonePickerProps, { floatingStrategy: "absolute", isPortaled: false })))] }), disabled: isDisabled, showPopperArrow: false, showMonthYearPicker: picker === 'month', showYearPicker: picker === 'year', shouldCloseOnSelect: picker === 'day' && !((_b = reactDatePickerProps.showTimeInput) !== null && _b !== void 0 ? _b : false), dayClassName: () => 'ndl-datepicker-day', renderCustomHeader: CustomHeader }, datePickerProps, { popperClassName: (0, classnames_1.default)('ndl-datepicker-popper', reactDatePickerProps.popperClassName), popperProps: Object.assign({ strategy: isInsideDialog ? 'fixed' : 'absolute' }, reactDatePickerProps.popperProps) })) })));
+                            : undefined, onChange: handleTimeChange }, timePickerProps, { floatingStrategy: "absolute", isPortaled: false })), timeZonePickerProps && ((0, jsx_runtime_1.jsx)(timezone_picker_1.TimeZonePicker, Object.assign({ isFluid: true, value: selectedTimeZone, onChange: handleTimeZoneChange, referenceDate: preSelectedDate || undefined }, timeZonePickerProps, { floatingStrategy: "absolute", isPortaled: false })))] }), disabled: isDisabled, showPopperArrow: false, showMonthYearPicker: picker === 'month', showYearPicker: picker === 'year', shouldCloseOnSelect: picker === 'day' && !((_b = reactDatePickerProps.showTimeInput) !== null && _b !== void 0 ? _b : false), dayClassName: () => 'ndl-datepicker-day', renderCustomHeader: CustomHeader }, datePickerProps, { isClearable: isClearable, popperClassName: (0, classnames_1.default)('ndl-datepicker-popper', reactDatePickerProps.popperClassName), popperProps: Object.assign({ strategy: isInsideDialog ? 'fixed' : 'absolute' }, reactDatePickerProps.popperProps) })) })));
 };
 exports.DatePicker = DatePicker;
 //# sourceMappingURL=DatePicker.js.map

package/lib/cjs/date-picker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["// TODO: try to fix as some point\n/* eslint-disable @typescript-eslint/naming-convention */\n\n/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport { format } from 'date-fns';\nimport { useCallback, useRef, useState } from 'react';\nimport ReactDatePicker, {\n  type ReactDatePickerCustomHeaderProps,\n} from 'react-datepicker';\n\nimport type { CommonProps, HtmlAttributes } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { Divider } from '../divider';\nimport {\n  ArrowLeftIconOutline,\n  ArrowRightIconOutline,\n  CalendarDaysIconOutline,\n  ChevronDownIconOutline,\n} from '../icons';\nimport { TextInput } from '../text-input';\nimport { NeedleTime, TimePicker, type TimePickerProps } from '../time-picker';\nimport { TimeZonePicker } from '../timezone-picker';\nimport { Typography } from '../typography';\nimport { daysInMonth, getYearsPeriodString } from './utils';\n\ntype DatePickerTextInputWrapperProps = React.ComponentProps<'input'> & {\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  isDisabled?: boolean;\n  value?: string;\n  ariaLabel?: string;\n};\n\n// This wrapper is needed due to react-datepicker injecting html attributes\n// into the custom input component on root level, since we use htmlAttributes\n// we need to help spread them there instead of the root level\nconst DatePickerTextInputWrapper = ({\n  textInputProps,\n  isDisabled,\n  value,\n  placeholder,\n  ...restProps\n}: DatePickerTextInputWrapperProps) => {\n  // deconstruct textInputProps to avoid bugs with react-datepicker injecting props\n  const {\n    placeholder: textInputPlaceholder,\n    htmlAttributes: textInputHtmlAttributes,\n    ref,\n    ...restTextInputProps\n  } = textInputProps ?? {};\n\n  return (\n    <TextInput\n      ref={ref}\n      trailingElement={<CalendarDaysIconOutline />}\n      value={value}\n      placeholder={placeholder ?? textInputPlaceholder}\n      isDisabled={isDisabled}\n      // react-datepicker injects html attributes into the custom input\n      htmlAttributes={{\n        ...textInputHtmlAttributes,\n        ...restProps,\n      }}\n      {...restTextInputProps}\n    />\n  );\n};\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype PickerType = 'day' | 'month' | 'year';\n\n// Define a more flexible type for onChange\ntype DatePickerChangeHandler = (\n  date: Date | null | [Date | null, Date | null] | Date[],\n  event?: React.SyntheticEvent | undefined,\n) => void;\n\ninterface DatePickerProps {\n  /** Props for the embedded `TextInput` component. */\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  /** Whether the date picker is disabled. */\n  isDisabled?: boolean;\n  /** Props for the embedded `TimePicker` component. */\n  timePickerProps?: TimePickerProps;\n  /** Props for the embedded `TimeZonePicker` component. */\n  timeZonePickerProps?: React.ComponentProps<typeof TimeZonePicker>;\n  /** Props forwarded to underlying `react-datepicker` component. */\n  reactDatePickerProps: React.ComponentProps<typeof ReactDatePicker>;\n  /**\n   * WARNING: these attributes do not apply to the underlying input element currently. This will be fixed in a future version.\n   */\n  htmlAttributes?: HtmlAttributes<'div'>;\n}\n\nexport const DatePicker = ({\n  reactDatePickerProps,\n  textInputProps,\n  timePickerProps,\n  timeZonePickerProps,\n  isDisabled,\n  ref,\n  className,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', DatePickerProps>) => {\n  const classes = classNames(`ndl-datepicker`, className, {});\n  const datetimeRef = useRef<ReactDatePicker>(null);\n  const [picker, setPicker] = useState<PickerType>('day');\n  const [preSelectedDate, setPreSelectedDate] = useState<Date | null>(\n    (reactDatePickerProps.selected as Date | null) ||\n      (reactDatePickerProps.startDate as Date | null),\n  );\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string | undefined>(\n    timeZonePickerProps?.value,\n  );\n\n  const isInsideDialog = useIsInsideDialog();\n\n  const headerAction = useCallback(\n    (action: PickerType) => {\n      setPicker(picker === action ? 'day' : action);\n    },\n    [picker],\n  );\n\n  const CustomHeader = useCallback(\n    (props: ReactDatePickerCustomHeaderProps) => {\n      const {\n        decreaseMonth,\n        increaseMonth,\n        increaseYear,\n        decreaseYear,\n        nextMonthButtonDisabled,\n        nextYearButtonDisabled,\n        prevMonthButtonDisabled,\n        prevYearButtonDisabled,\n      } = props;\n\n      const prevCallback = picker === 'year' ? decreaseYear : decreaseMonth;\n      const nextCallback = picker === 'year' ? increaseYear : increaseMonth;\n      const prevDisabled =\n        picker === 'year' ? prevYearButtonDisabled : prevMonthButtonDisabled;\n      const nextDisabled =\n        picker === 'year' ? nextYearButtonDisabled : nextMonthButtonDisabled;\n\n      return (\n        <div className=\"ndl-datepicker-header\">\n          <div className=\"ndl-datepicker-selects\">\n            {picker !== 'year' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'month' ? 'Close' : 'Open'} month picker`}\n                aria-pressed={picker === 'month'}\n                onClick={() => headerAction('month')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {format(props.date, 'MMM')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'month',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n            {picker !== 'month' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'year' ? 'Close' : 'Open'} year picker`}\n                onClick={() => headerAction('year')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {picker === 'year'\n                      ? getYearsPeriodString(\n                          props.date,\n                          reactDatePickerProps?.yearItemNumber,\n                        )\n                      : format(props.date, 'yyyy')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'year',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n          </div>\n          {picker !== 'month' && (\n            <div className=\"n-flex n-justify-center n-gap-token-16\">\n              <CleanIconButton\n                description={\n                  picker === 'year' ? 'Previous period' : 'Previous month'\n                }\n                onClick={prevCallback}\n                isDisabled={prevDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowLeftIconOutline />\n              </CleanIconButton>\n              <CleanIconButton\n                description={picker === 'year' ? 'Next period' : 'Next month'}\n                onClick={nextCallback}\n                isDisabled={nextDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowRightIconOutline />\n              </CleanIconButton>\n            </div>\n          )}\n        </div>\n      );\n    },\n    [picker, headerAction, reactDatePickerProps?.yearItemNumber],\n  );\n\n  const handleTimeChange = (newTime: NeedleTime) => {\n    if (\n      reactDatePickerProps.selectsRange ||\n      reactDatePickerProps.selectsMultiple\n    ) {\n      // this is consistent with the behavior of react-datepicker\n      return;\n    }\n\n    if (!preSelectedDate) {\n      return;\n    }\n\n    const newDate = new Date(preSelectedDate);\n    newDate.setHours(newTime.hour, newTime.minute, 0, 0);\n    setPreSelectedDate(newDate);\n\n    if (reactDatePickerProps.onChange) {\n      // For single date selection\n      reactDatePickerProps.onChange(newDate, undefined);\n    }\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setSelectedTimeZone(timezone);\n    if (timeZonePickerProps?.onChange) {\n      timeZonePickerProps.onChange(timezone);\n    }\n  };\n\n  /**\n   * Intercept onChange so we can work with\n   * Month and Year pickers\n   */\n  const interceptedChange: DatePickerChangeHandler = useCallback(\n    (\n      date: Date | null | [Date | null, Date | null] | Date[],\n      event?: React.SyntheticEvent,\n    ) => {\n      if (picker !== 'day') {\n        // setTimeout to prevent picker change before the handleMonthChange logic\n        setTimeout(() => {\n          setPicker('day');\n        });\n      } else if (picker === 'day') {\n        if (date instanceof Date) {\n          setPreSelectedDate(date);\n        } else if (\n          Array.isArray(date) &&\n          date.length > 0 &&\n          date[0] instanceof Date\n        ) {\n          setPreSelectedDate(date[0]);\n        } else if (date === null) {\n          setPreSelectedDate(null);\n        }\n\n        if (reactDatePickerProps.onChange && date !== null) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            date,\n            event,\n          );\n        }\n      }\n    },\n    [picker, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onCalendarClose so we can\n   * switch to \"day\" picker if we close on \"month\" or \"year\"\n   * view\n   */\n  const interceptedOnCalendarClose = useCallback(() => {\n    if (picker !== 'day') {\n      setPicker('day');\n    }\n    reactDatePickerProps?.onCalendarClose?.();\n  }, [picker, reactDatePickerProps]);\n\n  const handleMonthChange = useCallback(\n    (date: Date) => {\n      if (picker === 'month') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const daysInNewMonth = daysInMonth(date.getMonth(), date.getFullYear());\n        date.setDate(Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      } else if (picker === 'year') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const selectedMonth = preSelectedDate?.getMonth() ?? 0;\n        const daysInNewMonth = daysInMonth(selectedMonth, date.getFullYear());\n        date.setMonth(selectedMonth, Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      }\n      setPreSelectedDate(date);\n    },\n    [picker, preSelectedDate, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onChangeRaw to handle clearing the input\n   * When the user clears the text input, set the date to null\n   */\n  const interceptedOnChangeRaw = useCallback(\n    (\n      event?:\n        | React.KeyboardEvent<HTMLElement>\n        | React.MouseEvent<HTMLElement, MouseEvent>,\n    ) => {\n      const target = event?.target as HTMLInputElement | undefined;\n      if (target?.value === '') {\n        setPreSelectedDate(null);\n        if (reactDatePickerProps.onChange) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            null,\n            event,\n          );\n        }\n      }\n      reactDatePickerProps?.onChangeRaw?.(event);\n    },\n    [reactDatePickerProps],\n  );\n\n  const datePickerProps = {\n    ...reactDatePickerProps,\n    onCalendarClose: interceptedOnCalendarClose,\n    onChange: interceptedChange,\n    onChangeRaw: interceptedOnChangeRaw,\n    onMonthChange: handleMonthChange,\n  };\n\n  return (\n    <div\n      className={classes}\n      ref={ref}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/** TODO v5: Remove the div wrapper, type the component as an input, and apply all root props to the TextInput */}\n      <ReactDatePicker\n        ref={datetimeRef}\n        customInput={\n          <DatePickerTextInputWrapper\n            isDisabled={isDisabled}\n            textInputProps={textInputProps}\n          />\n        }\n        customTimeInput={\n          <span className=\"ndl-time-picker-wrapper\">\n            <Divider />\n            <TimePicker\n              isFluid\n              value={\n                preSelectedDate\n                  ? new NeedleTime(\n                      preSelectedDate.getHours(),\n                      preSelectedDate.getMinutes(),\n                    )\n                  : undefined\n              }\n              onChange={handleTimeChange}\n              {...timePickerProps}\n              floatingStrategy=\"absolute\"\n              isPortaled={false}\n            />\n            {timeZonePickerProps && (\n              <TimeZonePicker\n                isFluid\n                value={selectedTimeZone}\n                onChange={handleTimeZoneChange}\n                referenceDate={preSelectedDate || undefined}\n                {...timeZonePickerProps}\n                floatingStrategy=\"absolute\"\n                isPortaled={false}\n              />\n            )}\n          </span>\n        }\n        disabled={isDisabled}\n        showPopperArrow={false}\n        showMonthYearPicker={picker === 'month'}\n        showYearPicker={picker === 'year'}\n        shouldCloseOnSelect={\n          picker === 'day' && !(reactDatePickerProps.showTimeInput ?? false)\n        }\n        dayClassName={() => 'ndl-datepicker-day'}\n        renderCustomHeader={CustomHeader}\n        {...datePickerProps}\n        popperClassName={classNames(\n          'ndl-datepicker-popper',\n          reactDatePickerProps.popperClassName,\n        )}\n        popperProps={{\n          strategy: isInsideDialog ? 'fixed' : 'absolute',\n          ...reactDatePickerProps.popperProps,\n        }}\n      />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,iCAAiC;AACjC,yDAAyD;AAEzD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AACpC,uCAAkC;AAClC,iCAAsD;AACtD,wEAE0B;AAG1B,4DAAuD;AACvD,6DAA6D;AAC7D,wCAAqC;AACrC,oCAKkB;AAClB,8CAA0C;AAC1C,gDAA8E;AAC9E,wDAAoD;AACpD,8CAA2C;AAC3C,mCAA4D;AAU5D,2EAA2E;AAC3E,6EAA6E;AAC7E,8DAA8D;AAC9D,MAAM,0BAA0B,GAAG,CAAC,EAOF,EAAE,EAAE;QAPF,EAClC,cAAc,EACd,UAAU,EACV,WAAW,EACX,KAAK,EACL,WAAW,OAEqB,EAD7B,SAAS,cANsB,uEAOnC,CADa;IAEZ,iFAAiF;IACjF,MAAM,KAMF,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,EAAE,EANlB,EACJ,WAAW,EAAE,oBAAoB,EACjC,cAAc,EAAE,uBAAuB,EACvC,QAAQ,EAAE,iBAAiB,EAC3B,GAAG,OAEmB,EADnB,kBAAkB,cALjB,oDAML,CAAuB,CAAC;IACzB,MAAM,EAAE,QAAQ,EAAE,gBAAgB,KAA2B,SAAS,EAA/B,iBAAiB,UAAK,SAAS,EAAhE,YAAoD,CAAY,CAAC;IAEvE,MAAM,YAAY,GAA+C,CAAC,KAAK,EAAE,EAAE;QACzE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG,KAAK,CAAC,CAAC;QAC1B,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,KAAK,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,sBAAS,kBACR,GAAG,EAAE,GAAG,EACR,eAAe,EAAE,uBAAC,+BAAuB,KAAG,EAC5C,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,oBAAoB,EAChD,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,YAAY;QACtB,iEAAiE;QACjE,cAAc,kCACT,uBAAuB,GACvB,iBAAiB,KAElB,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC,CAAC;AAwCK,MAAM,UAAU,GAAG,CAAC,EAYW,EAAE,EAAE;;QAZf,EACzB,oBAAoB,EACpB,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,UAAU,EACV,WAAW,GAAG,KAAK,EACnB,GAAG,EACH,SAAS,EACT,KAAK,EACL,cAAc,OAEsB,EADjC,SAAS,cAXa,gKAY1B,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC;IAC5D,MAAM,WAAW,GAAG,IAAA,cAAM,EAAkB,IAAI,CAAC,CAAC;IAClD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAa,KAAK,CAAC,CAAC;IACxD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EACnD,oBAAoB,CAAC,QAAwB;QAC3C,oBAAoB,CAAC,SAAyB,CAClD,CAAC;IACF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,IAAA,gBAAQ,EACtD,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,KAAK,CAC3B,CAAC;IAEF,MAAM,cAAc,GAAG,IAAA,kCAAiB,GAAE,CAAC;IAE3C,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CAAC,MAAkB,EAAE,EAAE;QACrB,SAAS,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAChD,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CAAC,KAAuC,EAAE,EAAE;QAC1C,MAAM,EACJ,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,uBAAuB,EACvB,sBAAsB,EACtB,uBAAuB,EACvB,sBAAsB,GACvB,GAAG,KAAK,CAAC;QAEV,MAAM,YAAY,GAAG,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC;QACtE,MAAM,YAAY,GAAG,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC;QACtE,MAAM,YAAY,GAChB,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,uBAAuB,CAAC;QACvE,MAAM,YAAY,GAChB,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,uBAAuB,CAAC;QAEvE,OAAO,CACL,iCAAK,SAAS,EAAC,uBAAuB,aACpC,iCAAK,SAAS,EAAC,wBAAwB,aACpC,MAAM,KAAK,MAAM,IAAI,CACpB,mCACE,IAAI,EAAC,QAAQ,gBACD,GAAG,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,eAAe,kBACrD,MAAM,KAAK,OAAO,EAChC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,YAEpC,iCAAK,SAAS,EAAC,qCAAqC,aAClD,uBAAC,uBAAU,IAAC,OAAO,EAAC,kBAAkB,YACnC,IAAA,iBAAM,EAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,GACf,EACb,uBAAC,8BAAsB,IACrB,SAAS,EAAE,IAAA,oBAAU,EAAC,wBAAwB,EAAE;4CAC9C,cAAc,EAAE,MAAM,KAAK,OAAO;yCACnC,CAAC,gBACS,cAAc,GACzB,IACE,GACC,CACV,EACA,MAAM,KAAK,OAAO,IAAI,CACrB,mCACE,IAAI,EAAC,QAAQ,gBACD,GAAG,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,cAAc,EACjE,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,YAEnC,iCAAK,SAAS,EAAC,qCAAqC,aAClD,uBAAC,uBAAU,IAAC,OAAO,EAAC,kBAAkB,YACnC,MAAM,KAAK,MAAM;4CAChB,CAAC,CAAC,IAAA,4BAAoB,EAClB,KAAK,CAAC,IAAI,EACV,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,cAAc,CACrC;4CACH,CAAC,CAAC,IAAA,iBAAM,EAAC,KAAK,CAAC,IAAI,EAAE,MAAM,CAAC,GACnB,EACb,uBAAC,8BAAsB,IACrB,SAAS,EAAE,IAAA,oBAAU,EAAC,wBAAwB,EAAE;4CAC9C,cAAc,EAAE,MAAM,KAAK,MAAM;yCAClC,CAAC,gBACS,cAAc,GACzB,IACE,GACC,CACV,IACG,EACL,MAAM,KAAK,OAAO,IAAI,CACrB,iCAAK,SAAS,EAAC,wCAAwC,aACrD,uBAAC,mCAAe,IACd,WAAW,EACT,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAE1D,OAAO,EAAE,YAAY,EACrB,UAAU,EAAE,YAAY,EACxB,SAAS,EAAC,0BAA0B,EACpC,IAAI,EAAC,OAAO,YAEZ,uBAAC,4BAAoB,KAAG,GACR,EAClB,uBAAC,mCAAe,IACd,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,EAC7D,OAAO,EAAE,YAAY,EACrB,UAAU,EAAE,YAAY,EACxB,SAAS,EAAC,0BAA0B,EACpC,IAAI,EAAC,OAAO,YAEZ,uBAAC,6BAAqB,KAAG,GACT,IACd,CACP,IACG,CACP,CAAC;IACJ,CAAC,EACD,CAAC,MAAM,EAAE,YAAY,EAAE,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,cAAc,CAAC,CAC7D,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,OAAmB,EAAE,EAAE;QAC/C,IACE,oBAAoB,CAAC,YAAY;YACjC,oBAAoB,CAAC,eAAe,EACpC,CAAC;YACD,2DAA2D;YAC3D,OAAO;QACT,CAAC;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC;QAC1C,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACrD,kBAAkB,CAAC,OAAO,CAAC,CAAC;QAE5B,IAAI,oBAAoB,CAAC,QAAQ,EAAE,CAAC;YAClC,4BAA4B;YAC5B,oBAAoB,CAAC,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;QACpD,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAChD,mBAAmB,CAAC,QAAQ,CAAC,CAAC;QAC9B,IAAI,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,QAAQ,EAAE,CAAC;YAClC,mBAAmB,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACzC,CAAC;IACH,CAAC,CAAC;IAEF;;;OAGG;IACH,MAAM,iBAAiB,GAA4B,IAAA,mBAAW,EAC5D,CACE,IAAuD,EACvD,KAA4B,EAC5B,EAAE;QACF,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;YACrB,yEAAyE;YACzE,UAAU,CAAC,GAAG,EAAE;gBACd,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC,CAAC,CAAC;QACL,CAAC;aAAM,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;YAC5B,IAAI,IAAI,YAAY,IAAI,EAAE,CAAC;gBACzB,kBAAkB,CAAC,IAAI,CAAC,CAAC;YAC3B,CAAC;iBAAM,IACL,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;gBACnB,IAAI,CAAC,MAAM,GAAG,CAAC;gBACf,IAAI,CAAC,CAAC,CAAC,YAAY,IAAI,EACvB,CAAC;gBACD,kBAAkB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;YAC9B,CAAC;iBAAM,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;gBACzB,kBAAkB,CAAC,IAAI,CAAC,CAAC;YAC3B,CAAC;YAED,IAAI,oBAAoB,CAAC,QAAQ,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;gBAClD,oBAAoB,CAAC,QAAoC,CACxD,IAAI,EACJ,KAAK,CACN,CAAC;YACJ,CAAC;QACH,CAAC;IACH,CAAC,EACD,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAC/B,CAAC;IAEF;;;;OAIG;IACH,MAAM,0BAA0B,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;;QAClD,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;YACrB,SAAS,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC;QACD,MAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,eAAe,oEAAI,CAAC;IAC5C,CAAC,EAAE,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEnC,MAAM,iBAAiB,GAAG,IAAA,mBAAW,EACnC,CAAC,IAAU,EAAE,EAAE;;QACb,IAAI,MAAM,KAAK,OAAO,EAAE,CAAC;YACvB,MAAM,WAAW,GAAG,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,OAAO,EAAE,mCAAI,CAAC,CAAC;YACpD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;YACxE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC;YACpD,MAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,aAAa,qEAAG,IAAI,CAAC,CAAC;QAC9C,CAAC;aAAM,IAAI,MAAM,KAAK,MAAM,EAAE,CAAC;YAC7B,MAAM,WAAW,GAAG,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,OAAO,EAAE,mCAAI,CAAC,CAAC;YACpD,MAAM,aAAa,GAAG,MAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,QAAQ,EAAE,mCAAI,CAAC,CAAC;YACvD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAAC,aAAa,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;YACtE,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC;YACpE,MAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,aAAa,qEAAG,IAAI,CAAC,CAAC;QAC9C,CAAC;QACD,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,MAAM,EAAE,eAAe,EAAE,oBAAoB,CAAC,CAChD,CAAC;IAEF;;;OAGG;IACH,MAAM,sBAAsB,GAAG,IAAA,mBAAW,EACxC,CACE,KAE6C,EAC7C,EAAE;;QACF,MAAM,MAAM,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAsC,CAAC;QAC7D,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,MAAK,EAAE,EAAE,CAAC;YACzB,kBAAkB,CAAC,IAAI,CAAC,CAAC;YACzB,IAAI,oBAAoB,CAAC,QAAQ,EAAE,CAAC;gBACjC,oBAAoB,CAAC,QAAoC,CACxD,IAAI,EACJ,KAAK,CACN,CAAC;YACJ,CAAC;QACH,CAAC;QACD,MAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,WAAW,qEAAG,KAAK,CAAC,CAAC;IAC7C,CAAC,EACD,CAAC,oBAAoB,CAAC,CACvB,CAAC;IAEF,MAAM,eAAe,mCAChB,oBAAoB,KACvB,eAAe,EAAE,0BAA0B,EAC3C,QAAQ,EAAE,iBAAiB,EAC3B,WAAW,EAAE,sBAAsB,EACnC,aAAa,EAAE,iBAAiB,GACjC,CAAC;IAEF,OAAO,CACL,8CACE,SAAS,EAAE,OAAO,EAClB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,cAGlB,uBAAC,0BAAe,kBACd,GAAG,EAAE,WAAW,EAChB,WAAW,EACT,uBAAC,0BAA0B,IACzB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,EAEJ,eAAe,EACb,kCAAM,SAAS,EAAC,yBAAyB,aACvC,uBAAC,iBAAO,KAAG,EACX,uBAAC,wBAAU,kBACT,OAAO,QACP,KAAK,EACH,eAAe;4BACb,CAAC,CAAC,IAAI,wBAAU,CACZ,eAAe,CAAC,QAAQ,EAAE,EAC1B,eAAe,CAAC,UAAU,EAAE,CAC7B;4BACH,CAAC,CAAC,SAAS,EAEf,QAAQ,EAAE,gBAAgB,IACtB,eAAe,IACnB,gBAAgB,EAAC,UAAU,EAC3B,UAAU,EAAE,KAAK,IACjB,EACD,mBAAmB,IAAI,CACtB,uBAAC,gCAAc,kBACb,OAAO,QACP,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,oBAAoB,EAC9B,aAAa,EAAE,eAAe,IAAI,SAAS,IACvC,mBAAmB,IACvB,gBAAgB,EAAC,UAAU,EAC3B,UAAU,EAAE,KAAK,IACjB,CACH,IACI,EAET,QAAQ,EAAE,UAAU,EACpB,eAAe,EAAE,KAAK,EACtB,mBAAmB,EAAE,MAAM,KAAK,OAAO,EACvC,cAAc,EAAE,MAAM,KAAK,MAAM,EACjC,mBAAmB,EACjB,MAAM,KAAK,KAAK,IAAI,CAAC,CAAC,MAAA,oBAAoB,CAAC,aAAa,mCAAI,KAAK,CAAC,EAEpE,YAAY,EAAE,GAAG,EAAE,CAAC,oBAAoB,EACxC,kBAAkB,EAAE,YAAY,IAC5B,eAAe,IACnB,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,IAAA,oBAAU,EACzB,uBAAuB,EACvB,oBAAoB,CAAC,eAAe,CACrC,EACD,WAAW,kBACT,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,IAC5C,oBAAoB,CAAC,WAAW,KAErC,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AA9UW,QAAA,UAAU,cA8UrB","sourcesContent":["// TODO: try to fix as some point\n/* eslint-disable @typescript-eslint/naming-convention */\n\n/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport { format } from 'date-fns';\nimport { useCallback, useRef, useState } from 'react';\nimport ReactDatePicker, {\n  type ReactDatePickerCustomHeaderProps,\n} from 'react-datepicker';\n\nimport type { CommonProps, HtmlAttributes } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { Divider } from '../divider';\nimport {\n  ArrowLeftIconOutline,\n  ArrowRightIconOutline,\n  CalendarDaysIconOutline,\n  ChevronDownIconOutline,\n} from '../icons';\nimport { TextInput } from '../text-input';\nimport { NeedleTime, TimePicker, type TimePickerProps } from '../time-picker';\nimport { TimeZonePicker } from '../timezone-picker';\nimport { Typography } from '../typography';\nimport { daysInMonth, getYearsPeriodString } from './utils';\n\ntype DatePickerTextInputWrapperProps = React.ComponentProps<'input'> & {\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  isDisabled?: boolean;\n  isClearable?: boolean;\n  value?: string;\n  ariaLabel?: string;\n};\n\n// This wrapper is needed due to react-datepicker injecting html attributes\n// into the custom input component on root level, since we use htmlAttributes\n// we need to help spread them there instead of the root level\nconst DatePickerTextInputWrapper = ({\n  textInputProps,\n  isDisabled,\n  isClearable,\n  value,\n  placeholder,\n  ...restProps\n}: DatePickerTextInputWrapperProps) => {\n  // deconstruct textInputProps to avoid bugs with react-datepicker injecting props\n  const {\n    placeholder: textInputPlaceholder,\n    htmlAttributes: textInputHtmlAttributes,\n    onChange: textInputOnChange,\n    ref,\n    ...restTextInputProps\n  } = textInputProps ?? {};\n  const { onChange: injectedOnChange, ...restInjectedProps } = restProps;\n\n  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    injectedOnChange?.(event);\n    textInputOnChange?.(event);\n  };\n\n  return (\n    <TextInput\n      ref={ref}\n      trailingElement={<CalendarDaysIconOutline />}\n      value={value}\n      placeholder={placeholder ?? textInputPlaceholder}\n      isDisabled={isDisabled}\n      isClearable={isClearable}\n      onChange={handleChange}\n      // react-datepicker injects html attributes into the custom input\n      htmlAttributes={{\n        ...textInputHtmlAttributes,\n        ...restInjectedProps,\n      }}\n      {...restTextInputProps}\n    />\n  );\n};\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype PickerType = 'day' | 'month' | 'year';\n\n// Define a more flexible type for onChange\ntype DatePickerChangeHandler = (\n  date: Date | null | [Date | null, Date | null] | Date[],\n  event?: React.SyntheticEvent | undefined,\n) => void;\n\ninterface DatePickerProps {\n  /** Props for the embedded `TextInput` component. */\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  /** Whether the date picker is disabled. */\n  isDisabled?: boolean;\n  /**\n   * Whether to show the clear button.\n   * @default false\n   */\n  isClearable?: boolean;\n  /** Props for the embedded `TimePicker` component. */\n  timePickerProps?: TimePickerProps;\n  /** Props for the embedded `TimeZonePicker` component. */\n  timeZonePickerProps?: React.ComponentProps<typeof TimeZonePicker>;\n  /** Props forwarded to underlying `react-datepicker` component. */\n  reactDatePickerProps: React.ComponentProps<typeof ReactDatePicker>;\n  /**\n   * WARNING: these attributes do not apply to the underlying input element currently. This will be fixed in a future version.\n   */\n  htmlAttributes?: HtmlAttributes<'div'>;\n}\n\nexport const DatePicker = ({\n  reactDatePickerProps,\n  textInputProps,\n  timePickerProps,\n  timeZonePickerProps,\n  isDisabled,\n  isClearable = false,\n  ref,\n  className,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', DatePickerProps>) => {\n  const classes = classNames(`ndl-datepicker`, className, {});\n  const datetimeRef = useRef<ReactDatePicker>(null);\n  const [picker, setPicker] = useState<PickerType>('day');\n  const [preSelectedDate, setPreSelectedDate] = useState<Date | null>(\n    (reactDatePickerProps.selected as Date | null) ||\n      (reactDatePickerProps.startDate as Date | null),\n  );\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string | undefined>(\n    timeZonePickerProps?.value,\n  );\n\n  const isInsideDialog = useIsInsideDialog();\n\n  const headerAction = useCallback(\n    (action: PickerType) => {\n      setPicker(picker === action ? 'day' : action);\n    },\n    [picker],\n  );\n\n  const CustomHeader = useCallback(\n    (props: ReactDatePickerCustomHeaderProps) => {\n      const {\n        decreaseMonth,\n        increaseMonth,\n        increaseYear,\n        decreaseYear,\n        nextMonthButtonDisabled,\n        nextYearButtonDisabled,\n        prevMonthButtonDisabled,\n        prevYearButtonDisabled,\n      } = props;\n\n      const prevCallback = picker === 'year' ? decreaseYear : decreaseMonth;\n      const nextCallback = picker === 'year' ? increaseYear : increaseMonth;\n      const prevDisabled =\n        picker === 'year' ? prevYearButtonDisabled : prevMonthButtonDisabled;\n      const nextDisabled =\n        picker === 'year' ? nextYearButtonDisabled : nextMonthButtonDisabled;\n\n      return (\n        <div className=\"ndl-datepicker-header\">\n          <div className=\"ndl-datepicker-selects\">\n            {picker !== 'year' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'month' ? 'Close' : 'Open'} month picker`}\n                aria-pressed={picker === 'month'}\n                onClick={() => headerAction('month')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {format(props.date, 'MMM')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'month',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n            {picker !== 'month' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'year' ? 'Close' : 'Open'} year picker`}\n                onClick={() => headerAction('year')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {picker === 'year'\n                      ? getYearsPeriodString(\n                          props.date,\n                          reactDatePickerProps?.yearItemNumber,\n                        )\n                      : format(props.date, 'yyyy')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'year',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n          </div>\n          {picker !== 'month' && (\n            <div className=\"n-flex n-justify-center n-gap-token-16\">\n              <CleanIconButton\n                description={\n                  picker === 'year' ? 'Previous period' : 'Previous month'\n                }\n                onClick={prevCallback}\n                isDisabled={prevDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowLeftIconOutline />\n              </CleanIconButton>\n              <CleanIconButton\n                description={picker === 'year' ? 'Next period' : 'Next month'}\n                onClick={nextCallback}\n                isDisabled={nextDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowRightIconOutline />\n              </CleanIconButton>\n            </div>\n          )}\n        </div>\n      );\n    },\n    [picker, headerAction, reactDatePickerProps?.yearItemNumber],\n  );\n\n  const handleTimeChange = (newTime: NeedleTime) => {\n    if (\n      reactDatePickerProps.selectsRange ||\n      reactDatePickerProps.selectsMultiple\n    ) {\n      // this is consistent with the behavior of react-datepicker\n      return;\n    }\n\n    if (!preSelectedDate) {\n      return;\n    }\n\n    const newDate = new Date(preSelectedDate);\n    newDate.setHours(newTime.hour, newTime.minute, 0, 0);\n    setPreSelectedDate(newDate);\n\n    if (reactDatePickerProps.onChange) {\n      // For single date selection\n      reactDatePickerProps.onChange(newDate, undefined);\n    }\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setSelectedTimeZone(timezone);\n    if (timeZonePickerProps?.onChange) {\n      timeZonePickerProps.onChange(timezone);\n    }\n  };\n\n  /**\n   * Intercept onChange so we can work with\n   * Month and Year pickers\n   */\n  const interceptedChange: DatePickerChangeHandler = useCallback(\n    (\n      date: Date | null | [Date | null, Date | null] | Date[],\n      event?: React.SyntheticEvent,\n    ) => {\n      if (picker !== 'day') {\n        // setTimeout to prevent picker change before the handleMonthChange logic\n        setTimeout(() => {\n          setPicker('day');\n        });\n      } else if (picker === 'day') {\n        if (date instanceof Date) {\n          setPreSelectedDate(date);\n        } else if (\n          Array.isArray(date) &&\n          date.length > 0 &&\n          date[0] instanceof Date\n        ) {\n          setPreSelectedDate(date[0]);\n        } else if (date === null) {\n          setPreSelectedDate(null);\n        }\n\n        if (reactDatePickerProps.onChange && date !== null) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            date,\n            event,\n          );\n        }\n      }\n    },\n    [picker, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onCalendarClose so we can\n   * switch to \"day\" picker if we close on \"month\" or \"year\"\n   * view\n   */\n  const interceptedOnCalendarClose = useCallback(() => {\n    if (picker !== 'day') {\n      setPicker('day');\n    }\n    reactDatePickerProps?.onCalendarClose?.();\n  }, [picker, reactDatePickerProps]);\n\n  const handleMonthChange = useCallback(\n    (date: Date) => {\n      if (picker === 'month') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const daysInNewMonth = daysInMonth(date.getMonth(), date.getFullYear());\n        date.setDate(Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      } else if (picker === 'year') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const selectedMonth = preSelectedDate?.getMonth() ?? 0;\n        const daysInNewMonth = daysInMonth(selectedMonth, date.getFullYear());\n        date.setMonth(selectedMonth, Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      }\n      setPreSelectedDate(date);\n    },\n    [picker, preSelectedDate, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onChangeRaw to handle clearing the input\n   * When the user clears the text input, set the date to null\n   */\n  const interceptedOnChangeRaw = useCallback(\n    (\n      event?:\n        | React.KeyboardEvent<HTMLElement>\n        | React.MouseEvent<HTMLElement, MouseEvent>,\n    ) => {\n      const target = event?.target as HTMLInputElement | undefined;\n      if (target?.value === '') {\n        setPreSelectedDate(null);\n        if (reactDatePickerProps.onChange) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            null,\n            event,\n          );\n        }\n      }\n      reactDatePickerProps?.onChangeRaw?.(event);\n    },\n    [reactDatePickerProps],\n  );\n\n  const datePickerProps = {\n    ...reactDatePickerProps,\n    onCalendarClose: interceptedOnCalendarClose,\n    onChange: interceptedChange,\n    onChangeRaw: interceptedOnChangeRaw,\n    onMonthChange: handleMonthChange,\n  };\n\n  return (\n    <div\n      className={classes}\n      ref={ref}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/** TODO v5: Remove the div wrapper, type the component as an input, and apply all root props to the TextInput */}\n      <ReactDatePicker\n        ref={datetimeRef}\n        customInput={\n          <DatePickerTextInputWrapper\n            isDisabled={isDisabled}\n            isClearable={isClearable}\n            textInputProps={textInputProps}\n          />\n        }\n        customTimeInput={\n          <span className=\"ndl-time-picker-wrapper\">\n            <Divider />\n            <TimePicker\n              isFluid\n              value={\n                preSelectedDate\n                  ? new NeedleTime(\n                      preSelectedDate.getHours(),\n                      preSelectedDate.getMinutes(),\n                    )\n                  : undefined\n              }\n              onChange={handleTimeChange}\n              {...timePickerProps}\n              floatingStrategy=\"absolute\"\n              isPortaled={false}\n            />\n            {timeZonePickerProps && (\n              <TimeZonePicker\n                isFluid\n                value={selectedTimeZone}\n                onChange={handleTimeZoneChange}\n                referenceDate={preSelectedDate || undefined}\n                {...timeZonePickerProps}\n                floatingStrategy=\"absolute\"\n                isPortaled={false}\n              />\n            )}\n          </span>\n        }\n        disabled={isDisabled}\n        showPopperArrow={false}\n        showMonthYearPicker={picker === 'month'}\n        showYearPicker={picker === 'year'}\n        shouldCloseOnSelect={\n          picker === 'day' && !(reactDatePickerProps.showTimeInput ?? false)\n        }\n        dayClassName={() => 'ndl-datepicker-day'}\n        renderCustomHeader={CustomHeader}\n        {...datePickerProps}\n        isClearable={isClearable}\n        popperClassName={classNames(\n          'ndl-datepicker-popper',\n          reactDatePickerProps.popperClassName,\n        )}\n        popperProps={{\n          strategy: isInsideDialog ? 'fixed' : 'absolute',\n          ...reactDatePickerProps.popperProps,\n        }}\n      />\n    </div>\n  );\n};\n"]}

package/lib/cjs/date-picker/stories/date-picker-clearable.story.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Component = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const react_1 = require("@neo4j-ndl/react");
+const react_2 = require("react");
+const Component = () => {
+    const [selectedDate, setSelectedDate] = (0, react_2.useState)(new Date('2023-05-27'));
+    const handleOnChange = (date) => {
+        setSelectedDate(date);
+    };
+    return ((0, jsx_runtime_1.jsx)(react_1.DatePicker, { isClearable: true, reactDatePickerProps: {
+            onChange: handleOnChange,
+            popperProps: {
+                strategy: 'fixed',
+            },
+            selected: selectedDate,
+        }, textInputProps: {
+            htmlAttributes: {
+                'aria-label': 'Clearable date picker input',
+            },
+        } }));
+};
+exports.Component = Component;
+exports.default = exports.Component;
+//# sourceMappingURL=date-picker-clearable.story.js.map

package/lib/cjs/date-picker/stories/date-picker-clearable.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-clearable.story.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/date-picker-clearable.story.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA8C;AAC9C,iCAAiC;AAE1B,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAC9C,IAAI,IAAI,CAAC,YAAY,CAAC,CACvB,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,IAAiB,EAAE,EAAE;QAC3C,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,kBAAU,IACT,WAAW,QACX,oBAAoB,EAAE;YACpB,QAAQ,EAAE,cAAc;YACxB,WAAW,EAAE;gBACX,QAAQ,EAAE,OAAO;aAClB;YACD,QAAQ,EAAE,YAAY;SACvB,EACD,cAAc,EAAE;YACd,cAAc,EAAE;gBACd,YAAY,EAAE,6BAA6B;aAC5C;SACF,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AA1BW,QAAA,SAAS,aA0BpB;AAEF,kBAAe,iBAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DatePicker } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nexport const Component = () => {\n  const [selectedDate, setSelectedDate] = useState<Date | null>(\n    new Date('2023-05-27'),\n  );\n\n  const handleOnChange = (date: Date | null) => {\n    setSelectedDate(date);\n  };\n\n  return (\n    <DatePicker\n      isClearable\n      reactDatePickerProps={{\n        onChange: handleOnChange,\n        popperProps: {\n          strategy: 'fixed',\n        },\n        selected: selectedDate,\n      }}\n      textInputProps={{\n        htmlAttributes: {\n          'aria-label': 'Clearable date picker input',\n        },\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/date-picker/stories/index.js

@@ -23,9 +23,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DatePickerRangeSource = exports.DatePickerPortaledSource = exports.DatePickerFullSource = exports.DatePickerInDialogSource = exports.DatePickerDisabledSource = exports.DatePickerWithTimeZoneBothModeSource = exports.DatePickerWithTimeZoneSource = exports.DatePickerWithTimePickerSource = exports.DatePickerTextInputPropsSource = exports.DatePickerOpensToDateSource = exports.DatePickerMinMaxDateSource = exports.DatePickerStartsOnMondaySource = exports.DatePickerDefaultSource = exports.DatePickerRange = exports.DatePickerPortaled = exports.DatePickerFull = exports.DatePickerInDialog = exports.DatePickerDisabled = exports.DatePickerWithTimeZoneBothMode = exports.DatePickerWithTimeZone = exports.DatePickerWithTimePicker = exports.DatePickerTextInputProps = exports.DatePickerOpensToDate = exports.DatePickerMinMaxDate = exports.DatePickerStartsOnMonday = exports.DatePickerDefault = void 0;
+exports.DatePickerRangeSource = exports.DatePickerPortaledSource = exports.DatePickerFullSource = exports.DatePickerInDialogSource = exports.DatePickerDisabledSource = exports.DatePickerWithTimeZoneBothModeSource = exports.DatePickerWithTimeZoneSource = exports.DatePickerWithTimePickerSource = exports.DatePickerTextInputPropsSource = exports.DatePickerOpensToDateSource = exports.DatePickerMinMaxDateSource = exports.DatePickerStartsOnMondaySource = exports.DatePickerClearableSource = exports.DatePickerDefaultSource = exports.DatePickerRange = exports.DatePickerPortaled = exports.DatePickerFull = exports.DatePickerInDialog = exports.DatePickerDisabled = exports.DatePickerWithTimeZoneBothMode = exports.DatePickerWithTimeZone = exports.DatePickerWithTimePicker = exports.DatePickerTextInputProps = exports.DatePickerOpensToDate = exports.DatePickerMinMaxDate = exports.DatePickerStartsOnMonday = exports.DatePickerClearable = exports.DatePickerDefault = void 0;
 var date_picker_default_story_1 = require("./date-picker-default.story");
 Object.defineProperty(exports, "DatePickerDefault", { enumerable: true, get: function () { return __importDefault(date_picker_default_story_1).default; } });
+var date_picker_clearable_story_1 = require("./date-picker-clearable.story");
+Object.defineProperty(exports, "DatePickerClearable", { enumerable: true, get: function () { return __importDefault(date_picker_clearable_story_1).default; } });
 var date_picker_starts_on_monday_story_1 = require("./date-picker-starts-on-monday.story");
 Object.defineProperty(exports, "DatePickerStartsOnMonday", { enumerable: true, get: function () { return __importDefault(date_picker_starts_on_monday_story_1).default; } });
 var date_picker_min_max_date_story_1 = require("./date-picker-min-max-date.story");
@@ -51,6 +53,7 @@ Object.defineProperty(exports, "DatePickerPortaled", { enumerable: true, get: fu
 var date_picker_range_story_1 = require("./date-picker-range.story");
 Object.defineProperty(exports, "DatePickerRange", { enumerable: true, get: function () { return __importDefault(date_picker_range_story_1).default; } });
 const export_stories_utils_1 = require("../../_common/export-stories-utils");
+const date_picker_clearable_story_tsx_raw_1 = __importDefault(require("./date-picker-clearable.story.tsx?raw"));
 const date_picker_default_story_tsx_raw_1 = __importDefault(require("./date-picker-default.story.tsx?raw"));
 const date_picker_disabled_story_tsx_raw_1 = __importDefault(require("./date-picker-disabled.story.tsx?raw"));
 const date_picker_full_story_tsx_raw_1 = __importDefault(require("./date-picker-full.story.tsx?raw"));
@@ -65,6 +68,7 @@ const date_picker_with_time_picker_story_tsx_raw_1 = __importDefault(require("./
 const date_picker_with_timezone_story_tsx_raw_1 = __importDefault(require("./date-picker-with-timezone.story.tsx?raw"));
 const date_picker_with_timezone_both_mode_story_tsx_raw_1 = __importDefault(require("./date-picker-with-timezone-both-mode.story.tsx?raw"));
 exports.DatePickerDefaultSource = (0, export_stories_utils_1.removeLicenseHeader)(date_picker_default_story_tsx_raw_1.default);
+exports.DatePickerClearableSource = (0, export_stories_utils_1.removeLicenseHeader)(date_picker_clearable_story_tsx_raw_1.default);
 exports.DatePickerStartsOnMondaySource = (0, export_stories_utils_1.removeLicenseHeader)(date_picker_starts_on_monday_story_tsx_raw_1.default);
 exports.DatePickerMinMaxDateSource = (0, export_stories_utils_1.removeLicenseHeader)(date_picker_min_max_date_story_tsx_raw_1.default);
 exports.DatePickerOpensToDateSource = (0, export_stories_utils_1.removeLicenseHeader)(date_picker_opens_to_date_story_tsx_raw_1.default);

package/lib/cjs/date-picker/stories/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,yEAA2E;AAAlE,+IAAA,OAAO,OAAqB;AACrC,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,mFAAmF;AAA1E,uJAAA,OAAO,OAAwB;AACxC,qFAAqF;AAA5E,yJAAA,OAAO,OAAyB;AACzC,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,qFAAsF;AAA7E,0JAAA,OAAO,OAA0B;AAC1C,yGAAwG;AAA/F,4KAAA,OAAO,OAAkC;AAClD,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,6EAA8E;AAArE,kJAAA,OAAO,OAAsB;AACtC,mEAAqE;AAA5D,yIAAA,OAAO,OAAkB;AAClC,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AAEnC,6EAAyE;AACzE,4GAA6E;AAC7E,8GAA+E;AAC/E,sGAAuE;AACvE,gHAAgF;AAChF,sHAAqF;AACrF,wHAAuF;AACvF,8GAA+E;AAC/E,wGAAyE;AACzE,8HAA6F;AAC7F,8HAA6F;AAC7F,8HAA6F;AAC7F,wHAAwF;AACxF,4IAA0G;AAE7F,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,2CAA0B,CAC3B,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,0BAA0B,GAAG,IAAA,0CAAmB,EAC3D,gDAA6B,CAC9B,CAAC;AACW,QAAA,2BAA2B,GAAG,IAAA,0CAAmB,EAC5D,iDAA8B,CAC/B,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,4BAA4B,GAAG,IAAA,0CAAmB,EAC7D,iDAA+B,CAChC,CAAC;AACW,QAAA,oCAAoC,GAAG,IAAA,0CAAmB,EACrE,2DAAuC,CACxC,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,4CAA2B,CAC5B,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,6CAA2B,CAC5B,CAAC;AACW,QAAA,oBAAoB,GAAG,IAAA,0CAAmB,EACrD,wCAAuB,CACxB,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,4CAA2B,CAC5B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,yCAAwB,CACzB,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as DatePickerDefault } from './date-picker-default.story';\nexport { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';\nexport { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';\nexport { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';\nexport { default as DatePickerTextInputProps } from './date-picker-text-input-props.story';\nexport { default as DatePickerWithTimePicker } from './date-picker-with-time-picker.story';\nexport { default as DatePickerWithTimeZone } from './date-picker-with-timezone.story';\nexport { default as DatePickerWithTimeZoneBothMode } from './date-picker-with-timezone-both-mode.story';\nexport { default as DatePickerDisabled } from './date-picker-disabled.story';\nexport { default as DatePickerInDialog } from './date-picker-in-dialog.story';\nexport { default as DatePickerFull } from './date-picker-full.story';\nexport { default as DatePickerPortaled } from './date-picker-portaled.story';\nexport { default as DatePickerRange } from './date-picker-range.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport DatePickerDefaultSourceRaw from './date-picker-default.story.tsx?raw';\nimport DatePickerDisabledSourceRaw from './date-picker-disabled.story.tsx?raw';\nimport DatePickerFullSourceRaw from './date-picker-full.story.tsx?raw';\nimport DatePickerInDialogSourceRaw from './date-picker-in-dialog.story.tsx?raw';\nimport DatePickerMinMaxDateSourceRaw from './date-picker-min-max-date.story.tsx?raw';\nimport DatePickerOpensToDateSourceRaw from './date-picker-opens-to-date.story.tsx?raw';\nimport DatePickerPortaledSourceRaw from './date-picker-portaled.story.tsx?raw';\nimport DatePickerRangeSourceRaw from './date-picker-range.story.tsx?raw';\nimport DatePickerStartsOnMondaySourceRaw from './date-picker-starts-on-monday.story.tsx?raw';\nimport DatePickerTextInputPropsSourceRaw from './date-picker-text-input-props.story.tsx?raw';\nimport DatePickerWithTimePickerSourceRaw from './date-picker-with-time-picker.story.tsx?raw';\nimport DatePickerWithTimeZoneSourceRaw from './date-picker-with-timezone.story.tsx?raw';\nimport DatePickerWithTimeZoneBothModeSourceRaw from './date-picker-with-timezone-both-mode.story.tsx?raw';\n\nexport const DatePickerDefaultSource = removeLicenseHeader(\n  DatePickerDefaultSourceRaw,\n);\nexport const DatePickerStartsOnMondaySource = removeLicenseHeader(\n  DatePickerStartsOnMondaySourceRaw,\n);\nexport const DatePickerMinMaxDateSource = removeLicenseHeader(\n  DatePickerMinMaxDateSourceRaw,\n);\nexport const DatePickerOpensToDateSource = removeLicenseHeader(\n  DatePickerOpensToDateSourceRaw,\n);\nexport const DatePickerTextInputPropsSource = removeLicenseHeader(\n  DatePickerTextInputPropsSourceRaw,\n);\nexport const DatePickerWithTimePickerSource = removeLicenseHeader(\n  DatePickerWithTimePickerSourceRaw,\n);\nexport const DatePickerWithTimeZoneSource = removeLicenseHeader(\n  DatePickerWithTimeZoneSourceRaw,\n);\nexport const DatePickerWithTimeZoneBothModeSource = removeLicenseHeader(\n  DatePickerWithTimeZoneBothModeSourceRaw,\n);\nexport const DatePickerDisabledSource = removeLicenseHeader(\n  DatePickerDisabledSourceRaw,\n);\nexport const DatePickerInDialogSource = removeLicenseHeader(\n  DatePickerInDialogSourceRaw,\n);\nexport const DatePickerFullSource = removeLicenseHeader(\n  DatePickerFullSourceRaw,\n);\nexport const DatePickerPortaledSource = removeLicenseHeader(\n  DatePickerPortaledSourceRaw,\n);\nexport const DatePickerRangeSource = removeLicenseHeader(\n  DatePickerRangeSourceRaw,\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,yEAA2E;AAAlE,+IAAA,OAAO,OAAqB;AACrC,6EAA+E;AAAtE,mJAAA,OAAO,OAAuB;AACvC,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,mFAAmF;AAA1E,uJAAA,OAAO,OAAwB;AACxC,qFAAqF;AAA5E,yJAAA,OAAO,OAAyB;AACzC,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,2FAA2F;AAAlF,+JAAA,OAAO,OAA4B;AAC5C,qFAAsF;AAA7E,0JAAA,OAAO,OAA0B;AAC1C,yGAAwG;AAA/F,4KAAA,OAAO,OAAkC;AAClD,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,6EAA8E;AAArE,kJAAA,OAAO,OAAsB;AACtC,mEAAqE;AAA5D,yIAAA,OAAO,OAAkB;AAClC,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AAEnC,6EAAyE;AACzE,gHAAiF;AACjF,4GAA6E;AAC7E,8GAA+E;AAC/E,sGAAuE;AACvE,gHAAgF;AAChF,sHAAqF;AACrF,wHAAuF;AACvF,8GAA+E;AAC/E,wGAAyE;AACzE,8HAA6F;AAC7F,8HAA6F;AAC7F,8HAA6F;AAC7F,wHAAwF;AACxF,4IAA0G;AAE7F,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,2CAA0B,CAC3B,CAAC;AACW,QAAA,yBAAyB,GAAG,IAAA,0CAAmB,EAC1D,6CAA4B,CAC7B,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,0BAA0B,GAAG,IAAA,0CAAmB,EAC3D,gDAA6B,CAC9B,CAAC;AACW,QAAA,2BAA2B,GAAG,IAAA,0CAAmB,EAC5D,iDAA8B,CAC/B,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,8BAA8B,GAAG,IAAA,0CAAmB,EAC/D,oDAAiC,CAClC,CAAC;AACW,QAAA,4BAA4B,GAAG,IAAA,0CAAmB,EAC7D,iDAA+B,CAChC,CAAC;AACW,QAAA,oCAAoC,GAAG,IAAA,0CAAmB,EACrE,2DAAuC,CACxC,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,4CAA2B,CAC5B,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,6CAA2B,CAC5B,CAAC;AACW,QAAA,oBAAoB,GAAG,IAAA,0CAAmB,EACrD,wCAAuB,CACxB,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,4CAA2B,CAC5B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,yCAAwB,CACzB,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as DatePickerDefault } from './date-picker-default.story';\nexport { default as DatePickerClearable } from './date-picker-clearable.story';\nexport { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';\nexport { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';\nexport { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';\nexport { default as DatePickerTextInputProps } from './date-picker-text-input-props.story';\nexport { default as DatePickerWithTimePicker } from './date-picker-with-time-picker.story';\nexport { default as DatePickerWithTimeZone } from './date-picker-with-timezone.story';\nexport { default as DatePickerWithTimeZoneBothMode } from './date-picker-with-timezone-both-mode.story';\nexport { default as DatePickerDisabled } from './date-picker-disabled.story';\nexport { default as DatePickerInDialog } from './date-picker-in-dialog.story';\nexport { default as DatePickerFull } from './date-picker-full.story';\nexport { default as DatePickerPortaled } from './date-picker-portaled.story';\nexport { default as DatePickerRange } from './date-picker-range.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport DatePickerClearableSourceRaw from './date-picker-clearable.story.tsx?raw';\nimport DatePickerDefaultSourceRaw from './date-picker-default.story.tsx?raw';\nimport DatePickerDisabledSourceRaw from './date-picker-disabled.story.tsx?raw';\nimport DatePickerFullSourceRaw from './date-picker-full.story.tsx?raw';\nimport DatePickerInDialogSourceRaw from './date-picker-in-dialog.story.tsx?raw';\nimport DatePickerMinMaxDateSourceRaw from './date-picker-min-max-date.story.tsx?raw';\nimport DatePickerOpensToDateSourceRaw from './date-picker-opens-to-date.story.tsx?raw';\nimport DatePickerPortaledSourceRaw from './date-picker-portaled.story.tsx?raw';\nimport DatePickerRangeSourceRaw from './date-picker-range.story.tsx?raw';\nimport DatePickerStartsOnMondaySourceRaw from './date-picker-starts-on-monday.story.tsx?raw';\nimport DatePickerTextInputPropsSourceRaw from './date-picker-text-input-props.story.tsx?raw';\nimport DatePickerWithTimePickerSourceRaw from './date-picker-with-time-picker.story.tsx?raw';\nimport DatePickerWithTimeZoneSourceRaw from './date-picker-with-timezone.story.tsx?raw';\nimport DatePickerWithTimeZoneBothModeSourceRaw from './date-picker-with-timezone-both-mode.story.tsx?raw';\n\nexport const DatePickerDefaultSource = removeLicenseHeader(\n  DatePickerDefaultSourceRaw,\n);\nexport const DatePickerClearableSource = removeLicenseHeader(\n  DatePickerClearableSourceRaw,\n);\nexport const DatePickerStartsOnMondaySource = removeLicenseHeader(\n  DatePickerStartsOnMondaySourceRaw,\n);\nexport const DatePickerMinMaxDateSource = removeLicenseHeader(\n  DatePickerMinMaxDateSourceRaw,\n);\nexport const DatePickerOpensToDateSource = removeLicenseHeader(\n  DatePickerOpensToDateSourceRaw,\n);\nexport const DatePickerTextInputPropsSource = removeLicenseHeader(\n  DatePickerTextInputPropsSourceRaw,\n);\nexport const DatePickerWithTimePickerSource = removeLicenseHeader(\n  DatePickerWithTimePickerSourceRaw,\n);\nexport const DatePickerWithTimeZoneSource = removeLicenseHeader(\n  DatePickerWithTimeZoneSourceRaw,\n);\nexport const DatePickerWithTimeZoneBothModeSource = removeLicenseHeader(\n  DatePickerWithTimeZoneBothModeSourceRaw,\n);\nexport const DatePickerDisabledSource = removeLicenseHeader(\n  DatePickerDisabledSourceRaw,\n);\nexport const DatePickerInDialogSource = removeLicenseHeader(\n  DatePickerInDialogSourceRaw,\n);\nexport const DatePickerFullSource = removeLicenseHeader(\n  DatePickerFullSourceRaw,\n);\nexport const DatePickerPortaledSource = removeLicenseHeader(\n  DatePickerPortaledSourceRaw,\n);\nexport const DatePickerRangeSource = removeLicenseHeader(\n  DatePickerRangeSourceRaw,\n);\n"]}

package/lib/esm/date-picker/DatePicker.js

@@ -49,16 +49,21 @@ import { daysInMonth, getYearsPeriodString } from './utils';
 // into the custom input component on root level, since we use htmlAttributes
 // we need to help spread them there instead of the root level
 const DatePickerTextInputWrapper = (_a) => {
-    var { textInputProps, isDisabled, value, placeholder } = _a, restProps = __rest(_a, ["textInputProps", "isDisabled", "value", "placeholder"]);
+    var { textInputProps, isDisabled, isClearable, value, placeholder } = _a, restProps = __rest(_a, ["textInputProps", "isDisabled", "isClearable", "value", "placeholder"]);
     // deconstruct textInputProps to avoid bugs with react-datepicker injecting props
-    const _b = textInputProps !== null && textInputProps !== void 0 ? textInputProps : {}, { placeholder: textInputPlaceholder, htmlAttributes: textInputHtmlAttributes, ref } = _b, restTextInputProps = __rest(_b, ["placeholder", "htmlAttributes", "ref"]);
-    return (_jsx(TextInput, Object.assign({ ref: ref, trailingElement: _jsx(CalendarDaysIconOutline, {}), value: value, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : textInputPlaceholder, isDisabled: isDisabled, 
+    const _b = textInputProps !== null && textInputProps !== void 0 ? textInputProps : {}, { placeholder: textInputPlaceholder, htmlAttributes: textInputHtmlAttributes, onChange: textInputOnChange, ref } = _b, restTextInputProps = __rest(_b, ["placeholder", "htmlAttributes", "onChange", "ref"]);
+    const { onChange: injectedOnChange } = restProps, restInjectedProps = __rest(restProps, ["onChange"]);
+    const handleChange = (event) => {
+        injectedOnChange === null || injectedOnChange === void 0 ? void 0 : injectedOnChange(event);
+        textInputOnChange === null || textInputOnChange === void 0 ? void 0 : textInputOnChange(event);
+    };
+    return (_jsx(TextInput, Object.assign({ ref: ref, trailingElement: _jsx(CalendarDaysIconOutline, {}), value: value, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : textInputPlaceholder, isDisabled: isDisabled, isClearable: isClearable, onChange: handleChange, 
         // react-datepicker injects html attributes into the custom input
-        htmlAttributes: Object.assign(Object.assign({}, textInputHtmlAttributes), restProps) }, restTextInputProps)));
+        htmlAttributes: Object.assign(Object.assign({}, textInputHtmlAttributes), restInjectedProps) }, restTextInputProps)));
 };
 export const DatePicker = (_a) => {
     var _b;
-    var { reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, ref, className, style, htmlAttributes } = _a, restProps = __rest(_a, ["reactDatePickerProps", "textInputProps", "timePickerProps", "timeZonePickerProps", "isDisabled", "ref", "className", "style", "htmlAttributes"]);
+    var { reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, isClearable = false, ref, className, style, htmlAttributes } = _a, restProps = __rest(_a, ["reactDatePickerProps", "textInputProps", "timePickerProps", "timeZonePickerProps", "isDisabled", "isClearable", "ref", "className", "style", "htmlAttributes"]);
     const classes = classNames(`ndl-datepicker`, className, {});
     const datetimeRef = useRef(null);
     const [picker, setPicker] = useState('day');
@@ -179,8 +184,8 @@ export const DatePicker = (_a) => {
         (_a = reactDatePickerProps === null || reactDatePickerProps === void 0 ? void 0 : reactDatePickerProps.onChangeRaw) === null || _a === void 0 ? void 0 : _a.call(reactDatePickerProps, event);
     }, [reactDatePickerProps]);
     const datePickerProps = Object.assign(Object.assign({}, reactDatePickerProps), { onCalendarClose: interceptedOnCalendarClose, onChange: interceptedChange, onChangeRaw: interceptedOnChangeRaw, onMonthChange: handleMonthChange });
-    return (_jsx("div", Object.assign({ className: classes, ref: ref, style: style }, restProps, htmlAttributes, { children: _jsx(ReactDatePicker, Object.assign({ ref: datetimeRef, customInput: _jsx(DatePickerTextInputWrapper, { isDisabled: isDisabled, textInputProps: textInputProps }), customTimeInput: _jsxs("span", { className: "ndl-time-picker-wrapper", children: [_jsx(Divider, {}), _jsx(TimePicker, Object.assign({ isFluid: true, value: preSelectedDate
+    return (_jsx("div", Object.assign({ className: classes, ref: ref, style: style }, restProps, htmlAttributes, { children: _jsx(ReactDatePicker, Object.assign({ ref: datetimeRef, customInput: _jsx(DatePickerTextInputWrapper, { isDisabled: isDisabled, isClearable: isClearable, textInputProps: textInputProps }), customTimeInput: _jsxs("span", { className: "ndl-time-picker-wrapper", children: [_jsx(Divider, {}), _jsx(TimePicker, Object.assign({ isFluid: true, value: preSelectedDate
                             ? new NeedleTime(preSelectedDate.getHours(), preSelectedDate.getMinutes())
-                            : undefined, onChange: handleTimeChange }, timePickerProps, { floatingStrategy: "absolute", isPortaled: false })), timeZonePickerProps && (_jsx(TimeZonePicker, Object.assign({ isFluid: true, value: selectedTimeZone, onChange: handleTimeZoneChange, referenceDate: preSelectedDate || undefined }, timeZonePickerProps, { floatingStrategy: "absolute", isPortaled: false })))] }), disabled: isDisabled, showPopperArrow: false, showMonthYearPicker: picker === 'month', showYearPicker: picker === 'year', shouldCloseOnSelect: picker === 'day' && !((_b = reactDatePickerProps.showTimeInput) !== null && _b !== void 0 ? _b : false), dayClassName: () => 'ndl-datepicker-day', renderCustomHeader: CustomHeader }, datePickerProps, { popperClassName: classNames('ndl-datepicker-popper', reactDatePickerProps.popperClassName), popperProps: Object.assign({ strategy: isInsideDialog ? 'fixed' : 'absolute' }, reactDatePickerProps.popperProps) })) })));
+                            : undefined, onChange: handleTimeChange }, timePickerProps, { floatingStrategy: "absolute", isPortaled: false })), timeZonePickerProps && (_jsx(TimeZonePicker, Object.assign({ isFluid: true, value: selectedTimeZone, onChange: handleTimeZoneChange, referenceDate: preSelectedDate || undefined }, timeZonePickerProps, { floatingStrategy: "absolute", isPortaled: false })))] }), disabled: isDisabled, showPopperArrow: false, showMonthYearPicker: picker === 'month', showYearPicker: picker === 'year', shouldCloseOnSelect: picker === 'day' && !((_b = reactDatePickerProps.showTimeInput) !== null && _b !== void 0 ? _b : false), dayClassName: () => 'ndl-datepicker-day', renderCustomHeader: CustomHeader }, datePickerProps, { isClearable: isClearable, popperClassName: classNames('ndl-datepicker-popper', reactDatePickerProps.popperClassName), popperProps: Object.assign({ strategy: isInsideDialog ? 'fixed' : 'absolute' }, reactDatePickerProps.popperProps) })) })));
 };
 //# sourceMappingURL=DatePicker.js.map

package/lib/esm/date-picker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["// TODO: try to fix as some point\n/* eslint-disable @typescript-eslint/naming-convention */\n\n/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport { format } from 'date-fns';\nimport { useCallback, useRef, useState } from 'react';\nimport ReactDatePicker, {\n  type ReactDatePickerCustomHeaderProps,\n} from 'react-datepicker';\n\nimport type { CommonProps, HtmlAttributes } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { Divider } from '../divider';\nimport {\n  ArrowLeftIconOutline,\n  ArrowRightIconOutline,\n  CalendarDaysIconOutline,\n  ChevronDownIconOutline,\n} from '../icons';\nimport { TextInput } from '../text-input';\nimport { NeedleTime, TimePicker, type TimePickerProps } from '../time-picker';\nimport { TimeZonePicker } from '../timezone-picker';\nimport { Typography } from '../typography';\nimport { daysInMonth, getYearsPeriodString } from './utils';\n\ntype DatePickerTextInputWrapperProps = React.ComponentProps<'input'> & {\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  isDisabled?: boolean;\n  value?: string;\n  ariaLabel?: string;\n};\n\n// This wrapper is needed due to react-datepicker injecting html attributes\n// into the custom input component on root level, since we use htmlAttributes\n// we need to help spread them there instead of the root level\nconst DatePickerTextInputWrapper = ({\n  textInputProps,\n  isDisabled,\n  value,\n  placeholder,\n  ...restProps\n}: DatePickerTextInputWrapperProps) => {\n  // deconstruct textInputProps to avoid bugs with react-datepicker injecting props\n  const {\n    placeholder: textInputPlaceholder,\n    htmlAttributes: textInputHtmlAttributes,\n    ref,\n    ...restTextInputProps\n  } = textInputProps ?? {};\n\n  return (\n    <TextInput\n      ref={ref}\n      trailingElement={<CalendarDaysIconOutline />}\n      value={value}\n      placeholder={placeholder ?? textInputPlaceholder}\n      isDisabled={isDisabled}\n      // react-datepicker injects html attributes into the custom input\n      htmlAttributes={{\n        ...textInputHtmlAttributes,\n        ...restProps,\n      }}\n      {...restTextInputProps}\n    />\n  );\n};\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype PickerType = 'day' | 'month' | 'year';\n\n// Define a more flexible type for onChange\ntype DatePickerChangeHandler = (\n  date: Date | null | [Date | null, Date | null] | Date[],\n  event?: React.SyntheticEvent | undefined,\n) => void;\n\ninterface DatePickerProps {\n  /** Props for the embedded `TextInput` component. */\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  /** Whether the date picker is disabled. */\n  isDisabled?: boolean;\n  /** Props for the embedded `TimePicker` component. */\n  timePickerProps?: TimePickerProps;\n  /** Props for the embedded `TimeZonePicker` component. */\n  timeZonePickerProps?: React.ComponentProps<typeof TimeZonePicker>;\n  /** Props forwarded to underlying `react-datepicker` component. */\n  reactDatePickerProps: React.ComponentProps<typeof ReactDatePicker>;\n  /**\n   * WARNING: these attributes do not apply to the underlying input element currently. This will be fixed in a future version.\n   */\n  htmlAttributes?: HtmlAttributes<'div'>;\n}\n\nexport const DatePicker = ({\n  reactDatePickerProps,\n  textInputProps,\n  timePickerProps,\n  timeZonePickerProps,\n  isDisabled,\n  ref,\n  className,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', DatePickerProps>) => {\n  const classes = classNames(`ndl-datepicker`, className, {});\n  const datetimeRef = useRef<ReactDatePicker>(null);\n  const [picker, setPicker] = useState<PickerType>('day');\n  const [preSelectedDate, setPreSelectedDate] = useState<Date | null>(\n    (reactDatePickerProps.selected as Date | null) ||\n      (reactDatePickerProps.startDate as Date | null),\n  );\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string | undefined>(\n    timeZonePickerProps?.value,\n  );\n\n  const isInsideDialog = useIsInsideDialog();\n\n  const headerAction = useCallback(\n    (action: PickerType) => {\n      setPicker(picker === action ? 'day' : action);\n    },\n    [picker],\n  );\n\n  const CustomHeader = useCallback(\n    (props: ReactDatePickerCustomHeaderProps) => {\n      const {\n        decreaseMonth,\n        increaseMonth,\n        increaseYear,\n        decreaseYear,\n        nextMonthButtonDisabled,\n        nextYearButtonDisabled,\n        prevMonthButtonDisabled,\n        prevYearButtonDisabled,\n      } = props;\n\n      const prevCallback = picker === 'year' ? decreaseYear : decreaseMonth;\n      const nextCallback = picker === 'year' ? increaseYear : increaseMonth;\n      const prevDisabled =\n        picker === 'year' ? prevYearButtonDisabled : prevMonthButtonDisabled;\n      const nextDisabled =\n        picker === 'year' ? nextYearButtonDisabled : nextMonthButtonDisabled;\n\n      return (\n        <div className=\"ndl-datepicker-header\">\n          <div className=\"ndl-datepicker-selects\">\n            {picker !== 'year' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'month' ? 'Close' : 'Open'} month picker`}\n                aria-pressed={picker === 'month'}\n                onClick={() => headerAction('month')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {format(props.date, 'MMM')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'month',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n            {picker !== 'month' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'year' ? 'Close' : 'Open'} year picker`}\n                onClick={() => headerAction('year')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {picker === 'year'\n                      ? getYearsPeriodString(\n                          props.date,\n                          reactDatePickerProps?.yearItemNumber,\n                        )\n                      : format(props.date, 'yyyy')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'year',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n          </div>\n          {picker !== 'month' && (\n            <div className=\"n-flex n-justify-center n-gap-token-16\">\n              <CleanIconButton\n                description={\n                  picker === 'year' ? 'Previous period' : 'Previous month'\n                }\n                onClick={prevCallback}\n                isDisabled={prevDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowLeftIconOutline />\n              </CleanIconButton>\n              <CleanIconButton\n                description={picker === 'year' ? 'Next period' : 'Next month'}\n                onClick={nextCallback}\n                isDisabled={nextDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowRightIconOutline />\n              </CleanIconButton>\n            </div>\n          )}\n        </div>\n      );\n    },\n    [picker, headerAction, reactDatePickerProps?.yearItemNumber],\n  );\n\n  const handleTimeChange = (newTime: NeedleTime) => {\n    if (\n      reactDatePickerProps.selectsRange ||\n      reactDatePickerProps.selectsMultiple\n    ) {\n      // this is consistent with the behavior of react-datepicker\n      return;\n    }\n\n    if (!preSelectedDate) {\n      return;\n    }\n\n    const newDate = new Date(preSelectedDate);\n    newDate.setHours(newTime.hour, newTime.minute, 0, 0);\n    setPreSelectedDate(newDate);\n\n    if (reactDatePickerProps.onChange) {\n      // For single date selection\n      reactDatePickerProps.onChange(newDate, undefined);\n    }\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setSelectedTimeZone(timezone);\n    if (timeZonePickerProps?.onChange) {\n      timeZonePickerProps.onChange(timezone);\n    }\n  };\n\n  /**\n   * Intercept onChange so we can work with\n   * Month and Year pickers\n   */\n  const interceptedChange: DatePickerChangeHandler = useCallback(\n    (\n      date: Date | null | [Date | null, Date | null] | Date[],\n      event?: React.SyntheticEvent,\n    ) => {\n      if (picker !== 'day') {\n        // setTimeout to prevent picker change before the handleMonthChange logic\n        setTimeout(() => {\n          setPicker('day');\n        });\n      } else if (picker === 'day') {\n        if (date instanceof Date) {\n          setPreSelectedDate(date);\n        } else if (\n          Array.isArray(date) &&\n          date.length > 0 &&\n          date[0] instanceof Date\n        ) {\n          setPreSelectedDate(date[0]);\n        } else if (date === null) {\n          setPreSelectedDate(null);\n        }\n\n        if (reactDatePickerProps.onChange && date !== null) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            date,\n            event,\n          );\n        }\n      }\n    },\n    [picker, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onCalendarClose so we can\n   * switch to \"day\" picker if we close on \"month\" or \"year\"\n   * view\n   */\n  const interceptedOnCalendarClose = useCallback(() => {\n    if (picker !== 'day') {\n      setPicker('day');\n    }\n    reactDatePickerProps?.onCalendarClose?.();\n  }, [picker, reactDatePickerProps]);\n\n  const handleMonthChange = useCallback(\n    (date: Date) => {\n      if (picker === 'month') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const daysInNewMonth = daysInMonth(date.getMonth(), date.getFullYear());\n        date.setDate(Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      } else if (picker === 'year') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const selectedMonth = preSelectedDate?.getMonth() ?? 0;\n        const daysInNewMonth = daysInMonth(selectedMonth, date.getFullYear());\n        date.setMonth(selectedMonth, Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      }\n      setPreSelectedDate(date);\n    },\n    [picker, preSelectedDate, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onChangeRaw to handle clearing the input\n   * When the user clears the text input, set the date to null\n   */\n  const interceptedOnChangeRaw = useCallback(\n    (\n      event?:\n        | React.KeyboardEvent<HTMLElement>\n        | React.MouseEvent<HTMLElement, MouseEvent>,\n    ) => {\n      const target = event?.target as HTMLInputElement | undefined;\n      if (target?.value === '') {\n        setPreSelectedDate(null);\n        if (reactDatePickerProps.onChange) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            null,\n            event,\n          );\n        }\n      }\n      reactDatePickerProps?.onChangeRaw?.(event);\n    },\n    [reactDatePickerProps],\n  );\n\n  const datePickerProps = {\n    ...reactDatePickerProps,\n    onCalendarClose: interceptedOnCalendarClose,\n    onChange: interceptedChange,\n    onChangeRaw: interceptedOnChangeRaw,\n    onMonthChange: handleMonthChange,\n  };\n\n  return (\n    <div\n      className={classes}\n      ref={ref}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/** TODO v5: Remove the div wrapper, type the component as an input, and apply all root props to the TextInput */}\n      <ReactDatePicker\n        ref={datetimeRef}\n        customInput={\n          <DatePickerTextInputWrapper\n            isDisabled={isDisabled}\n            textInputProps={textInputProps}\n          />\n        }\n        customTimeInput={\n          <span className=\"ndl-time-picker-wrapper\">\n            <Divider />\n            <TimePicker\n              isFluid\n              value={\n                preSelectedDate\n                  ? new NeedleTime(\n                      preSelectedDate.getHours(),\n                      preSelectedDate.getMinutes(),\n                    )\n                  : undefined\n              }\n              onChange={handleTimeChange}\n              {...timePickerProps}\n              floatingStrategy=\"absolute\"\n              isPortaled={false}\n            />\n            {timeZonePickerProps && (\n              <TimeZonePicker\n                isFluid\n                value={selectedTimeZone}\n                onChange={handleTimeZoneChange}\n                referenceDate={preSelectedDate || undefined}\n                {...timeZonePickerProps}\n                floatingStrategy=\"absolute\"\n                isPortaled={false}\n              />\n            )}\n          </span>\n        }\n        disabled={isDisabled}\n        showPopperArrow={false}\n        showMonthYearPicker={picker === 'month'}\n        showYearPicker={picker === 'year'}\n        shouldCloseOnSelect={\n          picker === 'day' && !(reactDatePickerProps.showTimeInput ?? false)\n        }\n        dayClassName={() => 'ndl-datepicker-day'}\n        renderCustomHeader={CustomHeader}\n        {...datePickerProps}\n        popperClassName={classNames(\n          'ndl-datepicker-popper',\n          reactDatePickerProps.popperClassName,\n        )}\n        popperProps={{\n          strategy: isInsideDialog ? 'fixed' : 'absolute',\n          ...reactDatePickerProps.popperProps,\n        }}\n      />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["// TODO: try to fix as some point\n/* eslint-disable @typescript-eslint/naming-convention */\n\n/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport { format } from 'date-fns';\nimport { useCallback, useRef, useState } from 'react';\nimport ReactDatePicker, {\n  type ReactDatePickerCustomHeaderProps,\n} from 'react-datepicker';\n\nimport type { CommonProps, HtmlAttributes } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { Divider } from '../divider';\nimport {\n  ArrowLeftIconOutline,\n  ArrowRightIconOutline,\n  CalendarDaysIconOutline,\n  ChevronDownIconOutline,\n} from '../icons';\nimport { TextInput } from '../text-input';\nimport { NeedleTime, TimePicker, type TimePickerProps } from '../time-picker';\nimport { TimeZonePicker } from '../timezone-picker';\nimport { Typography } from '../typography';\nimport { daysInMonth, getYearsPeriodString } from './utils';\n\ntype DatePickerTextInputWrapperProps = React.ComponentProps<'input'> & {\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  isDisabled?: boolean;\n  isClearable?: boolean;\n  value?: string;\n  ariaLabel?: string;\n};\n\n// This wrapper is needed due to react-datepicker injecting html attributes\n// into the custom input component on root level, since we use htmlAttributes\n// we need to help spread them there instead of the root level\nconst DatePickerTextInputWrapper = ({\n  textInputProps,\n  isDisabled,\n  isClearable,\n  value,\n  placeholder,\n  ...restProps\n}: DatePickerTextInputWrapperProps) => {\n  // deconstruct textInputProps to avoid bugs with react-datepicker injecting props\n  const {\n    placeholder: textInputPlaceholder,\n    htmlAttributes: textInputHtmlAttributes,\n    onChange: textInputOnChange,\n    ref,\n    ...restTextInputProps\n  } = textInputProps ?? {};\n  const { onChange: injectedOnChange, ...restInjectedProps } = restProps;\n\n  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    injectedOnChange?.(event);\n    textInputOnChange?.(event);\n  };\n\n  return (\n    <TextInput\n      ref={ref}\n      trailingElement={<CalendarDaysIconOutline />}\n      value={value}\n      placeholder={placeholder ?? textInputPlaceholder}\n      isDisabled={isDisabled}\n      isClearable={isClearable}\n      onChange={handleChange}\n      // react-datepicker injects html attributes into the custom input\n      htmlAttributes={{\n        ...textInputHtmlAttributes,\n        ...restInjectedProps,\n      }}\n      {...restTextInputProps}\n    />\n  );\n};\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype PickerType = 'day' | 'month' | 'year';\n\n// Define a more flexible type for onChange\ntype DatePickerChangeHandler = (\n  date: Date | null | [Date | null, Date | null] | Date[],\n  event?: React.SyntheticEvent | undefined,\n) => void;\n\ninterface DatePickerProps {\n  /** Props for the embedded `TextInput` component. */\n  textInputProps?: React.ComponentProps<typeof TextInput>;\n  /** Whether the date picker is disabled. */\n  isDisabled?: boolean;\n  /**\n   * Whether to show the clear button.\n   * @default false\n   */\n  isClearable?: boolean;\n  /** Props for the embedded `TimePicker` component. */\n  timePickerProps?: TimePickerProps;\n  /** Props for the embedded `TimeZonePicker` component. */\n  timeZonePickerProps?: React.ComponentProps<typeof TimeZonePicker>;\n  /** Props forwarded to underlying `react-datepicker` component. */\n  reactDatePickerProps: React.ComponentProps<typeof ReactDatePicker>;\n  /**\n   * WARNING: these attributes do not apply to the underlying input element currently. This will be fixed in a future version.\n   */\n  htmlAttributes?: HtmlAttributes<'div'>;\n}\n\nexport const DatePicker = ({\n  reactDatePickerProps,\n  textInputProps,\n  timePickerProps,\n  timeZonePickerProps,\n  isDisabled,\n  isClearable = false,\n  ref,\n  className,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', DatePickerProps>) => {\n  const classes = classNames(`ndl-datepicker`, className, {});\n  const datetimeRef = useRef<ReactDatePicker>(null);\n  const [picker, setPicker] = useState<PickerType>('day');\n  const [preSelectedDate, setPreSelectedDate] = useState<Date | null>(\n    (reactDatePickerProps.selected as Date | null) ||\n      (reactDatePickerProps.startDate as Date | null),\n  );\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string | undefined>(\n    timeZonePickerProps?.value,\n  );\n\n  const isInsideDialog = useIsInsideDialog();\n\n  const headerAction = useCallback(\n    (action: PickerType) => {\n      setPicker(picker === action ? 'day' : action);\n    },\n    [picker],\n  );\n\n  const CustomHeader = useCallback(\n    (props: ReactDatePickerCustomHeaderProps) => {\n      const {\n        decreaseMonth,\n        increaseMonth,\n        increaseYear,\n        decreaseYear,\n        nextMonthButtonDisabled,\n        nextYearButtonDisabled,\n        prevMonthButtonDisabled,\n        prevYearButtonDisabled,\n      } = props;\n\n      const prevCallback = picker === 'year' ? decreaseYear : decreaseMonth;\n      const nextCallback = picker === 'year' ? increaseYear : increaseMonth;\n      const prevDisabled =\n        picker === 'year' ? prevYearButtonDisabled : prevMonthButtonDisabled;\n      const nextDisabled =\n        picker === 'year' ? nextYearButtonDisabled : nextMonthButtonDisabled;\n\n      return (\n        <div className=\"ndl-datepicker-header\">\n          <div className=\"ndl-datepicker-selects\">\n            {picker !== 'year' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'month' ? 'Close' : 'Open'} month picker`}\n                aria-pressed={picker === 'month'}\n                onClick={() => headerAction('month')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {format(props.date, 'MMM')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'month',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n            {picker !== 'month' && (\n              <button\n                type=\"button\"\n                aria-label={`${picker === 'year' ? 'Close' : 'Open'} year picker`}\n                onClick={() => headerAction('year')}\n              >\n                <div className=\"n-flex n-items-center n-gap-token-4\">\n                  <Typography variant=\"subheading-small\">\n                    {picker === 'year'\n                      ? getYearsPeriodString(\n                          props.date,\n                          reactDatePickerProps?.yearItemNumber,\n                        )\n                      : format(props.date, 'yyyy')}\n                  </Typography>\n                  <ChevronDownIconOutline\n                    className={classNames('ndl-datepicker-chevron', {\n                      'n-rotate-180': picker === 'year',\n                    })}\n                    aria-label=\"Chevron icon\"\n                  />\n                </div>\n              </button>\n            )}\n          </div>\n          {picker !== 'month' && (\n            <div className=\"n-flex n-justify-center n-gap-token-16\">\n              <CleanIconButton\n                description={\n                  picker === 'year' ? 'Previous period' : 'Previous month'\n                }\n                onClick={prevCallback}\n                isDisabled={prevDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowLeftIconOutline />\n              </CleanIconButton>\n              <CleanIconButton\n                description={picker === 'year' ? 'Next period' : 'Next month'}\n                onClick={nextCallback}\n                isDisabled={nextDisabled}\n                className=\"n-text-neutral-text-weak\"\n                size=\"small\"\n              >\n                <ArrowRightIconOutline />\n              </CleanIconButton>\n            </div>\n          )}\n        </div>\n      );\n    },\n    [picker, headerAction, reactDatePickerProps?.yearItemNumber],\n  );\n\n  const handleTimeChange = (newTime: NeedleTime) => {\n    if (\n      reactDatePickerProps.selectsRange ||\n      reactDatePickerProps.selectsMultiple\n    ) {\n      // this is consistent with the behavior of react-datepicker\n      return;\n    }\n\n    if (!preSelectedDate) {\n      return;\n    }\n\n    const newDate = new Date(preSelectedDate);\n    newDate.setHours(newTime.hour, newTime.minute, 0, 0);\n    setPreSelectedDate(newDate);\n\n    if (reactDatePickerProps.onChange) {\n      // For single date selection\n      reactDatePickerProps.onChange(newDate, undefined);\n    }\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setSelectedTimeZone(timezone);\n    if (timeZonePickerProps?.onChange) {\n      timeZonePickerProps.onChange(timezone);\n    }\n  };\n\n  /**\n   * Intercept onChange so we can work with\n   * Month and Year pickers\n   */\n  const interceptedChange: DatePickerChangeHandler = useCallback(\n    (\n      date: Date | null | [Date | null, Date | null] | Date[],\n      event?: React.SyntheticEvent,\n    ) => {\n      if (picker !== 'day') {\n        // setTimeout to prevent picker change before the handleMonthChange logic\n        setTimeout(() => {\n          setPicker('day');\n        });\n      } else if (picker === 'day') {\n        if (date instanceof Date) {\n          setPreSelectedDate(date);\n        } else if (\n          Array.isArray(date) &&\n          date.length > 0 &&\n          date[0] instanceof Date\n        ) {\n          setPreSelectedDate(date[0]);\n        } else if (date === null) {\n          setPreSelectedDate(null);\n        }\n\n        if (reactDatePickerProps.onChange && date !== null) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            date,\n            event,\n          );\n        }\n      }\n    },\n    [picker, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onCalendarClose so we can\n   * switch to \"day\" picker if we close on \"month\" or \"year\"\n   * view\n   */\n  const interceptedOnCalendarClose = useCallback(() => {\n    if (picker !== 'day') {\n      setPicker('day');\n    }\n    reactDatePickerProps?.onCalendarClose?.();\n  }, [picker, reactDatePickerProps]);\n\n  const handleMonthChange = useCallback(\n    (date: Date) => {\n      if (picker === 'month') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const daysInNewMonth = daysInMonth(date.getMonth(), date.getFullYear());\n        date.setDate(Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      } else if (picker === 'year') {\n        const selectedDay = preSelectedDate?.getDate() ?? 1;\n        const selectedMonth = preSelectedDate?.getMonth() ?? 0;\n        const daysInNewMonth = daysInMonth(selectedMonth, date.getFullYear());\n        date.setMonth(selectedMonth, Math.min(selectedDay, daysInNewMonth));\n        reactDatePickerProps?.onMonthChange?.(date);\n      }\n      setPreSelectedDate(date);\n    },\n    [picker, preSelectedDate, reactDatePickerProps],\n  );\n\n  /**\n   * Intercept onChangeRaw to handle clearing the input\n   * When the user clears the text input, set the date to null\n   */\n  const interceptedOnChangeRaw = useCallback(\n    (\n      event?:\n        | React.KeyboardEvent<HTMLElement>\n        | React.MouseEvent<HTMLElement, MouseEvent>,\n    ) => {\n      const target = event?.target as HTMLInputElement | undefined;\n      if (target?.value === '') {\n        setPreSelectedDate(null);\n        if (reactDatePickerProps.onChange) {\n          (reactDatePickerProps.onChange as DatePickerChangeHandler)(\n            null,\n            event,\n          );\n        }\n      }\n      reactDatePickerProps?.onChangeRaw?.(event);\n    },\n    [reactDatePickerProps],\n  );\n\n  const datePickerProps = {\n    ...reactDatePickerProps,\n    onCalendarClose: interceptedOnCalendarClose,\n    onChange: interceptedChange,\n    onChangeRaw: interceptedOnChangeRaw,\n    onMonthChange: handleMonthChange,\n  };\n\n  return (\n    <div\n      className={classes}\n      ref={ref}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/** TODO v5: Remove the div wrapper, type the component as an input, and apply all root props to the TextInput */}\n      <ReactDatePicker\n        ref={datetimeRef}\n        customInput={\n          <DatePickerTextInputWrapper\n            isDisabled={isDisabled}\n            isClearable={isClearable}\n            textInputProps={textInputProps}\n          />\n        }\n        customTimeInput={\n          <span className=\"ndl-time-picker-wrapper\">\n            <Divider />\n            <TimePicker\n              isFluid\n              value={\n                preSelectedDate\n                  ? new NeedleTime(\n                      preSelectedDate.getHours(),\n                      preSelectedDate.getMinutes(),\n                    )\n                  : undefined\n              }\n              onChange={handleTimeChange}\n              {...timePickerProps}\n              floatingStrategy=\"absolute\"\n              isPortaled={false}\n            />\n            {timeZonePickerProps && (\n              <TimeZonePicker\n                isFluid\n                value={selectedTimeZone}\n                onChange={handleTimeZoneChange}\n                referenceDate={preSelectedDate || undefined}\n                {...timeZonePickerProps}\n                floatingStrategy=\"absolute\"\n                isPortaled={false}\n              />\n            )}\n          </span>\n        }\n        disabled={isDisabled}\n        showPopperArrow={false}\n        showMonthYearPicker={picker === 'month'}\n        showYearPicker={picker === 'year'}\n        shouldCloseOnSelect={\n          picker === 'day' && !(reactDatePickerProps.showTimeInput ?? false)\n        }\n        dayClassName={() => 'ndl-datepicker-day'}\n        renderCustomHeader={CustomHeader}\n        {...datePickerProps}\n        isClearable={isClearable}\n        popperClassName={classNames(\n          'ndl-datepicker-popper',\n          reactDatePickerProps.popperClassName,\n        )}\n        popperProps={{\n          strategy: isInsideDialog ? 'fixed' : 'absolute',\n          ...reactDatePickerProps.popperProps,\n        }}\n      />\n    </div>\n  );\n};\n"]}

package/lib/esm/date-picker/stories/date-picker-clearable.story.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
+import { DatePicker } from '@neo4j-ndl/react';
+import { useState } from 'react';
+export const Component = () => {
+    const [selectedDate, setSelectedDate] = useState(new Date('2023-05-27'));
+    const handleOnChange = (date) => {
+        setSelectedDate(date);
+    };
+    return (_jsx(DatePicker, { isClearable: true, reactDatePickerProps: {
+            onChange: handleOnChange,
+            popperProps: {
+                strategy: 'fixed',
+            },
+            selected: selectedDate,
+        }, textInputProps: {
+            htmlAttributes: {
+                'aria-label': 'Clearable date picker input',
+            },
+        } }));
+};
+export default Component;
+//# sourceMappingURL=date-picker-clearable.story.js.map

package/lib/esm/date-picker/stories/date-picker-clearable.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-clearable.story.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/date-picker-clearable.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAC9C,IAAI,IAAI,CAAC,YAAY,CAAC,CACvB,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,IAAiB,EAAE,EAAE;QAC3C,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,IACT,WAAW,QACX,oBAAoB,EAAE;YACpB,QAAQ,EAAE,cAAc;YACxB,WAAW,EAAE;gBACX,QAAQ,EAAE,OAAO;aAClB;YACD,QAAQ,EAAE,YAAY;SACvB,EACD,cAAc,EAAE;YACd,cAAc,EAAE;gBACd,YAAY,EAAE,6BAA6B;aAC5C;SACF,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DatePicker } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nexport const Component = () => {\n  const [selectedDate, setSelectedDate] = useState<Date | null>(\n    new Date('2023-05-27'),\n  );\n\n  const handleOnChange = (date: Date | null) => {\n    setSelectedDate(date);\n  };\n\n  return (\n    <DatePicker\n      isClearable\n      reactDatePickerProps={{\n        onChange: handleOnChange,\n        popperProps: {\n          strategy: 'fixed',\n        },\n        selected: selectedDate,\n      }}\n      textInputProps={{\n        htmlAttributes: {\n          'aria-label': 'Clearable date picker input',\n        },\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/date-picker/stories/index.js

@@ -19,6 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 export { default as DatePickerDefault } from './date-picker-default.story';
+export { default as DatePickerClearable } from './date-picker-clearable.story';
 export { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';
 export { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';
 export { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';
@@ -32,6 +33,7 @@ export { default as DatePickerFull } from './date-picker-full.story';
 export { default as DatePickerPortaled } from './date-picker-portaled.story';
 export { default as DatePickerRange } from './date-picker-range.story';
 import { removeLicenseHeader } from '../../_common/export-stories-utils';
+import DatePickerClearableSourceRaw from './date-picker-clearable.story.tsx?raw';
 import DatePickerDefaultSourceRaw from './date-picker-default.story.tsx?raw';
 import DatePickerDisabledSourceRaw from './date-picker-disabled.story.tsx?raw';
 import DatePickerFullSourceRaw from './date-picker-full.story.tsx?raw';
@@ -46,6 +48,7 @@ import DatePickerWithTimePickerSourceRaw from './date-picker-with-time-picker.st
 import DatePickerWithTimeZoneSourceRaw from './date-picker-with-timezone.story.tsx?raw';
 import DatePickerWithTimeZoneBothModeSourceRaw from './date-picker-with-timezone-both-mode.story.tsx?raw';
 export const DatePickerDefaultSource = removeLicenseHeader(DatePickerDefaultSourceRaw);
+export const DatePickerClearableSource = removeLicenseHeader(DatePickerClearableSourceRaw);
 export const DatePickerStartsOnMondaySource = removeLicenseHeader(DatePickerStartsOnMondaySourceRaw);
 export const DatePickerMinMaxDateSource = removeLicenseHeader(DatePickerMinMaxDateSourceRaw);
 export const DatePickerOpensToDateSource = removeLicenseHeader(DatePickerOpensToDateSourceRaw);

package/lib/esm/date-picker/stories/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as DatePickerDefault } from './date-picker-default.story';\nexport { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';\nexport { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';\nexport { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';\nexport { default as DatePickerTextInputProps } from './date-picker-text-input-props.story';\nexport { default as DatePickerWithTimePicker } from './date-picker-with-time-picker.story';\nexport { default as DatePickerWithTimeZone } from './date-picker-with-timezone.story';\nexport { default as DatePickerWithTimeZoneBothMode } from './date-picker-with-timezone-both-mode.story';\nexport { default as DatePickerDisabled } from './date-picker-disabled.story';\nexport { default as DatePickerInDialog } from './date-picker-in-dialog.story';\nexport { default as DatePickerFull } from './date-picker-full.story';\nexport { default as DatePickerPortaled } from './date-picker-portaled.story';\nexport { default as DatePickerRange } from './date-picker-range.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport DatePickerDefaultSourceRaw from './date-picker-default.story.tsx?raw';\nimport DatePickerDisabledSourceRaw from './date-picker-disabled.story.tsx?raw';\nimport DatePickerFullSourceRaw from './date-picker-full.story.tsx?raw';\nimport DatePickerInDialogSourceRaw from './date-picker-in-dialog.story.tsx?raw';\nimport DatePickerMinMaxDateSourceRaw from './date-picker-min-max-date.story.tsx?raw';\nimport DatePickerOpensToDateSourceRaw from './date-picker-opens-to-date.story.tsx?raw';\nimport DatePickerPortaledSourceRaw from './date-picker-portaled.story.tsx?raw';\nimport DatePickerRangeSourceRaw from './date-picker-range.story.tsx?raw';\nimport DatePickerStartsOnMondaySourceRaw from './date-picker-starts-on-monday.story.tsx?raw';\nimport DatePickerTextInputPropsSourceRaw from './date-picker-text-input-props.story.tsx?raw';\nimport DatePickerWithTimePickerSourceRaw from './date-picker-with-time-picker.story.tsx?raw';\nimport DatePickerWithTimeZoneSourceRaw from './date-picker-with-timezone.story.tsx?raw';\nimport DatePickerWithTimeZoneBothModeSourceRaw from './date-picker-with-timezone-both-mode.story.tsx?raw';\n\nexport const DatePickerDefaultSource = removeLicenseHeader(\n  DatePickerDefaultSourceRaw,\n);\nexport const DatePickerStartsOnMondaySource = removeLicenseHeader(\n  DatePickerStartsOnMondaySourceRaw,\n);\nexport const DatePickerMinMaxDateSource = removeLicenseHeader(\n  DatePickerMinMaxDateSourceRaw,\n);\nexport const DatePickerOpensToDateSource = removeLicenseHeader(\n  DatePickerOpensToDateSourceRaw,\n);\nexport const DatePickerTextInputPropsSource = removeLicenseHeader(\n  DatePickerTextInputPropsSourceRaw,\n);\nexport const DatePickerWithTimePickerSource = removeLicenseHeader(\n  DatePickerWithTimePickerSourceRaw,\n);\nexport const DatePickerWithTimeZoneSource = removeLicenseHeader(\n  DatePickerWithTimeZoneSourceRaw,\n);\nexport const DatePickerWithTimeZoneBothModeSource = removeLicenseHeader(\n  DatePickerWithTimeZoneBothModeSourceRaw,\n);\nexport const DatePickerDisabledSource = removeLicenseHeader(\n  DatePickerDisabledSourceRaw,\n);\nexport const DatePickerInDialogSource = removeLicenseHeader(\n  DatePickerInDialogSourceRaw,\n);\nexport const DatePickerFullSource = removeLicenseHeader(\n  DatePickerFullSourceRaw,\n);\nexport const DatePickerPortaledSource = removeLicenseHeader(\n  DatePickerPortaledSourceRaw,\n);\nexport const DatePickerRangeSource = removeLicenseHeader(\n  DatePickerRangeSourceRaw,\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AACtF,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AACxG,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,0BAA0B,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,4BAA4B,MAAM,uCAAuC,CAAC;AACjF,OAAO,0BAA0B,MAAM,qCAAqC,CAAC;AAC7E,OAAO,2BAA2B,MAAM,sCAAsC,CAAC;AAC/E,OAAO,uBAAuB,MAAM,kCAAkC,CAAC;AACvE,OAAO,2BAA2B,MAAM,uCAAuC,CAAC;AAChF,OAAO,6BAA6B,MAAM,0CAA0C,CAAC;AACrF,OAAO,8BAA8B,MAAM,2CAA2C,CAAC;AACvF,OAAO,2BAA2B,MAAM,sCAAsC,CAAC;AAC/E,OAAO,wBAAwB,MAAM,mCAAmC,CAAC;AACzE,OAAO,iCAAiC,MAAM,8CAA8C,CAAC;AAC7F,OAAO,iCAAiC,MAAM,8CAA8C,CAAC;AAC7F,OAAO,iCAAiC,MAAM,8CAA8C,CAAC;AAC7F,OAAO,+BAA+B,MAAM,2CAA2C,CAAC;AACxF,OAAO,uCAAuC,MAAM,qDAAqD,CAAC;AAE1G,MAAM,CAAC,MAAM,uBAAuB,GAAG,mBAAmB,CACxD,0BAA0B,CAC3B,CAAC;AACF,MAAM,CAAC,MAAM,yBAAyB,GAAG,mBAAmB,CAC1D,4BAA4B,CAC7B,CAAC;AACF,MAAM,CAAC,MAAM,8BAA8B,GAAG,mBAAmB,CAC/D,iCAAiC,CAClC,CAAC;AACF,MAAM,CAAC,MAAM,0BAA0B,GAAG,mBAAmB,CAC3D,6BAA6B,CAC9B,CAAC;AACF,MAAM,CAAC,MAAM,2BAA2B,GAAG,mBAAmB,CAC5D,8BAA8B,CAC/B,CAAC;AACF,MAAM,CAAC,MAAM,8BAA8B,GAAG,mBAAmB,CAC/D,iCAAiC,CAClC,CAAC;AACF,MAAM,CAAC,MAAM,8BAA8B,GAAG,mBAAmB,CAC/D,iCAAiC,CAClC,CAAC;AACF,MAAM,CAAC,MAAM,4BAA4B,GAAG,mBAAmB,CAC7D,+BAA+B,CAChC,CAAC;AACF,MAAM,CAAC,MAAM,oCAAoC,GAAG,mBAAmB,CACrE,uCAAuC,CACxC,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,mBAAmB,CACzD,2BAA2B,CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,mBAAmB,CACzD,2BAA2B,CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,oBAAoB,GAAG,mBAAmB,CACrD,uBAAuB,CACxB,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,mBAAmB,CACzD,2BAA2B,CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,qBAAqB,GAAG,mBAAmB,CACtD,wBAAwB,CACzB,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as DatePickerDefault } from './date-picker-default.story';\nexport { default as DatePickerClearable } from './date-picker-clearable.story';\nexport { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';\nexport { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';\nexport { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';\nexport { default as DatePickerTextInputProps } from './date-picker-text-input-props.story';\nexport { default as DatePickerWithTimePicker } from './date-picker-with-time-picker.story';\nexport { default as DatePickerWithTimeZone } from './date-picker-with-timezone.story';\nexport { default as DatePickerWithTimeZoneBothMode } from './date-picker-with-timezone-both-mode.story';\nexport { default as DatePickerDisabled } from './date-picker-disabled.story';\nexport { default as DatePickerInDialog } from './date-picker-in-dialog.story';\nexport { default as DatePickerFull } from './date-picker-full.story';\nexport { default as DatePickerPortaled } from './date-picker-portaled.story';\nexport { default as DatePickerRange } from './date-picker-range.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport DatePickerClearableSourceRaw from './date-picker-clearable.story.tsx?raw';\nimport DatePickerDefaultSourceRaw from './date-picker-default.story.tsx?raw';\nimport DatePickerDisabledSourceRaw from './date-picker-disabled.story.tsx?raw';\nimport DatePickerFullSourceRaw from './date-picker-full.story.tsx?raw';\nimport DatePickerInDialogSourceRaw from './date-picker-in-dialog.story.tsx?raw';\nimport DatePickerMinMaxDateSourceRaw from './date-picker-min-max-date.story.tsx?raw';\nimport DatePickerOpensToDateSourceRaw from './date-picker-opens-to-date.story.tsx?raw';\nimport DatePickerPortaledSourceRaw from './date-picker-portaled.story.tsx?raw';\nimport DatePickerRangeSourceRaw from './date-picker-range.story.tsx?raw';\nimport DatePickerStartsOnMondaySourceRaw from './date-picker-starts-on-monday.story.tsx?raw';\nimport DatePickerTextInputPropsSourceRaw from './date-picker-text-input-props.story.tsx?raw';\nimport DatePickerWithTimePickerSourceRaw from './date-picker-with-time-picker.story.tsx?raw';\nimport DatePickerWithTimeZoneSourceRaw from './date-picker-with-timezone.story.tsx?raw';\nimport DatePickerWithTimeZoneBothModeSourceRaw from './date-picker-with-timezone-both-mode.story.tsx?raw';\n\nexport const DatePickerDefaultSource = removeLicenseHeader(\n  DatePickerDefaultSourceRaw,\n);\nexport const DatePickerClearableSource = removeLicenseHeader(\n  DatePickerClearableSourceRaw,\n);\nexport const DatePickerStartsOnMondaySource = removeLicenseHeader(\n  DatePickerStartsOnMondaySourceRaw,\n);\nexport const DatePickerMinMaxDateSource = removeLicenseHeader(\n  DatePickerMinMaxDateSourceRaw,\n);\nexport const DatePickerOpensToDateSource = removeLicenseHeader(\n  DatePickerOpensToDateSourceRaw,\n);\nexport const DatePickerTextInputPropsSource = removeLicenseHeader(\n  DatePickerTextInputPropsSourceRaw,\n);\nexport const DatePickerWithTimePickerSource = removeLicenseHeader(\n  DatePickerWithTimePickerSourceRaw,\n);\nexport const DatePickerWithTimeZoneSource = removeLicenseHeader(\n  DatePickerWithTimeZoneSourceRaw,\n);\nexport const DatePickerWithTimeZoneBothModeSource = removeLicenseHeader(\n  DatePickerWithTimeZoneBothModeSourceRaw,\n);\nexport const DatePickerDisabledSource = removeLicenseHeader(\n  DatePickerDisabledSourceRaw,\n);\nexport const DatePickerInDialogSource = removeLicenseHeader(\n  DatePickerInDialogSourceRaw,\n);\nexport const DatePickerFullSource = removeLicenseHeader(\n  DatePickerFullSourceRaw,\n);\nexport const DatePickerPortaledSource = removeLicenseHeader(\n  DatePickerPortaledSourceRaw,\n);\nexport const DatePickerRangeSource = removeLicenseHeader(\n  DatePickerRangeSourceRaw,\n);\n"]}

package/lib/types/date-picker/DatePicker.d.ts

@@ -29,6 +29,11 @@ interface DatePickerProps {
     textInputProps?: React.ComponentProps<typeof TextInput>;
     /** Whether the date picker is disabled. */
     isDisabled?: boolean;
+    /**
+     * Whether to show the clear button.
+     * @default false
+     */
+    isClearable?: boolean;
     /** Props for the embedded `TimePicker` component. */
     timePickerProps?: TimePickerProps;
     /** Props for the embedded `TimeZonePicker` component. */
@@ -40,6 +45,6 @@ interface DatePickerProps {
      */
     htmlAttributes?: HtmlAttributes<'div'>;
 }
-export declare const DatePicker: ({ reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, ref, className, style, htmlAttributes, ...restProps }: CommonProps<"div", DatePickerProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const DatePicker: ({ reactDatePickerProps, textInputProps, timePickerProps, timeZonePickerProps, isDisabled, isClearable, ref, className, style, htmlAttributes, ...restProps }: CommonProps<"div", DatePickerProps>) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=DatePicker.d.ts.map

package/lib/types/date-picker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":"AA0BA,OAAO,eAEN,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAUpE,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAA0B,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AA8DpD,UAAU,eAAe;IACvB,oDAAoD;IACpD,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC;IACxD,2CAA2C;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qDAAqD;IACrD,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,CAAC;IAClE,kEAAkE;IAClE,oBAAoB,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,CAAC;IACnE;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,UAAU,GAAI,iJAWxB,WAAW,CAAC,KAAK,EAAE,eAAe,CAAC,4CAgUrC,CAAC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/date-picker/DatePicker.tsx"],"names":[],"mappings":"AA0BA,OAAO,eAEN,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAUpE,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAA0B,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAyEpD,UAAU,eAAe;IACvB,oDAAoD;IACpD,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC;IACxD,2CAA2C;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qDAAqD;IACrD,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,CAAC;IAClE,kEAAkE;IAClE,oBAAoB,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,CAAC;IACnE;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,UAAU,GAAI,8JAYxB,WAAW,CAAC,KAAK,EAAE,eAAe,CAAC,4CAkUrC,CAAC"}

package/lib/types/{_common/component-docs-page.d.ts → date-picker/stories/date-picker-clearable.story.d.ts}

@@ -18,6 +18,7 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-
-export declare function createComponentDocsPage(readme: string, accessibility?: string): () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=component-docs-page.d.ts.map
+import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
+export declare const Component: () => import("react/jsx-runtime").JSX.Element;
+export default Component;
+//# sourceMappingURL=date-picker-clearable.story.d.ts.map

package/lib/types/date-picker/stories/date-picker-clearable.story.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-clearable.story.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/stories/date-picker-clearable.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAKjD,eAAO,MAAM,SAAS,+CA0BrB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/types/date-picker/stories/index.d.ts

@@ -19,6 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 export { default as DatePickerDefault } from './date-picker-default.story';
+export { default as DatePickerClearable } from './date-picker-clearable.story';
 export { default as DatePickerStartsOnMonday } from './date-picker-starts-on-monday.story';
 export { default as DatePickerMinMaxDate } from './date-picker-min-max-date.story';
 export { default as DatePickerOpensToDate } from './date-picker-opens-to-date.story';
@@ -32,6 +33,7 @@ export { default as DatePickerFull } from './date-picker-full.story';
 export { default as DatePickerPortaled } from './date-picker-portaled.story';
 export { default as DatePickerRange } from './date-picker-range.story';
 export declare const DatePickerDefaultSource: string;
+export declare const DatePickerClearableSource: string;
 export declare const DatePickerStartsOnMondaySource: string;
 export declare const DatePickerMinMaxDateSource: string;
 export declare const DatePickerOpensToDateSource: string;

package/lib/types/date-picker/stories/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AACtF,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AACxG,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,0BAA0B,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAiBvE,eAAO,MAAM,uBAAuB,QAEnC,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,0BAA0B,QAEtC,CAAC;AACF,eAAO,MAAM,2BAA2B,QAEvC,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,4BAA4B,QAExC,CAAC;AACF,eAAO,MAAM,oCAAoC,QAEhD,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,oBAAoB,QAEhC,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,qBAAqB,QAEjC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,kCAAkC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AACtF,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,6CAA6C,CAAC;AACxG,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,0BAA0B,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAkBvE,eAAO,MAAM,uBAAuB,QAEnC,CAAC;AACF,eAAO,MAAM,yBAAyB,QAErC,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,0BAA0B,QAEtC,CAAC;AACF,eAAO,MAAM,2BAA2B,QAEvC,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,8BAA8B,QAE1C,CAAC;AACF,eAAO,MAAM,4BAA4B,QAExC,CAAC;AACF,eAAO,MAAM,oCAAoC,QAEhD,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,oBAAoB,QAEhC,CAAC;AACF,eAAO,MAAM,wBAAwB,QAEpC,CAAC;AACF,eAAO,MAAM,qBAAqB,QAEjC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neo4j-ndl/react",
-  "version": "4.14.4",
+  "version": "4.14.5",
   "sideEffects": false,
   "description": "React implementation of Neo4j Design System",
   "keywords": [
@@ -55,6 +55,7 @@
     "@playwright/test": "1.60.0",
     "@storybook/addon-docs": "10.2.19",
     "@storybook/react-vite": "10.2.19",
+    "storybook": "10.2.19",
     "@svgr/cli": "6.5.1",
     "@tanstack/react-virtual": "3.13.23",
     "@testing-library/jest-dom": "6.9.1",

package/lib/cjs/_common/component-docs-page.js

@@ -1,72 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createComponentDocsPage = createComponentDocsPage;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- *
- *  Copyright (c) "Neo4j"
- *  Neo4j Sweden AB [http://neo4j.com]
- *
- *  This file is part of Neo4j.
- *
- *  Neo4j is free software: you can redistribute it and/or modify
- *  it under the terms of the GNU General Public License as published by
- *  the Free Software Foundation, either version 3 of the License, or
- *  (at your option) any later version.
- *
- *  This program is distributed in the hope that it will be useful,
- *  but WITHOUT ANY WARRANTY; without even the implied warranty of
- *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *  GNU General Public License for more details.
- *
- *  You should have received a copy of the GNU General Public License
- *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
- */
-const blocks_1 = require("@storybook/addon-docs/blocks");
-const react_1 = require("react");
-const text_link_1 = require("../text-link");
-const typography_1 = require("../typography");
-/**
- * Creates a Storybook docs page that combines a component's README (props)
- * and optional ACCESSIBILITY.md into a single page with a navigation index.
- *
- * Requires the `autodocs` tag on the component meta to create a Docs entry in the sidebar
- * (the global preview config disables autodocs with `!autodocs`).
- *
- * Usage in a *.stories.tsx file:
- * ```ts
- * import ReadmeContent from '../README.md?raw';
- * import AccessibilityContent from '../ACCESSIBILITY.md?raw';
- * import { createComponentDocsPage } from '../../_common/component-docs-page';
- *
- * const meta: Meta = {
- *   // ...
- *   tags: ['docsPage', 'autodocs'],
- *   parameters: {
- *     docs: {
- *       page: createComponentDocsPage(ReadmeContent, AccessibilityContent),
- *     },
- *   },
- * };
- * ```
- */
-function stripMarkdownComments(content) {
-    return content.replace(/^\[\/\/\]: #.*\n*/gm, '');
-}
-function createComponentDocsPage(readme, accessibility) {
-    const cleaned = stripMarkdownComments(readme);
-    const cleanedA11y = accessibility
-        ? stripMarkdownComments(accessibility).replace(/^## /gm, '### ')
-        : null;
-    return function ComponentDocsPage() {
-        const scrollTo = (0, react_1.useCallback)((e, id) => {
-            var _a;
-            e.preventDefault();
-            (_a = document.getElementById(id)) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth' });
-        }, []);
-        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [cleanedA11y && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, { as: "h1", variant: "title-1", children: "Docs" }), (0, jsx_runtime_1.jsxs)("nav", { className: "n-flex n-flex-col n-gap-token-2 n-mb-2", children: [(0, jsx_runtime_1.jsx)(text_link_1.TextLink, { href: "#props", htmlAttributes: { onClick: (e) => scrollTo(e, 'props') }, children: "Props" }), (0, jsx_runtime_1.jsx)(text_link_1.TextLink, { href: "#accessibility", htmlAttributes: {
-                                        onClick: (e) => scrollTo(e, 'accessibility'),
-                                    }, children: "Accessibility" })] })] })), (0, jsx_runtime_1.jsx)(blocks_1.Markdown, { children: cleaned }), cleanedA11y && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(blocks_1.Markdown, { children: `## Accessibility\n\n${cleanedA11y}` }) }))] }));
-    };
-}
-//# sourceMappingURL=component-docs-page.js.map

package/lib/cjs/_common/component-docs-page.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-docs-page.js","sourceRoot":"","sources":["../../../src/_common/component-docs-page.tsx"],"names":[],"mappings":";;AAuDA,0DAoDC;;AA3GD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,yDAAwD;AACxD,iCAAqD;AAErD,4CAAwC;AACxC,8CAA2C;AAE3C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,SAAS,qBAAqB,CAAC,OAAe;IAC5C,OAAO,OAAO,CAAC,OAAO,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;AACpD,CAAC;AAED,SAAgB,uBAAuB,CACrC,MAAc,EACd,aAAsB;IAEtB,MAAM,OAAO,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;IAC9C,MAAM,WAAW,GAAG,aAAa;QAC/B,CAAC,CAAC,qBAAqB,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC;QAChE,CAAC,CAAC,IAAI,CAAC;IAET,OAAO,SAAS,iBAAiB;QAC/B,MAAM,QAAQ,GAAG,IAAA,mBAAW,EAC1B,CAAC,CAAgC,EAAE,EAAU,EAAE,EAAE;;YAC/C,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAA,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,0CAAE,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;QACtE,CAAC,EACD,EAAE,CACH,CAAC;QAEF,OAAO,CACL,6DACG,WAAW,IAAI,CACd,6DACE,uBAAC,uBAAU,IAAC,EAAE,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,qBAExB,EACb,iCAAK,SAAS,EAAC,wCAAwC,aACrD,uBAAC,oBAAQ,IACP,IAAI,EAAC,QAAQ,EACb,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,sBAG/C,EACX,uBAAC,oBAAQ,IACP,IAAI,EAAC,gBAAgB,EACrB,cAAc,EAAE;wCACd,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,eAAe,CAAC;qCAC7C,8BAGQ,IACP,IACL,CACJ,EACD,uBAAC,iBAAQ,cAAE,OAAO,GAAY,EAC7B,WAAW,IAAI,CACd,2DACE,uBAAC,iBAAQ,cAAE,uBAAuB,WAAW,EAAE,GAAY,GAC1D,CACJ,IACA,CACJ,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { Markdown } from '@storybook/addon-docs/blocks';\nimport { type MouseEvent, useCallback } from 'react';\n\nimport { TextLink } from '../text-link';\nimport { Typography } from '../typography';\n\n/**\n * Creates a Storybook docs page that combines a component's README (props)\n * and optional ACCESSIBILITY.md into a single page with a navigation index.\n *\n * Requires the `autodocs` tag on the component meta to create a Docs entry in the sidebar\n * (the global preview config disables autodocs with `!autodocs`).\n *\n * Usage in a *.stories.tsx file:\n * ```ts\n * import ReadmeContent from '../README.md?raw';\n * import AccessibilityContent from '../ACCESSIBILITY.md?raw';\n * import { createComponentDocsPage } from '../../_common/component-docs-page';\n *\n * const meta: Meta = {\n *   // ...\n *   tags: ['docsPage', 'autodocs'],\n *   parameters: {\n *     docs: {\n *       page: createComponentDocsPage(ReadmeContent, AccessibilityContent),\n *     },\n *   },\n * };\n * ```\n */\n\nfunction stripMarkdownComments(content: string): string {\n  return content.replace(/^\\[\\/\\/\\]: #.*\\n*/gm, '');\n}\n\nexport function createComponentDocsPage(\n  readme: string,\n  accessibility?: string,\n) {\n  const cleaned = stripMarkdownComments(readme);\n  const cleanedA11y = accessibility\n    ? stripMarkdownComments(accessibility).replace(/^## /gm, '### ')\n    : null;\n\n  return function ComponentDocsPage() {\n    const scrollTo = useCallback(\n      (e: MouseEvent<HTMLAnchorElement>, id: string) => {\n        e.preventDefault();\n        document.getElementById(id)?.scrollIntoView({ behavior: 'smooth' });\n      },\n      [],\n    );\n\n    return (\n      <>\n        {cleanedA11y && (\n          <>\n            <Typography as=\"h1\" variant=\"title-1\">\n              Docs\n            </Typography>\n            <nav className=\"n-flex n-flex-col n-gap-token-2 n-mb-2\">\n              <TextLink\n                href=\"#props\"\n                htmlAttributes={{ onClick: (e) => scrollTo(e, 'props') }}\n              >\n                Props\n              </TextLink>\n              <TextLink\n                href=\"#accessibility\"\n                htmlAttributes={{\n                  onClick: (e) => scrollTo(e, 'accessibility'),\n                }}\n              >\n                Accessibility\n              </TextLink>\n            </nav>\n          </>\n        )}\n        <Markdown>{cleaned}</Markdown>\n        {cleanedA11y && (\n          <>\n            <Markdown>{`## Accessibility\\n\\n${cleanedA11y}`}</Markdown>\n          </>\n        )}\n      </>\n    );\n  };\n}\n"]}

package/lib/esm/_common/component-docs-page.js

@@ -1,69 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/**
- *
- *  Copyright (c) "Neo4j"
- *  Neo4j Sweden AB [http://neo4j.com]
- *
- *  This file is part of Neo4j.
- *
- *  Neo4j is free software: you can redistribute it and/or modify
- *  it under the terms of the GNU General Public License as published by
- *  the Free Software Foundation, either version 3 of the License, or
- *  (at your option) any later version.
- *
- *  This program is distributed in the hope that it will be useful,
- *  but WITHOUT ANY WARRANTY; without even the implied warranty of
- *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *  GNU General Public License for more details.
- *
- *  You should have received a copy of the GNU General Public License
- *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
- */
-import { Markdown } from '@storybook/addon-docs/blocks';
-import { useCallback } from 'react';
-import { TextLink } from '../text-link';
-import { Typography } from '../typography';
-/**
- * Creates a Storybook docs page that combines a component's README (props)
- * and optional ACCESSIBILITY.md into a single page with a navigation index.
- *
- * Requires the `autodocs` tag on the component meta to create a Docs entry in the sidebar
- * (the global preview config disables autodocs with `!autodocs`).
- *
- * Usage in a *.stories.tsx file:
- * ```ts
- * import ReadmeContent from '../README.md?raw';
- * import AccessibilityContent from '../ACCESSIBILITY.md?raw';
- * import { createComponentDocsPage } from '../../_common/component-docs-page';
- *
- * const meta: Meta = {
- *   // ...
- *   tags: ['docsPage', 'autodocs'],
- *   parameters: {
- *     docs: {
- *       page: createComponentDocsPage(ReadmeContent, AccessibilityContent),
- *     },
- *   },
- * };
- * ```
- */
-function stripMarkdownComments(content) {
-    return content.replace(/^\[\/\/\]: #.*\n*/gm, '');
-}
-export function createComponentDocsPage(readme, accessibility) {
-    const cleaned = stripMarkdownComments(readme);
-    const cleanedA11y = accessibility
-        ? stripMarkdownComments(accessibility).replace(/^## /gm, '### ')
-        : null;
-    return function ComponentDocsPage() {
-        const scrollTo = useCallback((e, id) => {
-            var _a;
-            e.preventDefault();
-            (_a = document.getElementById(id)) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth' });
-        }, []);
-        return (_jsxs(_Fragment, { children: [cleanedA11y && (_jsxs(_Fragment, { children: [_jsx(Typography, { as: "h1", variant: "title-1", children: "Docs" }), _jsxs("nav", { className: "n-flex n-flex-col n-gap-token-2 n-mb-2", children: [_jsx(TextLink, { href: "#props", htmlAttributes: { onClick: (e) => scrollTo(e, 'props') }, children: "Props" }), _jsx(TextLink, { href: "#accessibility", htmlAttributes: {
-                                        onClick: (e) => scrollTo(e, 'accessibility'),
-                                    }, children: "Accessibility" })] })] })), _jsx(Markdown, { children: cleaned }), cleanedA11y && (_jsx(_Fragment, { children: _jsx(Markdown, { children: `## Accessibility\n\n${cleanedA11y}` }) }))] }));
-    };
-}
-//# sourceMappingURL=component-docs-page.js.map

package/lib/esm/_common/component-docs-page.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-docs-page.js","sourceRoot":"","sources":["../../../src/_common/component-docs-page.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,EAAmB,WAAW,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,SAAS,qBAAqB,CAAC,OAAe;IAC5C,OAAO,OAAO,CAAC,OAAO,CAAC,qBAAqB,EAAE,EAAE,CAAC,CAAC;AACpD,CAAC;AAED,MAAM,UAAU,uBAAuB,CACrC,MAAc,EACd,aAAsB;IAEtB,MAAM,OAAO,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;IAC9C,MAAM,WAAW,GAAG,aAAa;QAC/B,CAAC,CAAC,qBAAqB,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC;QAChE,CAAC,CAAC,IAAI,CAAC;IAET,OAAO,SAAS,iBAAiB;QAC/B,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,CAAgC,EAAE,EAAU,EAAE,EAAE;;YAC/C,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAA,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,0CAAE,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;QACtE,CAAC,EACD,EAAE,CACH,CAAC;QAEF,OAAO,CACL,8BACG,WAAW,IAAI,CACd,8BACE,KAAC,UAAU,IAAC,EAAE,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,qBAExB,EACb,eAAK,SAAS,EAAC,wCAAwC,aACrD,KAAC,QAAQ,IACP,IAAI,EAAC,QAAQ,EACb,cAAc,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,sBAG/C,EACX,KAAC,QAAQ,IACP,IAAI,EAAC,gBAAgB,EACrB,cAAc,EAAE;wCACd,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,eAAe,CAAC;qCAC7C,8BAGQ,IACP,IACL,CACJ,EACD,KAAC,QAAQ,cAAE,OAAO,GAAY,EAC7B,WAAW,IAAI,CACd,4BACE,KAAC,QAAQ,cAAE,uBAAuB,WAAW,EAAE,GAAY,GAC1D,CACJ,IACA,CACJ,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { Markdown } from '@storybook/addon-docs/blocks';\nimport { type MouseEvent, useCallback } from 'react';\n\nimport { TextLink } from '../text-link';\nimport { Typography } from '../typography';\n\n/**\n * Creates a Storybook docs page that combines a component's README (props)\n * and optional ACCESSIBILITY.md into a single page with a navigation index.\n *\n * Requires the `autodocs` tag on the component meta to create a Docs entry in the sidebar\n * (the global preview config disables autodocs with `!autodocs`).\n *\n * Usage in a *.stories.tsx file:\n * ```ts\n * import ReadmeContent from '../README.md?raw';\n * import AccessibilityContent from '../ACCESSIBILITY.md?raw';\n * import { createComponentDocsPage } from '../../_common/component-docs-page';\n *\n * const meta: Meta = {\n *   // ...\n *   tags: ['docsPage', 'autodocs'],\n *   parameters: {\n *     docs: {\n *       page: createComponentDocsPage(ReadmeContent, AccessibilityContent),\n *     },\n *   },\n * };\n * ```\n */\n\nfunction stripMarkdownComments(content: string): string {\n  return content.replace(/^\\[\\/\\/\\]: #.*\\n*/gm, '');\n}\n\nexport function createComponentDocsPage(\n  readme: string,\n  accessibility?: string,\n) {\n  const cleaned = stripMarkdownComments(readme);\n  const cleanedA11y = accessibility\n    ? stripMarkdownComments(accessibility).replace(/^## /gm, '### ')\n    : null;\n\n  return function ComponentDocsPage() {\n    const scrollTo = useCallback(\n      (e: MouseEvent<HTMLAnchorElement>, id: string) => {\n        e.preventDefault();\n        document.getElementById(id)?.scrollIntoView({ behavior: 'smooth' });\n      },\n      [],\n    );\n\n    return (\n      <>\n        {cleanedA11y && (\n          <>\n            <Typography as=\"h1\" variant=\"title-1\">\n              Docs\n            </Typography>\n            <nav className=\"n-flex n-flex-col n-gap-token-2 n-mb-2\">\n              <TextLink\n                href=\"#props\"\n                htmlAttributes={{ onClick: (e) => scrollTo(e, 'props') }}\n              >\n                Props\n              </TextLink>\n              <TextLink\n                href=\"#accessibility\"\n                htmlAttributes={{\n                  onClick: (e) => scrollTo(e, 'accessibility'),\n                }}\n              >\n                Accessibility\n              </TextLink>\n            </nav>\n          </>\n        )}\n        <Markdown>{cleaned}</Markdown>\n        {cleanedA11y && (\n          <>\n            <Markdown>{`## Accessibility\\n\\n${cleanedA11y}`}</Markdown>\n          </>\n        )}\n      </>\n    );\n  };\n}\n"]}

package/lib/types/_common/component-docs-page.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-docs-page.d.ts","sourceRoot":"","sources":["../../../src/_common/component-docs-page.tsx"],"names":[],"mappings":"AAuDA,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,MAAM,EACd,aAAa,CAAC,EAAE,MAAM,iDAkDvB"}