@proyecto-viviana/solid-stately 0.0.6 → 0.1.0

package/src/select/createSelectState.d.ts

@@ -0,0 +1,73 @@
+/**
+ * State management for select components.
+ * Based on @react-stately/select useSelectState.
+ */
+import { type Accessor } from 'solid-js';
+import { type MaybeAccessor } from '../utils';
+import type { Key, CollectionNode, Collection } from '../collections/types';
+export interface SelectStateProps<T = unknown> {
+    /** The items to display in the select. */
+    items: T[];
+    /** Function to get the key for an item. */
+    getKey?: (item: T) => Key;
+    /** Function to get the text value for an item. */
+    getTextValue?: (item: T) => string;
+    /** Function to check if an item is disabled. */
+    getDisabled?: (item: T) => boolean;
+    /** Keys of disabled items. */
+    disabledKeys?: Iterable<Key>;
+    /** The currently selected key (controlled). */
+    selectedKey?: Key | null;
+    /** The default selected key (uncontrolled). */
+    defaultSelectedKey?: Key | null;
+    /** Handler called when the selection changes. */
+    onSelectionChange?: (key: Key | null) => void;
+    /** Whether the select is open (controlled). */
+    isOpen?: boolean;
+    /** Whether the select is open by default (uncontrolled). */
+    defaultOpen?: boolean;
+    /** Handler called when the open state changes. */
+    onOpenChange?: (isOpen: boolean) => void;
+    /** Whether the select is disabled. */
+    isDisabled?: boolean;
+    /** Whether the select is required. */
+    isRequired?: boolean;
+}
+export interface SelectState<T = unknown> {
+    /** The collection of items. */
+    readonly collection: Accessor<Collection<T>>;
+    /** Whether the select dropdown is open. */
+    readonly isOpen: Accessor<boolean>;
+    /** Open the select dropdown. */
+    open(): void;
+    /** Close the select dropdown. */
+    close(): void;
+    /** Toggle the select dropdown. */
+    toggle(): void;
+    /** The currently selected key. */
+    readonly selectedKey: Accessor<Key | null>;
+    /** The currently selected item. */
+    readonly selectedItem: Accessor<CollectionNode<T> | null>;
+    /** Set the selected key. */
+    setSelectedKey(key: Key | null): void;
+    /** The currently focused key. */
+    readonly focusedKey: Accessor<Key | null>;
+    /** Set the focused key. */
+    setFocusedKey(key: Key | null): void;
+    /** Whether the select has focus. */
+    readonly isFocused: Accessor<boolean>;
+    /** Set whether the select has focus. */
+    setFocused(isFocused: boolean): void;
+    /** Whether a specific key is disabled. */
+    isKeyDisabled(key: Key): boolean;
+    /** Whether the select is disabled. */
+    readonly isDisabled: boolean;
+    /** Whether the select is required. */
+    readonly isRequired: boolean;
+}
+/**
+ * Creates state for a select component.
+ * Combines list state with overlay trigger state for dropdown behavior.
+ */
+export declare function createSelectState<T = unknown>(props: MaybeAccessor<SelectStateProps<T>>): SelectState<T>;
+//# sourceMappingURL=createSelectState.d.ts.map

package/src/select/createSelectState.d.ts.map

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

package/src/select/createSelectState.ts

