@tiny-design/react 1.0.4

package/es/date-picker/date-picker.js

@@ -0,0 +1,228 @@
+import { ConfigContext } from "../config-provider/config-context.js";
+import { getPrefixCls } from "../_utils/general.js";
+import { CalendarIcon, ClearIcon } from "../_utils/components.js";
+import popup_default from "../popup/index.js";
+import { useLocale } from "../_utils/use-locale.js";
+import PickerHeader from "./picker-header.js";
+import PickerDay from "./picker-day.js";
+import PickerMonth from "./picker-month.js";
+import PickerYear from "./picker-year.js";
+import { useCallback, useContext, useEffect, useRef, useState } from "react";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/date-picker/date-picker.tsx
+function formatDate(date, format) {
+	const y = date.getFullYear();
+	const m = String(date.getMonth() + 1).padStart(2, "0");
+	const d = String(date.getDate()).padStart(2, "0");
+	return format.replace("YYYY", String(y)).replace("MM", m).replace("DD", d);
+}
+function getFormatByPicker(picker, customFormat) {
+	if (customFormat) return customFormat;
+	switch (picker) {
+		case "month": return "YYYY-MM";
+		case "year": return "YYYY";
+		default: return "YYYY-MM-DD";
+	}
+}
+const DatePicker = (props) => {
+	const { defaultValue, value, open: controlledOpen, picker = "date", format: customFormat, disabled = false, placeholder, allowClear = true, size = "md", showToday = true, inputReadOnly = true, disabledDate, renderExtraFooter, suffixIcon, onChange, onOpenChange, onPanelChange, className, style, prefixCls: customisedCls } = props;
+	const locale = useLocale();
+	const prefixCls = getPrefixCls("date-picker", useContext(ConfigContext).prefixCls, customisedCls);
+	const format = getFormatByPicker(picker, customFormat);
+	const [date, setDate] = useState(value ?? defaultValue ?? null);
+	const [panelDate, setPanelDate] = useState(value ?? defaultValue ?? /* @__PURE__ */ new Date());
+	const [open, setOpen] = useState(false);
+	const [mode, setMode] = useState(picker === "date" ? "date" : picker);
+	const wrapperRef = useRef(null);
+	const dropdownRef = useRef(null);
+	const isOpen = controlledOpen ?? open;
+	useEffect(() => {
+		if (value !== void 0) {
+			setDate(value);
+			if (value) setPanelDate(value);
+		}
+	}, [value]);
+	useEffect(() => {
+		if (controlledOpen !== void 0) setOpen(controlledOpen);
+	}, [controlledOpen]);
+	useEffect(() => {
+		const listener = (event) => {
+			const target = event.target;
+			if (wrapperRef.current?.contains(target) || dropdownRef.current?.contains(target)) return;
+			if (controlledOpen === void 0) setOpen(false);
+			onOpenChange?.(false);
+		};
+		document.addEventListener("click", listener);
+		return () => document.removeEventListener("click", listener);
+	}, [controlledOpen, onOpenChange]);
+	const toggleOpen = useCallback((val) => {
+		if (controlledOpen === void 0) setOpen(val);
+		onOpenChange?.(val);
+		if (val) setMode(picker === "date" ? "date" : picker);
+	}, [
+		controlledOpen,
+		onOpenChange,
+		picker
+	]);
+	const fireChange = useCallback((d) => {
+		if (value === void 0) setDate(d);
+		onChange?.(d, d ? formatDate(d, format) : "");
+	}, [
+		value,
+		onChange,
+		format
+	]);
+	const handleDateSelect = useCallback((d) => {
+		fireChange(d);
+		toggleOpen(false);
+	}, [fireChange, toggleOpen]);
+	const handleMonthSelect = useCallback((d) => {
+		if (picker === "month") {
+			fireChange(d);
+			toggleOpen(false);
+		} else {
+			setPanelDate(d);
+			setMode("date");
+			onPanelChange?.(d, "date");
+		}
+	}, [
+		picker,
+		fireChange,
+		toggleOpen,
+		onPanelChange
+	]);
+	const handleYearSelect = useCallback((d) => {
+		if (picker === "year") {
+			fireChange(d);
+			toggleOpen(false);
+		} else {
+			setPanelDate(d);
+			setMode(picker === "month" ? "month" : "month");
+			onPanelChange?.(d, "month");
+		}
+	}, [
+		picker,
+		fireChange,
+		toggleOpen,
+		onPanelChange
+	]);
+	const handleModeChange = useCallback((m) => {
+		setMode(m);
+		onPanelChange?.(panelDate, m);
+	}, [panelDate, onPanelChange]);
+	const handleClear = (e) => {
+		e.stopPropagation();
+		fireChange(null);
+		toggleOpen(false);
+	};
+	const handleToday = () => {
+		const today = /* @__PURE__ */ new Date();
+		today.setHours(0, 0, 0, 0);
+		fireChange(today);
+		setPanelDate(today);
+		toggleOpen(false);
+	};
+	const hasValue = date !== null;
+	const displayValue = hasValue ? formatDate(date, format) : "";
+	const defaultPlaceholder = placeholder ?? (picker === "month" ? locale.DatePicker.selectMonth : picker === "year" ? locale.DatePicker.selectYear : locale.DatePicker.selectDate);
+	const cls = classNames(prefixCls, className, `${prefixCls}_${size}`, {
+		[`${prefixCls}_disabled`]: disabled,
+		[`${prefixCls}_open`]: isOpen,
+		[`${prefixCls}_has-value`]: hasValue
+	});
+	const renderPanel = () => {
+		switch (mode) {
+			case "year": return /* @__PURE__ */ jsx(PickerYear, {
+				date,
+				panelDate,
+				onChange: handleYearSelect,
+				prefixCls
+			});
+			case "month": return /* @__PURE__ */ jsx(PickerMonth, {
+				date,
+				panelDate,
+				months: locale.DatePicker.months,
+				onChange: handleMonthSelect,
+				prefixCls
+			});
+			default: return /* @__PURE__ */ jsx(PickerDay, {
+				date,
+				panelDate,
+				weeks: locale.DatePicker.weeks,
+				disabledDate,
+				onChange: handleDateSelect,
+				panelOnChange: setPanelDate,
+				prefixCls
+			});
+		}
+	};
+	const renderOverlay = () => /* @__PURE__ */ jsxs("div", {
+		className: `${prefixCls}__dropdown`,
+		ref: dropdownRef,
+		children: [
+			/* @__PURE__ */ jsx(PickerHeader, {
+				date: panelDate,
+				mode,
+				months: locale.DatePicker.months,
+				onChange: setPanelDate,
+				onModeChange: handleModeChange,
+				prefixCls
+			}),
+			renderPanel(),
+			showToday && mode === "date" && picker === "date" || renderExtraFooter ? /* @__PURE__ */ jsxs("div", {
+				className: `${prefixCls}__footer`,
+				children: [renderExtraFooter?.(mode), showToday && mode === "date" && picker === "date" && /* @__PURE__ */ jsx("a", {
+					className: `${prefixCls}__today-btn`,
+					onClick: handleToday,
+					children: locale.DatePicker.today
+				})]
+			}) : null
+		]
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: cls,
+		style,
+		ref: wrapperRef,
+		children: /* @__PURE__ */ jsx(popup_default, {
+			trigger: "manual",
+			placement: "bottom-start",
+			arrow: false,
+			visible: isOpen,
+			content: renderOverlay(),
+			children: /* @__PURE__ */ jsxs("div", {
+				className: `${prefixCls}__input`,
+				onClick: () => !disabled && toggleOpen(!isOpen),
+				children: [/* @__PURE__ */ jsx("input", {
+					className: `${prefixCls}__input-field`,
+					readOnly: inputReadOnly,
+					disabled,
+					placeholder: defaultPlaceholder,
+					value: displayValue,
+					"aria-expanded": isOpen,
+					"aria-haspopup": "dialog",
+					onKeyDown: (e) => {
+						if (e.key === "Escape" && isOpen) toggleOpen(false);
+					}
+				}), /* @__PURE__ */ jsxs("span", {
+					className: `${prefixCls}__suffix`,
+					children: [allowClear && hasValue && !disabled ? /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: `${prefixCls}__clear`,
+						onClick: handleClear,
+						"aria-label": "Clear date",
+						children: /* @__PURE__ */ jsx(ClearIcon, { size: "1em" })
+					}) : null, /* @__PURE__ */ jsx("span", {
+						className: `${prefixCls}__icon`,
+						children: suffixIcon ?? /* @__PURE__ */ jsx(CalendarIcon, { size: "1em" })
+					})]
+				})]
+			})
+		})
+	});
+};
+DatePicker.displayName = "DatePicker";
+//#endregion
+export { DatePicker as default };
+
+//# sourceMappingURL=date-picker.js.map

