@ioca/react 1.5.17 → 1.5.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/lib/cjs/components/input/input.js +3 -1
  2. package/lib/cjs/components/input/input.js.map +1 -1
  3. package/lib/cjs/components/message/index.js +3 -2
  4. package/lib/cjs/components/message/index.js.map +1 -1
  5. package/lib/cjs/components/message/message.js +93 -50
  6. package/lib/cjs/components/message/message.js.map +1 -1
  7. package/lib/cjs/components/picker/daterange/daterange.js +60 -0
  8. package/lib/cjs/components/picker/daterange/daterange.js.map +1 -0
  9. package/lib/cjs/components/picker/daterange/index.js +11 -0
  10. package/lib/cjs/components/picker/daterange/index.js.map +1 -0
  11. package/lib/cjs/components/picker/daterange/panel.js +55 -0
  12. package/lib/cjs/components/picker/daterange/panel.js.map +1 -0
  13. package/lib/cjs/components/picker/dates/dates.js +12 -4
  14. package/lib/cjs/components/picker/dates/dates.js.map +1 -1
  15. package/lib/cjs/components/picker/dates/index.js +6 -2
  16. package/lib/cjs/components/picker/dates/index.js.map +1 -1
  17. package/lib/cjs/components/picker/dates/panel.js +22 -9
  18. package/lib/cjs/components/picker/dates/panel.js.map +1 -1
  19. package/lib/cjs/components/picker/time/index.js +6 -2
  20. package/lib/cjs/components/picker/time/index.js.map +1 -1
  21. package/lib/cjs/components/popconfirm/popconfirm.js +2 -4
  22. package/lib/cjs/components/popconfirm/popconfirm.js.map +1 -1
  23. package/lib/cjs/index.js +10 -8
  24. package/lib/cjs/index.js.map +1 -1
  25. package/lib/css/colors.css +2 -2
  26. package/lib/css/index.css +1 -1
  27. package/lib/css/index.css.map +1 -1
  28. package/lib/css/input.css +12 -0
  29. package/lib/es/components/input/input.js +3 -1
  30. package/lib/es/components/input/input.js.map +1 -1
  31. package/lib/es/components/message/index.js +3 -3
  32. package/lib/es/components/message/index.js.map +1 -1
  33. package/lib/es/components/message/message.js +93 -51
  34. package/lib/es/components/message/message.js.map +1 -1
  35. package/lib/es/components/picker/daterange/daterange.js +50 -0
  36. package/lib/es/components/picker/daterange/daterange.js.map +1 -0
  37. package/lib/es/components/picker/daterange/index.js +6 -0
  38. package/lib/es/components/picker/daterange/index.js.map +1 -0
  39. package/lib/es/components/picker/daterange/panel.js +47 -0
  40. package/lib/es/components/picker/daterange/panel.js.map +1 -0
  41. package/lib/es/components/picker/dates/dates.js +12 -4
  42. package/lib/es/components/picker/dates/dates.js.map +1 -1
  43. package/lib/es/components/picker/dates/index.js +6 -2
  44. package/lib/es/components/picker/dates/index.js.map +1 -1
  45. package/lib/es/components/picker/dates/panel.js +22 -9
  46. package/lib/es/components/picker/dates/panel.js.map +1 -1
  47. package/lib/es/components/picker/time/index.js +6 -2
  48. package/lib/es/components/picker/time/index.js.map +1 -1
  49. package/lib/es/components/popconfirm/popconfirm.js +2 -4
  50. package/lib/es/components/popconfirm/popconfirm.js.map +1 -1
  51. package/lib/es/index.js +2 -1
  52. package/lib/es/index.js.map +1 -1
  53. package/lib/index.js +223 -70
  54. package/lib/types/components/input/type.d.ts +1 -0
  55. package/lib/types/components/message/index.d.ts +5 -3
  56. package/lib/types/components/message/message.d.ts +5 -4
  57. package/lib/types/components/message/type.d.ts +25 -12
  58. package/lib/types/components/picker/daterange/daterange.d.ts +6 -0
  59. package/lib/types/components/picker/daterange/index.d.ts +5 -0
  60. package/lib/types/components/picker/type.d.ts +11 -2
  61. package/lib/types/index.d.ts +2 -1
  62. package/package.json +1 -1
@@ -0,0 +1,47 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import dayjs from 'dayjs';
3
+ import { useState, useMemo, useEffect } from 'react';
4
+ import Panel from '../dates/panel.js';
5
+
6
+ const DoublePanel = (props) => {
7
+ const { value, weeks, unitYear, unitMonth, renderDate, renderMonth, renderYear, disabledDate, onSelected, } = props;
8
+ const [baseMonth, setBaseMonth] = useState(value?.[0] || dayjs());
9
+ const [startDate, setStartDate] = useState(value?.[0] || null);
10
+ const [endDate, setEndDate] = useState(value?.[1] || null);
11
+ const [selecting, setSelecting] = useState("start");
12
+ const [hoverDate, setHoverDate] = useState(null);
13
+ const nextMonth = useMemo(() => baseMonth.add(1, "month"), [baseMonth]);
14
+ useEffect(() => {
15
+ setStartDate(value?.[0] || null);
16
+ setEndDate(value?.[1] || null);
17
+ setBaseMonth(value?.[0] || dayjs());
18
+ }, [value]);
19
+ const handleDateClick = (date) => {
20
+ if (selecting === "start") {
21
+ setStartDate(date);
22
+ setSelecting("end");
23
+ }
24
+ else {
25
+ let start = startDate || date;
26
+ let end = date;
27
+ if (start.isAfter(end)) {
28
+ [start, end] = [end, start];
29
+ }
30
+ setEndDate(end);
31
+ setSelecting("start");
32
+ onSelected?.([start, end]);
33
+ }
34
+ };
35
+ const handleDateHover = (date) => {
36
+ if (selecting === "end" && startDate) {
37
+ setHoverDate(date);
38
+ }
39
+ };
40
+ const handleOperateMonth = (next) => {
41
+ setBaseMonth((m) => m[next ? "add" : "subtract"](1, "month"));
42
+ };
43
+ return (jsxs("div", { className: 'i-daterange-panel i-daterange-grids', children: [jsx("div", { className: 'i-daterange-col', children: jsx(Panel, { value: startDate, month: baseMonth, rangeEnd: endDate, hoverDate: hoverDate, onDateHover: handleDateHover, weeks: weeks, unitYear: unitYear, unitMonth: unitMonth, renderDate: renderDate, renderMonth: renderMonth, renderYear: renderYear, disabledDate: disabledDate, onDateClick: handleDateClick, onOperateMonth: handleOperateMonth }) }), jsx("div", { className: 'i-daterange-col', children: jsx(Panel, { value: startDate, month: nextMonth, rangeEnd: endDate, hoverDate: hoverDate, onDateHover: handleDateHover, weeks: weeks, unitYear: unitYear, unitMonth: unitMonth, renderDate: renderDate, renderMonth: renderMonth, renderYear: renderYear, disabledDate: disabledDate, onDateClick: handleDateClick, onOperateMonth: handleOperateMonth }) })] }));
44
+ };
45
+
46
+ export { DoublePanel as default };
47
+ //# sourceMappingURL=panel.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"panel.js","sources":["../../../../../packages/components/picker/daterange/panel.tsx"],"sourcesContent":["import dayjs, { Dayjs } from \"dayjs\";\nimport { ReactNode, useEffect, useMemo, useState } from \"react\";\nimport Panel from \"../dates/panel\";\n\ninterface IDoublePanel {\n\tvalue?: [Dayjs | null, Dayjs | null] | null;\n\tweeks?: ReactNode[];\n\tunitYear?: ReactNode;\n\tunitMonth?: ReactNode;\n\trenderDate?: (date: Dayjs) => ReactNode;\n\trenderMonth?: (m: number) => ReactNode;\n\trenderYear?: (y: number) => ReactNode;\n\tdisabledDate?: (date: Dayjs) => boolean;\n\tonSelected?: (dates: [Dayjs, Dayjs]) => void;\n}\n\nconst DoublePanel = (props: IDoublePanel) => {\n\tconst {\n\t\tvalue,\n\t\tweeks,\n\t\tunitYear,\n\t\tunitMonth,\n\t\trenderDate,\n\t\trenderMonth,\n\t\trenderYear,\n\t\tdisabledDate,\n\t\tonSelected,\n\t} = props;\n\n\tconst [baseMonth, setBaseMonth] = useState(value?.[0] || dayjs());\n\tconst [startDate, setStartDate] = useState<Dayjs | null>(\n\t\tvalue?.[0] || null\n\t);\n\tconst [endDate, setEndDate] = useState<Dayjs | null>(\n\t\tvalue?.[1] || null\n\t);\n\tconst [selecting, setSelecting] = useState<\"start\" | \"end\">(\"start\");\n\tconst [hoverDate, setHoverDate] = useState<Dayjs | null>(null);\n\n\tconst nextMonth = useMemo(() => baseMonth.add(1, \"month\"), [baseMonth]);\n\n\tuseEffect(() => {\n\t\tsetStartDate(value?.[0] || null);\n\t\tsetEndDate(value?.[1] || null);\n\t\tsetBaseMonth(value?.[0] || dayjs());\n\t}, [value]);\n\n\tconst handleDateClick = (date: Dayjs) => {\n\t\tif (selecting === \"start\") {\n\t\t\tsetStartDate(date);\n\t\t\tsetSelecting(\"end\");\n\t\t} else {\n\t\t\tlet start = startDate || date;\n\t\t\tlet end = date;\n\t\t\tif (start.isAfter(end)) {\n\t\t\t\t[start, end] = [end, start];\n\t\t\t}\n\t\t\tsetEndDate(end);\n\t\t\tsetSelecting(\"start\");\n\t\t\tonSelected?.([start, end]);\n\t\t}\n\t};\n\n\tconst handleDateHover = (date: Dayjs | null) => {\n\t\tif (selecting === \"end\" && startDate) {\n\t\t\tsetHoverDate(date);\n\t\t}\n\t};\n\n\tconst handleOperateMonth = (next: boolean) => {\n\t\tsetBaseMonth((m) => m[next ? \"add\" : \"subtract\"](1, \"month\"));\n\t};\n\n\treturn (\n\t\t<div className='i-daterange-panel i-daterange-grids'>\n\t\t\t<div className='i-daterange-col'>\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={startDate}\n\t\t\t\t\tmonth={baseMonth}\n\t\t\t\t\trangeEnd={endDate}\n\t\t\t\t\thoverDate={hoverDate}\n\t\t\t\t\tonDateHover={handleDateHover}\n\t\t\t\t\tweeks={weeks}\n\t\t\t\t\tunitYear={unitYear}\n\t\t\t\t\tunitMonth={unitMonth}\n\t\t\t\t\trenderDate={renderDate}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\t\tonDateClick={handleDateClick}\n\t\t\t\t\tonOperateMonth={handleOperateMonth}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div className='i-daterange-col'>\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={startDate}\n\t\t\t\t\tmonth={nextMonth}\n\t\t\t\t\trangeEnd={endDate}\n\t\t\t\t\thoverDate={hoverDate}\n\t\t\t\t\tonDateHover={handleDateHover}\n\t\t\t\t\tweeks={weeks}\n\t\t\t\t\tunitYear={unitYear}\n\t\t\t\t\tunitMonth={unitMonth}\n\t\t\t\t\trenderDate={renderDate}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\t\tonDateClick={handleDateClick}\n\t\t\t\t\tonOperateMonth={handleOperateMonth}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default DoublePanel;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
@@ -4,7 +4,7 @@ import dayjs from 'dayjs';
4
4
  import { useMemo } from 'react';
