@proyecto-viviana/solid-stately 0.1.2 → 0.1.4

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 (74) hide show
  1. package/dist/index.d.ts +3363 -25
  2. package/dist/index.js +2 -2
  3. package/dist/index.js.map +1 -7
  4. package/package.json +4 -3
  5. package/dist/autocomplete/createAutocompleteState.d.ts +0 -45
  6. package/dist/autocomplete/index.d.ts +0 -1
  7. package/dist/calendar/createCalendarState.d.ts +0 -129
  8. package/dist/calendar/createDateFieldState.d.ts +0 -109
  9. package/dist/calendar/createRangeCalendarState.d.ts +0 -145
  10. package/dist/calendar/createTimeFieldState.d.ts +0 -94
  11. package/dist/calendar/index.d.ts +0 -6
  12. package/dist/checkbox/createCheckboxGroupState.d.ts +0 -70
  13. package/dist/checkbox/index.d.ts +0 -1
  14. package/dist/collections/ListCollection.d.ts +0 -36
  15. package/dist/collections/createListState.d.ts +0 -78
  16. package/dist/collections/createMenuState.d.ts +0 -49
  17. package/dist/collections/createSelectionState.d.ts +0 -75
  18. package/dist/collections/index.d.ts +0 -5
  19. package/dist/collections/types.d.ts +0 -146
  20. package/dist/color/Color.d.ts +0 -27
  21. package/dist/color/createColorAreaState.d.ts +0 -75
  22. package/dist/color/createColorFieldState.d.ts +0 -54
  23. package/dist/color/createColorSliderState.d.ts +0 -66
  24. package/dist/color/createColorWheelState.d.ts +0 -50
  25. package/dist/color/index.d.ts +0 -9
  26. package/dist/color/types.d.ts +0 -105
  27. package/dist/combobox/createComboBoxState.d.ts +0 -124
  28. package/dist/combobox/index.d.ts +0 -4
  29. package/dist/disclosure/createDisclosureState.d.ts +0 -63
  30. package/dist/disclosure/index.d.ts +0 -1
  31. package/dist/dnd/createDragState.d.ts +0 -58
  32. package/dist/dnd/createDraggableCollectionState.d.ts +0 -56
  33. package/dist/dnd/createDropState.d.ts +0 -60
  34. package/dist/dnd/createDroppableCollectionState.d.ts +0 -77
  35. package/dist/dnd/index.d.ts +0 -10
  36. package/dist/dnd/types.d.ts +0 -263
  37. package/dist/form/createFormValidationState.d.ts +0 -99
  38. package/dist/form/index.d.ts +0 -1
  39. package/dist/grid/createGridState.d.ts +0 -11
  40. package/dist/grid/index.d.ts +0 -6
  41. package/dist/grid/types.d.ts +0 -155
  42. package/dist/numberfield/createNumberFieldState.d.ts +0 -64
  43. package/dist/numberfield/index.d.ts +0 -1
  44. package/dist/overlays/createOverlayTriggerState.d.ts +0 -31
  45. package/dist/overlays/index.d.ts +0 -1
  46. package/dist/radio/createRadioGroupState.d.ts +0 -76
  47. package/dist/radio/index.d.ts +0 -1
  48. package/dist/searchfield/createSearchFieldState.d.ts +0 -24
  49. package/dist/searchfield/index.d.ts +0 -2
  50. package/dist/select/createSelectState.d.ts +0 -72
  51. package/dist/select/index.d.ts +0 -1
  52. package/dist/slider/createSliderState.d.ts +0 -71
  53. package/dist/slider/index.d.ts +0 -2
  54. package/dist/ssr/index.d.ts +0 -27
  55. package/dist/table/TableCollection.d.ts +0 -51
  56. package/dist/table/createTableState.d.ts +0 -11
  57. package/dist/table/index.d.ts +0 -7
  58. package/dist/table/types.d.ts +0 -138
  59. package/dist/tabs/createTabListState.d.ts +0 -67
  60. package/dist/tabs/index.d.ts +0 -1
  61. package/dist/textfield/createTextFieldState.d.ts +0 -29
  62. package/dist/textfield/index.d.ts +0 -1
  63. package/dist/toast/createToastState.d.ts +0 -117
  64. package/dist/toast/index.d.ts +0 -1
  65. package/dist/toggle/createToggleState.d.ts +0 -33
  66. package/dist/toggle/index.d.ts +0 -1
  67. package/dist/tooltip/createTooltipTriggerState.d.ts +0 -38
  68. package/dist/tooltip/index.d.ts +0 -1
  69. package/dist/tree/TreeCollection.d.ts +0 -39
  70. package/dist/tree/createTreeState.d.ts +0 -13
  71. package/dist/tree/index.d.ts +0 -6
  72. package/dist/tree/types.d.ts +0 -156
  73. package/dist/utils/index.d.ts +0 -1
  74. package/dist/utils/reactivity.d.ts +0 -27
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@proyecto-viviana/solid-stately",
3
- "version": "0.1.2",
3
+ "version": "0.1.4",
4
4
  "description": "A 1-1 SolidJS port of React Stately - headless state management for UI components",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -20,8 +20,9 @@