package/es/date-picker/date-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.js","names":["Popup"],"sources":["../../src/date-picker/date-picker.tsx"],"sourcesContent":["import { useState, useRef, useCallback, useEffect, useContext } from 'react';\nimport classNames from 'classnames';\nimport { ConfigContext } from '../config-provider/config-context';\nimport { getPrefixCls } from '../_utils/general';\nimport { useLocale } from '../_utils/use-locale';\nimport { CalendarIcon, ClearIcon } from '../_utils/components';\nimport Popup from '../popup';\nimport PickerHeader from './picker-header';\nimport PickerDay from './picker-day';\nimport PickerMonth from './picker-month';\nimport PickerYear from './picker-year';\nimport { DatePickerProps, PanelMode } from './types';\n\n\nfunction formatDate(date: Date, format: string): string {\n  const y = date.getFullYear();\n  const m = String(date.getMonth() + 1).padStart(2, '0');\n  const d = String(date.getDate()).padStart(2, '0');\n  return format\n    .replace('YYYY', String(y))\n    .replace('MM', m)\n    .replace('DD', d);\n}\n\nfunction getFormatByPicker(picker: string, customFormat?: string): string {\n  if (customFormat) return customFormat;\n  switch (picker) {\n    case 'month': return 'YYYY-MM';\n    case 'year': return 'YYYY';\n    default: return 'YYYY-MM-DD';\n  }\n}\n\nconst DatePicker = (props: DatePickerProps) => {\n  const {\n    defaultValue,\n    value,\n    open: controlledOpen,\n    picker = 'date',\n    format: customFormat,\n    disabled = false,\n    placeholder,\n    allowClear = true,\n    size = 'md',\n    showToday = true,\n    inputReadOnly = true,\n    disabledDate,\n    renderExtraFooter,\n    suffixIcon,\n    onChange,\n    onOpenChange,\n    onPanelChange,\n    className,\n    style,\n    prefixCls: customisedCls,\n  } = props;\n\n  const locale = useLocale();\n  const configContext = useContext(ConfigContext);\n  const prefixCls = getPrefixCls('date-picker', configContext.prefixCls, customisedCls);\n  const format = getFormatByPicker(picker, customFormat);\n\n  const [date, setDate] = useState<Date | null>(value ?? defaultValue ?? null);\n  const [panelDate, setPanelDate] = useState<Date>(value ?? defaultValue ?? new Date());\n  const [open, setOpen] = useState(false);\n  const [mode, setMode] = useState<PanelMode>(picker === 'date' ? 'date' : picker);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const dropdownRef = useRef<HTMLDivElement>(null);\n\n  const isOpen = controlledOpen ?? open;\n\n  // Controlled value\n  useEffect(() => {\n    if (value !== undefined) {\n      setDate(value);\n      if (value) setPanelDate(value);\n    }\n  }, [value]);\n\n  useEffect(() => {\n    if (controlledOpen !== undefined) setOpen(controlledOpen);\n  }, [controlledOpen]);\n\n  useEffect(() => {\n    const listener = (event: MouseEvent) => {\n      const target = event.target as HTMLElement;\n      if (wrapperRef.current?.contains(target) || dropdownRef.current?.contains(target)) return;\n      if (controlledOpen === undefined) setOpen(false);\n      onOpenChange?.(false);\n    };\n    document.addEventListener('click', listener);\n    return () => document.removeEventListener('click', listener);\n  }, [controlledOpen, onOpenChange]);\n\n  const toggleOpen = useCallback((val: boolean) => {\n    if (controlledOpen === undefined) setOpen(val);\n    onOpenChange?.(val);\n    if (val) setMode(picker === 'date' ? 'date' : picker);\n  }, [controlledOpen, onOpenChange, picker]);\n\n  const fireChange = useCallback((d: Date | null) => {\n    if (value === undefined) setDate(d);\n    onChange?.(d, d ? formatDate(d, format) : '');\n  }, [value, onChange, format]);\n\n  const handleDateSelect = useCallback((d: Date) => {\n    fireChange(d);\n    toggleOpen(false);\n  }, [fireChange, toggleOpen]);\n\n  const handleMonthSelect = useCallback((d: Date) => {\n    if (picker === 'month') {\n      fireChange(d);\n      toggleOpen(false);\n    } else {\n      setPanelDate(d);\n      setMode('date');\n      onPanelChange?.(d, 'date');\n    }\n  }, [picker, fireChange, toggleOpen, onPanelChange]);\n\n  const handleYearSelect = useCallback((d: Date) => {\n    if (picker === 'year') {\n      fireChange(d);\n      toggleOpen(false);\n    } else {\n      setPanelDate(d);\n      setMode(picker === 'month' ? 'month' : 'month');\n      onPanelChange?.(d, 'month');\n    }\n  }, [picker, fireChange, toggleOpen, onPanelChange]);\n\n  const handleModeChange = useCallback((m: PanelMode) => {\n    setMode(m);\n    onPanelChange?.(panelDate, m);\n  }, [panelDate, onPanelChange]);\n\n  const handleClear = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    fireChange(null);\n    toggleOpen(false);\n  };\n\n  const handleToday = () => {\n    const today = new Date();\n    today.setHours(0, 0, 0, 0);\n    fireChange(today);\n    setPanelDate(today);\n    toggleOpen(false);\n  };\n\n  const hasValue = date !== null;\n  const displayValue = hasValue ? formatDate(date, format) : '';\n  const defaultPlaceholder = placeholder ?? (picker === 'month' ? locale.DatePicker.selectMonth : picker === 'year' ? locale.DatePicker.selectYear : locale.DatePicker.selectDate);\n\n  const cls = classNames(prefixCls, className, `${prefixCls}_${size}`, {\n    [`${prefixCls}_disabled`]: disabled,\n    [`${prefixCls}_open`]: isOpen,\n    [`${prefixCls}_has-value`]: hasValue,\n  });\n\n  const renderPanel = () => {\n    switch (mode) {\n      case 'year':\n        return <PickerYear date={date} panelDate={panelDate} onChange={handleYearSelect} prefixCls={prefixCls} />;\n      case 'month':\n        return <PickerMonth date={date} panelDate={panelDate} months={locale.DatePicker.months} onChange={handleMonthSelect} prefixCls={prefixCls} />;\n      default:\n        return (\n          <PickerDay\n            date={date}\n            panelDate={panelDate}\n            weeks={locale.DatePicker.weeks}\n            disabledDate={disabledDate}\n            onChange={handleDateSelect}\n            panelOnChange={setPanelDate}\n            prefixCls={prefixCls}\n          />\n        );\n    }\n  };\n\n  const renderOverlay = () => (\n    <div className={`${prefixCls}__dropdown`} ref={dropdownRef}>\n      <PickerHeader\n        date={panelDate}\n        mode={mode}\n        months={locale.DatePicker.months}\n        onChange={setPanelDate}\n        onModeChange={handleModeChange}\n        prefixCls={prefixCls}\n      />\n      {renderPanel()}\n      {(showToday && mode === 'date' && picker === 'date') || renderExtraFooter ? (\n        <div className={`${prefixCls}__footer`}>\n          {renderExtraFooter?.(mode)}\n          {showToday && mode === 'date' && picker === 'date' && (\n            <a className={`${prefixCls}__today-btn`} onClick={handleToday}>{locale.DatePicker.today}</a>\n          )}\n        </div>\n      ) : null}\n    </div>\n  );\n\n  return (\n    <div className={cls} style={style} ref={wrapperRef}>\n      <Popup\n        trigger=\"manual\"\n        placement=\"bottom-start\"\n        arrow={false}\n        visible={isOpen}\n        content={renderOverlay()}>\n        <div className={`${prefixCls}__input`} onClick={() => !disabled && toggleOpen(!isOpen)}>\n          <input\n            className={`${prefixCls}__input-field`}\n            readOnly={inputReadOnly}\n            disabled={disabled}\n            placeholder={defaultPlaceholder}\n            value={displayValue}\n            aria-expanded={isOpen}\n            aria-haspopup=\"dialog\"\n            onKeyDown={(e) => {\n              if (e.key === 'Escape' && isOpen) toggleOpen(false);\n            }}\n          />\n          <span className={`${prefixCls}__suffix`}>\n            {allowClear && hasValue && !disabled ? (\n              <button type=\"button\" className={`${prefixCls}__clear`} onClick={handleClear} aria-label=\"Clear date\">\n                <ClearIcon size=\"1em\" />\n              </button>\n            ) : null}\n            <span className={`${prefixCls}__icon`}>\n              {suffixIcon ?? <CalendarIcon size=\"1em\" />}\n            </span>\n          </span>\n        </div>\n      </Popup>\n    </div>\n  );\n};\n\nDatePicker.displayName = 'DatePicker';\n\nexport default DatePicker;\n"],"mappings":"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"}

package/es/date-picker/index.d.ts

@@ -0,0 +1,2 @@
+import { DatePickerProps, PanelMode, PickerType } from "./types.js";
+import { DatePicker } from "./date-picker.js";

package/es/date-picker/index.js

@@ -0,0 +1,9 @@
+import '../style/base.css';
+import './style/index.css';
+import DatePicker from "./date-picker.js";
+//#region src/date-picker/index.tsx
+var date_picker_default = DatePicker;
+//#endregion
+export { date_picker_default as default };
+
+//# sourceMappingURL=index.js.map

package/es/date-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/date-picker/index.tsx"],"sourcesContent":["import DatePicker from './date-picker';\n\nexport type { DatePickerProps, PanelMode, PickerType } from './types';\nexport default DatePicker;\n"],"mappings":";;AAGA,IAAA,sBAAe"}

package/es/date-picker/picker-day.js

@@ -0,0 +1,42 @@
+import { getMonthDaysArray, isSameDate, isToday } from "./utils.js";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/date-picker/picker-day.tsx
+const PickerDay = (props) => {
+	const { prefixCls, date, weeks, onChange, panelDate, panelOnChange, disabledDate } = props;
+	const panelDays = getMonthDaysArray(panelDate);
+	const handleClick = (dayCell) => {
+		if (disabledDate?.(dayCell.date)) return;
+		onChange(dayCell.date);
+		if (!dayCell.isThisMonth) panelOnChange(dayCell.date);
+	};
+	return /* @__PURE__ */ jsx("div", {
+		className: `${prefixCls}__body`,
+		children: /* @__PURE__ */ jsxs("table", {
+			className: `${prefixCls}__table`,
+			children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: weeks.map((week, i) => /* @__PURE__ */ jsx("th", {
+				className: `${prefixCls}__cell-header`,
+				children: week
+			}, i)) }) }), /* @__PURE__ */ jsx("tbody", { children: Array.from({ length: panelDays.length / 7 }, (_, row) => /* @__PURE__ */ jsx("tr", { children: panelDays.slice(row * 7, row * 7 + 7).map((dayCell, col) => {
+				const isDisabled = disabledDate?.(dayCell.date) ?? false;
+				return /* @__PURE__ */ jsx("td", {
+					className: classNames(`${prefixCls}__cell`, {
+						[`${prefixCls}__cell_in-view`]: dayCell.isThisMonth,
+						[`${prefixCls}__cell_today`]: isToday(dayCell.date),
+						[`${prefixCls}__cell_selected`]: date && isSameDate(date, dayCell.date),
+						[`${prefixCls}__cell_disabled`]: isDisabled
+					}),
+					onClick: () => handleClick(dayCell),
+					children: /* @__PURE__ */ jsx("div", {
+						className: `${prefixCls}__cell-inner`,
+						children: dayCell.label
+					})
+				}, col);
+			}) }, row)) })]
+		})
+	});
+};
+//#endregion
+export { PickerDay as default };
+
+//# sourceMappingURL=picker-day.js.map

