@uxf/ui 11.110.0 → 11.110.1

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 (5) hide show
  1. package/date-range-picker/date-range-picker-decade.js +7 -10
  2. package/date-range-picker/date-range-picker-month.js +5 -8
  3. package/date-range-picker/date-range-picker-year.js +5 -8
  4. package/date-range-picker/date-range-picker.stories.js +4 -0
  5. package/package.json +3 -3
package/date-range-picker/date-range-picker-decade.js CHANGED
@@ -32,9 +32,6 @@ var __importStar = (this && this.__importStar) || (function () {
32
32
  return result;
33
33
  };
34
34
  })();
35
- var __importDefault = (this && this.__importDefault) || function (mod) {
36
- return (mod && mod.__esModule) ? mod : { "default": mod };
37
- };
38
35
  Object.defineProperty(exports, "__esModule", { value: true });
39
36
  exports.DateRangePickerDecade = void 0;
40
37
  const translations_1 = require("@uxf/core-react/translations");
@@ -44,7 +41,7 @@ const date_range_picker_context_1 = require("@uxf/datepicker/contexts/date-range
44
41
  const use_decade_1 = require("@uxf/datepicker/hooks/use-decade");
45
42
  const use_month_1 = require("@uxf/datepicker/hooks/use-month");
46
43
  const use_year_1 = require("@uxf/datepicker/hooks/use-year");
47
- const dayjs_1 = __importDefault(require("dayjs"));
44
+ const date_1 = require("@uxf/localize/src/date");
48
45
  const react_1 = __importStar(require("react"));
49
46
  const calendar_1 = require("../calendar");
50
47
  exports.DateRangePickerDecade = (0, react_1.memo)((props) => {
@@ -58,17 +55,17 @@ exports.DateRangePickerDecade = (0, react_1.memo)((props) => {
58
55
  });
59
56
  const { yearLabel } = (0, use_year_1.useYear)({
60
57
  year: currentYear,
61
- yearLabelFormat: (date) => (0, dayjs_1.default)(date).format("YYYY"),
62
- monthLabelFormat: (date) => (0, dayjs_1.default)(date).format("MMMM"),
58
+ yearLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("YYYY"),
59
+ monthLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("MMMM"),
63
60
  });
64
61
  const { monthLabel } = (0, use_month_1.useMonth)({
65
62
  firstDayOfWeek,
66
63
  month: currentMonth,
67
- monthLabelFormat: (date) => (0, dayjs_1.default)(date).format("MMMM"),
64
+ monthLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("MMMM"),
68
65
  year: currentYear,
69
66
  });
70
- const canGoToPrevDecade = canGoToYear((0, dayjs_1.default)(new Date(currentYear, 0)).subtract(5, "years").toDate());
71
- const canGoToNextDecade = canGoToYear((0, dayjs_1.default)(new Date(currentYear, 0)).add(5, "years").toDate());
67
+ const canGoToPrevDecade = canGoToYear((0, date_1.dayjsTz)(new Date(currentYear, 0)).subtract(5, "years").toDate());
68
+ const canGoToNextDecade = canGoToYear((0, date_1.dayjsTz)(new Date(currentYear, 0)).add(5, "years").toDate());
72
69
  const handleGoToPrevDecadeClick = (0, react_1.useCallback)(() => {
73
70
  if (canGoToPrevDecade) {
74
71
  goToPrevYear(9);
@@ -102,6 +99,6 @@ exports.DateRangePickerDecade = (0, react_1.memo)((props) => {
102
99
  children: yearLabel,
103
100
  isDisabled: true,
104
101
  } }),
105
- react_1.default.createElement("div", { className: "uxf-calendar__decade" }, years.map((year) => (react_1.default.createElement("button", { className: (0, cx_1.cx)("uxf-calendar__cell uxf-calendar__cell-year", !canGoToYear(year.date) && classes_1.CLASSES.IS_DISABLED, (0, dayjs_1.default)(year.date).year() === currentYear && "uxf-calendar__cell-year--current"), key: year.yearLabel, onClick: handleSelectYear(year.date), type: "button" }, year.yearLabel))))));
102
+ react_1.default.createElement("div", { className: "uxf-calendar__decade" }, years.map((year) => (react_1.default.createElement("button", { className: (0, cx_1.cx)("uxf-calendar__cell uxf-calendar__cell-year", !canGoToYear(year.date) && classes_1.CLASSES.IS_DISABLED, (0, date_1.dayjsTz)(year.date).year() === currentYear && "uxf-calendar__cell-year--current"), key: year.yearLabel, onClick: handleSelectYear(year.date), type: "button" }, year.yearLabel))))));
106
103
  });