@@ -0,0 +1,181 @@
+/**
+ * State management for select components.
+ * Based on @react-stately/select useSelectState.
+ */
+
+import { createSignal, type Accessor } from 'solid-js';
+import { access, type MaybeAccessor } from '../utils';
+import { createListState } from '../collections/createListState';
+import { createOverlayTriggerState } from '../overlays';
+import type { Key, CollectionNode, Collection } from '../collections/types';
+
+export interface SelectStateProps<T = unknown> {
+  /** The items to display in the select. */
+  items: T[];
+  /** Function to get the key for an item. */
+  getKey?: (item: T) => Key;
+  /** Function to get the text value for an item. */
+  getTextValue?: (item: T) => string;
+  /** Function to check if an item is disabled. */
+  getDisabled?: (item: T) => boolean;
+  /** Keys of disabled items. */
+  disabledKeys?: Iterable<Key>;
+  /** The currently selected key (controlled). */
+  selectedKey?: Key | null;
+  /** The default selected key (uncontrolled). */
+  defaultSelectedKey?: Key | null;
+  /** Handler called when the selection changes. */
+  onSelectionChange?: (key: Key | null) => void;
+  /** Whether the select is open (controlled). */
+  isOpen?: boolean;
+  /** Whether the select is open by default (uncontrolled). */
+  defaultOpen?: boolean;
+  /** Handler called when the open state changes. */
+  onOpenChange?: (isOpen: boolean) => void;
+  /** Whether the select is disabled. */
+  isDisabled?: boolean;
+  /** Whether the select is required. */
+  isRequired?: boolean;
+}
+
+export interface SelectState<T = unknown> {
+  /** The collection of items. */
+  readonly collection: Accessor<Collection<T>>;
+  /** Whether the select dropdown is open. */
+  readonly isOpen: Accessor<boolean>;
+  /** Open the select dropdown. */
+  open(): void;
+  /** Close the select dropdown. */
+  close(): void;
+  /** Toggle the select dropdown. */
+  toggle(): void;
+  /** The currently selected key. */
+  readonly selectedKey: Accessor<Key | null>;
+  /** The currently selected item. */
+  readonly selectedItem: Accessor<CollectionNode<T> | null>;
+  /** Set the selected key. */
+  setSelectedKey(key: Key | null): void;
+  /** The currently focused key. */
+  readonly focusedKey: Accessor<Key | null>;
+  /** Set the focused key. */
+  setFocusedKey(key: Key | null): void;
+  /** Whether the select has focus. */
+  readonly isFocused: Accessor<boolean>;
+  /** Set whether the select has focus. */
+  setFocused(isFocused: boolean): void;
+  /** Whether a specific key is disabled. */
+  isKeyDisabled(key: Key): boolean;
+  /** Whether the select is disabled. */
+  readonly isDisabled: boolean;
+  /** Whether the select is required. */
+  readonly isRequired: boolean;
+}
+
+/**
+ * Creates state for a select component.
+ * Combines list state with overlay trigger state for dropdown behavior.
+ */
+export function createSelectState<T = unknown>(
+  props: MaybeAccessor<SelectStateProps<T>>
+): SelectState<T> {
+  const getProps = () => access(props);
+
+  // Overlay trigger state for open/close
+  const overlayState = createOverlayTriggerState({
+    get isOpen() {
+      return getProps().isOpen;
+    },
+    get defaultOpen() {
+      return getProps().defaultOpen;
+    },
+    get onOpenChange() {
+      return getProps().onOpenChange;
+    },
+  });
+
+  // Track selected key
+  const isControlled = () => getProps().selectedKey !== undefined;
+  const [internalSelectedKey, setInternalSelectedKey] = createSignal<Key | null>(
+    getProps().defaultSelectedKey ?? null
+  );
+
+  const selectedKey: Accessor<Key | null> = () => {
+    return isControlled() ? (getProps().selectedKey ?? null) : internalSelectedKey();
+  };
+
+  const setSelectedKey = (key: Key | null) => {
+    if (!isControlled()) {
+      setInternalSelectedKey(key);
+    }
+    getProps().onSelectionChange?.(key);
+  };
+
+  // Create list state with single selection
+  const listState = createListState<T>({
+    get items() {
+      return getProps().items;
+    },
+    get getKey() {
+      return getProps().getKey;
+    },
+    get getTextValue() {
+      return getProps().getTextValue;
+    },
+    get getDisabled() {
+      return getProps().getDisabled;
+    },
+    get disabledKeys() {
+      return getProps().disabledKeys;
+    },
+    selectionMode: 'single',
+    disallowEmptySelection: true,
+    get selectedKeys() {
+      const key = selectedKey();
+      return key != null ? [key] : [];
+    },
+    onSelectionChange(keys) {
+      // Get the first (and only) selected key
+      if (keys === 'all') return; // Not applicable for single select
+      const key = keys.size > 0 ? Array.from(keys)[0] : null;
+      setSelectedKey(key);
+      // Close the dropdown after selection
+      overlayState.close();
+    },
+  });
+
+  // Get the selected item from the collection
+  const selectedItem: Accessor<CollectionNode<T> | null> = () => {
+    const key = selectedKey();
+    if (key == null) return null;
+    return listState.collection().getItem(key);
+  };
+
+  return {
+    // Collection
+    collection: listState.collection,
+
+    // Focus management
+    focusedKey: listState.focusedKey,
+    setFocusedKey: listState.setFocusedKey,
+    isFocused: listState.isFocused,
+    setFocused: listState.setFocused,
+
+    // Overlay state
+    isOpen: overlayState.isOpen,
+    open: overlayState.open,
+    close: overlayState.close,
+    toggle: overlayState.toggle,
+
+    // Select-specific
+    selectedKey,
+    selectedItem,
+    setSelectedKey,
+    isKeyDisabled: (key: Key) => listState.isDisabled(key),
+    get isDisabled() {
+      return getProps().isDisabled ?? false;
+    },
+    get isRequired() {
+      return getProps().isRequired ?? false;
+    },
+  };
+}