5
5
 
6
6
  const Dates = (props) => {
7
- const { value, month, weeks = ["一", "二", "三", "四", "五", "六", "日"], renderDate = (date) => date.date(), disabledDate, onDateClick, } = props;
7
+ const { value, month, rangeEnd, hoverDate, weeks = ["一", "二", "三", "四", "五", "六", "日"], renderDate = (date) => date.date(), disabledDate, onDateClick, onDateHover, } = props;
8
8
  const today = dayjs();
9
9
  const dates = useMemo(() => {
10
10
  const dates = [];
@@ -28,17 +28,25 @@ const Dates = (props) => {
28
28
  return;
29
29
  onDateClick?.(date);
30
30
  };
31
- return (jsxs(Fragment, { children: [jsx("div", { className: 'i-datepicker-weeks', children: weeks.map((week, i) => (jsx("span", { className: 'i-datepicker-week', children: week }, i))) }), jsx("div", { className: 'i-datepicker-dates', children: dates.map((date, i) => {
32
- const active = date.isSame(value, "day");
31
+ const handleMouseEnter = (date) => {
32
+ if (disabledDate?.(date))
33
+ return;
34
+ onDateHover?.(date);
35
+ };
36
+ return (jsxs(Fragment, { children: [jsx("div", { className: 'i-datepicker-weeks', children: weeks.map((week, i) => (jsx("span", { className: 'i-datepicker-week', children: week }, i))) }), jsx("div", { className: 'i-datepicker-dates', onMouseLeave: () => onDateHover?.(null), children: dates.map((date, i) => {
37
+ const active = date.isSame(value, "day") || (rangeEnd && date.isSame(rangeEnd, "day"));
33
38
  const isSameMonth = date.isSame(month, "month");
34
39
  const isToday = date.isSame(today, "day");
35
40
  const disabled = disabledDate?.(date);
41
+ const isBetween = hoverDate && value && ((date.isAfter(value, "day") && date.isBefore(hoverDate, "day")) ||
42
+ (date.isAfter(hoverDate, "day") && date.isBefore(value, "day")));
36
43
  return (jsx("div", { className: classNames("i-datepicker-item", {
37
44
  "i-datepicker-active": active,
38
45
  "i-datepicker-same-month": isSameMonth,
39
46
  "i-datepicker-today": isToday,
40
47
  "i-datepicker-disabled": disabled,
41
- }), onClick: () => handleDateClick(date), children: renderDate(date) }, i));
48
+ "i-daterange-between": isBetween,
49
+ }), onMouseEnter: () => handleMouseEnter(date), onClick: () => handleDateClick(date), children: renderDate(date) }, i));
42
50
  }) })] }));
43
51
  };
44
52
 
@@ -1 +1 @@
1
- {"version":3,"file":"dates.js","sources":["../../../../../packages/components/picker/dates/dates.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport { ReactNode, useMemo } from \"react\";\nimport { IBaseDates } from \"../type\";\n\nconst Dates = (\n\tprops: IBaseDates & {\n\t\tmonth: any;\n\t}\n) => {\n\tconst {\n\t\tvalue,\n\t\tmonth,\n\t\tweeks = [\"一\", \"二\", \"三\", \"四\", \"五\", \"六\", \"日\"],\n\t\trenderDate = (date: Dayjs) => date.date(),\n\t\tdisabledDate,\n\t\tonDateClick,\n\t} = props;\n\tconst today = dayjs();\n\n\tconst dates = useMemo(() => {\n\t\tconst dates: Dayjs[] = [];\n\n\t\tconst lastDateOfLastMonth = month.add(-1, \"month\").endOf(\"month\");\n\t\tlet { $W, $D } = lastDateOfLastMonth;\n\n\t\tif ($W !== 0) {\n\t\t\tconst lastMonthDates = Array.from({ length: $W }).map(\n\t\t\t\t(whatever, i) => lastDateOfLastMonth.add(i + 1 - $W, \"day\")\n\t\t\t);\n\t\t\tdates.push(...lastMonthDates);\n\t\t}\n\n\t\tconst lastDate = month.endOf(\"month\");\n\t\t$D = lastDate.$D;\n\t\t$W = lastDate.$W;\n\t\tdates.push(\n\t\t\t...Array.from({ length: $D }).map((whatever, i) =>\n\t\t\t\tlastDate.add(i + 1 - $D, \"day\")\n\t\t\t)\n\t\t);\n\n\t\tif ($W !== 0) {\n\t\t\tdates.push(\n\t\t\t\t...Array.from({ length: 7 - $W }).map((whatever, i) =>\n\t\t\t\t\tlastDate.add(i + 1, \"day\")\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\treturn dates;\n\t}, [month]);\n\n\tconst handleDateClick = (date: Dayjs) => {\n\t\tif (disabledDate?.(date)) return;\n\n\t\tonDateClick?.(date);\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<div className='i-datepicker-weeks'>\n\t\t\t\t{weeks.map((week: ReactNode, i: number) => (\n\t\t\t\t\t<span key={i} className='i-datepicker-week'>\n\t\t\t\t\t\t{week}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t<div className='i-datepicker-dates'>\n\t\t\t\t{dates.map((date, i: number) => {\n\t\t\t\t\tconst active = date.isSame(value, \"day\");\n\t\t\t\t\tconst isSameMonth = date.isSame(month, \"month\");\n\t\t\t\t\tconst isToday = date.isSame(today, \"day\");\n\t\t\t\t\tconst disabled = disabledDate?.(date);\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-item\", {\n\t\t\t\t\t\t\t\t\"i-datepicker-active\": active,\n\t\t\t\t\t\t\t\t\"i-datepicker-same-month\": isSameMonth,\n\t\t\t\t\t\t\t\t\"i-datepicker-today\": isToday,\n\t\t\t\t\t\t\t\t\"i-datepicker-disabled\": disabled,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => handleDateClick(date)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderDate(date)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nexport default Dates;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"dates.js","sources":["../../../../../packages/components/picker/dates/dates.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport { ReactNode, useMemo } from \"react\";\nimport { IBaseDates } from \"../type\";\n\nconst Dates = (\n\tprops: IBaseDates & {\n\t\tmonth: any;\n\t\trangeEnd?: Dayjs | null;\n\t\thoverDate?: Dayjs | null;\n\t\tonDateHover?: (date: Dayjs | null) => void;\n\t}\n) => {\n\tconst {\n\t\tvalue,\n\t\tmonth,\n\t\trangeEnd,\n\t\thoverDate,\n\t\tweeks = [\"一\", \"二\", \"三\", \"四\", \"五\", \"六\", \"日\"],\n\t\trenderDate = (date: Dayjs) => date.date(),\n\t\tdisabledDate,\n\t\tonDateClick,\n\t\tonDateHover,\n\t} = props;\n\tconst today = dayjs();\n\n\tconst dates = useMemo(() => {\n\t\tconst dates: Dayjs[] = [];\n\n\t\tconst lastDateOfLastMonth = month.add(-1, \"month\").endOf(\"month\");\n\t\tlet { $W, $D } = lastDateOfLastMonth;\n\n\t\tif ($W !== 0) {\n\t\t\tconst lastMonthDates = Array.from({ length: $W }).map(\n\t\t\t\t(whatever, i) => lastDateOfLastMonth.add(i + 1 - $W, \"day\")\n\t\t\t);\n\t\t\tdates.push(...lastMonthDates);\n\t\t}\n\n\t\tconst lastDate = month.endOf(\"month\");\n\t\t$D = lastDate.$D;\n\t\t$W = lastDate.$W;\n\t\tdates.push(\n\t\t\t...Array.from({ length: $D }).map((whatever, i) =>\n\t\t\t\tlastDate.add(i + 1 - $D, \"day\")\n\t\t\t)\n\t\t);\n\n\t\tif ($W !== 0) {\n\t\t\tdates.push(\n\t\t\t\t...Array.from({ length: 7 - $W }).map((whatever, i) =>\n\t\t\t\t\tlastDate.add(i + 1, \"day\")\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\treturn dates;\n\t}, [month]);\n\n\tconst handleDateClick = (date: Dayjs) => {\n\t\tif (disabledDate?.(date)) return;\n\n\t\tonDateClick?.(date);\n\t};\n\n\tconst handleMouseEnter = (date: Dayjs) => {\n\t\tif (disabledDate?.(date)) return;\n\t\tonDateHover?.(date);\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<div className='i-datepicker-weeks'>\n\t\t\t\t{weeks.map((week: ReactNode, i: number) => (\n\t\t\t\t\t<span key={i} className='i-datepicker-week'>\n\t\t\t\t\t\t{week}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclassName='i-datepicker-dates'\n\t\t\t\tonMouseLeave={() => onDateHover?.(null)}\n\t\t\t>\n\t\t\t\t{dates.map((date, i: number) => {\n\t\t\t\t\tconst active = date.isSame(value, \"day\") || (rangeEnd && date.isSame(rangeEnd, \"day\"));\n\t\t\t\t\tconst isSameMonth = date.isSame(month, \"month\");\n\t\t\t\t\tconst isToday = date.isSame(today, \"day\");\n\t\t\t\t\tconst disabled = disabledDate?.(date);\n\t\t\t\t\tconst isBetween = hoverDate && value && (\n\t\t\t\t\t\t(date.isAfter(value, \"day\") && date.isBefore(hoverDate, \"day\")) ||\n\t\t\t\t\t\t(date.isAfter(hoverDate, \"day\") && date.isBefore(value, \"day\"))\n\t\t\t\t\t);\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-item\", {\n\t\t\t\t\t\t\t\t\"i-datepicker-active\": active,\n\t\t\t\t\t\t\t\t\"i-datepicker-same-month\": isSameMonth,\n\t\t\t\t\t\t\t\t\"i-datepicker-today\": isToday,\n\t\t\t\t\t\t\t\t\"i-datepicker-disabled\": disabled,\n\t\t\t\t\t\t\t\t\"i-daterange-between\": isBetween,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonMouseEnter={() => handleMouseEnter(date)}\n\t\t\t\t\t\t\tonClick={() => handleDateClick(date)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderDate(date)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nexport default Dates;\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
@@ -13,7 +13,7 @@ dayjs.extend(customParseFormat);
13
13
  const FORMATTYPES = ["YYYY-MM-DD", "YYYY-M-D", "YYYY/MM/DD", "YYYY/M/D"];
14
14
  const FORMAT = "YYYY-MM-DD";
15
15
  const Datepicker = (props) => {
16
- const { name, value, weeks, format = FORMAT, placeholder = props.format ?? FORMAT, className, renderDate, renderMonth, renderYear, popupProps, disabledDate, onDateClick, onChange, onBlur, ...restProps } = props;
16
+ const { name, value, weeks, format = FORMAT, placeholder = props.format ?? FORMAT, className, renderDate, renderMonth, renderYear, popupProps, disabledDate, onDateClick, onChange, onBlur, clear, onClear: onClearProp, ...restProps } = props;
17
17
  const [inputValue, setInputValue] = useState(value);
18
18
  const [active, setActive] = useState(false);
19
19
  const dayJsValue = useMemo(() => {
@@ -49,10 +49,14 @@ const Datepicker = (props) => {
49
49
  popupProps?.onVisibleChange?.(v);
50
50
  setActive(v);
51
51
  };
52
+ const handleClear = () => {
53
+ setActive(false);
54
+ onClearProp?.();
55
+ };
52
56
  useEffect(() => {
53
57
  setInputValue(value);
54
58
  }, [value]);
55
- return (jsx(Popup, { visible: active, trigger: 'click', position: 'bottom', arrow: false, align: 'start', onVisibleChange: handleVisibleChange, content: jsx(Panel, { value: dayJsValue, weeks: weeks, renderDate: renderDate, renderMonth: renderMonth, renderYear: renderYear, disabledDate: disabledDate, onDateClick: handleDateClick }), ...popupProps, children: jsx(Input, { value: inputValue, append: jsx(Icon, { icon: jsx(CalendarMonthTwotone, {}), className: 'i-datepicker-icon', size: '1em' }), placeholder: placeholder, onChange: handleChange, onBlur: handleBlur, onEnter: handleSetDate, className: classNames("i-datepicker-label", className), ...restProps }) }));
59
+ return (jsx(Popup, { visible: active, trigger: 'click', position: 'bottom', arrow: false, align: 'start', onVisibleChange: handleVisibleChange, content: jsx(Panel, { value: dayJsValue, weeks: weeks, renderDate: renderDate, renderMonth: renderMonth, renderYear: renderYear, disabledDate: disabledDate, onDateClick: handleDateClick }), ...popupProps, children: jsx(Input, { value: inputValue, append: jsx(Icon, { icon: jsx(CalendarMonthTwotone, {}), className: 'i-datepicker-icon', size: '1em' }), placeholder: placeholder, clear: clear, onClear: handleClear, onChange: handleChange, onBlur: handleBlur, onEnter: handleSetDate, className: classNames("i-datepicker-label", className), ...restProps }) }));
56
60
  };
57
61
 
58
62
  export { Datepicker as default };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../packages/components/picker/dates/index.tsx"],"sourcesContent":["import { CalendarMonthTwotone } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat.js\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Input from \"../../input\";\nimport Popup from \"../../popup\";\nimport { IDatePicker } from \"../type\";\nimport \"./index.css\";\nimport Panel from \"./panel\";\n\ndayjs.extend(customParseFormat);\n\nconst FORMATTYPES = [\"YYYY-MM-DD\", \"YYYY-M-D\", \"YYYY/MM/DD\", \"YYYY/M/D\"];\nconst FORMAT = \"YYYY-MM-DD\";\n\nconst Datepicker = (props: IDatePicker) => {\n\tconst {\n\t\tname,\n\t\tvalue,\n\t\tweeks,\n\t\tformat = FORMAT,\n\t\tplaceholder = props.format ?? FORMAT,\n\t\tclassName,\n\t\trenderDate,\n\t\trenderMonth,\n\t\trenderYear,\n\t\tpopupProps,\n\t\tdisabledDate,\n\t\tonDateClick,\n\t\tonChange,\n\t\tonBlur,\n\t\t...restProps\n\t} = props;\n\n\tconst [inputValue, setInputValue] = useState(value);\n\n\tconst [active, setActive] = useState<boolean>(false);\n\n\tconst dayJsValue = useMemo(() => {\n\t\tif (!inputValue) return null;\n\n\t\tconst date = dayjs(inputValue as string, format, true);\n\n\t\tif (date.isValid()) return date;\n\n\t\treturn null;\n\t}, [inputValue, format]);\n\n\tconst handleDateClick = (date: Dayjs) => {\n\t\thandleChange(date.format(format));\n\t};\n\n\tconst handleChange = (v) => {\n\t\tsetInputValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst handleSetDate = () => {\n\t\tif (!inputValue) return;\n\n\t\tconst date = dayjs(inputValue as string, FORMATTYPES, true);\n\n\t\tif (date.isValid()) {\n\t\t\thandleChange(date.format(format));\n\t\t\treturn;\n\t\t}\n\n\t\thandleChange(\"\");\n\t};\n\n\tconst handleBlur = (e) => {\n\t\tonBlur?.(e);\n\t\thandleSetDate();\n\t};\n\n\tconst handleVisibleChange = (v) => {\n\t\tpopupProps?.onVisibleChange?.(v);\n\t\tsetActive(v);\n\t};\n\n\tuseEffect(() => {\n\t\tsetInputValue(value);\n\t}, [value]);\n\n\treturn (\n\t\t<Popup\n\t\t\tvisible={active}\n\t\t\ttrigger='click'\n\t\t\tposition='bottom'\n\t\t\tarrow={false}\n\t\t\talign='start'\n\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\tcontent={\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={dayJsValue}\n\t\t\t\t\tweeks={weeks}\n\t\t\t\t\trenderDate={renderDate}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\t\tonDateClick={handleDateClick}\n\t\t\t\t/>\n\t\t\t}\n\t\t\t{...popupProps}\n\t\t>\n\t\t\t<Input\n\t\t\t\tvalue={inputValue}\n\t\t\t\tappend={\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={<CalendarMonthTwotone />}\n\t\t\t\t\t\tclassName='i-datepicker-icon'\n\t\t\t\t\t\tsize='1em'\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tonEnter={handleSetDate}\n\t\t\t\tclassName={classNames(\"i-datepicker-label\", className)}\n\t\t\t\t{...restProps}\n\t\t\t/>\n\t\t</Popup>\n\t);\n};\n\nexport default Datepicker;\n"],"names":["_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../../../packages/components/picker/dates/index.tsx"],"sourcesContent":["import { CalendarMonthTwotone } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat.js\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Input from \"../../input\";\nimport Popup from \"../../popup\";\nimport { IDatePicker } from \"../type\";\nimport \"./index.css\";\nimport Panel from \"./panel\";\n\ndayjs.extend(customParseFormat);\n\nconst FORMATTYPES = [\"YYYY-MM-DD\", \"YYYY-M-D\", \"YYYY/MM/DD\", \"YYYY/M/D\"];\nconst FORMAT = \"YYYY-MM-DD\";\n\nconst Datepicker = (props: IDatePicker) => {\n\tconst {\n\t\tname,\n\t\tvalue,\n\t\tweeks,\n\t\tformat = FORMAT,\n\t\tplaceholder = props.format ?? FORMAT,\n\t\tclassName,\n\t\trenderDate,\n\t\trenderMonth,\n\t\trenderYear,\n\t\tpopupProps,\n\t\tdisabledDate,\n\t\tonDateClick,\n\t\tonChange,\n\t\tonBlur,\n\t\tclear,\n\t\tonClear: onClearProp,\n\t\t...restProps\n\t} = props;\n\n\tconst [inputValue, setInputValue] = useState(value);\n\n\tconst [active, setActive] = useState<boolean>(false);\n\n\n\tconst dayJsValue = useMemo(() => {\n\t\tif (!inputValue) return null;\n\n\t\tconst date = dayjs(inputValue as string, format, true);\n\n\t\tif (date.isValid()) return date;\n\n\t\treturn null;\n\t}, [inputValue, format]);\n\n\tconst handleDateClick = (date: Dayjs) => {\n\t\thandleChange(date.format(format));\n\t};\n\n\tconst handleChange = (v) => {\n\t\tsetInputValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst handleSetDate = () => {\n\t\tif (!inputValue) return;\n\n\t\tconst date = dayjs(inputValue as string, FORMATTYPES, true);\n\n\t\tif (date.isValid()) {\n\t\t\thandleChange(date.format(format));\n\t\t\treturn;\n\t\t}\n\n\t\thandleChange(\"\");\n\t};\n\n\tconst handleBlur = (e) => {\n\t\tonBlur?.(e);\n\t\thandleSetDate();\n\t};\n\n\tconst handleVisibleChange = (v) => {\n\t\tpopupProps?.onVisibleChange?.(v);\n\t\tsetActive(v);\n\t};\n\n\tconst handleClear = () => {\n\t\tsetActive(false);\n\t\tonClearProp?.();\n\t};\n\n\tuseEffect(() => {\n\t\tsetInputValue(value);\n\t}, [value]);\n\n\treturn (\n\t\t<Popup\n\t\t\tvisible={active}\n\t\t\ttrigger='click'\n\t\t\tposition='bottom'\n\t\t\tarrow={false}\n\t\t\talign='start'\n\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\tcontent={\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={dayJsValue}\n\t\t\t\t\tweeks={weeks}\n\t\t\t\t\trenderDate={renderDate}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\t\tonDateClick={handleDateClick}\n\t\t\t\t/>\n\t\t\t}\n\t\t\t{...popupProps}\n\t\t>\n\t\t\t<Input\n\t\t\t\tvalue={inputValue}\n\t\t\t\tappend={\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={<CalendarMonthTwotone />}\n\t\t\t\t\t\tclassName='i-datepicker-icon'\n\t\t\t\t\t\tsize='1em'\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tclear={clear}\n\t\t\t\tonClear={handleClear}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tonEnter={handleSetDate}\n\t\t\t\tclassName={classNames(\"i-datepicker-label\", className)}\n\t\t\t\t{...restProps}\n\t\t\t/>\n\t\t</Popup>\n\t);\n};\n\nexport default Datepicker;\n"],"names":["_jsx"],"mappings":"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"}
@@ -14,20 +14,20 @@ const YearMonth = (props) => {
14
14
  return (jsxs("a", { className: 'i-datepicker-action', "data-ripple": true, onClick: onClick, children: [jsx("span", { children: renderYear?.(value.year()) }), unitYear, jsx("span", { children: renderMonth?.(value.month() + 1) }), unitMonth] }));
15
15
  };
16
16
  const Panel = (props) => {
17
- const { value, unitYear, unitMonth, renderDate, renderMonth = (m) => m, renderYear = (y) => y, disabledDate, onDateClick, } = props;
17
+ const { value, month: controlledMonth, rangeEnd, hoverDate, onDateHover, onOperateMonth: onOperateMonthProp, unitYear, unitMonth, renderDate, renderMonth = (m) => m, renderYear = (y) => y, disabledDate, onDateClick, } = props;
18
18
  const [today, setToday] = useState(value);
19
- const [month, setMonth] = useState(value || dayjs());
19
+ const [month, setMonth] = useState(controlledMonth || value || dayjs());
20
20
  const [selectedYear, setSelectedYear] = useState(dayjs());
21
21
  const [years, setYears] = useState([]);
22
22
  const [selectable, setSelectable] = useState(false);
23
23
  const $years = useRef(null);
24
- const handleOperateMonth = (next) => {
24
+ const handleOperateMonth = onOperateMonthProp || ((next) => {
25
25
  setMonth((m) => m[next ? "add" : "subtract"](1, "month"));
26
- };
26
+ });
27
27
  const handleChangeDate = (date) => {
28
28
  if (date.isSame(today, "day"))
29
29
  return;
30
- if (!date.isSame(month, "month")) {
30
+ if (controlledMonth === undefined && !date.isSame(month, "month")) {
31
31
  setMonth(date);
32
32
  }
33
33
  setToday(date);
@@ -51,20 +51,33 @@ const Panel = (props) => {
51
51
  }, [selectable, month]);
52
52
  useEffect(() => {
53
53
  setToday(value);
54
- setMonth(value || dayjs());
55
- }, [value]);
54
+ if (controlledMonth === undefined) {
55
+ setMonth(value || dayjs());
56
+ }
57
+ }, [value, controlledMonth]);
58
+ useEffect(() => {
59
+ const el = $years.current;
60
+ if (!el)
61
+ return;
62
+ const onWheel = (e) => {
63
+ e.preventDefault();
64
+ getMoreYears(e);
65
+ };
66
+ el.addEventListener("wheel", onWheel, { passive: false });
67
+ return () => el.removeEventListener("wheel", onWheel);
68
+ }, []);
56
69
  return (jsxs("div", { className: 'i-datepicker', children: [jsxs("div", { className: 'i-datepicker-units', children: [jsx(YearMonth, { value: month, unitYear: unitYear, unitMonth: unitMonth, renderMonth: renderMonth, renderYear: renderYear, onClick: () => setSelectable(true) }), jsx("a", { className: 'ml-auto i-datepicker-action', "data-ripple": true, onClick: () => handleOperateMonth(false), children: jsx(Icon, { icon: jsx(KeyboardArrowLeftRound, {}) }) }), jsx("a", { className: 'i-datepicker-action', "data-ripple": true, onClick: () => handleOperateMonth(true), children: jsx(Icon, { icon: jsx(KeyboardArrowRightRound, {}) }) })] }), jsxs("div", { className: classNames("i-datepicker-ym", {
57
70
  "i-datepicker-active": selectable,
58
71
  }), children: [jsx(Helpericon, { active: true, className: 'i-datepicker-close', onClick: (e) => {
59
72
  e.stopPropagation();
60
73
  setSelectable(false);
61
- } }), jsx("div", { ref: $years, className: 'i-datepicker-years', onWheel: getMoreYears, children: years.map((y) => (jsx("a", { className: classNames("i-datepicker-year", {
74
+ } }), jsx("div", { ref: $years, className: 'i-datepicker-years', children: years.map((y) => (jsx("a", { className: classNames("i-datepicker-year", {
62
75
  "i-datepicker-active": y === selectedYear.year(),
63
76
  }), onClick: () => setSelectedYear((sy) => sy.year(y)), children: renderYear(y) }, y))) }), jsx("div", { className: 'i-datepicker-months', children: MONTHS.map((m) => {
64
77
  return (jsx("a", { className: classNames("i-datepicker-month", {
65
78
  "i-datepicker-active": m === month.month() + 1,
66
79
  }), onClick: () => handleChangeMonth(m), children: renderMonth(m) }, m));
67
- }) })] }), jsx(Dates, { value: today, month: month, disabledDate: disabledDate, onDateClick: handleChangeDate, renderDate: renderDate })] }));
80
+ }) })] }), jsx(Dates, { value: today, month: month, rangeEnd: rangeEnd, hoverDate: hoverDate, onDateHover: onDateHover, disabledDate: disabledDate, onDateClick: handleChangeDate, renderDate: renderDate })] }));
68
81
  };
