@proyecto-viviana/solid-stately 0.4.0 → 0.5.0

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 (34) hide show
  1. package/dist/calendar/createDateFieldState.d.ts +56 -18
  2. package/dist/calendar/createRangeCalendarState.d.ts +10 -0
  3. package/dist/calendar/createTimeFieldState.d.ts +38 -67
  4. package/dist/calendar/intl/index.d.ts +10 -0
  5. package/dist/collections/ListCollection.d.ts +8 -0
  6. package/dist/collections/createListState.d.ts +12 -0
  7. package/dist/collections/getChildNodes.d.ts +8 -0
  8. package/dist/collections/index.d.ts +2 -2
  9. package/dist/collections/types.d.ts +12 -0
  10. package/dist/color/intl/index.d.ts +14 -0
  11. package/dist/dnd/createDroppableCollectionState.d.ts +17 -2
  12. package/dist/index.d.ts +1 -1
  13. package/dist/index.js +3451 -1309
  14. package/dist/index.js.map +1 -1
  15. package/dist/selection/SelectionManager.d.ts +9 -0
  16. package/package.json +1 -1
  17. package/src/calendar/createCalendarState.ts +26 -4
  18. package/src/calendar/createDateFieldState.ts +614 -459
  19. package/src/calendar/createRangeCalendarState.ts +212 -11
  20. package/src/calendar/createTimeFieldState.ts +179 -467
  21. package/src/calendar/intl/index.ts +364 -0
  22. package/src/collections/ListCollection.ts +40 -1
  23. package/src/collections/createListState.ts +105 -2
  24. package/src/collections/getChildNodes.ts +31 -0
  25. package/src/collections/index.ts +3 -0
  26. package/src/collections/types.ts +13 -0
  27. package/src/color/Color.ts +104 -133
  28. package/src/color/intl/index.ts +1409 -0
  29. package/src/combobox/createComboBoxState.ts +48 -16
  30. package/src/dnd/createDroppableCollectionState.ts +125 -6
  31. package/src/index.ts +3 -0
  32. package/src/selection/SelectionManager.ts +15 -0
  33. package/src/steplist/createStepListState.ts +27 -4
  34. package/src/tabs/createTabListState.ts +9 -1
@@ -2,20 +2,27 @@
2
2
  * DateFieldState for Solid-Stately
3
3
  *
4
4
  * Provides state management for date field components with segment-based editing.
5
- * Based on @react-stately/datepicker useDateFieldState
5
+ * Faithful port of @react-stately/datepicker useDateFieldState.
6
6
  *
7
7
  * Editing is modeled with an {@link IncompleteDate} display value so that invalid
8
8
  * intermediate dates (e.g. February 31st, produced by editing the day before the
9
9
  * month) are held as-typed while the field is focused and only constrained on blur
10
10
  * via `confirmPlaceholder`, matching upstream behavior. Out-of-range values are
11
11
  * never snapped to `minValue`/`maxValue`; they are kept and reported as invalid.
12
+ *
13
+ * The upstream "derived state during render" resync (which re-mints the display
14
+ * value when the committed value / calendar / hour cycle changes) is ported to a
15
+ * Solid `createComputed` so it runs synchronously before render effects — mirroring
16
+ * React's render-phase setState rather than a post-render `createEffect`.
12
17
  */
13
18
  import { type Accessor } from "solid-js";
14
- import { type CalendarDateTime, type DateValue } from "@internationalized/date";
19
+ import { type Calendar, type CalendarDateTime, type CalendarIdentifier, type DateValue, DateFormatter, Time } from "@internationalized/date";
15
20
  import { type MaybeAccessor } from "../utils";
16
21
  import type { ValidationState } from "./createCalendarState";
17
22
  import { type ValidationBehavior, type ValidationFunction, type ValidationResult } from "../form";
18
23
  export type DateSegmentType = "year" | "month" | "day" | "hour" | "minute" | "second" | "dayPeriod" | "era" | "timeZoneName" | "literal";