package/src/select/index.d.ts

@@ -0,0 +1,2 @@
+export { createSelectState, type SelectStateProps, type SelectState, } from './createSelectState';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,KAAK,gBAAgB,EACrB,KAAK,WAAW,GACjB,MAAM,qBAAqB,CAAC"}

package/src/select/index.ts

@@ -0,0 +1,5 @@
+export {
+  createSelectState,
+  type SelectStateProps,
+  type SelectState,
+} from './createSelectState';

package/src/slider/createSliderState.d.ts

@@ -0,0 +1,72 @@
+/**
+ * Creates state for a slider component.
+ * Based on @react-stately/slider useSliderState.
+ */
+import { type Accessor } from 'solid-js';
+import { type MaybeAccessor } from '../utils';
+export type SliderOrientation = 'horizontal' | 'vertical';
+export interface SliderStateProps {
+    /** The current value (controlled). */
+    value?: number;
+    /** The default value (uncontrolled). */
+    defaultValue?: number;
+    /** Handler called when the value changes. */
+    onChange?: (value: number) => void;
+    /** Handler called when the user stops dragging. */
+    onChangeEnd?: (value: number) => void;
+    /** The minimum value. */
+    minValue?: number;
+    /** The maximum value. */
+    maxValue?: number;
+    /** The step value. */
+    step?: number;
+    /** The orientation of the slider. */
+    orientation?: SliderOrientation;
+    /** Whether the slider is disabled. */
+    isDisabled?: boolean;
+    /** The locale for number formatting. */
+    locale?: string;
+    /** Number format options. */
+    formatOptions?: Intl.NumberFormatOptions;
+}
+export interface SliderState {
+    /** The current value. */
+    value: Accessor<number>;
+    /** Sets the value. */
+    setValue: (value: number) => void;
+    /** Sets the value by percent (0-1). */
+    setValuePercent: (percent: number) => void;
+    /** Gets the value as a percent (0-1). */
+    getValuePercent: Accessor<number>;
+    /** Gets the formatted value string. */
+    getFormattedValue: Accessor<string>;
+    /** Whether the thumb is being dragged. */
+    isDragging: Accessor<boolean>;
+    /** Sets the dragging state. */
+    setDragging: (dragging: boolean) => void;
+    /** Whether the slider is focused. */
+    isFocused: Accessor<boolean>;
+    /** Sets the focused state. */
+    setFocused: (focused: boolean) => void;
+    /** Increments the value by step. */
+    increment: (stepMultiplier?: number) => void;
+    /** Decrements the value by step. */
+    decrement: (stepMultiplier?: number) => void;
+    /** The minimum value. */
+    minValue: number;
+    /** The maximum value. */
+    maxValue: number;
+    /** The step value. */
+    step: number;
+    /** The page step (larger step for Page Up/Down). */
+    pageStep: number;
+    /** The orientation. */
+    orientation: SliderOrientation;
+    /** Whether the slider is disabled. */
+    isDisabled: boolean;
+}
+/**
+ * Provides state management for a slider component.
+ */
+export declare function createSliderState(props: MaybeAccessor<SliderStateProps>): SliderState;
+//# sourceMappingURL=createSliderState.d.ts.map