69
82
 
70
83
  export { Panel as default };
@@ -1 +1 @@
1
- {"version":3,"file":"panel.js","sources":["../../../../../packages/components/picker/dates/panel.tsx"],"sourcesContent":["import {\n\tKeyboardArrowLeftRound,\n\tKeyboardArrowRightRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport { throttle } from \"radash\";\nimport { ReactNode, useEffect, useRef, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Helpericon from \"../../utils/helpericon\";\nimport { IBaseDates } from \"../type\";\nimport Dates from \"./dates\";\n\nconst MONTHS = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];\n\nconst YearMonth = (\n\tprops: IBaseDates & {\n\t\tonClick?: () => void;\n\t}\n) => {\n\tconst {\n\t\tvalue,\n\t\tunitMonth = \"月\",\n\t\tunitYear = \"年\",\n\t\trenderYear,\n\t\trenderMonth,\n\t\tonClick,\n\t} = props;\n\n\treturn (\n\t\t<a className='i-datepicker-action' data-ripple onClick={onClick}>\n\t\t\t<span>{renderYear?.(value.year())}</span>\n\t\t\t{unitYear}\n\t\t\t<span>{renderMonth?.(value.month() + 1)}</span>\n\t\t\t{unitMonth}\n\t\t</a>\n\t);\n};\n\nconst Panel = (props: IBaseDates) => {\n\tconst {\n\t\tvalue,\n\t\tunitYear,\n\t\tunitMonth,\n\t\trenderDate,\n\t\trenderMonth = (m: ReactNode) => m,\n\t\trenderYear = (y: ReactNode) => y,\n\t\tdisabledDate,\n\t\tonDateClick,\n\t} = props;\n\n\tconst [today, setToday] = useState(value);\n\tconst [month, setMonth] = useState(value || dayjs());\n\tconst [selectedYear, setSelectedYear] = useState(dayjs());\n\tconst [years, setYears] = useState<number[]>([]);\n\tconst [selectable, setSelectable] = useState(false);\n\n\tconst $years = useRef<HTMLDivElement>(null);\n\n\tconst handleOperateMonth = (next: boolean) => {\n\t\tsetMonth((m) => m[next ? \"add\" : \"subtract\"](1, \"month\"));\n\t};\n\n\tconst handleChangeDate = (date: Dayjs) => {\n\t\tif (date.isSame(today, \"day\")) return;\n\n\t\tif (!date.isSame(month, \"month\")) {\n\t\t\tsetMonth(date);\n\t\t}\n\n\t\tsetToday(date);\n\t\tonDateClick?.(date);\n\t};\n\n\tconst handleChangeMonth = (month: number) => {\n\t\tsetMonth((m) => m.year(selectedYear.year()).month(month - 1));\n\t\tsetSelectable(false);\n\t};\n\n\tconst getMoreYears = throttle({ interval: 100 }, (e) => {\n\t\tconst isUp = e.deltaY < 0;\n\n\t\tsetYears((ys) => ys.map((y) => y + (isUp ? -1 : 1)));\n\t});\n\n\tuseEffect(() => {\n\t\tif (!selectable) return;\n\n\t\tsetSelectedYear(month);\n\t\tconst y = month.year();\n\t\tconst nextYears = Array.from({ length: 7 }).map((_, i) => y - 3 + i);\n\n\t\tsetYears([...nextYears]);\n\t}, [selectable, month]);\n\n\tuseEffect(() => {\n\t\tsetToday(value);\n\t\tsetMonth(value || dayjs());\n\t}, [value]);\n\n\treturn (\n\t\t<div className='i-datepicker'>\n\t\t\t<div className='i-datepicker-units'>\n\t\t\t\t<YearMonth\n\t\t\t\t\tvalue={month}\n\t\t\t\t\tunitYear={unitYear}\n\t\t\t\t\tunitMonth={unitMonth}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tonClick={() => setSelectable(true)}\n\t\t\t\t/>\n\t\t\t\t<a\n\t\t\t\t\tclassName='ml-auto i-datepicker-action'\n\t\t\t\t\tdata-ripple\n\t\t\t\t\tonClick={() => handleOperateMonth(false)}\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={<KeyboardArrowLeftRound />} />\n\t\t\t\t</a>\n\t\t\t\t<a\n\t\t\t\t\tclassName='i-datepicker-action'\n\t\t\t\t\tdata-ripple\n\t\t\t\t\tonClick={() => handleOperateMonth(true)}\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={<KeyboardArrowRightRound />} />\n\t\t\t\t</a>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-datepicker-ym\", {\n\t\t\t\t\t\"i-datepicker-active\": selectable,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<Helpericon\n\t\t\t\t\tactive\n\t\t\t\t\tclassName='i-datepicker-close'\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\tsetSelectable(false);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t\t<div\n\t\t\t\t\tref={$years}\n\t\t\t\t\tclassName='i-datepicker-years'\n\t\t\t\t\tonWheel={getMoreYears}\n\t\t\t\t>\n\t\t\t\t\t{years.map((y) => (\n\t\t\t\t\t\t<a\n\t\t\t\t\t\t\tkey={y}\n\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-year\", {\n\t\t\t\t\t\t\t\t\"i-datepicker-active\":\n\t\t\t\t\t\t\t\t\ty === selectedYear.year(),\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => setSelectedYear((sy) => sy.year(y))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderYear(y)}\n\t\t\t\t\t\t</a>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\n\t\t\t\t<div className='i-datepicker-months'>\n\t\t\t\t\t{MONTHS.map((m) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tkey={m}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-month\", {\n\t\t\t\t\t\t\t\t\t\"i-datepicker-active\":\n\t\t\t\t\t\t\t\t\t\tm === month.month() + 1,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => handleChangeMonth(m)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderMonth(m)}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Dates\n\t\t\t\tvalue={today}\n\t\t\t\tmonth={month}\n\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\tonDateClick={handleChangeDate}\n\t\t\t\trenderDate={renderDate}\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport default Panel;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"panel.js","sources":["../../../../../packages/components/picker/dates/panel.tsx"],"sourcesContent":["import {\n\tKeyboardArrowLeftRound,\n\tKeyboardArrowRightRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport dayjs, { Dayjs } from \"dayjs\";\nimport { throttle } from \"radash\";\nimport { ReactNode, useEffect, useRef, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Helpericon from \"../../utils/helpericon\";\nimport { IBaseDates } from \"../type\";\nimport Dates from \"./dates\";\n\nconst MONTHS = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];\n\nconst YearMonth = (\n\tprops: IBaseDates & {\n\t\tonClick?: () => void;\n\t}\n) => {\n\tconst {\n\t\tvalue,\n\t\tunitMonth = \"月\",\n\t\tunitYear = \"年\",\n\t\trenderYear,\n\t\trenderMonth,\n\t\tonClick,\n\t} = props;\n\n\treturn (\n\t\t<a className='i-datepicker-action' data-ripple onClick={onClick}>\n\t\t\t<span>{renderYear?.(value.year())}</span>\n\t\t\t{unitYear}\n\t\t\t<span>{renderMonth?.(value.month() + 1)}</span>\n\t\t\t{unitMonth}\n\t\t</a>\n\t);\n};\n\nconst Panel = (props: IBaseDates & {\n\tmonth?: Dayjs;\n\trangeEnd?: Dayjs | null;\n\thoverDate?: Dayjs | null;\n\tonDateHover?: (date: Dayjs | null) => void;\n\tonOperateMonth?: (next: boolean) => void;\n}) => {\n\tconst {\n\t\tvalue,\n\t\tmonth: controlledMonth,\n\t\trangeEnd,\n\t\thoverDate,\n\t\tonDateHover,\n\t\tonOperateMonth: onOperateMonthProp,\n\t\tunitYear,\n\t\tunitMonth,\n\t\trenderDate,\n\t\trenderMonth = (m: ReactNode) => m,\n\t\trenderYear = (y: ReactNode) => y,\n\t\tdisabledDate,\n\t\tonDateClick,\n\t} = props;\n\n\tconst [today, setToday] = useState(value);\n\tconst [month, setMonth] = useState(controlledMonth || value || dayjs());\n\tconst [selectedYear, setSelectedYear] = useState(dayjs());\n\tconst [years, setYears] = useState<number[]>([]);\n\tconst [selectable, setSelectable] = useState(false);\n\n\tconst $years = useRef<HTMLDivElement>(null);\n\n\tconst handleOperateMonth = onOperateMonthProp || ((next: boolean) => {\n\t\tsetMonth((m) => m[next ? \"add\" : \"subtract\"](1, \"month\"));\n\t});\n\n\tconst handleChangeDate = (date: Dayjs) => {\n\t\tif (date.isSame(today, \"day\")) return;\n\n\t\tif (controlledMonth === undefined && !date.isSame(month, \"month\")) {\n\t\t\tsetMonth(date);\n\t\t}\n\n\t\tsetToday(date);\n\t\tonDateClick?.(date);\n\t};\n\n\tconst handleChangeMonth = (month: number) => {\n\t\tsetMonth((m) => m.year(selectedYear.year()).month(month - 1));\n\t\tsetSelectable(false);\n\t};\n\n\tconst getMoreYears = throttle({ interval: 100 }, (e) => {\n\t\tconst isUp = e.deltaY < 0;\n\n\t\tsetYears((ys) => ys.map((y) => y + (isUp ? -1 : 1)));\n\t});\n\n\tuseEffect(() => {\n\t\tif (!selectable) return;\n\n\t\tsetSelectedYear(month);\n\t\tconst y = month.year();\n\t\tconst nextYears = Array.from({ length: 7 }).map((_, i) => y - 3 + i);\n\n\t\tsetYears([...nextYears]);\n\t}, [selectable, month]);\n\n\tuseEffect(() => {\n\t\tsetToday(value);\n\t\tif (controlledMonth === undefined) {\n\t\t\tsetMonth(value || dayjs());\n\t\t}\n\t}, [value, controlledMonth]);\n\n\tuseEffect(() => {\n\t\tconst el = $years.current;\n\t\tif (!el) return;\n\n\t\tconst onWheel = (e: WheelEvent) => {\n\t\t\te.preventDefault();\n\t\t\tgetMoreYears(e);\n\t\t};\n\n\t\tel.addEventListener(\"wheel\", onWheel, { passive: false });\n\n\t\treturn () => el.removeEventListener(\"wheel\", onWheel);\n\t}, []);\n\n\treturn (\n\t\t<div className='i-datepicker'>\n\t\t\t<div className='i-datepicker-units'>\n\t\t\t\t<YearMonth\n\t\t\t\t\tvalue={month}\n\t\t\t\t\tunitYear={unitYear}\n\t\t\t\t\tunitMonth={unitMonth}\n\t\t\t\t\trenderMonth={renderMonth}\n\t\t\t\t\trenderYear={renderYear}\n\t\t\t\t\tonClick={() => setSelectable(true)}\n\t\t\t\t/>\n\t\t\t\t<a\n\t\t\t\t\tclassName='ml-auto i-datepicker-action'\n\t\t\t\t\tdata-ripple\n\t\t\t\t\tonClick={() => handleOperateMonth(false)}\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={<KeyboardArrowLeftRound />} />\n\t\t\t\t</a>\n\t\t\t\t<a\n\t\t\t\t\tclassName='i-datepicker-action'\n\t\t\t\t\tdata-ripple\n\t\t\t\t\tonClick={() => handleOperateMonth(true)}\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={<KeyboardArrowRightRound />} />\n\t\t\t\t</a>\n\t\t\t</div>\n\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-datepicker-ym\", {\n\t\t\t\t\t\"i-datepicker-active\": selectable,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<Helpericon\n\t\t\t\t\tactive\n\t\t\t\t\tclassName='i-datepicker-close'\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\tsetSelectable(false);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\n\t\t\t\t<div\n\t\t\t\t\tref={$years}\n\t\t\t\t\tclassName='i-datepicker-years'\n\t\t\t\t>\n\t\t\t\t\t{years.map((y) => (\n\t\t\t\t\t\t<a\n\t\t\t\t\t\t\tkey={y}\n\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-year\", {\n\t\t\t\t\t\t\t\t\"i-datepicker-active\":\n\t\t\t\t\t\t\t\t\ty === selectedYear.year(),\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tonClick={() => setSelectedYear((sy) => sy.year(y))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderYear(y)}\n\t\t\t\t\t\t</a>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\n\t\t\t\t<div className='i-datepicker-months'>\n\t\t\t\t\t{MONTHS.map((m) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\tkey={m}\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-datepicker-month\", {\n\t\t\t\t\t\t\t\t\t\"i-datepicker-active\":\n\t\t\t\t\t\t\t\t\t\tm === month.month() + 1,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\tonClick={() => handleChangeMonth(m)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderMonth(m)}\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Dates\n\t\t\t\tvalue={today}\n\t\t\t\tmonth={month}\n\t\t\t\trangeEnd={rangeEnd}\n\t\t\t\thoverDate={hoverDate}\n\t\t\t\tonDateHover={onDateHover}\n\t\t\t\tdisabledDate={disabledDate}\n\t\t\t\tonDateClick={handleChangeDate}\n\t\t\t\trenderDate={renderDate}\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport default Panel;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
@@ -9,7 +9,7 @@ import Panel from './panel.js';
9
9
 
10
10
  const FORMAT = "hh:mm:ss";
11
11
  function TimePicker(props) {
12
- const { name, value, format = FORMAT, periods, placeholder = props.format ?? FORMAT, className, renderItem, onChange, onBlur, popupProps, ...restProps } = props;
12
+ const { name, value, format = FORMAT, periods, placeholder = props.format ?? FORMAT, className, renderItem, onChange, onBlur, popupProps, clear, onClear: onClearProp, ...restProps } = props;
13
13
  const [timeValue, setTimeValue] = useState(value);
14
14
  const [safeValue, setSafeValue] = useState(undefined);
15
15
  const [active, setActive] = useState(false);
@@ -33,10 +33,14 @@ function TimePicker(props) {
33
33
  popupProps?.onVisibleChange?.(v);
34
34
  setActive(v);
35
35
  };
36
+ const handleClear = () => {
37
+ setActive(false);
38
+ onClearProp?.();
39
+ };
36
40
  useEffect(() => {
37
41
  setTimeValue(value);
38
42
  }, [value]);
39
- return (jsx(Popup, { visible: active, trigger: 'click', position: 'bottom', arrow: false, align: 'start', ...popupProps, onVisibleChange: handleVisibleChange, content: jsx(Panel, { value: timeValue, format: format, periods: periods, renderItem: renderItem, onChange: handleChange, onFallback: handleFallback }), children: jsx(Input, { value: timeValue, placeholder: placeholder, append: jsx(Icon, { icon: jsx(AccessTimeRound, {}), className: 'i-timepicker-icon', size: '1em' }), onChange: handleChange, onBlur: handleBlur, className: classNames("i-timepicker-label", className), ...restProps }) }));
43
+ return (jsx(Popup, { visible: active, trigger: 'click', position: 'bottom', arrow: false, align: 'start', ...popupProps, onVisibleChange: handleVisibleChange, content: jsx(Panel, { value: timeValue, format: format, periods: periods, renderItem: renderItem, onChange: handleChange, onFallback: handleFallback }), children: jsx(Input, { value: timeValue, placeholder: placeholder, append: jsx(Icon, { icon: jsx(AccessTimeRound, {}), className: 'i-timepicker-icon', size: '1em' }), clear: clear, onClear: handleClear, onChange: handleChange, onBlur: handleBlur, className: classNames("i-timepicker-label", className), ...restProps }) }));
40
44
  }
41
45
 
42
46
  export { TimePicker as default };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../packages/components/picker/time/index.tsx"],"sourcesContent":["import { AccessTimeRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { useEffect, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Input from \"../../input\";\nimport Popup from \"../../popup\";\nimport { ITimePicker } from \"../type\";\nimport Panel from \"./panel\";\n\nconst FORMAT = \"hh:mm:ss\";\n\nexport default function TimePicker(props: ITimePicker) {\n\tconst {\n\t\tname,\n\t\tvalue,\n\t\tformat = FORMAT,\n\t\tperiods,\n\t\tplaceholder = props.format ?? FORMAT,\n\t\tclassName,\n\t\trenderItem,\n\t\tonChange,\n\t\tonBlur,\n\t\tpopupProps,\n\t\t...restProps\n\t} = props;\n\tconst [timeValue, setTimeValue] = useState(value);\n\tconst [safeValue, setSafeValue] = useState(undefined);\n\tconst [active, setActive] = useState<boolean>(false);\n\n\tconst handleChange = (v) => {\n\t\tsetTimeValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst handleFallback = (v) => {\n\t\tsetSafeValue(v);\n\t};\n\n\tconst handleValidTime = () => {\n\t\tif (!timeValue) return;\n\n\t\tsetTimeValue(safeValue);\n\t};\n\n\tconst handleBlur = (e) => {\n\t\tonBlur?.(e);\n\t\thandleValidTime();\n\t};\n\n\tconst handleVisibleChange = (v) => {\n\t\tpopupProps?.onVisibleChange?.(v);\n\t\tsetActive(v);\n\t};\n\n\tuseEffect(() => {\n\t\tsetTimeValue(value);\n\t}, [value]);\n\n\treturn (\n\t\t<Popup\n\t\t\tvisible={active}\n\t\t\ttrigger='click'\n\t\t\tposition='bottom'\n\t\t\tarrow={false}\n\t\t\talign='start'\n\t\t\t{...popupProps}\n\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\tcontent={\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={timeValue}\n\t\t\t\t\tformat={format}\n\t\t\t\t\tperiods={periods}\n\t\t\t\t\trenderItem={renderItem}\n\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\tonFallback={handleFallback}\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<Input\n\t\t\t\tvalue={timeValue}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tappend={\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={<AccessTimeRound />}\n\t\t\t\t\t\tclassName='i-timepicker-icon'\n\t\t\t\t\t\tsize='1em'\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tclassName={classNames(\"i-timepicker-label\", className)}\n\t\t\t\t{...restProps}\n\t\t\t/>\n\t\t</Popup>\n\t);\n}\n"],"names":["_jsx"],"mappings":";;;;;;;;;AASA,MAAM,MAAM,GAAG,UAAU;AAEX,SAAU,UAAU,CAAC,KAAkB,EAAA;AACpD,IAAA,MAAM,EACL,IAAI,EACJ,KAAK,EACL,MAAM,GAAG,MAAM,EACf,OAAO,EACP,WAAW,GAAG,KAAK,CAAC,MAAM,IAAI,MAAM,EACpC,SAAS,EACT,UAAU,EACV,QAAQ,EACR,MAAM,EACN,UAAU,EACV,GAAG,SAAS,EACZ,GAAG,KAAK;IACT,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACjD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC;IACrD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC;AAEpD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAC,KAAI;QAC1B,YAAY,CAAC,CAAC,CAAC;AACf,QAAA,QAAQ,GAAG,CAAC,CAAC;AACd,IAAA,CAAC;AAED,IAAA,MAAM,cAAc,GAAG,CAAC,CAAC,KAAI;QAC5B,YAAY,CAAC,CAAC,CAAC;AAChB,IAAA,CAAC;IAED,MAAM,eAAe,GAAG,MAAK;AAC5B,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,YAAY,CAAC,SAAS,CAAC;AACxB,IAAA,CAAC;AAED,IAAA,MAAM,UAAU,GAAG,CAAC,CAAC,KAAI;AACxB,QAAA,MAAM,GAAG,CAAC,CAAC;AACX,QAAA,eAAe,EAAE;AAClB,IAAA,CAAC;AAED,IAAA,MAAM,mBAAmB,GAAG,CAAC,CAAC,KAAI;AACjC,QAAA,UAAU,EAAE,eAAe,GAAG,CAAC,CAAC;QAChC,SAAS,CAAC,CAAC,CAAC;AACb,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,YAAY,CAAC,KAAK,CAAC;AACpB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,QACCA,GAAA,CAAC,KAAK,EAAA,EACL,OAAO,EAAE,MAAM,EACf,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAC,OAAO,EAAA,GACT,UAAU,EACd,eAAe,EAAE,mBAAmB,EACpC,OAAO,EACNA,GAAA,CAAC,KAAK,IACL,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE,cAAc,EAAA,CACzB,EAAA,QAAA,EAGHA,GAAA,CAAC,KAAK,EAAA,EACL,KAAK,EAAE,SAAS,EAChB,WAAW,EAAE,WAAW,EACxB,MAAM,EACLA,GAAA,CAAC,IAAI,EAAA,EACJ,IAAI,EAAEA,GAAA,CAAC,eAAe,EAAA,EAAA,CAAG,EACzB,SAAS,EAAC,mBAAmB,EAC7B,IAAI,EAAC,KAAK,EAAA,CACT,EAEH,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,SAAS,CAAC,EAAA,GAClD,SAAS,EAAA,CACZ,EAAA,CACK;AAEV;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../../../../packages/components/picker/time/index.tsx"],"sourcesContent":["import { AccessTimeRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { useEffect, useState } from \"react\";\nimport Icon from \"../../icon\";\nimport Input from \"../../input\";\nimport Popup from \"../../popup\";\nimport { ITimePicker } from \"../type\";\nimport Panel from \"./panel\";\n\nconst FORMAT = \"hh:mm:ss\";\n\nexport default function TimePicker(props: ITimePicker) {\n\tconst {\n\t\tname,\n\t\tvalue,\n\t\tformat = FORMAT,\n\t\tperiods,\n\t\tplaceholder = props.format ?? FORMAT,\n\t\tclassName,\n\t\trenderItem,\n\t\tonChange,\n\t\tonBlur,\n\t\tpopupProps,\n\t\tclear,\n\t\tonClear: onClearProp,\n\t\t...restProps\n\t} = props;\n\tconst [timeValue, setTimeValue] = useState(value);\n\tconst [safeValue, setSafeValue] = useState(undefined);\n\tconst [active, setActive] = useState<boolean>(false);\n\n\n\tconst handleChange = (v) => {\n\t\tsetTimeValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst handleFallback = (v) => {\n\t\tsetSafeValue(v);\n\t};\n\n\tconst handleValidTime = () => {\n\t\tif (!timeValue) return;\n\n\t\tsetTimeValue(safeValue);\n\t};\n\n\tconst handleBlur = (e) => {\n\t\tonBlur?.(e);\n\t\thandleValidTime();\n\t};\n\n\tconst handleVisibleChange = (v) => {\n\t\tpopupProps?.onVisibleChange?.(v);\n\t\tsetActive(v);\n\t};\n\n\tconst handleClear = () => {\n\t\tsetActive(false);\n\t\tonClearProp?.();\n\t};\n\n\tuseEffect(() => {\n\t\tsetTimeValue(value);\n\t}, [value]);\n\n\treturn (\n\t\t<Popup\n\t\t\tvisible={active}\n\t\t\ttrigger='click'\n\t\t\tposition='bottom'\n\t\t\tarrow={false}\n\t\t\talign='start'\n\t\t\t{...popupProps}\n\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\tcontent={\n\t\t\t\t<Panel\n\t\t\t\t\tvalue={timeValue}\n\t\t\t\t\tformat={format}\n\t\t\t\t\tperiods={periods}\n\t\t\t\t\trenderItem={renderItem}\n\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\tonFallback={handleFallback}\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<Input\n\t\t\t\tvalue={timeValue}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tappend={\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={<AccessTimeRound />}\n\t\t\t\t\t\tclassName='i-timepicker-icon'\n\t\t\t\t\t\tsize='1em'\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\tclear={clear}\n\t\t\t\tonClear={handleClear}\n\t\t\t\tonChange={handleChange}\n\t\t\t\tonBlur={handleBlur}\n\t\t\t\tclassName={classNames(\"i-timepicker-label\", className)}\n\t\t\t\t{...restProps}\n\t\t\t/>\n\t\t</Popup>\n\t);\n}\n"],"names":["_jsx"],"mappings":";;;;;;;;;AASA,MAAM,MAAM,GAAG,UAAU;AAEX,SAAU,UAAU,CAAC,KAAkB,EAAA;AACpD,IAAA,MAAM,EACL,IAAI,EACJ,KAAK,EACL,MAAM,GAAG,MAAM,EACf,OAAO,EACP,WAAW,GAAG,KAAK,CAAC,MAAM,IAAI,MAAM,EACpC,SAAS,EACT,UAAU,EACV,QAAQ,EACR,MAAM,EACN,UAAU,EACV,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,GAAG,SAAS,EACZ,GAAG,KAAK;IACT,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACjD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC;IACrD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC;AAGpD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAC,KAAI;QAC1B,YAAY,CAAC,CAAC,CAAC;AACf,QAAA,QAAQ,GAAG,CAAC,CAAC;AACd,IAAA,CAAC;AAED,IAAA,MAAM,cAAc,GAAG,CAAC,CAAC,KAAI;QAC5B,YAAY,CAAC,CAAC,CAAC;AAChB,IAAA,CAAC;IAED,MAAM,eAAe,GAAG,MAAK;AAC5B,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,YAAY,CAAC,SAAS,CAAC;AACxB,IAAA,CAAC;AAED,IAAA,MAAM,UAAU,GAAG,CAAC,CAAC,KAAI;AACxB,QAAA,MAAM,GAAG,CAAC,CAAC;AACX,QAAA,eAAe,EAAE;AAClB,IAAA,CAAC;AAED,IAAA,MAAM,mBAAmB,GAAG,CAAC,CAAC,KAAI;AACjC,QAAA,UAAU,EAAE,eAAe,GAAG,CAAC,CAAC;QAChC,SAAS,CAAC,CAAC,CAAC;AACb,IAAA,CAAC;IAED,MAAM,WAAW,GAAG,MAAK;QACxB,SAAS,CAAC,KAAK,CAAC;QAChB,WAAW,IAAI;AAChB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,YAAY,CAAC,KAAK,CAAC;AACpB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,QACCA,GAAA,CAAC,KAAK,EAAA,EACL,OAAO,EAAE,MAAM,EACf,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAC,OAAO,EAAA,GACT,UAAU,EACd,eAAe,EAAE,mBAAmB,EACpC,OAAO,EACNA,GAAA,CAAC,KAAK,EAAA,EACL,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE,cAAc,EAAA,CACzB,EAAA,QAAA,EAGHA,IAAC,KAAK,EAAA,EACL,KAAK,EAAE,SAAS,EAChB,WAAW,EAAE,WAAW,EACxB,MAAM,EACLA,GAAA,CAAC,IAAI,EAAA,EACJ,IAAI,EAAEA,GAAA,CAAC,eAAe,EAAA,EAAA,CAAG,EACzB,SAAS,EAAC,mBAAmB,EAC7B,IAAI,EAAC,KAAK,EAAA,CACT,EAEH,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,SAAS,CAAC,EAAA,GAClD,SAAS,EAAA,CACZ,EAAA,CACK;AAEV;;;;"}
@@ -1,9 +1,7 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { InfoOutlined } from '@ricons/material';
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
2
  import { useReactive } from '../../js/hooks.js';
4
3
  import Button from '../button/button.js';
5
4
  import Flex from '../flex/flex.js';
6
- import Icon from '../icon/icon.js';
7
5
  import Popup from '../popup/popup.js';
8
6
 
9
7
  const defaultOk = {
@@ -14,7 +12,7 @@ const defaultCancel = {
14
12
  flat: true,
15
13
  };
16
14
  const Popconfirm = (props) => {
17
- const { trigger = "click", visible, icon = jsx(Icon, { icon: jsx(InfoOutlined, {}), className: "error", size: "1.2em" }), content, okButtonProps, cancelButtonProps, children, align, position = "top", offset = 12, extra, onOk, onClose, ...restProps } = props;
15
+ const { trigger = "click", visible, icon, content, okButtonProps, cancelButtonProps, children, align, position = "top", offset = 12, extra, onOk, onClose, ...restProps } = props;
18
16
  const state = useReactive({
19
17
  loading: false,
20
18
  visible,
@@ -1 +1 @@
1
- {"version":3,"file":"popconfirm.js","sources":["../../../../packages/components/popconfirm/popconfirm.tsx"],"sourcesContent":["import { InfoOutlined } from \"@ricons/material\";\nimport { MouseEvent } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport Button from \"../button\";\nimport { IButton } from \"../button/type\";\nimport Flex from \"../flex\";\nimport Icon from \"../icon\";\nimport Popup from \"../popup\";\nimport \"./index.css\";\nimport { IPopconfirm } from \"./type\";\n\nconst defaultOk = {\n children: \"确定\",\n};\n\nconst defaultCancel = {\n children: \"取消\",\n flat: true,\n};\n\nconst Popconfirm = (props: IPopconfirm) => {\n const {\n trigger = \"click\",\n visible,\n icon = <Icon icon={<InfoOutlined />} className=\"error\" size=\"1.2em\" />,\n content,\n okButtonProps,\n cancelButtonProps,\n children,\n align,\n position = \"top\",\n offset = 12,\n extra,\n onOk,\n onClose,\n ...restProps\n } = props;\n\n const state = useReactive({\n loading: false,\n visible,\n });\n\n const ok: IButton = okButtonProps\n ? Object.assign({}, defaultOk, okButtonProps)\n : defaultOk;\n const cancel: IButton = cancelButtonProps\n ? Object.assign({}, defaultCancel, cancelButtonProps)\n : defaultCancel;\n\n const handleVisibleChange = (v: boolean) => {\n state.visible = v;\n restProps.onVisibleChange?.(v);\n };\n\n const handleOk = async (e: MouseEvent<HTMLElement>) => {\n state.loading = true;\n ok.onClick?.(e);\n try {\n await onOk?.();\n state.visible = false;\n } finally {\n state.loading = false;\n }\n };\n\n const handleCancel = async (e: MouseEvent<HTMLElement>) => {\n cancel.onClick?.(e);\n await onClose?.();\n state.visible = false;\n };\n\n const popconfirmContent = (\n <div className=\"i-popconfirm\">\n <Flex gap=\".5em\">\n {icon}\n <div className=\"i-popconfirm-content\">{content}</div>\n </Flex>\n\n <Flex gap={12} justify=\"flex-end\" className=\"i-popconfirm-footer\">\n {cancelButtonProps !== null && (\n <Button {...cancel} onClick={handleCancel} />\n )}\n {extra}\n {okButtonProps !== null && (\n <Button\n loading={state.loading}\n {...ok}\n onClick={handleOk}\n />\n )}\n </Flex>\n </div>\n );\n\n return (\n <Popup\n content={popconfirmContent}\n {...restProps}\n trigger={trigger}\n visible={state.visible}\n align={align}\n offset={offset}\n position={position}\n onVisibleChange={handleVisibleChange}\n >\n {children}\n </Popup>\n );\n};\n\nexport default Popconfirm;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"popconfirm.js","sources":["../../../../packages/components/popconfirm/popconfirm.tsx"],"sourcesContent":["import { MouseEvent } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport Button from \"../button\";\nimport { IButton } from \"../button/type\";\nimport Flex from \"../flex\";\nimport Popup from \"../popup\";\nimport \"./index.css\";\nimport { IPopconfirm } from \"./type\";\n\nconst defaultOk = {\n children: \"确定\",\n};\n\nconst defaultCancel = {\n children: \"取消\",\n flat: true,\n};\n\nconst Popconfirm = (props: IPopconfirm) => {\n const {\n trigger = \"click\",\n visible,\n icon,\n content,\n okButtonProps,\n cancelButtonProps,\n children,\n align,\n position = \"top\",\n offset = 12,\n extra,\n onOk,\n onClose,\n ...restProps\n } = props;\n\n const state = useReactive({\n loading: false,\n visible,\n });\n\n const ok: IButton = okButtonProps\n ? Object.assign({}, defaultOk, okButtonProps)\n : defaultOk;\n const cancel: IButton = cancelButtonProps\n ? Object.assign({}, defaultCancel, cancelButtonProps)\n : defaultCancel;\n\n const handleVisibleChange = (v: boolean) => {\n state.visible = v;\n restProps.onVisibleChange?.(v);\n };\n\n const handleOk = async (e: MouseEvent<HTMLElement>) => {\n state.loading = true;\n ok.onClick?.(e);\n try {\n await onOk?.();\n state.visible = false;\n } finally {\n state.loading = false;\n }\n };\n\n const handleCancel = async (e: MouseEvent<HTMLElement>) => {\n cancel.onClick?.(e);\n await onClose?.();\n state.visible = false;\n };\n\n const popconfirmContent = (\n <div className=\"i-popconfirm\">\n <Flex gap=\".5em\">\n {icon}\n <div className=\"i-popconfirm-content\">{content}</div>\n </Flex>\n\n <Flex gap={12} justify=\"flex-end\" className=\"i-popconfirm-footer\">\n {cancelButtonProps !== null && (\n <Button {...cancel} onClick={handleCancel} />\n )}\n {extra}\n {okButtonProps !== null && (\n <Button\n loading={state.loading}\n {...ok}\n onClick={handleOk}\n />\n )}\n </Flex>\n </div>\n );\n\n return (\n <Popup\n content={popconfirmContent}\n {...restProps}\n trigger={trigger}\n visible={state.visible}\n align={align}\n offset={offset}\n position={position}\n onVisibleChange={handleVisibleChange}\n >\n {children}\n </Popup>\n );\n};\n\nexport default Popconfirm;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
package/lib/es/index.js CHANGED
@@ -16,12 +16,13 @@ export { default as Image } from './components/image/image.js';
16
16
  export { default as Input } from './components/input/input.js';
17
17
  export { default as List } from './components/list/list.js';
18
18
  export { default as Loading } from './components/loading/loading.js';
19
- export { default as Message } from './components/message/message.js';
19
+ export { default as Message } from './components/message/index.js';
20
20
  export { default as Modal } from './components/modal/modal.js';
21
21
  export { default as Pagination } from './components/pagination/pagination.js';
22
22
  export { default as ColorPicker } from './components/picker/colors/index.js';
23
23
  export { default as DatePicker } from './components/picker/dates/index.js';
24
24
  export { default as TimePicker } from './components/picker/time/index.js';
25
+ export { default as DateRange } from './components/picker/daterange/daterange.js';
25
26
  export { default as Popconfirm } from './components/popconfirm/popconfirm.js';
26
27
  export { default as Popup } from './components/popup/popup.js';
27
28
  export { default as Progress } from './components/progress/progress.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}