@grandbazar/ui-baza 1.2.10 → 1.2.11

package/dist/index.cjs

@@ -1321,6 +1321,19 @@ function getCalendarGrid(month, year, firstDayOfWeek) {
   );
 }
 
+function normalizeDateRange(firstDate, secondDate) {
+  if (!firstDate || !secondDate) {
+    return { firstDate, secondDate };
+  }
+  if (firstDate.getTime() <= secondDate.getTime()) {
+    return { firstDate, secondDate };
+  }
+  return {
+    firstDate: secondDate,
+    secondDate: firstDate
+  };
+}
+
 const datePickerField = "_datePickerField_1qk8s_2";
 const datePickerFieldCalendar = "_datePickerFieldCalendar_1qk8s_8";
 const datePickerFieldWeek = "_datePickerFieldWeek_1qk8s_14";
@@ -1426,9 +1439,14 @@ function useDatePickerControls(initialDate = /* @__PURE__ */ new Date()) {
   };
 }
 
-function useDatePickerMultiSelect(firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru) {
-  const [firstSelectedDate, setFirstSelectedDate] = React.useState(null);
-  const [secondSelectedDate, setSecondSelectedDate] = React.useState(null);
+function useDatePickerMultiSelect({
+  firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru,
+  initialFirstSelectedDate = null,
+  initialSecondSelectedDate = null
+} = {}) {
+  const normalizedRange = normalizeDateRange(initialFirstSelectedDate, initialSecondSelectedDate);
+  const [firstSelectedDate, setFirstSelectedDate] = React.useState(normalizedRange.firstDate);
+  const [secondSelectedDate, setSecondSelectedDate] = React.useState(normalizedRange.secondDate);
   const lastDayOfWeek = (firstDayOfWeek + 6) % 7;
   const dayInfoCache = React.useMemo(() => /* @__PURE__ */ new Map(), []);
   const getDayInfo = React.useCallback(
@@ -1544,8 +1562,8 @@ function useDatePickerMultiSelect(firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru)
   return { firstSelectedDate, secondSelectedDate, setFirstSelectedDate, setSecondSelectedDate, getCellProps };
 }
 
-function useDatePickerSelect() {
-  const [selectedDate, setSelectedDate] = React.useState(null);
+function useDatePickerSelect({ initialSelectedDate = null } = {}) {
+  const [selectedDate, setSelectedDate] = React.useState(initialSelectedDate);
   const getCellProps = React.useCallback(
     (day) => {
       return {

package/dist/index.d.ts

@@ -880,6 +880,16 @@ declare type TTooltipRootProps = Omit<React.ComponentProps<typeof TooltipContent
     centerArrowToTrigger?: boolean;
 };
 
+declare type TUseDatePickerMultiSelectOptions = {
+    firstDayOfWeek?: number;
+    initialFirstSelectedDate?: Date | null;
+    initialSecondSelectedDate?: Date | null;
+};
+
+declare type TUseDatePickerSelectOptions = {
+    initialSelectedDate?: Date | null;
+};
+
 declare type TWithRef<TProps, TElement = HTMLElement> = TProps & {
     ref?: React.Ref<TElement>;
 };
@@ -904,10 +914,13 @@ export declare function useDatePickerControls(initialDate?: Date): {
  * Manages date range selection state for DatePicker.
  * Handles two-date selection with automatic ordering and visual range styling.
  *
- * @param firstDayOfWeek - First day of the week (0 = Sunday, 1 = Monday, etc.)
+ * @param options - Hook options for range selection
+ * @param options.firstDayOfWeek - First day of the week (0 = Sunday, 1 = Monday, etc.)
+ * @param options.initialFirstSelectedDate - Initial start date for range selection
+ * @param options.initialSecondSelectedDate - Initial end date for range selection
  * @returns Object containing selected dates, setters, and cell props generator with range styling
  */
-export declare function useDatePickerMultiSelect(firstDayOfWeek?: number): {
+export declare function useDatePickerMultiSelect({ firstDayOfWeek, initialFirstSelectedDate, initialSecondSelectedDate, }?: TUseDatePickerMultiSelectOptions): {
     firstSelectedDate: Date | null;
     secondSelectedDate: Date | null;
     setFirstSelectedDate: Dispatch<SetStateAction<Date | null>>;
@@ -919,9 +932,11 @@ export declare function useDatePickerMultiSelect(firstDayOfWeek?: number): {
  * Manages single date selection state for DatePicker.
  * Provides cell props with selection logic and state management.
  *
+ * @param options - Hook options for initial selection state
+ * @param options.initialSelectedDate - Initial selected date
  * @returns Object containing selected date, setter, and cell props generator
  */
-export declare function useDatePickerSelect(): {
+export declare function useDatePickerSelect({ initialSelectedDate }?: TUseDatePickerSelectOptions): {
     selectedDate: Date | null;
     setSelectedDate: Dispatch<SetStateAction<Date | null>>;
     getCellProps: (day: TCalendarDay) => Pick<ComponentProps<typeof DatePickerCell>, "onClick" | "disabled" | "isCurrent" | "state">;

package/dist/index.js

@@ -1317,6 +1317,19 @@ function getCalendarGrid(month, year, firstDayOfWeek) {
   );
 }
 
+function normalizeDateRange(firstDate, secondDate) {
+  if (!firstDate || !secondDate) {
+    return { firstDate, secondDate };
+  }
+  if (firstDate.getTime() <= secondDate.getTime()) {
+    return { firstDate, secondDate };
+  }
+  return {
+    firstDate: secondDate,
+    secondDate: firstDate
+  };
+}
+
 const datePickerField = "_datePickerField_1qk8s_2";
 const datePickerFieldCalendar = "_datePickerFieldCalendar_1qk8s_8";
 const datePickerFieldWeek = "_datePickerFieldWeek_1qk8s_14";
@@ -1422,9 +1435,14 @@ function useDatePickerControls(initialDate = /* @__PURE__ */ new Date()) {
   };
 }
 
-function useDatePickerMultiSelect(firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru) {
-  const [firstSelectedDate, setFirstSelectedDate] = useState(null);
-  const [secondSelectedDate, setSecondSelectedDate] = useState(null);
+function useDatePickerMultiSelect({
+  firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru,
+  initialFirstSelectedDate = null,
+  initialSecondSelectedDate = null
+} = {}) {
+  const normalizedRange = normalizeDateRange(initialFirstSelectedDate, initialSecondSelectedDate);
+  const [firstSelectedDate, setFirstSelectedDate] = useState(normalizedRange.firstDate);
+  const [secondSelectedDate, setSecondSelectedDate] = useState(normalizedRange.secondDate);
   const lastDayOfWeek = (firstDayOfWeek + 6) % 7;
   const dayInfoCache = useMemo(() => /* @__PURE__ */ new Map(), []);
   const getDayInfo = useCallback(
@@ -1540,8 +1558,8 @@ function useDatePickerMultiSelect(firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru)
   return { firstSelectedDate, secondSelectedDate, setFirstSelectedDate, setSecondSelectedDate, getCellProps };
 }
 
-function useDatePickerSelect() {
-  const [selectedDate, setSelectedDate] = useState(null);
+function useDatePickerSelect({ initialSelectedDate = null } = {}) {
+  const [selectedDate, setSelectedDate] = useState(initialSelectedDate);
   const getCellProps = useCallback(
     (day) => {
       return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grandbazar/ui-baza",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "description": "A lightweight and modular UI kit for building modern, accessible web interfaces. Designed for flexibility, scalability, and developer happiness.",
   "repository": {
     "type": "git",