@proyecto-viviana/solid-stately 0.2.1 → 0.2.3

package/src/calendar/createTimeFieldState.ts

@@ -0,0 +1,483 @@
+/**
+ * TimeFieldState for Solid-Stately
+ *
+ * Provides state management for time field components with segment-based editing.
+ * Based on @react-stately/datepicker useTimeFieldState
+ */
+
+import { createSignal, createMemo, type Accessor } from 'solid-js';
+import {
+  type Time,
+  type CalendarDateTime,
+  type ZonedDateTime,
+  getLocalTimeZone,
+  DateFormatter,
+} from '@internationalized/date';
+import { access, type MaybeAccessor } from '../utils';
+import type { ValidationState } from './createCalendarState';
+
+// ============================================
+// TYPES
+// ============================================
+
+export type TimeValue = Time | CalendarDateTime | ZonedDateTime;
+
+export type TimeSegmentType =
+  | 'hour'
+  | 'minute'
+  | 'second'
+  | 'dayPeriod'
+  | 'literal';
+
+export interface TimeSegment {
+  /** The type of segment. */
+  type: TimeSegmentType;
+  /** The text content of the segment. */
+  text: string;
+  /** The numeric value of the segment (if applicable). */
+  value?: number;
+  /** The minimum value for the segment. */
+  minValue?: number;
+  /** The maximum value for the segment. */
+  maxValue?: number;
+  /** Whether this segment is editable. */
+  isEditable: boolean;
+  /** Whether this segment is a placeholder. */
+  isPlaceholder: boolean;
+  /** A placeholder string for the segment. */
+  placeholder: string;
+}
+
+export interface TimeFieldStateProps<T extends TimeValue = Time> {
+  /** The current value (controlled). */
+  value?: MaybeAccessor<T | null>;
+  /** The default value (uncontrolled). */
+  defaultValue?: T | null;
+  /** Handler called when the value changes. */
+  onChange?: (value: T | null) => void;
+  /** The minimum allowed time. */
+  minValue?: MaybeAccessor<TimeValue | undefined>;
+  /** The maximum allowed time. */
+  maxValue?: MaybeAccessor<TimeValue | undefined>;
+  /** Whether the field is disabled. */
+  isDisabled?: MaybeAccessor<boolean>;
+  /** Whether the field is read-only. */
+  isReadOnly?: MaybeAccessor<boolean>;
+  /** Whether the field is required. */
+  isRequired?: MaybeAccessor<boolean>;
+  /** The locale to use for formatting. */
+  locale?: string;
+  /** The granularity (hour, minute, second). */
+  granularity?: 'hour' | 'minute' | 'second';
+  /** Whether to show 12 or 24 hour format. */
+  hourCycle?: 12 | 24;
+  /** Validation state. */
+  validationState?: MaybeAccessor<ValidationState | undefined>;
+  /** The placeholder value. */
+  placeholderValue?: T;
+}
+
+export interface TimeFieldState<T extends TimeValue = Time> {
+  /** The current value. */
+  value: Accessor<T | null>;
+  /** Sets the value. */
+  setValue: (value: T | null) => void;
+  /** The segments that make up the time. */
+  segments: Accessor<TimeSegment[]>;
+  /** Sets a segment value. */
+  setSegment: (type: TimeSegmentType, value: number) => void;
+  /** Increments a segment. */
+  incrementSegment: (type: TimeSegmentType) => void;
+  /** Decrements a segment. */
+  decrementSegment: (type: TimeSegmentType) => void;
+  /** Clears a segment. */
+  clearSegment: (type: TimeSegmentType) => void;
+  /** Whether the field is disabled. */
+  isDisabled: Accessor<boolean>;
+  /** Whether the field is read-only. */
+  isReadOnly: Accessor<boolean>;
+  /** Whether the field is required. */
+  isRequired: Accessor<boolean>;
+  /** The validation state. */
+  validationState: Accessor<ValidationState | undefined>;
+  /** The granularity. */
+  granularity: 'hour' | 'minute' | 'second';
+  /** Whether the value is invalid. */
+  isInvalid: Accessor<boolean>;
+  /** The locale. */
+  locale: string;
+  /** The hour cycle. */
+  hourCycle: 12 | 24;
+}
+
+// ============================================
+// IMPLEMENTATION
+// ============================================
+
+/**
+ * Provides state management for a time field component.
+ */
+export function createTimeFieldState<T extends TimeValue = Time>(
+  props: TimeFieldStateProps<T> = {}
+): TimeFieldState<T> {
+  const timeZone = getLocalTimeZone();
+  const locale = props.locale ?? 'en-US';
+  const granularity = props.granularity ?? 'minute';
+  const hourCycle = props.hourCycle ?? 12;
+
+  // State signals
+  const [internalValue, setInternalValue] = createSignal<T | null>(
+    props.defaultValue ?? null
+  );
+
+  // Track partial values during editing
+  const [placeholderParts, setPlaceholderParts] = createSignal<Partial<TimeParts>>({});
+
+  // 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 isRequired = createMemo(() => access(props.isRequired) ?? false);
+  const validationState = createMemo(() => access(props.validationState));
+
+  // Check if value is invalid
+  const isInvalid = createMemo(() => {
+    const v = value();
+    if (!v) return false;
+
+    const minValue = access(props.minValue);
+    const maxValue = access(props.maxValue);
+
+    if (minValue && compareTime(v, minValue) < 0) return true;
+    if (maxValue && compareTime(v, maxValue) > 0) return true;
+
+    return validationState() === 'invalid';
+  });
+
+  // Generate segments based on granularity
+  const segments = createMemo<TimeSegment[]>(() => {
+    const v = value();
+    const parts = placeholderParts();
+    const segs: TimeSegment[] = [];
+
+    // Determine format options
+    const formatOptions: Intl.DateTimeFormatOptions = {
+      hour: '2-digit',
+      minute: '2-digit',
+      hourCycle: hourCycle === 12 ? 'h12' : 'h23',
+    };
+
+    if (granularity === 'second') {
+      formatOptions.second = '2-digit';
+    }
+
+    // Use a base date for formatting
+    const baseDate = new Date();
+    if (v) {
+      baseDate.setHours(getHour(v), getMinute(v), getSecond(v));
+    }
+
+    const formatter = new DateFormatter(locale, formatOptions);
+    const formattedParts = formatter.formatToParts(baseDate);
+
+    for (const part of formattedParts) {
+      const type = mapTimePartType(part.type);
+
+      if (type === 'literal') {
+        segs.push({
+          type: 'literal',
+          text: part.value,
+          isEditable: false,
+          isPlaceholder: false,
+          placeholder: part.value,
+        });
+      } else if (type) {
+        const segValue = getTimeSegmentValue(v, type);
+        const partValue = parts[type as keyof TimeParts];
+        const hasValue = v !== null || partValue !== undefined;
+
+        segs.push({
+          type,
+          text: hasValue ? part.value : getTimePlaceholderText(type),
+          value: segValue ?? partValue,
+          minValue: getTimeMinValue(type, hourCycle),
+          maxValue: getTimeMaxValue(type, hourCycle),
+          isEditable: !isDisabled() && !isReadOnly(),
+          isPlaceholder: !hasValue,
+          placeholder: getTimePlaceholderText(type),
+        });
+      }
+    }
+
+    return segs;
+  });
+
+  // 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 (props.onChange) {
+      props.onChange(newValue);
+    }
+
+    setPlaceholderParts({});
+  };
+
+  // Set a specific segment value
+  const setSegment = (type: TimeSegmentType, newValue: number) => {
+    if (isDisabled() || isReadOnly()) return;
+    if (type === 'literal') return;
+
+    const v = value();
+
+    if (v) {
+      const updated = updateTimePart(v, type, newValue, hourCycle);
+      setValue(updated as T);
+    } else {
+      setPlaceholderParts((prev) => ({
+        ...prev,
+        [type]: newValue,
+      }));
+    }
+  };
+
+  // Increment a segment
+  const incrementSegment = (type: TimeSegmentType) => {
+    if (isDisabled() || isReadOnly()) return;
+    if (type === 'literal') return;
+
+    const v = value();
+    const current = v
+      ? getTimeSegmentValue(v, type)
+      : placeholderParts()[type as keyof TimeParts];
+    const max = getTimeMaxValue(type, hourCycle);
+    const min = getTimeMinValue(type, hourCycle);
+
+    if (type === 'dayPeriod') {
+      // Toggle AM/PM
+      const currentHour = v ? getHour(v) : (placeholderParts().hour ?? 0);
+      const newHour = currentHour >= 12 ? currentHour - 12 : currentHour + 12;
+      setSegment('hour', newHour);
+      return;
+    }
+
+    const newValue = current !== undefined ? current + 1 : min;
+    setSegment(type, newValue > max ? min : newValue);
+  };
+
+  // Decrement a segment
+  const decrementSegment = (type: TimeSegmentType) => {
+    if (isDisabled() || isReadOnly()) return;
+    if (type === 'literal') return;
+
+    const v = value();
+    const current = v
+      ? getTimeSegmentValue(v, type)
+      : placeholderParts()[type as keyof TimeParts];
+    const max = getTimeMaxValue(type, hourCycle);
+    const min = getTimeMinValue(type, hourCycle);
+
+    if (type === 'dayPeriod') {
+      // Toggle AM/PM
+      const currentHour = v ? getHour(v) : (placeholderParts().hour ?? 0);
+      const newHour = currentHour >= 12 ? currentHour - 12 : currentHour + 12;
+      setSegment('hour', newHour);
+      return;
+    }
+
+    const newValue = current !== undefined ? current - 1 : max;
+    setSegment(type, newValue < min ? max : newValue);
+  };
+
+  // Clear a segment
+  const clearSegment = (type: TimeSegmentType) => {
+    if (isDisabled() || isReadOnly()) return;
+
+    const v = value();
+    if (v) {
+      setValue(null);
+    } else {
+      setPlaceholderParts((prev) => {
+        const next = { ...prev };
+        delete next[type as keyof TimeParts];
+        return next;
+      });
+    }
+  };
+
+  return {
+    value,
+    setValue,
+    segments,
+    setSegment,
+    incrementSegment,
+    decrementSegment,
+    clearSegment,
+    isDisabled,
+    isReadOnly,
+    isRequired,
+    validationState,
+    granularity,
+    isInvalid,
+    locale,
+    hourCycle,
+  };
+}
+
+// ============================================
+// HELPER TYPES & FUNCTIONS
+// ============================================
+
+interface TimeParts {
+  hour?: number;
+  minute?: number;
+  second?: number;
+}
+
+function mapTimePartType(type: Intl.DateTimeFormatPartTypes): TimeSegmentType | null {
+  switch (type) {
+    case 'hour':
+      return 'hour';
+    case 'minute':
+      return 'minute';
+    case 'second':
+      return 'second';
+    case 'dayPeriod':
+      return 'dayPeriod';
+    case 'literal':
+      return 'literal';
+    default:
+      return null;
+  }
+}
+
+function getHour(time: TimeValue): number {
+  if ('hour' in time) {
+    return time.hour;
+  }
+  return 0;
+}
+
+function getMinute(time: TimeValue): number {
+  if ('minute' in time) {
+    return time.minute;
+  }
+  return 0;
+}
+
+function getSecond(time: TimeValue): number {
+  if ('second' in time) {
+    return time.second;
+  }
+  return 0;
+}
+
+function getTimeSegmentValue(
+  time: TimeValue | null,
+  type: TimeSegmentType
+): number | undefined {
+  if (!time) return undefined;
+
+  switch (type) {
+    case 'hour':
+      return getHour(time);
+    case 'minute':
+      return getMinute(time);
+    case 'second':
+      return getSecond(time);
+    case 'dayPeriod':
+      return getHour(time) >= 12 ? 1 : 0;
+    default:
+      return undefined;
+  }
+}
+
+function getTimeMinValue(type: TimeSegmentType, hourCycle: number): number {
+  switch (type) {
+    case 'hour':
+      return hourCycle === 12 ? 1 : 0;
+    case 'minute':
+      return 0;
+    case 'second':
+      return 0;
+    case 'dayPeriod':
+      return 0;
+    default:
+      return 0;
+  }
+}
+
+function getTimeMaxValue(type: TimeSegmentType, hourCycle: number): number {
+  switch (type) {
+    case 'hour':
+      return hourCycle === 12 ? 12 : 23;
+    case 'minute':
+      return 59;
+    case 'second':
+      return 59;
+    case 'dayPeriod':
+      return 1;
+    default:
+      return 0;
+  }
+}
+
+function getTimePlaceholderText(type: TimeSegmentType): string {
+  switch (type) {
+    case 'hour':
+      return '––';
+    case 'minute':
+      return '––';
+    case 'second':
+      return '––';
+    case 'dayPeriod':
+      return 'AM';
+    default:
+      return '';
+  }
+}
+
+function updateTimePart(
+  time: TimeValue,
+  type: TimeSegmentType,
+  value: number,
+  hourCycle: number
+): TimeValue {
+  if ('set' in time) {
+    switch (type) {
+      case 'hour':
+        return time.set({ hour: value });
+      case 'minute':
+        return time.set({ minute: value });
+      case 'second':
+        return time.set({ second: value });
+      default:
+        return time;
+    }
+  }
+  return time;
+}
+
+function compareTime(a: TimeValue, b: TimeValue): number {
+  const aHour = getHour(a);
+  const bHour = getHour(b);
+  if (aHour !== bHour) return aHour - bHour;
+
+  const aMinute = getMinute(a);
+  const bMinute = getMinute(b);
+  if (aMinute !== bMinute) return aMinute - bMinute;
+
+  const aSecond = getSecond(a);
+  const bSecond = getSecond(b);
+  return aSecond - bSecond;
+}