20
20
  ],
21
21
  "sideEffects": false,
22
22
  "scripts": {
23
- "build": "deno run -A ../../scripts/build.ts solid-stately",
24
- "prepublishOnly": "deno run -A ../../scripts/build.ts solid-stately"
23
+ "build": "tsup",
24
+ "dev": "tsup --watch",
25
+ "prepublishOnly": "bun run build"
25
26
  },
26
27
  "peerDependencies": {
27
28
  "solid-js": "^1.9.0"
@@ -1,45 +0,0 @@
1
- /**
2
- * createAutocompleteState - State management for autocomplete components
3
- *
4
- * Based on @react-stately/autocomplete useAutocompleteState.
5
- */
6
- import { type Accessor } from 'solid-js';
7
- export interface AutocompleteState {
8
- /** The current value of the autocomplete input. */
9
- inputValue: Accessor<string>;
10
- /** Sets the value of the autocomplete input. */
11
- setInputValue(value: string): void;
12
- /** The id of the current aria-activedescendant of the autocomplete input. */
13
- focusedNodeId: Accessor<string | null>;
14
- /** Sets the id of the current aria-activedescendant of the autocomplete input. */
15
- setFocusedNodeId(value: string | null): void;
16
- }
17
- export interface AutocompleteStateOptions {
18
- /** The value of the autocomplete input (controlled). */
19
- inputValue?: string;
20
- /** The default value of the autocomplete input (uncontrolled). */
21
- defaultInputValue?: string;
22
- /** Handler that is called when the autocomplete input value changes. */
23
- onInputChange?: (value: string) => void;
24
- }
25
- /**
26
- * Provides state management for an autocomplete component.
27
- *
28
- * @example
29
- * ```tsx
30
- * const state = createAutocompleteState({
31
- * defaultInputValue: '',
32
- * onInputChange: (value) => console.log('Input changed:', value),
33
- * });
34
- *
35
- * // Access current input value
36
- * console.log(state.inputValue());
37
- *
38
- * // Update input value
39
- * state.setInputValue('new value');
40
- *
41
- * // Track focused node for aria-activedescendant
42
- * state.setFocusedNodeId('item-1');
43
- * ```
44
- */
45
- export declare function createAutocompleteState(props?: AutocompleteStateOptions): AutocompleteState;
@@ -1 +0,0 @@
1
- export { createAutocompleteState, type AutocompleteState, type AutocompleteStateOptions, } from './createAutocompleteState';
@@ -1,129 +0,0 @@
1
- /**
2
- * CalendarState for Solid-Stately
3
- *
4
- * Provides state management for calendar components.
5
- * Based on @react-stately/calendar useCalendarState
6
- */
7
- import { type Accessor } from 'solid-js';
8
- import { type CalendarDate, type DateValue } from '@internationalized/date';
9
- import { type MaybeAccessor } from '../utils';
10
- export type ValidationState = 'valid' | 'invalid';
11
- export interface CalendarStateProps<T extends DateValue = DateValue> {
12
- /** The current value (controlled). */
13
- value?: MaybeAccessor<T | null>;
14
- /** The default value (uncontrolled). */
15
- defaultValue?: T | null;
16
- /** Handler called when the value changes. */
17
- onChange?: (value: T) => void;
18
- /** The minimum allowed date. */
19
- minValue?: MaybeAccessor<DateValue | undefined>;
20
- /** The maximum allowed date. */
21
- maxValue?: MaybeAccessor<DateValue | undefined>;
22
- /** Whether the calendar is disabled. */
23
- isDisabled?: MaybeAccessor<boolean>;
24
- /** Whether the calendar is read-only. */
25
- isReadOnly?: MaybeAccessor<boolean>;
26
- /** Whether dates outside the visible range are automatically focused. */
27
- autoFocus?: boolean;
28
- /** The date that is focused when the calendar first mounts. */
29
- focusedValue?: MaybeAccessor<DateValue | undefined>;
30
- /** The default focused date (uncontrolled). */
31
- defaultFocusedValue?: DateValue;
32
- /** Handler called when the focused date changes. */
33
- onFocusChange?: (date: CalendarDate) => void;
34
- /** The locale to use for formatting. */
35
- locale?: string;
36
- /** Callback that is called for each date in the calendar to determine if it is unavailable. */
37
- isDateUnavailable?: (date: DateValue) => boolean;
38
- /** The number of months to display at once. */
39
- visibleMonths?: number;
40
- /** Whether to automatically focus the calendar when it is mounted. */
41
- autoFocusOnMount?: boolean;
42
- /** Controls which days are disabled. */
43
- isDateDisabled?: (date: DateValue) => boolean;
44
- /** Validation state. */
45
- validationState?: MaybeAccessor<ValidationState | undefined>;
46
- /** Error message. */
47
- errorMessage?: string;
48
- /** The first day of the week (0 = Sunday, 1 = Monday, etc.). */
49
- firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
50
- }
51
- export interface CalendarState<T extends DateValue = DateValue> {
52
- /** The currently selected date. */
53
- value: Accessor<T | null>;
54
- /** Sets the selected date. */
55
- setValue: (value: T | null) => void;
56
- /** The currently focused date. */
57
- focusedDate: Accessor<CalendarDate>;
58
- /** Sets the focused date. */
59
- setFocusedDate: (date: CalendarDate) => void;
60
- /** Whether the calendar is disabled. */
61
- isDisabled: Accessor<boolean>;
62
- /** Whether the calendar is read-only. */
63
- isReadOnly: Accessor<boolean>;
64
- /** The visible date range (first and last day of visible month(s)). */
65
- visibleRange: Accessor<{
66
- start: CalendarDate;
67
- end: CalendarDate;
68
- }>;
69
- /** The timezone used for date calculations. */
70
- timeZone: string;
71
- /** The validation state. */
72
- validationState: Accessor<ValidationState | undefined>;
73
- /** Whether a date is selected. */
74
- isSelected: (date: DateValue) => boolean;
75
- /** Whether a date is focused. */
76
- isCellFocused: (date: DateValue) => boolean;
77
- /** Whether a date is unavailable. */
78
- isCellUnavailable: (date: DateValue) => boolean;
79
- /** Whether a date is disabled. */
80
- isCellDisabled: (date: DateValue) => boolean;
81
- /** Whether a date is outside the visible range. */
82
- isOutsideVisibleRange: (date: DateValue) => boolean;
83
- /** Whether a date is invalid. */
84
- isInvalid: (date: DateValue) => boolean;
85
- /** Moves focus to the previous page (month). */
86
- focusPreviousPage: () => void;
87
- /** Moves focus to the next page (month). */
88
- focusNextPage: () => void;
89
- /** Moves focus to the previous section (year). */
90
- focusPreviousSection: () => void;
91
- /** Moves focus to the next section (year). */
92
- focusNextSection: () => void;
93
- /** Moves focus to the previous day. */
94
- focusPreviousDay: () => void;
95
- /** Moves focus to the next day. */
96
- focusNextDay: () => void;
97
- /** Moves focus to the previous week. */
98
- focusPreviousWeek: () => void;
99
- /** Moves focus to the next week. */
100
- focusNextWeek: () => void;
101
- /** Moves focus to the start of the month. */
102
- focusPageStart: () => void;
103
- /** Moves focus to the end of the month. */
104
- focusPageEnd: () => void;
105
- /** Selects the focused date. */
106
- selectFocusedDate: () => void;
107
- /** Selects a specific date. */
108
- selectDate: (date: CalendarDate) => void;
109
- /** Whether focus is currently within the calendar. */
110
- isFocused: Accessor<boolean>;
111
- /** Sets whether focus is within the calendar. */
112
- setFocused: (focused: boolean) => void;
113
- /** Gets the dates for a week in the visible range. */
114
- getDatesInWeek: (weekIndex: number, monthStartDate?: CalendarDate) => (CalendarDate | null)[];
115
- /** Gets the number of weeks in a month. */
116
- getWeeksInMonth: (date?: CalendarDate) => number;
117
- /** The week day headers. */
118
- weekDays: Accessor<string[]>;
119
- /** The title for the calendar (formatted month and year). */
120
- title: Accessor<string>;
121
- /** The number of visible months. */
122
- visibleMonths: number;
123
- /** Whether the calendar is paginating (for animations). */
124
- isPaginating: Accessor<boolean>;
125
- }
126
- /**
127
- * Provides state management for a calendar component.
128
- */
129
- export declare function createCalendarState<T extends DateValue = CalendarDate>(props?: CalendarStateProps<T>): CalendarState<T>;
@@ -1,109 +0,0 @@
1
- /**
2
- * DateFieldState for Solid-Stately
3
- *
4
- * Provides state management for date field components with segment-based editing.
5
- * Based on @react-stately/datepicker useDateFieldState
6
- */
7
- import { type Accessor } from 'solid-js';
8
- import { type CalendarDate, type DateValue } from '@internationalized/date';
9
- import { type MaybeAccessor } from '../utils';
10
- import type { ValidationState } from './createCalendarState';
11
- export type DateSegmentType = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second' | 'dayPeriod' | 'era' | 'timeZoneName' | 'literal';
12
- export interface DateSegment {
13
- /** The type of segment. */
14
- type: DateSegmentType;
15
- /** The text content of the segment. */
16
- text: string;
17
- /** The numeric value of the segment (if applicable). */
18
- value?: number;
19
- /** The minimum value for the segment. */
20
- minValue?: number;
21
- /** The maximum value for the segment. */
22
- maxValue?: number;
23
- /** Whether this segment is editable. */
24
- isEditable: boolean;
25
- /** Whether this segment is a placeholder. */
26
- isPlaceholder: boolean;
27
- /** A placeholder string for the segment. */
28
- placeholder: string;
29
- }
30
- export interface DateFieldStateProps<T extends DateValue = DateValue> {
31
- /** The current value (controlled). */
32
- value?: MaybeAccessor<T | null>;
33
- /** The default value (uncontrolled). */
34
- defaultValue?: T | null;
35
- /** Handler called when the value changes. */
36
- onChange?: (value: T | null) => void;
37
- /** The minimum allowed date. */
38
- minValue?: MaybeAccessor<DateValue | undefined>;
39
- /** The maximum allowed date. */
40
- maxValue?: MaybeAccessor<DateValue | undefined>;
41
- /** Whether the field is disabled. */
42
- isDisabled?: MaybeAccessor<boolean>;
43
- /** Whether the field is read-only. */
44
- isReadOnly?: MaybeAccessor<boolean>;
45
- /** Whether the field is required. */
46
- isRequired?: MaybeAccessor<boolean>;
47
- /** The locale to use for formatting. */
48
- locale?: string;
49
- /** The granularity of the date/time (day, hour, minute, second). */
50
- granularity?: 'day' | 'hour' | 'minute' | 'second';
51
- /** Whether to show the hour in 12 or 24 hour format. */
52
- hourCycle?: 12 | 24;
53
- /** Whether to hide the time zone. */
54
- hideTimeZone?: boolean;
55
- /** The placeholder date (determines segment structure). */
56
- placeholderValue?: DateValue;
57
- /** Validation state. */
58
- validationState?: MaybeAccessor<ValidationState | undefined>;
59
- /** Description text. */
60
- description?: string;
61
- /** Error message. */
62
- errorMessage?: string;
63
- /** Whether dates outside the min/max range are allowed. */
64
- allowsNonContiguousRanges?: boolean;
65
- /** Whether to create a date or datetime. */
66
- createCalendar?: (name: string) => unknown;
67
- }
68
- export interface DateFieldState<T extends DateValue = DateValue> {
69
- /** The current value. */
70
- value: Accessor<T | null>;
71
- /** The date value (may be partial during editing). */
72
- dateValue: Accessor<DateValue | null>;
73
- /** Sets the date value. */
74
- setValue: (value: T | null) => void;
75
- /** The segments that make up the date. */
76
- segments: Accessor<DateSegment[]>;
77
- /** The format string. */
78
- formatValue: (fieldOptions?: Intl.DateTimeFormatOptions) => string;
79
- /** Sets a segment value. */
80
- setSegment: (type: DateSegmentType, value: number) => void;
81
- /** Increments a segment. */
82
- incrementSegment: (type: DateSegmentType) => void;
83
- /** Decrements a segment. */
84
- decrementSegment: (type: DateSegmentType) => void;
85
- /** Clears a segment. */
86
- clearSegment: (type: DateSegmentType) => void;
87
- /** Confirms the value (after typing). */
88
- confirmPlaceholder: () => void;
89
- /** Whether the field is disabled. */
90
- isDisabled: Accessor<boolean>;
91
- /** Whether the field is read-only. */
92
- isReadOnly: Accessor<boolean>;
93
- /** Whether the field is required. */
94
- isRequired: Accessor<boolean>;
95
- /** The validation state. */
96
- validationState: Accessor<ValidationState | undefined>;
97
- /** The granularity. */
98
- granularity: 'day' | 'hour' | 'minute' | 'second';
99
- /** Whether the value is invalid. */
100
- isInvalid: Accessor<boolean>;
101
- /** The locale. */
102
- locale: string;
103
- /** The time zone. */
104
- timeZone: string;
105
- }
106
- /**
107
- * Provides state management for a date field component.
108
- */
109
- export declare function createDateFieldState<T extends DateValue = CalendarDate>(props?: DateFieldStateProps<T>): DateFieldState<T>;
@@ -1,145 +0,0 @@
1
- /**
2
- * RangeCalendarState for Solid-Stately
3
- *
4
- * Provides state management for range calendar components.
5
- * Based on @react-stately/calendar useRangeCalendarState
6
- */
7
- import { type Accessor } from 'solid-js';
8
- import { type CalendarDate, type DateValue } from '@internationalized/date';
9
- import { type MaybeAccessor } from '../utils';
10
- import type { ValidationState } from './createCalendarState';
11
- export interface DateRange {
12
- start: CalendarDate;
13
- end: CalendarDate;
14
- }
15
- export interface RangeValue<T> {
16
- start: T;
17
- end: T;
18
- }
19
- export interface RangeCalendarStateProps<T extends DateValue = DateValue> {
20
- /** The current value (controlled). */
21
- value?: MaybeAccessor<RangeValue<T> | null>;
22
- /** The default value (uncontrolled). */
23
- defaultValue?: RangeValue<T> | null;
24
- /** Handler called when the value changes. */
25
- onChange?: (value: RangeValue<T>) => void;
26
- /** The minimum allowed date. */
27
- minValue?: MaybeAccessor<DateValue | undefined>;
28
- /** The maximum allowed date. */
29
- maxValue?: MaybeAccessor<DateValue | undefined>;
30
- /** Whether the calendar is disabled. */
31
- isDisabled?: MaybeAccessor<boolean>;
32
- /** Whether the calendar is read-only. */
33
- isReadOnly?: MaybeAccessor<boolean>;
34
- /** The date that is focused when the calendar first mounts. */
35
- focusedValue?: MaybeAccessor<DateValue | undefined>;
36
- /** The default focused date (uncontrolled). */
37
- defaultFocusedValue?: DateValue;
38
- /** Handler called when the focused date changes. */
39
- onFocusChange?: (date: CalendarDate) => void;
40
- /** The locale to use for formatting. */
41
- locale?: string;
42
- /** Callback to determine if a date is unavailable. */
43
- isDateUnavailable?: (date: DateValue) => boolean;
44
- /** The number of months to display at once. */
45
- visibleMonths?: number;
46
- /** Controls which days are disabled. */
47
- isDateDisabled?: (date: DateValue) => boolean;
48
- /** Validation state. */
49
- validationState?: MaybeAccessor<ValidationState | undefined>;
50
- /** Whether to allow selecting the same date for start and end. */
51
- allowsNonContiguousRanges?: boolean;
52
- /** The first day of the week (0 = Sunday, 1 = Monday, etc.). */
53
- firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
54
- }
55
- export interface RangeCalendarState<T extends DateValue = DateValue> {
56
- /** The currently selected date range. */
57
- value: Accessor<RangeValue<T> | null>;
58
- /** Sets the selected date range. */
59
- setValue: (value: RangeValue<T> | null) => void;
60
- /** The currently focused date. */
61
- focusedDate: Accessor<CalendarDate>;
62
- /** Sets the focused date. */
63
- setFocusedDate: (date: CalendarDate) => void;
64
- /** The anchor date when selecting a range (first click). */
65
- anchorDate: Accessor<CalendarDate | null>;
66
- /** Sets the anchor date. */
67
- setAnchorDate: (date: CalendarDate | null) => void;
68
- /** The highlighted range during selection. */
69
- highlightedRange: Accessor<RangeValue<CalendarDate> | null>;
70
- /** Whether the calendar is disabled. */
71
- isDisabled: Accessor<boolean>;
72
- /** Whether the calendar is read-only. */
73
- isReadOnly: Accessor<boolean>;
74
- /** The visible date range (first and last day of visible month(s)). */
75
- visibleRange: Accessor<{
76
- start: CalendarDate;
77
- end: CalendarDate;
78
- }>;
79
- /** The timezone used for date calculations. */
80
- timeZone: string;
81
- /** The validation state. */
82
- validationState: Accessor<ValidationState | undefined>;
83
- /** Whether a date is within the selected range. */
84
- isSelected: (date: DateValue) => boolean;
85
- /** Whether a date is the start of the selection. */
86
- isSelectionStart: (date: DateValue) => boolean;
87
- /** Whether a date is the end of the selection. */
88
- isSelectionEnd: (date: DateValue) => boolean;
89
- /** Whether a date is focused. */
90
- isCellFocused: (date: DateValue) => boolean;
91
- /** Whether a date is unavailable. */
92
- isCellUnavailable: (date: DateValue) => boolean;
93
- /** Whether a date is disabled. */
94
- isCellDisabled: (date: DateValue) => boolean;
95
- /** Whether a date is outside the visible range. */
96
- isOutsideVisibleRange: (date: DateValue) => boolean;
97
- /** Whether a date is invalid. */
98
- isInvalid: (date: DateValue) => boolean;
99
- /** Moves focus to the previous page (month). */
100
- focusPreviousPage: () => void;
101
- /** Moves focus to the next page (month). */
102
- focusNextPage: () => void;
103
- /** Moves focus to the previous section (year). */
104
- focusPreviousSection: () => void;
105
- /** Moves focus to the next section (year). */
106
- focusNextSection: () => void;
107
- /** Moves focus to the previous day. */
108
- focusPreviousDay: () => void;
109
- /** Moves focus to the next day. */
110
- focusNextDay: () => void;
111
- /** Moves focus to the previous week. */
112
- focusPreviousWeek: () => void;
113
- /** Moves focus to the next week. */
114
- focusNextWeek: () => void;
115
- /** Moves focus to the start of the month. */
116
- focusPageStart: () => void;
117
- /** Moves focus to the end of the month. */
118
- focusPageEnd: () => void;
119
- /** Selects the focused date. */
120
- selectFocusedDate: () => void;
121
- /** Selects a specific date. */
122
- selectDate: (date: CalendarDate) => void;
123
- /** Whether focus is currently within the calendar. */
124
- isFocused: Accessor<boolean>;
125
- /** Sets whether focus is within the calendar. */
126
- setFocused: (focused: boolean) => void;
127
- /** Gets the dates for a week in the visible range. */
128
- getDatesInWeek: (weekIndex: number, monthStartDate?: CalendarDate) => (CalendarDate | null)[];
129
- /** Gets the number of weeks in a month. */
130
- getWeeksInMonth: (date?: CalendarDate) => number;
131
- /** The week day headers. */
132
- weekDays: Accessor<string[]>;
133
- /** The title for the calendar (formatted month and year). */
134
- title: Accessor<string>;
135
- /** The number of visible months. */
136
- visibleMonths: number;
137
- /** Whether the user is currently selecting a range. */
138
- isDragging: Accessor<boolean>;
139
- /** Sets whether the user is dragging to select. */
140
- setDragging: (dragging: boolean) => void;
141
- }
142
- /**
143
- * Provides state management for a range calendar component.
144
- */
145
- export declare function createRangeCalendarState<T extends DateValue = CalendarDate>(props?: RangeCalendarStateProps<T>): RangeCalendarState<T>;
@@ -1,94 +0,0 @@
1
- /**
2
- * TimeFieldState for Solid-Stately
3
- *
4
- * Provides state management for time field components with segment-based editing.
5
- * Based on @react-stately/datepicker useTimeFieldState
6
- */
7
- import { type Accessor } from 'solid-js';
8
- import { type Time, type CalendarDateTime, type ZonedDateTime } from '@internationalized/date';
9
- import { type MaybeAccessor } from '../utils';
10
- import type { ValidationState } from './createCalendarState';
11
- export type TimeValue = Time | CalendarDateTime | ZonedDateTime;
12
- export type TimeSegmentType = 'hour' | 'minute' | 'second' | 'dayPeriod' | 'literal';
13
- export interface TimeSegment {
14
- /** The type of segment. */
15
- type: TimeSegmentType;
16
- /** The text content of the segment. */
17
- text: string;
18
- /** The numeric value of the segment (if applicable). */
19
- value?: number;
20
- /** The minimum value for the segment. */
21
- minValue?: number;
22
- /** The maximum value for the segment. */
23
- maxValue?: number;
24
- /** Whether this segment is editable. */
25
- isEditable: boolean;
26
- /** Whether this segment is a placeholder. */
27
- isPlaceholder: boolean;
28
- /** A placeholder string for the segment. */
29
- placeholder: string;
30
- }
31
- export interface TimeFieldStateProps<T extends TimeValue = Time> {
32
- /** The current value (controlled). */
33
- value?: MaybeAccessor<T | null>;
34
- /** The default value (uncontrolled). */
35
- defaultValue?: T | null;
36
- /** Handler called when the value changes. */
37
- onChange?: (value: T | null) => void;
38
- /** The minimum allowed time. */
39
- minValue?: MaybeAccessor<TimeValue | undefined>;
40
- /** The maximum allowed time. */
41
- maxValue?: MaybeAccessor<TimeValue | undefined>;
42
- /** Whether the field is disabled. */
43
- isDisabled?: MaybeAccessor<boolean>;
44
- /** Whether the field is read-only. */
45
- isReadOnly?: MaybeAccessor<boolean>;
46
- /** Whether the field is required. */
47
- isRequired?: MaybeAccessor<boolean>;
48
- /** The locale to use for formatting. */
49
- locale?: string;
50
- /** The granularity (hour, minute, second). */
51
- granularity?: 'hour' | 'minute' | 'second';
52
- /** Whether to show 12 or 24 hour format. */
53
- hourCycle?: 12 | 24;
54
- /** Validation state. */
55
- validationState?: MaybeAccessor<ValidationState | undefined>;
56
- /** The placeholder value. */
57
- placeholderValue?: T;
58
- }
59
- export interface TimeFieldState<T extends TimeValue = Time> {
60
- /** The current value. */
61
- value: Accessor<T | null>;
62
- /** Sets the value. */
63
- setValue: (value: T | null) => void;
64
- /** The segments that make up the time. */
65
- segments: Accessor<TimeSegment[]>;
66
- /** Sets a segment value. */
67
- setSegment: (type: TimeSegmentType, value: number) => void;
68
- /** Increments a segment. */
69
- incrementSegment: (type: TimeSegmentType) => void;
70
- /** Decrements a segment. */
71
- decrementSegment: (type: TimeSegmentType) => void;
72
- /** Clears a segment. */
73
- clearSegment: (type: TimeSegmentType) => void;
74
- /** Whether the field is disabled. */
75
- isDisabled: Accessor<boolean>;
76
- /** Whether the field is read-only. */
77
- isReadOnly: Accessor<boolean>;
78
- /** Whether the field is required. */
79
- isRequired: Accessor<boolean>;
80
- /** The validation state. */
81
- validationState: Accessor<ValidationState | undefined>;
82
- /** The granularity. */
83
- granularity: 'hour' | 'minute' | 'second';
84
- /** Whether the value is invalid. */
85
- isInvalid: Accessor<boolean>;
86
- /** The locale. */
87
- locale: string;
88
- /** The hour cycle. */
89
- hourCycle: 12 | 24;
90
- }
91
- /**
92
- * Provides state management for a time field component.
93
- */
94
- export declare function createTimeFieldState<T extends TimeValue = Time>(props?: TimeFieldStateProps<T>): TimeFieldState<T>;
@@ -1,6 +0,0 @@
1
- export { createCalendarState, type CalendarStateProps, type CalendarState, type ValidationState, } from './createCalendarState';
2
- export { createRangeCalendarState, type RangeCalendarStateProps, type RangeCalendarState, type DateRange, type RangeValue, } from './createRangeCalendarState';
3
- export { createDateFieldState, type DateFieldStateProps, type DateFieldState, type DateSegment, type DateSegmentType, } from './createDateFieldState';
4
- export { createTimeFieldState, type TimeFieldStateProps, type TimeFieldState, type TimeSegment, type TimeSegmentType, type TimeValue, } from './createTimeFieldState';
5
- export type { CalendarDate, CalendarDateTime, ZonedDateTime, DateValue, Time, } from '@internationalized/date';
6
- 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';
@@ -1,70 +0,0 @@
1
- /**
2
- * Checkbox group state for Solid Stately
3
- *
4
- * Provides state management for a checkbox group component.
5
- * Provides a name for the group, and manages selection and focus state.
6
- *
7
- * This is a 1:1 port of @react-stately/checkbox's useCheckboxGroupState.
8
- */
9
- import { Accessor } from 'solid-js';
10
- import { type MaybeAccessor } from '../utils';
11
- export interface CheckboxGroupProps {
12
- /** The current selected values (controlled). */
13
- value?: string[];
14
- /** The default selected values (uncontrolled). */
15
- defaultValue?: string[];
16
- /** Handler that is called when the value changes. */
17
- onChange?: (value: string[]) => void;
18
- /** Whether the checkbox group is disabled. */
19
- isDisabled?: boolean;
20
- /** Whether the checkbox group is read only. */
21
- isReadOnly?: boolean;
22
- /** Whether the checkbox group is required. */
23
- isRequired?: boolean;
24
- /** Whether the checkbox group is invalid. */
25
- isInvalid?: boolean;
26
- /** The name of the checkbox group, used when submitting an HTML form. */
27
- name?: string;
28
- /** The form to associate the checkbox group with. */
29
- form?: string;
30
- /** The label for the checkbox group. */
31
- label?: string;
32
- /** Handler that is called when the checkbox group receives focus. */
33
- onFocus?: (e: FocusEvent) => void;
34
- /** Handler that is called when the checkbox group loses focus. */
35
- onBlur?: (e: FocusEvent) => void;
36
- /** Handler that is called when the checkbox group's focus status changes. */
37
- onFocusChange?: (isFocused: boolean) => void;
38
- }
39
- export interface CheckboxGroupState {
40
- /** Current selected values. */
41
- readonly value: Accessor<readonly string[]>;
42
- /** Default selected values. */
43
- readonly defaultValue: readonly string[];
44
- /** Whether the checkbox group is disabled. */
45
- readonly isDisabled: boolean;
46
- /** Whether the checkbox group is read only. */
47
- readonly isReadOnly: boolean;
48
- /** Whether the checkbox group is invalid. */
49
- readonly isInvalid: boolean;
50
- /**
51
- * Whether the checkboxes in the group are required.
52
- * This changes to false once at least one item is selected.
53
- */
54
- readonly isRequired: Accessor<boolean>;
55
- /** Returns whether the given value is selected. */
56
- isSelected(value: string): boolean;
57
- /** Sets the selected values. */
58
- setValue(value: string[]): void;
59
- /** Adds a value to the set of selected values. */
60
- addValue(value: string): void;
61
- /** Removes a value from the set of selected values. */
62
- removeValue(value: string): void;
63
- /** Toggles a value in the set of selected values. */
64
- toggleValue(value: string): void;
65
- }
66
- /**
67
- * Provides state management for a checkbox group component.
68
- * Provides a name for the group, and manages selection and focus state.
69
- */
70
- export declare function createCheckboxGroupState(props?: MaybeAccessor<CheckboxGroupProps>): CheckboxGroupState;
@@ -1 +0,0 @@
1
- export { createCheckboxGroupState, type CheckboxGroupProps, type CheckboxGroupState, } from './createCheckboxGroupState';
@@ -1,36 +0,0 @@
1
- /**
2
- * A simple list collection implementation.
3
- * Provides a Collection interface over an array of nodes.
4
- */
5
- import type { Collection, CollectionNode, Key } from './types';
6
- /**
7
- * A basic implementation of Collection for list-based components.
8
- */
9
- export declare class ListCollection<T = unknown> implements Collection<T> {
10
- private nodes;
11
- private keyMap;
12
- constructor(nodes: CollectionNode<T>[]);
13
- get size(): number;
14
- [Symbol.iterator](): Iterator<CollectionNode<T>>;
15
- getKeys(): Iterable<Key>;
16
- getItem(key: Key): CollectionNode<T> | null;
17
- at(index: number): CollectionNode<T> | null;
18
- getKeyBefore(key: Key): Key | null;
19
- getKeyAfter(key: Key): Key | null;
20
- getFirstKey(): Key | null;
21
- getLastKey(): Key | null;
22
- getChildren(key: Key): Iterable<CollectionNode<T>>;
23
- getTextValue(key: Key): string;
24
- /**
25
- * Get all items (excluding sections, including items within sections).
26
- */
27
- private getAllItems;
28
- }
29
- /**
30
- * Create a collection from an array of items.
31
- */
32
- export declare function createListCollection<T>(items: T[], options?: {
33
- getKey?: (item: T, index: number) => Key;
34
- getTextValue?: (item: T) => string;
35
- getDisabled?: (item: T) => boolean;
36
- }): ListCollection<T>;