package/es/date-picker/picker-day.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-day.js","names":[],"sources":["../../src/date-picker/picker-day.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { getMonthDaysArray, isSameDate, isToday } from './utils';\n\nexport type PickerDayProps = {\n  date: Date | null;\n  panelDate: Date;\n  weeks: string[];\n  disabledDate?: (current: Date) => boolean;\n  onChange: (date: Date) => void;\n  panelOnChange: (panelDate: Date) => void;\n  prefixCls: string;\n};\n\nconst PickerDay = (props: PickerDayProps) => {\n  const { prefixCls, date, weeks, onChange, panelDate, panelOnChange, disabledDate } = props;\n  const panelDays = getMonthDaysArray(panelDate);\n\n  const handleClick = (dayCell: typeof panelDays[0]) => {\n    if (disabledDate?.(dayCell.date)) return;\n    onChange(dayCell.date);\n    if (!dayCell.isThisMonth) panelOnChange(dayCell.date);\n  };\n\n  return (\n    <div className={`${prefixCls}__body`}>\n      <table className={`${prefixCls}__table`}>\n        <thead>\n          <tr>\n            {weeks.map((week, i) => (\n              <th key={i} className={`${prefixCls}__cell-header`}>\n                {week}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {Array.from({ length: panelDays.length / 7 }, (_, row) => (\n            <tr key={row}>\n              {panelDays.slice(row * 7, row * 7 + 7).map((dayCell, col) => {\n                const isDisabled = disabledDate?.(dayCell.date) ?? false;\n                const cls = classNames(`${prefixCls}__cell`, {\n                  [`${prefixCls}__cell_in-view`]: dayCell.isThisMonth,\n                  [`${prefixCls}__cell_today`]: isToday(dayCell.date),\n                  [`${prefixCls}__cell_selected`]: date && isSameDate(date, dayCell.date),\n                  [`${prefixCls}__cell_disabled`]: isDisabled,\n                });\n                return (\n                  <td key={col} className={cls} onClick={() => handleClick(dayCell)}>\n                    <div className={`${prefixCls}__cell-inner`}>\n                      {dayCell.label}\n                    </div>\n                  </td>\n                );\n              })}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n};\n\nexport default PickerDay;\n"],"mappings":";;;;AAaA,MAAM,aAAa,UAA0B;CAC3C,MAAM,EAAE,WAAW,MAAM,OAAO,UAAU,WAAW,eAAe,iBAAiB;CACrF,MAAM,YAAY,kBAAkB,UAAU;CAE9C,MAAM,eAAe,YAAiC;AACpD,MAAI,eAAe,QAAQ,KAAK,CAAE;AAClC,WAAS,QAAQ,KAAK;AACtB,MAAI,CAAC,QAAQ,YAAa,eAAc,QAAQ,KAAK;;AAGvD,QACE,oBAAC,OAAD;EAAK,WAAW,GAAG,UAAU;YAC3B,qBAAC,SAAD;GAAO,WAAW,GAAG,UAAU;aAA/B,CACE,oBAAC,SAAD,EAAA,UACE,oBAAC,MAAD,EAAA,UACG,MAAM,KAAK,MAAM,MAChB,oBAAC,MAAD;IAAY,WAAW,GAAG,UAAU;cACjC;IACE,EAFI,EAEJ,CACL,EACC,CAAA,EACC,CAAA,EACR,oBAAC,SAAD,EAAA,UACG,MAAM,KAAK,EAAE,QAAQ,UAAU,SAAS,GAAG,GAAG,GAAG,QAChD,oBAAC,MAAD,EAAA,UACG,UAAU,MAAM,MAAM,GAAG,MAAM,IAAI,EAAE,CAAC,KAAK,SAAS,QAAQ;IAC3D,MAAM,aAAa,eAAe,QAAQ,KAAK,IAAI;AAOnD,WACE,oBAAC,MAAD;KAAc,WAPJ,WAAW,GAAG,UAAU,SAAS;OAC1C,GAAG,UAAU,kBAAkB,QAAQ;OACvC,GAAG,UAAU,gBAAgB,QAAQ,QAAQ,KAAK;OAClD,GAAG,UAAU,mBAAmB,QAAQ,WAAW,MAAM,QAAQ,KAAK;OACtE,GAAG,UAAU,mBAAmB;MAClC,CAAC;KAE8B,eAAe,YAAY,QAAQ;eAC/D,oBAAC,OAAD;MAAK,WAAW,GAAG,UAAU;gBAC1B,QAAQ;MACL,CAAA;KACH,EAJI,IAIJ;KAEP,EACC,EAjBI,IAiBJ,CACL,EACI,CAAA,CACF;;EACJ,CAAA"}

package/es/date-picker/picker-header.js

@@ -0,0 +1,74 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/date-picker/picker-header.tsx
+const PickerHeader = ({ date, mode, months, onChange, onModeChange, prefixCls }) => {
+	const year = date.getFullYear();
+	const startDecade = year - year % 10;
+	const step = (dir, unit) => {
+		const y = date.getFullYear();
+		const m = date.getMonth();
+		if (unit === "decade") onChange(new Date(y + dir * 10, m, 1));
+		else if (unit === "year") onChange(new Date(y + dir, m, 1));
+		else onChange(new Date(y, m + dir, 1));
+	};
+	const yearUnit = mode === "year" ? "decade" : "year";
+	return /* @__PURE__ */ jsxs("div", {
+		className: `${prefixCls}__header`,
+		children: [
+			/* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: `${prefixCls}__header-btn`,
+				onClick: () => step(-1, yearUnit),
+				"aria-label": "Previous year",
+				children: "«"
+			}),
+			mode === "date" && /* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: `${prefixCls}__header-btn`,
+				onClick: () => step(-1, "month"),
+				"aria-label": "Previous month",
+				children: "‹"
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: `${prefixCls}__header-caption`,
+				children: mode === "year" ? /* @__PURE__ */ jsxs("span", {
+					className: `${prefixCls}__header-label`,
+					children: [
+						startDecade,
+						" – ",
+						startDecade + 9
+					]
+				}) : mode === "month" ? /* @__PURE__ */ jsx("span", {
+					className: `${prefixCls}__header-label`,
+					onClick: () => onModeChange("year"),
+					children: year
+				}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+					className: `${prefixCls}__header-label`,
+					onClick: () => onModeChange("month"),
+					children: months[date.getMonth()]
+				}), /* @__PURE__ */ jsx("span", {
+					className: `${prefixCls}__header-label`,
+					onClick: () => onModeChange("year"),
+					children: year
+				})] })
+			}),
+			mode === "date" && /* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: `${prefixCls}__header-btn`,
+				onClick: () => step(1, "month"),
+				"aria-label": "Next month",
+				children: "›"
+			}),
+			/* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: `${prefixCls}__header-btn`,
+				onClick: () => step(1, yearUnit),
+				"aria-label": "Next year",
+				children: "»"
+			})
+		]
+	});
+};
+//#endregion
+export { PickerHeader as default };
+
+//# sourceMappingURL=picker-header.js.map

package/es/date-picker/picker-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-header.js","names":[],"sources":["../../src/date-picker/picker-header.tsx"],"sourcesContent":["import { PanelMode } from './types';\n\nexport type PickerHeaderProps = {\n  date: Date;\n  mode: PanelMode;\n  months: string[];\n  onChange: (date: Date) => void;\n  onModeChange: (mode: PanelMode) => void;\n  prefixCls: string;\n};\n\nconst PickerHeader = ({ date, mode, months, onChange, onModeChange, prefixCls }: PickerHeaderProps) => {\n  const year = date.getFullYear();\n  const startDecade = year - (year % 10);\n\n  const step = (dir: -1 | 1, unit: 'month' | 'year' | 'decade') => {\n    const y = date.getFullYear();\n    const m = date.getMonth();\n    if (unit === 'decade') onChange(new Date(y + dir * 10, m, 1));\n    else if (unit === 'year') onChange(new Date(y + dir, m, 1));\n    else {\n      const next = new Date(y, m + dir, 1);\n      onChange(next);\n    }\n  };\n\n  const yearUnit = mode === 'year' ? 'decade' : 'year';\n\n  return (\n    <div className={`${prefixCls}__header`}>\n      <button\n        type=\"button\"\n        className={`${prefixCls}__header-btn`}\n        onClick={() => step(-1, yearUnit)}\n        aria-label=\"Previous year\">\n        «\n      </button>\n      {mode === 'date' && (\n        <button\n          type=\"button\"\n          className={`${prefixCls}__header-btn`}\n          onClick={() => step(-1, 'month')}\n          aria-label=\"Previous month\">\n          ‹\n        </button>\n      )}\n      <div className={`${prefixCls}__header-caption`}>\n        {mode === 'year' ? (\n          <span className={`${prefixCls}__header-label`}>\n            {startDecade} – {startDecade + 9}\n          </span>\n        ) : mode === 'month' ? (\n          <span\n            className={`${prefixCls}__header-label`}\n            onClick={() => onModeChange('year')}>\n            {year}\n          </span>\n        ) : (\n          <>\n            <span\n              className={`${prefixCls}__header-label`}\n              onClick={() => onModeChange('month')}>\n              {months[date.getMonth()]}\n            </span>\n            <span\n              className={`${prefixCls}__header-label`}\n              onClick={() => onModeChange('year')}>\n              {year}\n            </span>\n          </>\n        )}\n      </div>\n      {mode === 'date' && (\n        <button\n          type=\"button\"\n          className={`${prefixCls}__header-btn`}\n          onClick={() => step(1, 'month')}\n          aria-label=\"Next month\">\n          ›\n        </button>\n      )}\n      <button\n        type=\"button\"\n        className={`${prefixCls}__header-btn`}\n        onClick={() => step(1, yearUnit)}\n        aria-label=\"Next year\">\n        »\n      </button>\n    </div>\n  );\n};\n\nexport default PickerHeader;\n"],"mappings":";;AAWA,MAAM,gBAAgB,EAAE,MAAM,MAAM,QAAQ,UAAU,cAAc,gBAAmC;CACrG,MAAM,OAAO,KAAK,aAAa;CAC/B,MAAM,cAAc,OAAQ,OAAO;CAEnC,MAAM,QAAQ,KAAa,SAAsC;EAC/D,MAAM,IAAI,KAAK,aAAa;EAC5B,MAAM,IAAI,KAAK,UAAU;AACzB,MAAI,SAAS,SAAU,UAAS,IAAI,KAAK,IAAI,MAAM,IAAI,GAAG,EAAE,CAAC;WACpD,SAAS,OAAQ,UAAS,IAAI,KAAK,IAAI,KAAK,GAAG,EAAE,CAAC;MAGzD,UADa,IAAI,KAAK,GAAG,IAAI,KAAK,EAAE,CACtB;;CAIlB,MAAM,WAAW,SAAS,SAAS,WAAW;AAE9C,QACE,qBAAC,OAAD;EAAK,WAAW,GAAG,UAAU;YAA7B;GACE,oBAAC,UAAD;IACE,MAAK;IACL,WAAW,GAAG,UAAU;IACxB,eAAe,KAAK,IAAI,SAAS;IACjC,cAAW;cAAgB;IAEpB,CAAA;GACR,SAAS,UACR,oBAAC,UAAD;IACE,MAAK;IACL,WAAW,GAAG,UAAU;IACxB,eAAe,KAAK,IAAI,QAAQ;IAChC,cAAW;cAAiB;IAErB,CAAA;GAEX,oBAAC,OAAD;IAAK,WAAW,GAAG,UAAU;cAC1B,SAAS,SACR,qBAAC,QAAD;KAAM,WAAW,GAAG,UAAU;eAA9B;MACG;MAAY;MAAI,cAAc;MAC1B;SACL,SAAS,UACX,oBAAC,QAAD;KACE,WAAW,GAAG,UAAU;KACxB,eAAe,aAAa,OAAO;eAClC;KACI,CAAA,GAEP,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;KACE,WAAW,GAAG,UAAU;KACxB,eAAe,aAAa,QAAQ;eACnC,OAAO,KAAK,UAAU;KAClB,CAAA,EACP,oBAAC,QAAD;KACE,WAAW,GAAG,UAAU;KACxB,eAAe,aAAa,OAAO;eAClC;KACI,CAAA,CACN,EAAA,CAAA;IAED,CAAA;GACL,SAAS,UACR,oBAAC,UAAD;IACE,MAAK;IACL,WAAW,GAAG,UAAU;IACxB,eAAe,KAAK,GAAG,QAAQ;IAC/B,cAAW;cAAa;IAEjB,CAAA;GAEX,oBAAC,UAAD;IACE,MAAK;IACL,WAAW,GAAG,UAAU;IACxB,eAAe,KAAK,GAAG,SAAS;IAChC,cAAW;cAAY;IAEhB,CAAA;GACL"}

package/es/date-picker/picker-month.js

@@ -0,0 +1,42 @@
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/date-picker/picker-month.tsx
+const PickerMonth = ({ date, panelDate, months, onChange, prefixCls }) => {
+	const panelYear = panelDate.getFullYear();
+	const selectedMonth = date && date.getFullYear() === panelYear ? date.getMonth() : -1;
+	const now = /* @__PURE__ */ new Date();
+	const isCurrentYear = now.getFullYear() === panelYear;
+	return /* @__PURE__ */ jsx("div", {
+		className: `${prefixCls}__body`,
+		children: /* @__PURE__ */ jsx("table", {
+			className: `${prefixCls}__table`,
+			children: /* @__PURE__ */ jsx("tbody", { children: [
+				0,
+				1,
+				2
+			].map((row) => /* @__PURE__ */ jsx("tr", { children: [
+				0,
+				1,
+				2,
+				3
+			].map((col) => {
+				const monthIdx = row * 4 + col;
+				return /* @__PURE__ */ jsx("td", {
+					className: classNames(`${prefixCls}__cell`, {
+						[`${prefixCls}__cell_selected`]: monthIdx === selectedMonth,
+						[`${prefixCls}__cell_today`]: isCurrentYear && monthIdx === now.getMonth()
+					}),
+					onClick: () => onChange(new Date(panelYear, monthIdx, 1)),
+					children: /* @__PURE__ */ jsx("div", {
+						className: `${prefixCls}__cell-inner`,
+						children: months[monthIdx]
+					})
+				}, col);
+			}) }, row)) })
+		})
+	});
+};
+//#endregion
+export { PickerMonth as default };
+
+//# sourceMappingURL=picker-month.js.map

package/es/date-picker/picker-month.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-month.js","names":[],"sources":["../../src/date-picker/picker-month.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nexport type PickerMonthProps = {\n  date: Date | null;\n  panelDate: Date;\n  months: string[];\n  onChange: (date: Date) => void;\n  prefixCls: string;\n};\n\nconst PickerMonth = ({ date, panelDate, months, onChange, prefixCls }: PickerMonthProps) => {\n  const panelYear = panelDate.getFullYear();\n  const selectedMonth = date && date.getFullYear() === panelYear ? date.getMonth() : -1;\n  const now = new Date();\n  const isCurrentYear = now.getFullYear() === panelYear;\n\n  return (\n    <div className={`${prefixCls}__body`}>\n      <table className={`${prefixCls}__table`}>\n        <tbody>\n          {[0, 1, 2].map((row) => (\n            <tr key={row}>\n              {[0, 1, 2, 3].map((col) => {\n                const monthIdx = row * 4 + col;\n                const cls = classNames(`${prefixCls}__cell`, {\n                  [`${prefixCls}__cell_selected`]: monthIdx === selectedMonth,\n                  [`${prefixCls}__cell_today`]: isCurrentYear && monthIdx === now.getMonth(),\n                });\n                return (\n                  <td\n                    key={col}\n                    className={cls}\n                    onClick={() => onChange(new Date(panelYear, monthIdx, 1))}>\n                    <div className={`${prefixCls}__cell-inner`}>{months[monthIdx]}</div>\n                  </td>\n                );\n              })}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n};\n\nexport default PickerMonth;\n"],"mappings":";;;AAUA,MAAM,eAAe,EAAE,MAAM,WAAW,QAAQ,UAAU,gBAAkC;CAC1F,MAAM,YAAY,UAAU,aAAa;CACzC,MAAM,gBAAgB,QAAQ,KAAK,aAAa,KAAK,YAAY,KAAK,UAAU,GAAG;CACnF,MAAM,sBAAM,IAAI,MAAM;CACtB,MAAM,gBAAgB,IAAI,aAAa,KAAK;AAE5C,QACE,oBAAC,OAAD;EAAK,WAAW,GAAG,UAAU;YAC3B,oBAAC,SAAD;GAAO,WAAW,GAAG,UAAU;aAC7B,oBAAC,SAAD,EAAA,UACG;IAAC;IAAG;IAAG;IAAE,CAAC,KAAK,QACd,oBAAC,MAAD,EAAA,UACG;IAAC;IAAG;IAAG;IAAG;IAAE,CAAC,KAAK,QAAQ;IACzB,MAAM,WAAW,MAAM,IAAI;AAK3B,WACE,oBAAC,MAAD;KAEE,WAPQ,WAAW,GAAG,UAAU,SAAS;OAC1C,GAAG,UAAU,mBAAmB,aAAa;OAC7C,GAAG,UAAU,gBAAgB,iBAAiB,aAAa,IAAI,UAAU;MAC3E,CAAC;KAKE,eAAe,SAAS,IAAI,KAAK,WAAW,UAAU,EAAE,CAAC;eACzD,oBAAC,OAAD;MAAK,WAAW,GAAG,UAAU;gBAAgB,OAAO;MAAgB,CAAA;KACjE,EAJE,IAIF;KAEP,EACC,EAhBI,IAgBJ,CACL,EACI,CAAA;GACF,CAAA;EACJ,CAAA"}

package/es/date-picker/picker-year.js

@@ -0,0 +1,46 @@
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/date-picker/picker-year.tsx
+const PickerYear = ({ date, panelDate, onChange, prefixCls }) => {
+	const panelYear = panelDate.getFullYear();
+	const startYear = panelYear - panelYear % 10;
+	const selectedYear = date?.getFullYear() ?? -1;
+	const now = /* @__PURE__ */ new Date();
+	const years = [];
+	for (let i = startYear - 1; i <= startYear + 10; i++) years.push(i);
+	return /* @__PURE__ */ jsx("div", {
+		className: `${prefixCls}__body`,
+		children: /* @__PURE__ */ jsx("table", {
+			className: `${prefixCls}__table`,
+			children: /* @__PURE__ */ jsx("tbody", { children: [
+				0,
+				1,
+				2
+			].map((row) => /* @__PURE__ */ jsx("tr", { children: [
+				0,
+				1,
+				2,
+				3
+			].map((col) => {
+				const year = years[row * 4 + col];
+				const isOutOfRange = year < startYear || year > startYear + 9;
+				return /* @__PURE__ */ jsx("td", {
+					className: classNames(`${prefixCls}__cell`, {
+						[`${prefixCls}__cell_selected`]: year === selectedYear,
+						[`${prefixCls}__cell_today`]: year === now.getFullYear(),
+						[`${prefixCls}__cell_dim`]: isOutOfRange
+					}),
+					onClick: () => onChange(new Date(year, panelDate.getMonth(), 1)),
+					children: /* @__PURE__ */ jsx("div", {
+						className: `${prefixCls}__cell-inner`,
+						children: year
+					})
+				}, col);
+			}) }, row)) })
+		})
+	});
+};
+//#endregion
+export { PickerYear as default };
+
+//# sourceMappingURL=picker-year.js.map

package/es/date-picker/picker-year.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"picker-year.js","names":[],"sources":["../../src/date-picker/picker-year.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nexport type PickerYearProps = {\n  date: Date | null;\n  panelDate: Date;\n  onChange: (date: Date) => void;\n  prefixCls: string;\n};\n\nconst PickerYear = ({ date, panelDate, onChange, prefixCls }: PickerYearProps) => {\n  const panelYear = panelDate.getFullYear();\n  const startYear = panelYear - (panelYear % 10);\n  const selectedYear = date?.getFullYear() ?? -1;\n  const now = new Date();\n\n  const years: number[] = [];\n  for (let i = startYear - 1; i <= startYear + 10; i++) {\n    years.push(i);\n  }\n\n  return (\n    <div className={`${prefixCls}__body`}>\n      <table className={`${prefixCls}__table`}>\n        <tbody>\n          {[0, 1, 2].map((row) => (\n            <tr key={row}>\n              {[0, 1, 2, 3].map((col) => {\n                const idx = row * 4 + col;\n                const year = years[idx];\n                const isOutOfRange = year < startYear || year > startYear + 9;\n                const cls = classNames(`${prefixCls}__cell`, {\n                  [`${prefixCls}__cell_selected`]: year === selectedYear,\n                  [`${prefixCls}__cell_today`]: year === now.getFullYear(),\n                  [`${prefixCls}__cell_dim`]: isOutOfRange,\n                });\n                return (\n                  <td\n                    key={col}\n                    className={cls}\n                    onClick={() => onChange(new Date(year, panelDate.getMonth(), 1))}>\n                    <div className={`${prefixCls}__cell-inner`}>{year}</div>\n                  </td>\n                );\n              })}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n};\n\nexport default PickerYear;\n"],"mappings":";;;AASA,MAAM,cAAc,EAAE,MAAM,WAAW,UAAU,gBAAiC;CAChF,MAAM,YAAY,UAAU,aAAa;CACzC,MAAM,YAAY,YAAa,YAAY;CAC3C,MAAM,eAAe,MAAM,aAAa,IAAI;CAC5C,MAAM,sBAAM,IAAI,MAAM;CAEtB,MAAM,QAAkB,EAAE;AAC1B,MAAK,IAAI,IAAI,YAAY,GAAG,KAAK,YAAY,IAAI,IAC/C,OAAM,KAAK,EAAE;AAGf,QACE,oBAAC,OAAD;EAAK,WAAW,GAAG,UAAU;YAC3B,oBAAC,SAAD;GAAO,WAAW,GAAG,UAAU;aAC7B,oBAAC,SAAD,EAAA,UACG;IAAC;IAAG;IAAG;IAAE,CAAC,KAAK,QACd,oBAAC,MAAD,EAAA,UACG;IAAC;IAAG;IAAG;IAAG;IAAE,CAAC,KAAK,QAAQ;IAEzB,MAAM,OAAO,MADD,MAAM,IAAI;IAEtB,MAAM,eAAe,OAAO,aAAa,OAAO,YAAY;AAM5D,WACE,oBAAC,MAAD;KAEE,WARQ,WAAW,GAAG,UAAU,SAAS;OAC1C,GAAG,UAAU,mBAAmB,SAAS;OACzC,GAAG,UAAU,gBAAgB,SAAS,IAAI,aAAa;OACvD,GAAG,UAAU,cAAc;MAC7B,CAAC;KAKE,eAAe,SAAS,IAAI,KAAK,MAAM,UAAU,UAAU,EAAE,EAAE,CAAC;eAChE,oBAAC,OAAD;MAAK,WAAW,GAAG,UAAU;gBAAgB;MAAW,CAAA;KACrD,EAJE,IAIF;KAEP,EACC,EAnBI,IAmBJ,CACL,EACI,CAAA;GACF,CAAA;EACJ,CAAA"}