package/src/calendar/index.d.ts

@@ -0,0 +1,7 @@
+export { createCalendarState, type CalendarStateProps, type CalendarState, type ValidationState, } from './createCalendarState';
+export { createRangeCalendarState, type RangeCalendarStateProps, type RangeCalendarState, type DateRange, type RangeValue, } from './createRangeCalendarState';
+export { createDateFieldState, type DateFieldStateProps, type DateFieldState, type DateSegment, type DateSegmentType, } from './createDateFieldState';
+export { createTimeFieldState, type TimeFieldStateProps, type TimeFieldState, type TimeSegment, type TimeSegmentType, type TimeValue, } from './createTimeFieldState';
+export type { CalendarDate, CalendarDateTime, ZonedDateTime, DateValue, Time, } from '@internationalized/date';
+export { today, now, getLocalTimeZone, parseDate, parseDateTime, parseTime, parseAbsolute, parseAbsoluteToLocal, parseZonedDateTime, toCalendarDate, toCalendarDateTime, toZoned, toTime, CalendarDate as CalendarDateClass, CalendarDateTime as CalendarDateTimeClass, ZonedDateTime as ZonedDateTimeClass, Time as TimeClass, DateFormatter, isSameDay, isSameMonth, isSameYear, isToday, isWeekend, startOfMonth, endOfMonth, startOfWeek, endOfWeek, startOfYear, endOfYear, getWeeksInMonth, getDayOfWeek, minDate, maxDate, } from '@internationalized/date';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,mBAAmB,EACnB,KAAK,kBAAkB,EACvB,KAAK,aAAa,EAClB,KAAK,eAAe,GACrB,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EACL,wBAAwB,EACxB,KAAK,uBAAuB,EAC5B,KAAK,kBAAkB,EACvB,KAAK,SAAS,EACd,KAAK,UAAU,GAChB,MAAM,4BAA4B,CAAC;AAGpC,OAAO,EACL,oBAAoB,EACpB,KAAK,mBAAmB,EACxB,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,eAAe,GACrB,MAAM,wBAAwB,CAAC;AAGhC,OAAO,EACL,oBAAoB,EACpB,KAAK,mBAAmB,EACxB,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,SAAS,GACf,MAAM,wBAAwB,CAAC;AAGhC,YAAY,EACV,YAAY,EACZ,gBAAgB,EAChB,aAAa,EACb,SAAS,EACT,IAAI,GACL,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EACL,KAAK,EACL,GAAG,EACH,gBAAgB,EAChB,SAAS,EACT,aAAa,EACb,SAAS,EACT,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,OAAO,EACP,MAAM,EACN,YAAY,IAAI,iBAAiB,EACjC,gBAAgB,IAAI,qBAAqB,EACzC,aAAa,IAAI,kBAAkB,EACnC,IAAI,IAAI,SAAS,EACjB,aAAa,EACb,SAAS,EACT,WAAW,EACX,UAAU,EACV,OAAO,EACP,SAAS,EACT,YAAY,EACZ,UAAU,EACV,WAAW,EACX,SAAS,EACT,WAAW,EACX,SAAS,EACT,eAAe,EACf,YAAY,EACZ,OAAO,EACP,OAAO,GACR,MAAM,yBAAyB,CAAC"}