107
104
  exports.DateRangePickerDecade.displayName = "UxfUiDatePickerDecade";
package/date-range-picker/date-range-picker-month.js CHANGED
@@ -32,16 +32,13 @@ var __importStar = (this && this.__importStar) || (function () {
32
32
  return result;
33
33
  };
34
34
  })();
35
- var __importDefault = (this && this.__importDefault) || function (mod) {
36
- return (mod && mod.__esModule) ? mod : { "default": mod };
37
- };
38
35
  Object.defineProperty(exports, "__esModule", { value: true });
39
36
  exports.DateRangePickerMonth = void 0;
40
37
  const translations_1 = require("@uxf/core-react/translations");
41
38
  const date_range_picker_context_1 = require("@uxf/datepicker/contexts/date-range-picker-context");
42
39
  const use_month_1 = require("@uxf/datepicker/hooks/use-month");
43
40
  const use_year_1 = require("@uxf/datepicker/hooks/use-year");
44
- const dayjs_1 = __importDefault(require("dayjs"));
41
+ const date_1 = require("@uxf/localize/src/date");
45
42
  const react_1 = __importStar(require("react"));
46
43
  const calendar_1 = require("../calendar");
47
44
  exports.DateRangePickerMonth = (0, react_1.memo)((props) => {
@@ -50,16 +47,16 @@ exports.DateRangePickerMonth = (0, react_1.memo)((props) => {
50
47
  const dateRangePickerProps = (0, react_1.useContext)(date_range_picker_context_1.DateRangePickerContext);
51
48
  const { canGoToNextMonth, canGoToPrevMonth, firstDayOfWeek, goToNextMonthsByOneMonth, goToPrevMonthsByOneMonth } = dateRangePickerProps;
52
49
  const { monthLabel } = (0, use_month_1.useMonth)({
53
- dayLabelFormat: (date) => (0, dayjs_1.default)(date).format("D"),
50
+ dayLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("D"),
54
51
  firstDayOfWeek,
55
52
  month: props.month,
56
- monthLabelFormat: (date) => (0, dayjs_1.default)(date).format("MMMM"),
57
- weekdayLabelFormat: (date) => (0, dayjs_1.default)(date).format("dd"),
53
+ monthLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("MMMM"),
54
+ weekdayLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("dd"),
58
55
  year: props.year,
59
56
  });
60
57
  const { yearLabel } = (0, use_year_1.useYear)({
61
58
  year: props.year,
62
- yearLabelFormat: (date) => (0, dayjs_1.default)(date).format("YYYY"),
59
+ yearLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("YYYY"),
63
60
  });
64
61
  const handleGoToPrevMonth = (0, react_1.useCallback)(() => {
65
62
  goToPrevMonthsByOneMonth();
package/date-range-picker/date-range-picker-year.js CHANGED
@@ -32,9 +32,6 @@ var __importStar = (this && this.__importStar) || (function () {
32
32
  return result;
33
33
  };
34
34
  })();
35
- var __importDefault = (this && this.__importDefault) || function (mod) {
36
- return (mod && mod.__esModule) ? mod : { "default": mod };
37
- };
38
35
  Object.defineProperty(exports, "__esModule", { value: true });
39
36
  exports.DateRangePickerYear = void 0;
40
37
  const translations_1 = require("@uxf/core-react/translations");
@@ -43,7 +40,7 @@ const cx_1 = require("@uxf/core/utils/cx");
43
40
  const date_range_picker_context_1 = require("@uxf/datepicker/contexts/date-range-picker-context");
44
41
  const use_month_1 = require("@uxf/datepicker/hooks/use-month");
45
42
  const use_year_1 = require("@uxf/datepicker/hooks/use-year");
46
- const dayjs_1 = __importDefault(require("dayjs"));
43
+ const date_1 = require("@uxf/localize/src/date");
47
44
  const react_1 = __importStar(require("react"));
48
45
  const calendar_1 = require("../calendar");
49
46
  exports.DateRangePickerYear = (0, react_1.memo)((props) => {
@@ -54,13 +51,13 @@ exports.DateRangePickerYear = (0, react_1.memo)((props) => {
54
51
  const currentYear = (_d = (_c = activeMonths.at(0)) === null || _c === void 0 ? void 0 : _c.year) !== null && _d !== void 0 ? _d : new Date().getFullYear();
55
52
  const { months, yearLabel } = (0, use_year_1.useYear)({
56
53
  year: currentYear,
57
- yearLabelFormat: (date) => (0, dayjs_1.default)(date).format("YYYY"),
58
- monthLabelFormat: (date) => (0, dayjs_1.default)(date).format("MMMM"),
54
+ yearLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("YYYY"),
55
+ monthLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("MMMM"),
59
56
  });
60
57
  const { monthLabel } = (0, use_month_1.useMonth)({
61
58
  firstDayOfWeek,
62
59
  month: currentMonth,
63
- monthLabelFormat: (date) => (0, dayjs_1.default)(date).format("MMMM"),
60
+ monthLabelFormat: (date) => (0, date_1.dayjsTz)(date).format("MMMM"),
64
61
  year: currentYear,
65
62
  });
66
63
  const handleGoToNextYear = (0, react_1.useCallback)(() => {
@@ -98,6 +95,6 @@ exports.DateRangePickerYear = (0, react_1.memo)((props) => {
98
95
  onClick: handleYearClick,
99
96
  title: (_k = (_j = props.customButtonTitles) === null || _j === void 0 ? void 0 : _j.selectYear) !== null && _k !== void 0 ? _k : t("uxf-ui-date-range-picker:select-year"),
100
97
  } }),
101
- react_1.default.createElement("div", { className: "uxf-calendar__year" }, months.map((month, index) => (react_1.default.createElement("button", { className: (0, cx_1.cx)("uxf-calendar__cell uxf-calendar__cell-month", !canGoToMonth(month.date) && classes_1.CLASSES.IS_DISABLED, (0, dayjs_1.default)(month.date).month() === currentMonth && "uxf-calendar__cell-month--current"), key: month.monthLabel + index, onClick: handleMonthClick(month.date), type: "button" }, month.monthLabel))))));
98
+ react_1.default.createElement("div", { className: "uxf-calendar__year" }, months.map((month, index) => (react_1.default.createElement("button", { className: (0, cx_1.cx)("uxf-calendar__cell uxf-calendar__cell-month", !canGoToMonth(month.date) && classes_1.CLASSES.IS_DISABLED, (0, date_1.dayjsTz)(month.date).month() === currentMonth && "uxf-calendar__cell-month--current"), key: month.monthLabel + index, onClick: handleMonthClick(month.date), type: "button" }, month.monthLabel))))));
102
99
  });
103
100
  exports.DateRangePickerYear.displayName = "UxfUiDatePickerYear";
package/date-range-picker/date-range-picker.stories.js CHANGED
@@ -54,6 +54,10 @@ function Default() {
54
54
  const [value, setValue] = (0, react_1.useState)(null);
55
55
  const onChange = (0, action_1.action)("onChange", setValue);
56
56
  return (react_1.default.createElement("div", { className: "max-w-screen-sm space-y-4 rounded p-8 dark:text-white" },
57
+ react_1.default.createElement("p", { className: "text-lg" }, "Date range picker raw"),
58
+ react_1.default.createElement(date_range_picker_1.DateRangePicker, { onChange: onChange, onClosePopover: noop_1.noop, selectedDates: value }),
59
+ react_1.default.createElement("p", { className: "text-lg" }, "Date range picker 2.4.2026 - 12.4.2026"),
60
+ react_1.default.createElement(date_range_picker_1.DateRangePicker, { maxDate: new Date("2026-04-12"), minDate: new Date("2026-04-02"), minSelectedDays: 2, onChange: onChange, onClosePopover: noop_1.noop, selectedDates: value }),
57
61
  react_1.default.createElement("p", { className: "text-lg" }, "Date range picker with min max and unavailable dates"),
58
62
  react_1.default.createElement(date_range_picker_1.DateRangePicker, { maxDate: maxDate, minDate: minDate, onChange: onChange, onClosePopover: noop_1.noop, selectedDates: value, unavailableDates: unavailableDates }),
59
63
  react_1.default.createElement("p", { className: "text-lg" }, "Date range picker with min selected days"),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uxf/ui",
3
- "version": "11.110.0",
3
+ "version": "11.110.1",
4
4
  "description": "",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -25,7 +25,7 @@
25
25
  "@headlessui/react": "1.7.19",
26
26
  "@uxf/core": "11.110.0",
27
27
  "@uxf/core-react": "11.110.0",
28
- "@uxf/datepicker": "11.110.0",
28
+ "@uxf/datepicker": "11.110.1",
29
29
  "@uxf/localize": "11.110.0",
30
30
  "@uxf/styles": "11.110.0",
31
31
  "dayjs": "^1.11.19",
@@ -41,7 +41,7 @@
41
41
  "@types/react-dom": "18.3.7",
42
42
  "@uxf/core": "11.110.0",
43
43
  "@uxf/core-react": "11.110.0",
44
- "@uxf/datepicker": "11.110.0",
44
+ "@uxf/datepicker": "11.110.1",
45
45
  "@uxf/localize": "11.110.0",
46
46
  "@uxf/styles": "11.110.0",
47
47
  "dayjs": "^1.11.19",