package/src/slider/createSliderState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createSliderState.d.ts","sourceRoot":"","sources":["createSliderState.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,KAAK,QAAQ,EAA4B,MAAM,UAAU,CAAC;AACnE,OAAO,EAAU,KAAK,aAAa,EAAE,MAAM,UAAU,CAAC;AAEtD,MAAM,MAAM,iBAAiB,GAAG,YAAY,GAAG,UAAU,CAAC;AAE1D,MAAM,WAAW,gBAAgB;IAC/B,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,mDAAmD;IACnD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAChC,sCAAsC;IACtC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wCAAwC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6BAA6B;IAC7B,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;CAC1C;AAED,MAAM,WAAW,WAAW;IAC1B,yBAAyB;IACzB,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACxB,sBAAsB;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,uCAAuC;IACvC,eAAe,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,yCAAyC;IACzC,eAAe,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAClC,uCAAuC;IACvC,iBAAiB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACpC,0CAA0C;IAC1C,UAAU,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC9B,+BAA+B;IAC/B,WAAW,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,qCAAqC;IACrC,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC7B,8BAA8B;IAC9B,UAAU,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,oCAAoC;IACpC,SAAS,EAAE,CAAC,cAAc,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,oCAAoC;IACpC,SAAS,EAAE,CAAC,cAAc,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,yBAAyB;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,sBAAsB;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,QAAQ,EAAE,MAAM,CAAC;IACjB,uBAAuB;IACvB,WAAW,EAAE,iBAAiB,CAAC;IAC/B,sCAAsC;IACtC,UAAU,EAAE,OAAO,CAAC;CACrB;AAwBD;;GAEG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,aAAa,CAAC,gBAAgB,CAAC,GACrC,WAAW,CA+Gb"}

package/src/slider/createSliderState.ts