package/src/calendar/index.ts

@@ -0,0 +1,81 @@
+// Calendar State
+export {
+  createCalendarState,
+  type CalendarStateProps,
+  type CalendarState,
+  type ValidationState,
+} from './createCalendarState';
+
+// Range Calendar State
+export {
+  createRangeCalendarState,
+  type RangeCalendarStateProps,
+  type RangeCalendarState,
+  type DateRange,
+  type RangeValue,
+} from './createRangeCalendarState';
+
+// Date Field State
+export {
+  createDateFieldState,
+  type DateFieldStateProps,
+  type DateFieldState,
+  type DateSegment,
+  type DateSegmentType,
+} from './createDateFieldState';
+
+// Time Field State
+export {
+  createTimeFieldState,
+  type TimeFieldStateProps,
+  type TimeFieldState,
+  type TimeSegment,
+  type TimeSegmentType,
+  type TimeValue,
+} from './createTimeFieldState';
+
+// Re-export date types from @internationalized/date
+export type {
+  CalendarDate,
+  CalendarDateTime,
+  ZonedDateTime,
+  DateValue,
+  Time,
+} from '@internationalized/date';
+
+// Re-export commonly used date utilities
+export {
+  today,
+  now,
+  getLocalTimeZone,
+  parseDate,
+  parseDateTime,
+  parseTime,
+  parseAbsolute,
+  parseAbsoluteToLocal,
+  parseZonedDateTime,
+  toCalendarDate,
+  toCalendarDateTime,
+  toZoned,
+  toTime,
+  CalendarDate as CalendarDateClass,
+  CalendarDateTime as CalendarDateTimeClass,
+  ZonedDateTime as ZonedDateTimeClass,
+  Time as TimeClass,
+  DateFormatter,
+  isSameDay,
+  isSameMonth,
+  isSameYear,
+  isToday,
+  isWeekend,
+  startOfMonth,
+  endOfMonth,
+  startOfWeek,
+  endOfWeek,
+  startOfYear,
+  endOfYear,
+  getWeeksInMonth,
+  getDayOfWeek,
+  minDate,
+  maxDate,
+} from '@internationalized/date';