24
+ type Granularity = "year" | "month" | "day" | "hour" | "minute" | "second";
25
+ type FieldGranularity = "day" | "hour" | "minute" | "second";
19
26
  export interface DateSegment {
20
27
  /** The type of segment. */
21
28
  type: DateSegmentType;
@@ -56,7 +63,9 @@ export interface DateFieldStateProps<T extends DateValue = DateValue> {
56
63
  /** The locale to use for formatting. */
57
64
  locale?: string;
58
65
  /** The granularity of the date/time (day, hour, minute, second). */
59
- granularity?: "day" | "hour" | "minute" | "second";
66
+ granularity?: FieldGranularity;
67
+ /** The maximum granularity (largest editable unit). Defaults to `year`. */
68
+ maxGranularity?: "year" | "month" | "day" | "hour" | "minute";
60
69
  /** Whether to show the hour in 12 or 24 hour format. */
61
70
  hourCycle?: 12 | 24;
62
71
  /** Whether to hide the time zone. */
@@ -77,28 +86,42 @@ export interface DateFieldStateProps<T extends DateValue = DateValue> {
77
86
  errorMessage?: string;
78
87
  /** Whether dates outside the min/max range are allowed. */
79
88
  allowsNonContiguousRanges?: boolean;
80
- /** Whether to create a date or datetime. */
81
- createCalendar?: (name: string) => unknown;
89
+ /** Resolves a calendar system by its Unicode identifier. */
90
+ createCalendar?: (name: CalendarIdentifier) => Calendar;
82
91
  /** Whether a date is unavailable. */
83
92
  isDateUnavailable?: (date: DateValue) => boolean;
84
93
  }
85
94
  export interface DateFieldState<T extends DateValue = DateValue> {
86
- /** The current value. */
87
- value: Accessor<T | null>;
88
- /** The date value (may be partial during editing). */
89
- dateValue: Accessor<DateValue | null>;
95
+ /** The current value, converted to the display calendar. */
96
+ value: Accessor<DateValue | null>;
97
+ /** The current value as a native JavaScript Date (may be partial during editing). */
98
+ dateValue: Accessor<Date>;
99
+ /** The display calendar system. */
100
+ readonly calendar: Calendar;
90
101
  /** Sets the date value. */
91
102
  setValue: (value: T | null) => void;
92
103
  /** The segments that make up the date. */
93
104
  segments: Accessor<DateSegment[]>;
94
- /** The format string. */
105
+ /** The formatter used to render the field. */
106
+ readonly dateFormatter: DateFormatter;
107
+ /** Formats the current value with the given field options. */
95
108
  formatValue: (fieldOptions?: Intl.DateTimeFormatOptions) => string;
109
+ /** Returns a formatter with the field's resolved options merged with the given ones. */
110
+ getDateFormatter: (locale: string, formatOptions: FormatterOptions) => DateFormatter;
96
111
  /** Sets a segment value. */
97
112
  setSegment: (type: DateSegmentType, value: number) => void;
98
- /** Increments a segment. */
99
- incrementSegment: (type: DateSegmentType) => void;
100
- /** Decrements a segment. */
101
- decrementSegment: (type: DateSegmentType) => void;
113
+ /** Increments a segment by one. */
114
+ increment: (type: DateSegmentType) => void;
115
+ /** Decrements a segment by one. */
116
+ decrement: (type: DateSegmentType) => void;
117
+ /** Increments a segment by a larger page step. */
118
+ incrementPage: (type: DateSegmentType) => void;
119
+ /** Decrements a segment by a larger page step. */
120
+ decrementPage: (type: DateSegmentType) => void;
121
+ /** Sets a segment to its maximum value. */
122
+ incrementToMax: (type: DateSegmentType) => void;
123
+ /** Sets a segment to its minimum value. */
124
+ decrementToMin: (type: DateSegmentType) => void;
102
125
  /** Clears a segment. */
103
126
  clearSegment: (type: DateSegmentType) => void;
104
127
  /** Confirms the value (after typing). */
@@ -112,7 +135,9 @@ export interface DateFieldState<T extends DateValue = DateValue> {
112
135
  /** The validation state. */
113
136
  validationState: Accessor<ValidationState | undefined>;
114
137
  /** The granularity. */
115
- granularity: "day" | "hour" | "minute" | "second";
138
+ readonly granularity: FieldGranularity;
139
+ /** The maximum granularity. */
140
+ readonly maxGranularity: "year" | "month" | "day" | "hour" | "minute";
116
141
  /** Whether the value is invalid. */
117
142
  isInvalid: Accessor<boolean>;
118
143
  /** Realtime validation results, including native and custom constraints. */
@@ -126,14 +151,27 @@ export interface DateFieldState<T extends DateValue = DateValue> {
126
151
  /** Commits realtime validation to displayed validation. */
127
152
  commitValidation: () => void;
128
153
  /** The locale. */
129
- locale: string;
154
+ readonly locale: string;
130
155
  /** The time zone. */
131
- timeZone: string;
156
+ readonly timeZone: string;
132
157
  /** The default value. */
133
- defaultValue: T | null;
158
+ defaultValue: DateValue | null;
134
159
  }
135
160
  /**
136
161
  * Provides state management for a date field component.
137
162
  */
138
163
  export declare function createDateFieldState<T extends DateValue = DateValue>(props?: DateFieldStateProps<T>): DateFieldState<T>;
164
+ interface FormatterOptions {
165
+ timeZone?: string;
166
+ hideTimeZone?: boolean;
167
+ granularity?: Granularity;
168
+ maxGranularity?: "year" | "month" | "day" | "hour" | "minute";
169
+ hourCycle?: 12 | 24;
170
+ showEra?: boolean;
171
+ shouldForceLeadingZeros?: boolean;
172
+ }
173
+ export declare function getFormatOptions(fieldOptions: Intl.DateTimeFormatOptions | undefined, options: FormatterOptions): Intl.DateTimeFormatOptions;
174
+ /** The placeholder time, used by time-only fields. */
175
+ export declare function getPlaceholderTime(placeholderValue?: DateValue): Time | DateValue;
176
+ export declare function getValidationResult(value: DateValue | null, minValue: DateValue | undefined, maxValue: DateValue | undefined, isDateUnavailable: ((date: DateValue) => boolean) | undefined, options: FormatterOptions): ValidationResult;
139
177
  export type { CalendarDateTime };
@@ -164,6 +164,16 @@ export interface RangeCalendarState<T extends DateValue = DateValue> {
164
164
  isDragging: Accessor<boolean>;
165
165
  /** Sets whether the user is dragging to select. */
166
166
  setDragging: (dragging: boolean) => void;
167
+ /**
168
+ * Formats the selected range as a `{ start, end }` pair of localized strings,
169
+ * or `null` when the range is incomplete. Mirrors upstream
170
+ * `DateRangePickerState.formatValue` — the port collapses that state into the
171
+ * range calendar state, so the range picker reads its SR description from here.
172
+ */
173
+ formatValue: (locale: string, fieldOptions: Intl.DateTimeFormatOptions) => {
174
+ start: string;
175
+ end: string;
176
+ } | null;
167
177
  }
168
178
  /**
169
179
  * Provides state management for a range calendar component.
@@ -1,34 +1,37 @@
1
1
  /**
2
2
  * TimeFieldState for Solid-Stately
3
3
  *
4
- * Provides state management for time field components with segment-based editing.
5
- * Based on @react-stately/datepicker useTimeFieldState
4
+ * Faithful port of `@react-stately/datepicker` `useTimeFieldState`, which is a
5
+ * thin wrapper over `useDateFieldState`: a time-only `Time` value is converted
6
+ * to a `CalendarDateTime` (anchored on today's date, or a zoned date when the
7
+ * value/default carries a time zone) and fed to the date-field state machine
8
+ * with `maxGranularity: 'hour'` so the date segments drop away and only
9
+ * hour/minute[/second]/dayPeriod remain. The returned state IS the
10
+ * `DateFieldState`, plus a `timeValue` accessor holding the value back in the
11
+ * `Time` domain. This means TimeField reuses the certified DateField segment
12
+ * stack (`createDateSegment`, `DateInput`, `DateSegment`) exactly as RAC's
13
+ * TimeField reuses `DateInput`/`DateSegment` — there is no parallel time
14
+ * primitive.
15
+ *
16
+ * The `timeValue` is layered on with a Proxy rather than an object spread
17
+ * because `DateFieldState`'s `calendar`/`dateFormatter`/`granularity`/
18
+ * `maxGranularity`/`locale`/`timeZone` members are getters — spreading would
19
+ * invoke and freeze them, breaking reactivity.
6
20
  */
7
21
  import { type Accessor } from "solid-js";
8
- import { type Time, type CalendarDateTime, type ZonedDateTime, type DateValue } from "@internationalized/date";
22
+ import { Time, type CalendarDateTime, type ZonedDateTime, type DateValue } from "@internationalized/date";
9
23
  import { type MaybeAccessor } from "../utils";
10
24
  import type { ValidationState } from "./createCalendarState";
11
- import { type ValidationBehavior, type ValidationFunction, type ValidationResult } from "../form";
25
+ import type { ValidationBehavior, ValidationFunction } from "../form";
26
+ import { type DateFieldState, type DateSegment as DateSegmentInternal, type DateSegmentType as DateSegmentTypeInternal } from "./createDateFieldState";
12
27
  export type TimeValue = Time | CalendarDateTime | ZonedDateTime;
13
- export type TimeSegmentType = "hour" | "minute" | "second" | "dayPeriod" | "literal";
14
- export interface TimeSegment {
15
- /** The type of segment. */
16
- type: TimeSegmentType;
17
- /** The text content of the segment. */
18
- text: string;
19
- /** The numeric value of the segment (if applicable). */
20
- value?: number;
21
- /** The minimum value for the segment. */
22
- minValue?: number;
23
- /** The maximum value for the segment. */
24
- maxValue?: number;
25
- /** Whether this segment is editable. */
26
- isEditable: boolean;
27
- /** Whether this segment is a placeholder. */
28
- isPlaceholder: boolean;
29
- /** A placeholder string for the segment. */
30
- placeholder: string;
31
- }
28
+ /**
29
+ * TimeField reuses the DateField segment vocabulary (RAC TimeField reuses
30
+ * `DateInput`/`DateSegment`); the legacy `TimeSegment`/`TimeSegmentType` names
31
+ * are kept as aliases of the shared date-segment types.
32
+ */
33
+ export type TimeSegmentType = DateSegmentTypeInternal;
34
+ export type TimeSegment = DateSegmentInternal;
32
35
  export interface TimeFieldStateProps<T extends TimeValue = Time> {
33
36
  /** The current value (controlled). */
34
37
  value?: MaybeAccessor<T | null>;
@@ -54,6 +57,8 @@ export interface TimeFieldStateProps<T extends TimeValue = Time> {
54
57
  granularity?: "hour" | "minute" | "second";
55
58
  /** Whether to show 12 or 24 hour format. */
56
59
  hourCycle?: 12 | 24;
60
+ /** Whether to hide the time zone. */
61
+ hideTimeZone?: boolean;
57
62
  /** Whether to force leading zeroes in the hour segment. */
58
63
  shouldForceLeadingZeros?: boolean;
59
64
  /** Validation state. */
@@ -61,7 +66,7 @@ export interface TimeFieldStateProps<T extends TimeValue = Time> {
61
66
  /** Validation behavior mode. */
62
67
  validationBehavior?: ValidationBehavior;
63
68
  /** Custom validation function. */
64
- validate?: ValidationFunction<T>;
69
+ validate?: ValidationFunction<T | null>;
65
70
  /** Description text. */
66
71
  description?: string;
67
72
  /** Error message. */
@@ -71,49 +76,15 @@ export interface TimeFieldStateProps<T extends TimeValue = Time> {
71
76
  /** Whether dates outside the min/max range are unavailable. Added for API consistency. */
72
77
  isDateUnavailable?: (date: DateValue) => boolean;
73
78
  }
74
- export interface TimeFieldState<T extends TimeValue = Time> {
75
- /** The current value. */
76
- value: Accessor<T | null>;
77
- /** The default value. */
78
- defaultValue: T | null;
79
- /** Sets the value. */
80
- setValue: (value: T | null) => void;
81
- /** The segments that make up the time. */
82
- segments: Accessor<TimeSegment[]>;
83
- /** Sets a segment value. */
84
- setSegment: (type: TimeSegmentType, value: number) => void;
85
- /** Increments a segment. */
86
- incrementSegment: (type: TimeSegmentType) => void;
87
- /** Decrements a segment. */
88
- decrementSegment: (type: TimeSegmentType) => void;
89
- /** Clears a segment. */
90
- clearSegment: (type: TimeSegmentType) => void;
91
- /** Whether the field is disabled. */
92
- isDisabled: Accessor<boolean>;
93
- /** Whether the field is read-only. */
94
- isReadOnly: Accessor<boolean>;
95
- /** Whether the field is required. */
96
- isRequired: Accessor<boolean>;
97
- /** The validation state. */
98
- validationState: Accessor<ValidationState | undefined>;
99
- /** The granularity. */
100
- granularity: "hour" | "minute" | "second";
101
- /** Whether the value is invalid. */
102
- isInvalid: Accessor<boolean>;
103
- /** Realtime validation results, including native and custom constraints. */
104
- realtimeValidation: Accessor<ValidationResult>;
105
- /** Currently displayed validation results. */
106
- displayValidation: Accessor<ValidationResult>;
107
- /** Updates the current validation result. */
108
- updateValidation: (result: ValidationResult) => void;
109
- /** Resets displayed validation to valid. */
110
- resetValidation: () => void;
111
- /** Commits realtime validation to displayed validation. */
112
- commitValidation: () => void;
113
- /** The locale. */
114
- locale: string;
115
- /** The hour cycle. */
116
- hourCycle: 12 | 24;
79
+ /**
80
+ * The TimeField state IS the certified DateField state (segments, validation,
81
+ * increment/decrement, formatter, etc.) with a `timeValue` accessor added. The
82
+ * `T` generic is retained for API back-compat with existing `TimeFieldState<T>`
83
+ * consumers.
84
+ */
85
+ export interface TimeFieldState<T extends TimeValue = Time> extends DateFieldState {
86
+ /** The current value in the `Time`/`CalendarDateTime`/`ZonedDateTime` domain. */
87
+ timeValue: Accessor<TimeValue | null>;
117
88
  }
118
89
  /**
119
90
  * Provides state management for a time field component.
@@ -0,0 +1,10 @@
1
+ export type DateFieldErrorKey = "rangeUnderflow" | "rangeOverflow" | "rangeReversed" | "unavailableDate";
2
+ type DateFieldErrorArgs = {
3
+ minValue?: string;
4
+ maxValue?: string;
5
+ };
6
+ /** Mirrors LocalizedStringFormatter.format for the datepicker validation messages. */
7
+ export declare function formatDateFieldError(locale: string, key: DateFieldErrorKey, args?: DateFieldErrorArgs): string;
8
+ /** Mirrors @react-stately/datepicker getPlaceholder. */
9
+ export declare function getPlaceholder(field: string, value: string, locale: string): string;
10
+ export {};
@@ -21,6 +21,14 @@ export declare class ListCollection<T = unknown> implements Collection<T> {
21
21
  getLastKey(): Key | null;
22
22
  getChildren(key: Key): Iterable<CollectionNode<T>>;
23
23
  getTextValue(key: Key): string;
24
+ /**
25
+ * Filter the collection, returning a new `ListCollection` containing only the
26
+ * item nodes for which `filterFn(node.textValue, node)` returns true. Sections
27
+ * whose children are all filtered out are dropped; surviving sections are
28
+ * rebuilt with their filtered children. Node order is preserved. Mirrors the
29
+ * behaviour of @react-aria/collections `BaseCollection.filter`.
30
+ */
31
+ filter(filterFn: (nodeValue: string, node: CollectionNode<T>) => boolean): ListCollection<T>;
24
32
  /**
25
33
  * Get all items (excluding sections, including items within sections).
26
34
  */
@@ -56,6 +56,18 @@ export interface ListState<T = unknown> extends SelectionState {
56
56
  * Creates state for a list component with selection.
57
57
  */
58
58
  export declare function createListState<T = unknown>(props: MaybeAccessor<ListStateProps<T>>): ListState<T>;
59
+ /** A collection filter predicate: `(nodeTextValue, node) => keep`. */
60
+ export type ListFilterFn<T = unknown> = (nodeValue: string, node: CollectionNode<T>) => boolean;
61
+ /**
62
+ * Wraps a {@link ListState} so its collection is filtered by `filterFn`, returning
63
+ * a new (reactive) ListState. Mirrors @react-stately's `UNSTABLE_useFilteredListState`
64
+ * (used by Autocomplete): the filter re-runs as the predicate — which typically
65
+ * closes over the current input value — or the base collection changes; a single
66
+ * stable, collection-aware manager reads the narrowed collection live and shares
67
+ * the base selection/focus state; and the focused key is reset to the nearest
68
+ * surviving item when the current one is filtered out.
69
+ */
70
+ export declare function createFilteredListState<T = unknown>(state: ListState<T>, filterFn: Accessor<ListFilterFn<T> | null | undefined>): ListState<T>;
59
71
  /**
60
72
  * Props for single selection list state.
61
73
  */
@@ -8,4 +8,12 @@ export declare function getChildNodes<T>(node: CollectionNode<T>, collection: Co
8
8
  export declare function getFirstItem<T>(iterable: Iterable<T>): T | undefined;
9
9
  export declare function getNthItem<T>(iterable: Iterable<T>, index: number): T | undefined;
10
10
  export declare function getLastItem<T>(iterable: Iterable<T>): T | undefined;
11
+ /**
12
+ * Counts the item nodes (recursing into sections, ignoring section headers and
13
+ * other non-item nodes) in a collection. Faithful port of
14
+ * @react-stately/collections `getItemCount`; used by createOption to populate
15
+ * `aria-setsize` when the listbox is virtualized. Cached per (immutable)
16
+ * collection identity, exactly like upstream.
17
+ */
18
+ export declare function getItemCount<T>(collection: Collection<T>): number;
11
19
  export declare function compareNodeOrder<T>(collection: Collection<T>, a: CollectionNode<T>, b: CollectionNode<T>): number;
@@ -1,6 +1,6 @@
1
1
  export type { Key, SelectionMode, SelectionBehavior, Selection, FocusStrategy, DisabledBehavior, CollectionNode, Collection, ItemProps, SectionProps, CollectionBase, SingleSelection, MultipleSelection, } from "./types";
2
2
  export { ListCollection, createListCollection } from "./ListCollection";
3
- export { getChildNodes, getFirstItem, getNthItem, getLastItem, compareNodeOrder, } from "./getChildNodes";
3
+ export { getChildNodes, getFirstItem, getNthItem, getLastItem, getItemCount, compareNodeOrder, } from "./getChildNodes";
4
4
  export { createSelectionState, type SelectionStateProps, type SelectionState, type SelectionPressEvent, } from "./createSelectionState";
5
- export { createListState, createSingleSelectListState, type ListStateProps, type ListState, type SingleSelectListStateProps, type SingleSelectListState, } from "./createListState";
5
+ export { createListState, createFilteredListState, createSingleSelectListState, type ListStateProps, type ListState, type ListFilterFn, type SingleSelectListStateProps, type SingleSelectListState, } from "./createListState";
6
6
  export { createMenuState, createMenuTriggerState, type MenuStateProps, type MenuState, type MenuTriggerStateProps, type MenuTriggerState, } from "./createMenuState";
@@ -70,6 +70,15 @@ export interface Collection<T = unknown> extends Iterable<CollectionNode<T>> {
70
70
  getChildren(key: Key): Iterable<CollectionNode<T>>;
71
71
  /** Get the text value for a key. */
72
72
  getTextValue(key: Key): string;
73
+ /**
74
+ * Filter the collection, returning a new collection containing only the item
75
+ * nodes for which `filterFn` returns true. Sections whose children are all
76
+ * filtered out are dropped. Mirrors @react-aria/collections
77
+ * `BaseCollection.filter` (and the optional `Collection.filter` in
78
+ * @react-types/shared). Used by Autocomplete to narrow the collection as the
79
+ * user types.
80
+ */
81
+ filter?(filterFn: (nodeValue: string, node: CollectionNode<T>) => boolean): Collection<T>;
73
82
  }
74
83
  /**
75
84
  * Structural shape expected when inferring collection item properties
@@ -80,6 +89,9 @@ export interface CollectionItemLike {
80
89
  id?: Key;
81
90
  textValue?: string;
82
91
  label?: string;
92
+ /** Conventional display fields, read when no textValue/label/getTextValue is given. */
93
+ name?: string;
94
+ title?: string;
83
95
  isDisabled?: boolean;
84
96
  }
85
97
  /**
@@ -0,0 +1,14 @@
1
+ export type ColorStringKey = "hue" | "saturation" | "lightness" | "brightness" | "red" | "green" | "blue" | "alpha" | "colorName" | "transparentColorName" | "very dark" | "dark" | "light" | "very light" | "pale" | "grayish" | "vibrant" | "black" | "white" | "gray" | "pink" | "pink red" | "red orange" | "brown" | "orange" | "orange yellow" | "brown yellow" | "yellow" | "yellow green" | "green cyan" | "cyan" | "cyan blue" | "blue purple" | "purple" | "purple magenta" | "magenta" | "magenta pink";
2
+ export declare const colorStrings: Record<string, Record<ColorStringKey, string>>;
3
+ /**
4
+ * Mirrors LocalizedStringDictionary.getStringForLocale: exact-locale match,
5
+ * then language-only match (e.g. "ar" for "ar-AE"), then the en-US fallback.
6
+ * Ported so solid-stately's Color needs no @internationalized/string dependency.
7
+ */
8
+ export declare function getColorStringForLocale(key: ColorStringKey, locale: string): string;
9
+ /**
10
+ * Mirrors LocalizedStringFormatter.format for the plain `{variable}` messages
11
+ * used by color names (colorName / transparentColorName). Substitutes each
12
+ * `{name}` token with the matching variable's string value.
13
+ */
14
+ export declare function formatColorMessage(key: ColorStringKey, locale: string, variables: Record<string, string>): string;
@@ -5,6 +5,7 @@
5
5
  */
6
6
  import { type Accessor } from "solid-js";
7
7
  import type { DropItem, DropTarget, DropOperation, DragTypes, DroppableCollectionEnterEvent, DroppableCollectionActivateEvent, DroppableCollectionExitEvent, DroppableCollectionDropEvent, DroppableCollectionInsertDropEvent, DroppableCollectionRootDropEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, ItemDropTarget } from "./types";
8
+ import type { Collection } from "../collections/types";
8
9
  export interface DroppableCollectionStateOptions {
9
10
  /**
10
11
  * The drag types that the droppable collection accepts.
@@ -35,6 +36,14 @@ export interface DroppableCollectionStateOptions {
35
36
  onMove?: (e: DroppableCollectionReorderEvent) => void;
36
37
  /** A function returning whether a given target is a valid "on" drop target. */
37
38
  shouldAcceptItemDrop?: (target: ItemDropTarget, types: DragTypes) => boolean;
39
+ /**
40
+ * The host collection. Used by the default drop-operation feature detection to
41
+ * confirm a reorder stays within the same parent and to prevent dropping an
42
+ * item onto itself or a descendant. Optional: a flat collection (e.g. a plain
43
+ * ListBox) is always "within parent" and has no descendants, so omitting it is
44
+ * faithful for flat hosts.
45
+ */
46
+ collection?: Collection<unknown>;
38
47
  /** Whether the droppable collection is disabled. */
39
48
  isDisabled?: boolean;
40
49
  }
@@ -59,8 +68,14 @@ export interface DroppableCollectionState {
59
68
  activateTarget(x: number, y: number): void;
60
69
  /** Perform a drop on the collection. */
61
70
  drop(items: DropItem[], dropOperation: DropOperation, isInternal: boolean, draggingKeys?: Set<string | number>): void;
62
- /** Get the drop operation for a target. */
63
- getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[]): DropOperation;
71
+ /**
72
+ * Get the drop operation for a target. `isInternal` is true when the active
73
+ * drag originated from this same collection; `draggingKeys` are the keys being
74
+ * dragged. Both feed the handler-aware feature detection that decides whether a
75
+ * given drop position (before/after/on/root) is a valid target — e.g. a
76
+ * reorder-only collection rejects "on" targets, matching React Aria.
77
+ */
78
+ getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[], isInternal?: boolean, draggingKeys?: Set<string | number>): DropOperation;
64
79
  /** Check if an item drop should be accepted. */
65
80
  shouldAcceptItemDrop(target: ItemDropTarget, types: DragTypes): boolean;
66
81
  }
package/dist/index.d.ts CHANGED
@@ -4,7 +4,7 @@ export { createTextFieldState, type TextFieldStateOptions, type TextFieldState }
4
4
  export { createCheckboxGroupState, type CheckboxGroupProps, type CheckboxGroupState, } from "./checkbox";
5
5
  export { createRadioGroupState, radioGroupSyncVersion, type RadioGroupProps, type RadioGroupState, } from "./radio";
6
6
  export { createOverlayTriggerState, type OverlayTriggerProps, type OverlayTriggerState, } from "./overlays";
7
- export { type Key, type SelectionMode, type SelectionBehavior, type Selection, type FocusStrategy, type DisabledBehavior, type CollectionNode, type Collection, type ItemProps, type SectionProps, type CollectionBase, type SingleSelection, type MultipleSelection, ListCollection, createListCollection, createSelectionState, type SelectionStateProps, type SelectionState, type SelectionPressEvent, createListState, createSingleSelectListState, type ListStateProps, type ListState, type SingleSelectListStateProps, type SingleSelectListState, createMenuState, createMenuTriggerState, type MenuStateProps, type MenuState, type MenuTriggerStateProps, type MenuTriggerState, } from "./collections";
7
+ export { type Key, type SelectionMode, type SelectionBehavior, type Selection, type FocusStrategy, type DisabledBehavior, type CollectionNode, type Collection, type ItemProps, type SectionProps, type CollectionBase, type SingleSelection, type MultipleSelection, ListCollection, createListCollection, getItemCount, createSelectionState, type SelectionStateProps, type SelectionState, type SelectionPressEvent, createListState, createFilteredListState, createSingleSelectListState, type ListStateProps, type ListState, type ListFilterFn, type SingleSelectListStateProps, type SingleSelectListState, createMenuState, createMenuTriggerState, type MenuStateProps, type MenuState, type MenuTriggerStateProps, type MenuTriggerState, } from "./collections";
8
8
  export { useMultipleSelectionState, type MultipleSelectionStateProps, type MultipleSelectionState, SelectionManager, type SelectionManagerOptions, type LayoutDelegate, } from "./selection";
9
9
  export { useMenuTriggerState } from "./menu";
10
10
  export { useDateFieldState, useDatePickerState, useDateRangePickerState, useTimeFieldState, type DateFieldStateOptions, type DatePickerStateOptions, type DateRangePickerStateOptions, type TimeFieldStateOptions, type SegmentType, } from "./datepicker";