@@ -0,0 +1,211 @@
+/**
+ * Creates state for a slider component.
+ * Based on @react-stately/slider useSliderState.
+ */
+
+import { type Accessor, createSignal, createMemo } from 'solid-js';
+import { access, type MaybeAccessor } from '../utils';
+
+export type SliderOrientation = 'horizontal' | 'vertical';
+
+export interface SliderStateProps {
+  /** The current value (controlled). */
+  value?: number;
+  /** The default value (uncontrolled). */
+  defaultValue?: number;
+  /** Handler called when the value changes. */
+  onChange?: (value: number) => void;
+  /** Handler called when the user stops dragging. */
+  onChangeEnd?: (value: number) => void;
+  /** The minimum value. */
+  minValue?: number;
+  /** The maximum value. */
+  maxValue?: number;
+  /** The step value. */
+  step?: number;
+  /** The orientation of the slider. */
+  orientation?: SliderOrientation;
+  /** Whether the slider is disabled. */
+  isDisabled?: boolean;
+  /** The locale for number formatting. */
+  locale?: string;
+  /** Number format options. */
+  formatOptions?: Intl.NumberFormatOptions;
+}
+
+export interface SliderState {
+  /** The current value. */
+  value: Accessor<number>;
+  /** Sets the value. */
+  setValue: (value: number) => void;
+  /** Sets the value by percent (0-1). */
+  setValuePercent: (percent: number) => void;
+  /** Gets the value as a percent (0-1). */
+  getValuePercent: Accessor<number>;
+  /** Gets the formatted value string. */
+  getFormattedValue: Accessor<string>;
+  /** Whether the thumb is being dragged. */
+  isDragging: Accessor<boolean>;
+  /** Sets the dragging state. */
+  setDragging: (dragging: boolean) => void;
+  /** Whether the slider is focused. */
+  isFocused: Accessor<boolean>;
+  /** Sets the focused state. */
+  setFocused: (focused: boolean) => void;
+  /** Increments the value by step. */
+  increment: (stepMultiplier?: number) => void;
+  /** Decrements the value by step. */
+  decrement: (stepMultiplier?: number) => void;
+  /** The minimum value. */
+  minValue: number;
+  /** The maximum value. */
+  maxValue: number;
+  /** The step value. */
+  step: number;
+  /** The page step (larger step for Page Up/Down). */
+  pageStep: number;
+  /** The orientation. */
+  orientation: SliderOrientation;
+  /** Whether the slider is disabled. */
+  isDisabled: boolean;
+}
+
+const DEFAULT_MIN = 0;
+const DEFAULT_MAX = 100;
+const DEFAULT_STEP = 1;
+
+/**
+ * Clamps a value between min and max.
+ */
+function clamp(value: number, min: number, max: number): number {
+  return Math.min(Math.max(value, min), max);
+}
+
+/**
+ * Snaps a value to the nearest step.
+ */
+function snapToStep(value: number, min: number, max: number, step: number): number {
+  const snapped = Math.round((value - min) / step) * step + min;
+  // Handle floating point precision issues
+  const decimalPlaces = (step.toString().split('.')[1] || '').length;
+  const rounded = parseFloat(snapped.toFixed(decimalPlaces));
+  return clamp(rounded, min, max);
+}
+
+/**
+ * Provides state management for a slider component.
+ */
+export function createSliderState(
+  props: MaybeAccessor<SliderStateProps>
+): SliderState {
+  const getProps = () => access(props);
+
+  // Get static values with defaults
+  const minValue = getProps().minValue ?? DEFAULT_MIN;
+  const maxValue = getProps().maxValue ?? DEFAULT_MAX;
+  const step = getProps().step ?? DEFAULT_STEP;
+  const orientation = getProps().orientation ?? 'horizontal';
+  const isDisabled = getProps().isDisabled ?? false;
+
+  // Calculate page step (10% of range, snapped to step)
+  const pageStep = Math.max(step, snapToStep((maxValue - minValue) / 10, 0, maxValue - minValue, step));
+
+  // Controlled vs uncontrolled
+  const isControlled = () => getProps().value !== undefined;
+
+  // Internal signal for uncontrolled mode
+  const [internalValue, setInternalValue] = createSignal(
+    snapToStep(getProps().defaultValue ?? minValue, minValue, maxValue, step)
+  );
+
+  // Dragging and focus state
+  const [isDragging, setIsDragging] = createSignal(false);
+  const [isFocused, setIsFocused] = createSignal(false);
+
+  // Current value accessor
+  const value = createMemo(() => {
+    const p = getProps();
+    const rawValue = isControlled() ? (p.value ?? minValue) : internalValue();
+    return snapToStep(rawValue, minValue, maxValue, step);
+  });
+
+  // Value as percent (0-1)
+  const getValuePercent = createMemo(() => {
+    return (value() - minValue) / (maxValue - minValue);
+  });
+
+  // Formatted value
+  const getFormattedValue = createMemo(() => {
+    const p = getProps();
+    const formatter = new Intl.NumberFormat(p.locale, p.formatOptions);
+    return formatter.format(value());
+  });
+
+  // Set value function
+  const setValue = (newValue: number) => {
+    if (isDisabled) return;
+
+    const p = getProps();
+    const snappedValue = snapToStep(newValue, minValue, maxValue, step);
+
+    if (!isControlled()) {
+      setInternalValue(snappedValue);
+    }
+
+    p.onChange?.(snappedValue);
+  };
+
+  // Set value by percent
+  const setValuePercent = (percent: number) => {
+    const clampedPercent = clamp(percent, 0, 1);
+    const newValue = clampedPercent * (maxValue - minValue) + minValue;
+    setValue(newValue);
+  };
+
+  // Dragging state management
+  const setDragging = (dragging: boolean) => {
+    const wasDragging = isDragging();
+    setIsDragging(dragging);
+
+    // Call onChangeEnd when dragging stops
+    if (wasDragging && !dragging) {
+      getProps().onChangeEnd?.(value());
+    }
+  };
+
+  // Increment/decrement
+  const increment = (stepMultiplier = 1) => {
+    if (isDisabled) return;
+    setValue(value() + step * stepMultiplier);
+  };
+
+  const decrement = (stepMultiplier = 1) => {
+    if (isDisabled) return;
+    setValue(value() - step * stepMultiplier);
+  };
+
+  // Set focused state
+  const setFocused = (focused: boolean) => {
+    setIsFocused(focused);
+  };
+
+  return {
+    value,
+    setValue,
+    setValuePercent,
+    getValuePercent,
+    getFormattedValue,
+    isDragging,
+    setDragging,
+    isFocused,
+    setFocused,
+    increment,
+    decrement,
+    minValue,
+    maxValue,
+    step,
+    pageStep,
+    orientation,
+    isDisabled,
+  };
+}