package/src/checkbox/createCheckboxGroupState.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Checkbox group state for Solid Stately
+ *
+ * Provides state management for a checkbox group component.
+ * Provides a name for the group, and manages selection and focus state.
+ *
+ * This is a 1:1 port of @react-stately/checkbox's useCheckboxGroupState.
+ */
+import { Accessor } from 'solid-js';
+import { type MaybeAccessor } from '../utils';
+export interface CheckboxGroupProps {
+    /** The current selected values (controlled). */
+    value?: string[];
+    /** The default selected values (uncontrolled). */
+    defaultValue?: string[];
+    /** Handler that is called when the value changes. */
+    onChange?: (value: string[]) => void;
+    /** Whether the checkbox group is disabled. */
+    isDisabled?: boolean;
+    /** Whether the checkbox group is read only. */
+    isReadOnly?: boolean;
+    /** Whether the checkbox group is required. */
+    isRequired?: boolean;
+    /** Whether the checkbox group is invalid. */
+    isInvalid?: boolean;
+    /** The name of the checkbox group, used when submitting an HTML form. */
+    name?: string;
+    /** The form to associate the checkbox group with. */
+    form?: string;
+    /** The label for the checkbox group. */
+    label?: string;
+    /** Handler that is called when the checkbox group receives focus. */
+    onFocus?: (e: FocusEvent) => void;
+    /** Handler that is called when the checkbox group loses focus. */
+    onBlur?: (e: FocusEvent) => void;
+    /** Handler that is called when the checkbox group's focus status changes. */
+    onFocusChange?: (isFocused: boolean) => void;
+}
+export interface CheckboxGroupState {
+    /** Current selected values. */
+    readonly value: Accessor<readonly string[]>;
+    /** Default selected values. */
+    readonly defaultValue: readonly string[];
+    /** Whether the checkbox group is disabled. */
+    readonly isDisabled: boolean;
+    /** Whether the checkbox group is read only. */
+    readonly isReadOnly: boolean;
+    /** Whether the checkbox group is invalid. */
+    readonly isInvalid: boolean;
+    /**
+     * Whether the checkboxes in the group are required.
+     * This changes to false once at least one item is selected.
+     */
+    readonly isRequired: Accessor<boolean>;
+    /** Returns whether the given value is selected. */
+    isSelected(value: string): boolean;
+    /** Sets the selected values. */
+    setValue(value: string[]): void;
+    /** Adds a value to the set of selected values. */
+    addValue(value: string): void;
+    /** Removes a value from the set of selected values. */
+    removeValue(value: string): void;
+    /** Toggles a value in the set of selected values. */
+    toggleValue(value: string): void;
+}
+/**
+ * Provides state management for a checkbox group component.
+ * Provides a name for the group, and manages selection and focus state.
+ */
+export declare function createCheckboxGroupState(props?: MaybeAccessor<CheckboxGroupProps>): CheckboxGroupState;
+//# sourceMappingURL=createCheckboxGroupState.d.ts.map

