@proyecto-viviana/solid-stately 0.1.5 → 0.2.1

package/src/calendar/createCalendarState.ts

@@ -1,461 +0,0 @@
-/**
- * CalendarState for Solid-Stately
- *
- * Provides state management for calendar components.
- * Based on @react-stately/calendar useCalendarState
- */
-
-import { createSignal, createMemo, type Accessor } from 'solid-js';
-import {
-  type CalendarDate,
-  type DateValue,
-  today,
-  getLocalTimeZone,
-  isSameDay,
-  isSameMonth,
-  startOfMonth,
-  endOfMonth,
-  startOfWeek,
-  getWeeksInMonth,
-  getDayOfWeek,
-  DateFormatter,
-  toCalendarDate as intlToCalendarDate,
-} from '@internationalized/date';
-import { access, type MaybeAccessor } from '../utils';
-
-// ============================================
-// TYPES
-// ============================================
-
-export type ValidationState = 'valid' | 'invalid';
-
-export interface CalendarStateProps<T extends DateValue = DateValue> {
-  /** The current value (controlled). */
-  value?: MaybeAccessor<T | null>;
-  /** The default value (uncontrolled). */
-  defaultValue?: T | null;
-  /** Handler called when the value changes. */
-  onChange?: (value: T) => void;
-  /** The minimum allowed date. */
-  minValue?: MaybeAccessor<DateValue | undefined>;
-  /** The maximum allowed date. */
-  maxValue?: MaybeAccessor<DateValue | undefined>;
-  /** Whether the calendar is disabled. */
-  isDisabled?: MaybeAccessor<boolean>;
-  /** Whether the calendar is read-only. */
-  isReadOnly?: MaybeAccessor<boolean>;
-  /** Whether dates outside the visible range are automatically focused. */
-  autoFocus?: boolean;
-  /** The date that is focused when the calendar first mounts. */
-  focusedValue?: MaybeAccessor<DateValue | undefined>;
-  /** The default focused date (uncontrolled). */
-  defaultFocusedValue?: DateValue;
-  /** Handler called when the focused date changes. */
-  onFocusChange?: (date: CalendarDate) => void;
-  /** The locale to use for formatting. */
-  locale?: string;
-  /** Callback that is called for each date in the calendar to determine if it is unavailable. */
-  isDateUnavailable?: (date: DateValue) => boolean;
-  /** The number of months to display at once. */
-  visibleMonths?: number;
-  /** Whether to automatically focus the calendar when it is mounted. */
-  autoFocusOnMount?: boolean;
-  /** Controls which days are disabled. */
-  isDateDisabled?: (date: DateValue) => boolean;
-  /** Validation state. */
-  validationState?: MaybeAccessor<ValidationState | undefined>;
-  /** Error message. */
-  errorMessage?: string;
-  /** The first day of the week (0 = Sunday, 1 = Monday, etc.). */
-  firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
-}
-
-export interface CalendarState<T extends DateValue = DateValue> {
-  /** The currently selected date. */
-  value: Accessor<T | null>;
-  /** Sets the selected date. */
-  setValue: (value: T | null) => void;
-  /** The currently focused date. */
-  focusedDate: Accessor<CalendarDate>;
-  /** Sets the focused date. */
-  setFocusedDate: (date: CalendarDate) => void;
-  /** Whether the calendar is disabled. */
-  isDisabled: Accessor<boolean>;
-  /** Whether the calendar is read-only. */
-  isReadOnly: Accessor<boolean>;
-  /** The visible date range (first and last day of visible month(s)). */
-  visibleRange: Accessor<{ start: CalendarDate; end: CalendarDate }>;
-  /** The timezone used for date calculations. */
-  timeZone: string;
-  /** The validation state. */
-  validationState: Accessor<ValidationState | undefined>;
-  /** Whether a date is selected. */
-  isSelected: (date: DateValue) => boolean;
-  /** Whether a date is focused. */
-  isCellFocused: (date: DateValue) => boolean;
-  /** Whether a date is unavailable. */
-  isCellUnavailable: (date: DateValue) => boolean;
-  /** Whether a date is disabled. */
-  isCellDisabled: (date: DateValue) => boolean;
-  /** Whether a date is outside the visible range. */
-  isOutsideVisibleRange: (date: DateValue) => boolean;
-  /** Whether a date is invalid. */
-  isInvalid: (date: DateValue) => boolean;
-  /** Moves focus to the previous page (month). */
-  focusPreviousPage: () => void;
-  /** Moves focus to the next page (month). */
-  focusNextPage: () => void;
-  /** Moves focus to the previous section (year). */
-  focusPreviousSection: () => void;
-  /** Moves focus to the next section (year). */
-  focusNextSection: () => void;
-  /** Moves focus to the previous day. */
-  focusPreviousDay: () => void;
-  /** Moves focus to the next day. */
-  focusNextDay: () => void;
-  /** Moves focus to the previous week. */
-  focusPreviousWeek: () => void;
-  /** Moves focus to the next week. */
-  focusNextWeek: () => void;
-  /** Moves focus to the start of the month. */
-  focusPageStart: () => void;
-  /** Moves focus to the end of the month. */
-  focusPageEnd: () => void;
-  /** Selects the focused date. */
-  selectFocusedDate: () => void;
-  /** Selects a specific date. */
-  selectDate: (date: CalendarDate) => void;
-  /** Whether focus is currently within the calendar. */
-  isFocused: Accessor<boolean>;
-  /** Sets whether focus is within the calendar. */
-  setFocused: (focused: boolean) => void;
-  /** Gets the dates for a week in the visible range. */
-  getDatesInWeek: (weekIndex: number, monthStartDate?: CalendarDate) => (CalendarDate | null)[];
-  /** Gets the number of weeks in a month. */
-  getWeeksInMonth: (date?: CalendarDate) => number;
-  /** The week day headers. */
-  weekDays: Accessor<string[]>;
-  /** The title for the calendar (formatted month and year). */
-  title: Accessor<string>;
-  /** The number of visible months. */
-  visibleMonths: number;
-  /** Whether the calendar is paginating (for animations). */
-  isPaginating: Accessor<boolean>;
-}
-
-// ============================================
-// IMPLEMENTATION
-// ============================================
-
-/**
- * Provides state management for a calendar component.
- */
-export function createCalendarState<T extends DateValue = CalendarDate>(
-  props: CalendarStateProps<T> = {}
-): CalendarState<T> {
-  const timeZone = getLocalTimeZone();
-  const locale = props.locale ?? 'en-US';
-  const visibleMonths = props.visibleMonths ?? 1;
-
-  // Determine the initially focused date
-  const getInitialFocusedDate = (): CalendarDate => {
-    const controlledFocused = access(props.focusedValue);
-    if (controlledFocused) {
-      return toCalendarDate(controlledFocused);
-    }
-    if (props.defaultFocusedValue) {
-      return toCalendarDate(props.defaultFocusedValue);
-    }
-    const controlledValue = access(props.value);
-    if (controlledValue) {
-      return toCalendarDate(controlledValue);
-    }
-    if (props.defaultValue) {
-      return toCalendarDate(props.defaultValue);
-    }
-    return today(timeZone);
-  };
-
-  // State signals
-  const [internalValue, setInternalValue] = createSignal<T | null>(
-    props.defaultValue ?? null
-  );
-  const [focusedDate, setFocusedDateInternal] = createSignal<CalendarDate>(
-    getInitialFocusedDate()
-  );
-  const [isFocused, setFocused] = createSignal(false);
-  const [isPaginating, setIsPaginating] = createSignal(false);
-
-  // Controlled vs uncontrolled value
-  const value = createMemo<T | null>(() => {
-    const controlled = access(props.value);
-    return controlled !== undefined ? controlled : internalValue();
-  });
-
-  // Derived states
-  const isDisabled = createMemo(() => access(props.isDisabled) ?? false);
-  const isReadOnly = createMemo(() => access(props.isReadOnly) ?? false);
-  const validationState = createMemo(() => access(props.validationState));
-
-  // Visible range based on focused date
-  const visibleRange = createMemo(() => {
-    const focused = focusedDate();
-    const start = startOfMonth(focused);
-    let end = endOfMonth(focused);
-
-    // Extend for multiple visible months
-    for (let i = 1; i < visibleMonths; i++) {
-      end = endOfMonth(end.add({ months: 1 }));
-    }
-
-    return { start, end };
-  });
-
-  // Format week days for headers
-  const weekDays = createMemo(() => {
-    const formatter = new DateFormatter(locale, { weekday: 'short' });
-    const startDay = props.firstDayOfWeek ?? 0;
-    const days: string[] = [];
-    const base = today(timeZone);
-
-    // Find the start of the week
-    const dayOfWeek = getDayOfWeek(base, locale);
-    const weekStart = base.subtract({ days: (dayOfWeek - startDay + 7) % 7 });
-
-    for (let i = 0; i < 7; i++) {
-      const day = weekStart.add({ days: i });
-      days.push(formatter.format(day.toDate(timeZone)));
-    }
-
-    return days;
-  });
-
-  // Title (formatted month/year)
-  const title = createMemo(() => {
-    const formatter = new DateFormatter(locale, {
-      month: 'long',
-      year: 'numeric',
-    });
-    return formatter.format(focusedDate().toDate(timeZone));
-  });
-
-  // Set value with onChange callback
-  const setValue = (newValue: T | null) => {
-    if (isDisabled() || isReadOnly()) return;
-
-    const controlled = access(props.value);
-    if (controlled === undefined) {
-      setInternalValue(() => newValue);
-    }
-
-    if (newValue && props.onChange) {
-      props.onChange(newValue);
-    }
-  };
-
-  // Set focused date with constraints
-  const setFocusedDate = (date: CalendarDate) => {
-    const minValue = access(props.minValue);
-    const maxValue = access(props.maxValue);
-
-    let constrained = date;
-
-    if (minValue && date.compare(toCalendarDate(minValue)) < 0) {
-      constrained = toCalendarDate(minValue);
-    }
-    if (maxValue && date.compare(toCalendarDate(maxValue)) > 0) {
-      constrained = toCalendarDate(maxValue);
-    }
-
-    setFocusedDateInternal(constrained);
-    props.onFocusChange?.(constrained);
-  };
-
-  // Check if a date is selected
-  const isSelected = (date: DateValue): boolean => {
-    const v = value();
-    if (!v) return false;
-    return isSameDay(toCalendarDate(date), toCalendarDate(v));
-  };
-
-  // Check if a date is focused
-  const isCellFocused = (date: DateValue): boolean => {
-    return isSameDay(toCalendarDate(date), focusedDate());
-  };
-
-  // Check if a date is unavailable
-  const isCellUnavailable = (date: DateValue): boolean => {
-    return props.isDateUnavailable?.(date) ?? false;
-  };
-
-  // Check if a date is disabled
-  const isCellDisabled = (date: DateValue): boolean => {
-    if (isDisabled()) return true;
-    if (props.isDateDisabled?.(date)) return true;
-
-    const minValue = access(props.minValue);
-    const maxValue = access(props.maxValue);
-    const calDate = toCalendarDate(date);
-
-    if (minValue && calDate.compare(toCalendarDate(minValue)) < 0) return true;
-    if (maxValue && calDate.compare(toCalendarDate(maxValue)) > 0) return true;
-
-    return false;
-  };
-
-  // Check if a date is outside the visible range
-  const isOutsideVisibleRange = (date: DateValue): boolean => {
-    const range = visibleRange();
-    const calDate = toCalendarDate(date);
-    return !isSameMonth(calDate, range.start) && !isSameMonth(calDate, range.end);
-  };
-
-  // Check if a date is invalid
-  const isInvalid = (date: DateValue): boolean => {
-    return isCellDisabled(date) || isCellUnavailable(date);
-  };
-
-  // Navigation methods
-  const focusPreviousPage = () => {
-    setIsPaginating(true);
-    setFocusedDate(focusedDate().subtract({ months: 1 }));
-    setIsPaginating(false);
-  };
-
-  const focusNextPage = () => {
-    setIsPaginating(true);
-    setFocusedDate(focusedDate().add({ months: 1 }));
-    setIsPaginating(false);
-  };
-
-  const focusPreviousSection = () => {
-    setFocusedDate(focusedDate().subtract({ years: 1 }));
-  };
-
-  const focusNextSection = () => {
-    setFocusedDate(focusedDate().add({ years: 1 }));
-  };
-
-  const focusPreviousDay = () => {
-    setFocusedDate(focusedDate().subtract({ days: 1 }));
-  };
-
-  const focusNextDay = () => {
-    setFocusedDate(focusedDate().add({ days: 1 }));
-  };
-
-  const focusPreviousWeek = () => {
-    setFocusedDate(focusedDate().subtract({ weeks: 1 }));
-  };
-
-  const focusNextWeek = () => {
-    setFocusedDate(focusedDate().add({ weeks: 1 }));
-  };
-
-  const focusPageStart = () => {
-    setFocusedDate(startOfMonth(focusedDate()));
-  };
-
-  const focusPageEnd = () => {
-    setFocusedDate(endOfMonth(focusedDate()));
-  };
-
-  // Selection methods
-  const selectFocusedDate = () => {
-    if (isReadOnly() || isDisabled()) return;
-    const date = focusedDate();
-    if (!isCellDisabled(date) && !isCellUnavailable(date)) {
-      setValue(date as unknown as T);
-    }
-  };
-
-  const selectDate = (date: CalendarDate) => {
-    if (isReadOnly() || isDisabled()) return;
-    if (!isCellDisabled(date) && !isCellUnavailable(date)) {
-      setValue(date as unknown as T);
-      setFocusedDate(date);
-    }
-  };
-
-  // Get dates in a specific week
-  const getDatesInWeek = (
-    weekIndex: number,
-    monthStartDate?: CalendarDate
-  ): (CalendarDate | null)[] => {
-    const startDate = monthStartDate ?? visibleRange().start;
-
-    const monthStart = startOfMonth(startDate);
-    const weekStart = startOfWeek(monthStart, locale);
-
-    const week: (CalendarDate | null)[] = [];
-    const firstDayOfWeek = weekStart.add({ weeks: weekIndex });
-
-    for (let i = 0; i < 7; i++) {
-      const date = firstDayOfWeek.add({ days: i });
-      // Only include dates that are in the same month
-      if (isSameMonth(date, startDate)) {
-        week.push(date);
-      } else {
-        week.push(date); // Still include for proper grid alignment
-      }
-    }
-
-    return week;
-  };
-
-  // Get number of weeks in a month
-  const getWeeksInMonthFn = (date?: CalendarDate): number => {
-    const monthDate = date ?? focusedDate();
-    return getWeeksInMonth(monthDate, locale);
-  };
-
-  return {
-    value,
-    setValue,
-    focusedDate,
-    setFocusedDate,
-    isDisabled,
-    isReadOnly,
-    visibleRange,
-    timeZone,
-    validationState,
-    isSelected,
-    isCellFocused,
-    isCellUnavailable,
-    isCellDisabled,
-    isOutsideVisibleRange,
-    isInvalid,
-    focusPreviousPage,
-    focusNextPage,
-    focusPreviousSection,
-    focusNextSection,
-    focusPreviousDay,
-    focusNextDay,
-    focusPreviousWeek,
-    focusNextWeek,
-    focusPageStart,
-    focusPageEnd,
-    selectFocusedDate,
-    selectDate,
-    isFocused,
-    setFocused,
-    getDatesInWeek,
-    getWeeksInMonth: getWeeksInMonthFn,
-    weekDays,
-    title,
-    visibleMonths,
-    isPaginating,
-  };
-}
-
-// ============================================
-// HELPER FUNCTIONS
-// ============================================
-
-/**
- * Converts a DateValue to a CalendarDate.
- */
-function toCalendarDate(date: DateValue): CalendarDate {
-  // Use the library function to convert
-  return intlToCalendarDate(date);
-}

package/src/calendar/createDateFieldState.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createDateFieldState.d.ts","sourceRoot":"","sources":["createDateFieldState.ts"],"names":[],"mappings":"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"}