package/src/slider/index.d.ts

@@ -0,0 +1,3 @@
+export { createSliderState } from './createSliderState';
+export type { SliderState, SliderStateProps, SliderOrientation, } from './createSliderState';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EACV,WAAW,EACX,gBAAgB,EAChB,iBAAiB,GAClB,MAAM,qBAAqB,CAAC"}

package/src/slider/index.ts

@@ -0,0 +1,6 @@
+export { createSliderState } from './createSliderState';
+export type {
+  SliderState,
+  SliderStateProps,
+  SliderOrientation,
+} from './createSliderState';

package/{dist → src}/ssr/index.d.ts

@@ -4,6 +4,10 @@
  * SolidJS has built-in SSR support with `isServer` and `createUniqueId()`.
  * These utilities provide a consistent API matching React-Stately's patterns.
  */
+/**
+ * Re-export isServer from solid-js/web for convenience.
+ */
+export declare const isServer: boolean;
 /**
  * Returns whether the component is currently being server side rendered.
  * Can be used to delay browser-specific rendering until after hydration.
@@ -21,3 +25,4 @@ export declare function createId(defaultId?: string): string;
  * This is useful for code that needs to run only in the browser.
  */
 export declare const canUseDOM: boolean;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH;;GAEG;AACH,eAAO,MAAM,QAAQ,SAAY,CAAC;AAElC;;;GAGG;AACH,wBAAgB,WAAW,IAAI,OAAO,CAErC;AAED;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAKnD;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,SAAY,CAAC"}

package/src/ssr/index.ts

@@ -6,7 +6,12 @@
  */
 
 import { createUniqueId } from 'solid-js';
-import { isServer } from 'solid-js/web';
+import { isServer as _isServer } from 'solid-js/web';
+
+/**
+ * Re-export isServer from solid-js/web for convenience.
+ */
+export const isServer = _isServer;
 
 /**
  * Returns whether the component is currently being server side rendered.

package/src/table/TableCollection.d.ts

@@ -0,0 +1,52 @@
+/**
+ * TableCollection - A collection class for table data.
+ * Based on @react-stately/table/TableCollection.
+ */
+import type { Key } from '../collections/types';
+import type { GridNode } from '../grid/types';
+import type { TableCollection as ITableCollection, TableCollectionOptions } from './types';
+/**
+ * Creates a table collection from column and row definitions.
+ */
+export declare class TableCollection<T = unknown> implements ITableCollection<T> {
+    private _columns;
+    private _rows;
+    private _headerRows;
+    private _body;
+    private _head;
+    private _keyMap;
+    private _rowHeaderColumnKeys;
+    private _size;
+    constructor(options: TableCollectionOptions<T>);
+    private buildColumns;
+    private buildColumnNode;
+    private getDefaultRowHeaderColumnKeys;
+    private buildHeaderRows;
+    private buildRows;
+    private isRowDefinition;
+    get size(): number;
+    get rows(): GridNode<T>[];
+    get columns(): GridNode<T>[];
+    get headerRows(): GridNode<T>[];
+    get head(): GridNode<T> | undefined;
+    get body(): GridNode<T>;
+    get rowCount(): number;
+    get columnCount(): number;
+    get rowHeaderColumnKeys(): Set<Key>;
+    getKeys(): Iterable<Key>;
+    getItem(key: Key): GridNode<T> | null;
+    at(index: number): GridNode<T> | null;
+    getChildren(key: Key): Iterable<GridNode<T>>;
+    getTextValue(key: Key): string;
+    getCell(rowKey: Key, columnKey: Key): GridNode<T> | null;
+    getFirstKey(): Key | null;
+    getLastKey(): Key | null;
+    getKeyBefore(key: Key): Key | null;
+    getKeyAfter(key: Key): Key | null;
+    [Symbol.iterator](): Iterator<GridNode<T>>;
+}
+/**
+ * Creates a table collection from options.
+ */
+export declare function createTableCollection<T>(options: TableCollectionOptions<T>): TableCollection<T>;
+//# sourceMappingURL=TableCollection.d.ts.map