package/src/checkbox/createCheckboxGroupState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createCheckboxGroupState.d.ts","sourceRoot":"","sources":["createCheckboxGroupState.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAgB,QAAQ,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EAAE,KAAK,aAAa,EAAU,MAAM,UAAU,CAAC;AAMtD,MAAM,WAAW,kBAAkB;IACjC,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,kEAAkE;IAClE,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACjC,6EAA6E;IAC7E,aAAa,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,MAAM,WAAW,kBAAkB;IACjC,+BAA+B;IAC/B,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,SAAS,MAAM,EAAE,CAAC,CAAC;IAC5C,+BAA+B;IAC/B,QAAQ,CAAC,YAAY,EAAE,SAAS,MAAM,EAAE,CAAC;IACzC,8CAA8C;IAC9C,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,+CAA+C;IAC/C,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,6CAA6C;IAC7C,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IACvC,mDAAmD;IACnD,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;IACnC,gCAAgC;IAChC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IAChC,kDAAkD;IAClD,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,uDAAuD;IACvD,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,qDAAqD;IACrD,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CAClC;AAMD;;;GAGG;AACH,wBAAgB,wBAAwB,CACtC,KAAK,GAAE,aAAa,CAAC,kBAAkB,CAAM,GAC5C,kBAAkB,CA6GpB"}