package/src/table/TableCollection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCollection.d.ts","sourceRoot":"","sources":["TableCollection.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAC;AAChD,OAAO,KAAK,EAAE,QAAQ,EAAgB,MAAM,eAAe,CAAC;AAC5D,OAAO,KAAK,EACV,eAAe,IAAI,gBAAgB,EACnC,sBAAsB,EAGvB,MAAM,SAAS,CAAC;AAEjB;;GAEG;AACH,qBAAa,eAAe,CAAC,CAAC,GAAG,OAAO,CAAE,YAAW,gBAAgB,CAAC,CAAC,CAAC;IACtE,OAAO,CAAC,QAAQ,CAAqB;IACrC,OAAO,CAAC,KAAK,CAAqB;IAClC,OAAO,CAAC,WAAW,CAAqB;IACxC,OAAO,CAAC,KAAK,CAAc;IAC3B,OAAO,CAAC,KAAK,CAA0B;IACvC,OAAO,CAAC,OAAO,CAAoC;IACnD,OAAO,CAAC,oBAAoB,CAAW;IACvC,OAAO,CAAC,KAAK,CAAa;gBAEd,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC;IAuD9C,OAAO,CAAC,YAAY;IAmCpB,OAAO,CAAC,eAAe;IA6BvB,OAAO,CAAC,6BAA6B;IAUrC,OAAO,CAAC,eAAe;IAqCvB,OAAO,CAAC,SAAS;IAgEjB,OAAO,CAAC,eAAe;IAUvB,IAAI,IAAI,IAAI,MAAM,CAEjB;IAED,IAAI,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,CAExB;IAED,IAAI,OAAO,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,CAE3B;IAED,IAAI,UAAU,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,CAE9B;IAED,IAAI,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,GAAG,SAAS,CAElC;IAED,IAAI,IAAI,IAAI,QAAQ,CAAC,CAAC,CAAC,CAEtB;IAED,IAAI,QAAQ,IAAI,MAAM,CAErB;IAED,IAAI,WAAW,IAAI,MAAM,CAExB;IAED,IAAI,mBAAmB,IAAI,GAAG,CAAC,GAAG,CAAC,CAElC;IAED,OAAO,IAAI,QAAQ,CAAC,GAAG,CAAC;IAIxB,OAAO,CAAC,GAAG,EAAE,GAAG,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI;IAIrC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI;IAQrC,WAAW,CAAC,GAAG,EAAE,GAAG,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAK5C,YAAY,CAAC,GAAG,EAAE,GAAG,GAAG,MAAM;IAK9B,OAAO,CAAC,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI;IAKxD,WAAW,IAAI,GAAG,GAAG,IAAI;IAMzB,UAAU,IAAI,GAAG,GAAG,IAAI;IAMxB,YAAY,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI;IAalC,WAAW,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI;IAahC,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;CAM5C;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,EACrC,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,GACjC,eAAe,CAAC,CAAC,CAAC,CAEpB"}