@proyecto-viviana/solidaria 0.1.3 → 0.2.0

package/src/utils/filterDOMProps.ts

@@ -1,116 +0,0 @@
-/**
- * filterDOMProps for Solidaria
- *
- * Filters out all props that aren't valid DOM props.
- * This is a 1:1 port of @react-aria/utils filterDOMProps.
- */
-
-const DOMPropNames = new Set(['id']);
-
-const labelablePropNames = new Set([
-  'aria-label',
-  'aria-labelledby',
-  'aria-describedby',
-  'aria-details',
-]);
-
-// See LinkDOMProps in dom.d.ts.
-const linkPropNames = new Set([
-  'href',
-  'hrefLang',
-  'target',
-  'rel',
-  'download',
-  'ping',
-  'referrerPolicy',
-]);
-
-const globalAttrs = new Set(['dir', 'lang', 'hidden', 'inert', 'translate']);
-
-const globalEvents = new Set([
-  'onClick',
-  'onAuxClick',
-  'onContextMenu',
-  'onDoubleClick',
-  'onMouseDown',
-  'onMouseEnter',
-  'onMouseLeave',
-  'onMouseMove',
-  'onMouseOut',
-  'onMouseOver',
-  'onMouseUp',
-  'onTouchCancel',
-  'onTouchEnd',
-  'onTouchMove',
-  'onTouchStart',
-  'onPointerDown',
-  'onPointerMove',
-  'onPointerUp',
-  'onPointerCancel',
-  'onPointerEnter',
-  'onPointerLeave',
-  'onPointerOver',
-  'onPointerOut',
-  'onGotPointerCapture',
-  'onLostPointerCapture',
-  'onScroll',
-  'onWheel',
-  'onAnimationStart',
-  'onAnimationEnd',
-  'onAnimationIteration',
-  'onTransitionCancel',
-  'onTransitionEnd',
-  'onTransitionRun',
-  'onTransitionStart',
-]);
-
-const propRe = /^(data-.*)$/;
-
-export interface FilterDOMPropsOptions {
-  /**
-   * If labelling associated aria properties should be included in the filter.
-   */
-  labelable?: boolean;
-  /** Whether the element is a link and should include DOM props for <a> elements. */
-  isLink?: boolean;
-  /** Whether to include global DOM attributes. */
-  global?: boolean;
-  /** Whether to include DOM events. */
-  events?: boolean;
-  /**
-   * A Set of other property names that should be included in the filter.
-   */
-  propNames?: Set<string>;
-}
-
-/**
- * Filters out all props that aren't valid DOM props or defined via override prop obj.
- * @param props - The component props to be filtered.
- * @param opts - Props to override.
- */
-export function filterDOMProps<T extends object>(
-  props: T,
-  opts: FilterDOMPropsOptions = {}
-): Partial<T> {
-  const { labelable, isLink, global, events = global, propNames } = opts;
-  const filteredProps: Partial<T> = {};
-
-  for (const prop in props) {
-    if (
-      Object.prototype.hasOwnProperty.call(props, prop) &&
-      (DOMPropNames.has(prop) ||
-        (labelable && labelablePropNames.has(prop)) ||
-        (isLink && linkPropNames.has(prop)) ||
-        (global && globalAttrs.has(prop)) ||
-        (events &&
-          (globalEvents.has(prop) ||
-            (prop.endsWith('Capture') && globalEvents.has(prop.slice(0, -7))))) ||
-        propNames?.has(prop) ||
-        propRe.test(prop))
-    ) {
-      (filteredProps as Record<string, unknown>)[prop] = props[prop];
-    }
-  }
-
-  return filteredProps;
-}

package/src/utils/focus.ts

@@ -1,151 +0,0 @@
-/**
- * Focus management utilities.
- * Based on @react-aria/utils focus utilities.
- */
-
-import { getOwnerDocument } from './dom';
-
-/**
- * Focuses an element without scrolling the page.
- * Uses preventScroll option with fallback for older browsers.
- */
-export function focusWithoutScrolling(element: HTMLElement | null): void {
-  if (!element) return;
-
-  // Try using the modern preventScroll option
-  try {
-    element.focus({ preventScroll: true });
-  } catch {
-    // Fallback for browsers that don't support preventScroll
-    // Save scroll positions and restore after focus
-    const scrollableElements = getScrollableAncestors(element);
-    const scrollPositions = scrollableElements.map((el) => ({
-      element: el,
-      scrollTop: el.scrollTop,
-      scrollLeft: el.scrollLeft,
-    }));
-
-    element.focus();
-
-    // Restore scroll positions
-    for (const { element: el, scrollTop, scrollLeft } of scrollPositions) {
-      el.scrollTop = scrollTop;
-      el.scrollLeft = scrollLeft;
-    }
-  }
-}
-
-/**
- * Gets all scrollable ancestors of an element.
- */
-function getScrollableAncestors(element: Element): Element[] {
-  const ancestors: Element[] = [];
-  let parent = element.parentElement;
-
-  while (parent) {
-    const style = getComputedStyle(parent);
-    const overflowY = style.overflowY;
-    const overflowX = style.overflowX;
-
-    if (
-      overflowY === 'auto' ||
-      overflowY === 'scroll' ||
-      overflowX === 'auto' ||
-      overflowX === 'scroll'
-    ) {
-      ancestors.push(parent);
-    }
-
-    parent = parent.parentElement;
-  }
-
-  // Also include the document scrolling element
-  const doc = getOwnerDocument(element);
-  ancestors.push(doc.documentElement);
-
-  return ancestors;
-}
-
-// State for preventFocus
-let ignoreFocus = false;
-let preventFocusTimeout: ReturnType<typeof setTimeout> | null = null;
-
-/**
- * Prevents focus from moving to a new element temporarily.
- * Used when clicking on a button that shouldn't steal focus.
- */
-export function preventFocus(target: Element): void {
-  // Find the closest focusable ancestor
-  const focusableAncestor = findFocusableAncestor(target);
-  if (!focusableAncestor) return;
-
-  const document = getOwnerDocument(target);
-  const activeElement = document.activeElement;
-
-  // Set flag to ignore next focus event
-  ignoreFocus = true;
-
-  // Capture focus events and prevent them from changing focus
-  const onFocus = (e: Event) => {
-    if (ignoreFocus) {
-      e.stopImmediatePropagation();
-      // Refocus the original element if focus moved
-      if (activeElement && activeElement !== document.body) {
-        (activeElement as HTMLElement).focus();
-      }
-    }
-  };
-
-  const onBlur = (e: Event) => {
-    if (ignoreFocus) {
-      e.stopImmediatePropagation();
-    }
-  };
-
-  // Use capturing to intercept focus before it reaches elements
-  // Cast to HTMLElement to access focus event listeners
-  const el = focusableAncestor as HTMLElement;
-  el.addEventListener('focus', onFocus, true);
-  el.addEventListener('blur', onBlur, true);
-  el.addEventListener('focusin', onFocus, true);
-  el.addEventListener('focusout', onBlur, true);
-
-  // Clean up after the current event cycle
-  if (preventFocusTimeout != null) {
-    clearTimeout(preventFocusTimeout);
-  }
-
-  preventFocusTimeout = setTimeout(() => {
-    ignoreFocus = false;
-    el.removeEventListener('focus', onFocus, true);
-    el.removeEventListener('blur', onBlur, true);
-    el.removeEventListener('focusin', onFocus, true);
-    el.removeEventListener('focusout', onBlur, true);
-    preventFocusTimeout = null;
-  }, 0);
-}
-
-/**
- * Finds the closest focusable ancestor or the element itself.
- */
-function findFocusableAncestor(element: Element): Element | null {
-  let current: Element | null = element;
-
-  while (current) {
-    if (
-      current.hasAttribute('tabindex') ||
-      ['INPUT', 'BUTTON', 'SELECT', 'TEXTAREA', 'A'].includes(current.tagName)
-    ) {
-      return current;
-    }
-    current = current.parentElement;
-  }
-
-  return element;
-}
-
-/**
- * Safely focuses an element, alias for focusWithoutScrolling.
- * This matches the react-aria focusSafely function name.
- */
-export const focusSafely = focusWithoutScrolling;

package/src/utils/geometry.ts

@@ -1,115 +0,0 @@
-/**
- * Geometry utilities for pointer/touch hit testing.
- * Based on @react-aria/interactions geometry utilities.
- */
-
-export interface Rect {
-  top: number;
-  right: number;
-  bottom: number;
-  left: number;
-}
-
-export interface EventPoint {
-  clientX: number;
-  clientY: number;
-  width?: number;
-  height?: number;
-  radiusX?: number;
-  radiusY?: number;
-}
-
-/**
- * Checks if two rectangles overlap.
- */
-export function areRectanglesOverlapping(a: Rect, b: Rect): boolean {
-  // Check if one rectangle is to the left of the other
-  if (a.left > b.right || b.left > a.right) {
-    return false;
-  }
-
-  // Check if one rectangle is above the other
-  if (a.top > b.bottom || b.top > a.bottom) {
-    return false;
-  }
-
-  return true;
-}
-
-/**
- * Gets the bounding rectangle for an event point (touch/pointer).
- * Takes into account the size of the touch point.
- */
-export function getPointClientRect(point: EventPoint): Rect {
-  let offsetX = 0;
-  let offsetY = 0;
-
-  // Use width/height if available (PointerEvent)
-  if (point.width !== undefined && point.width > 0) {
-    offsetX = point.width / 2;
-  } else if (point.radiusX !== undefined && point.radiusX > 0) {
-    // Fallback to radiusX/radiusY (Touch)
-    offsetX = point.radiusX;
-  }
-
-  if (point.height !== undefined && point.height > 0) {
-    offsetY = point.height / 2;
-  } else if (point.radiusY !== undefined && point.radiusY > 0) {
-    offsetY = point.radiusY;
-  }
-
-  return {
-    top: point.clientY - offsetY,
-    right: point.clientX + offsetX,
-    bottom: point.clientY + offsetY,
-    left: point.clientX - offsetX,
-  };
-}
-
-/**
- * Checks if a pointer/touch point is over an element.
- */
-export function isPointOverTarget(point: EventPoint, target: Element): boolean {
-  const rect = target.getBoundingClientRect();
-  const pointRect = getPointClientRect(point);
-
-  return areRectanglesOverlapping(
-    {
-      top: rect.top,
-      right: rect.right,
-      bottom: rect.bottom,
-      left: rect.left,
-    },
-    pointRect
-  );
-}
-
-/**
- * Gets the first touch from a TouchEvent's targetTouches.
- */
-export function getTouchFromEvent(event: TouchEvent): Touch | null {
-  const { targetTouches } = event;
-  if (targetTouches.length > 0) {
-    return targetTouches[0];
-  }
-  return null;
-}
-
-/**
- * Finds a touch by its identifier in changedTouches.
- */
-export function getTouchById(event: TouchEvent, pointerId: number | null): Touch | null {
-  if (pointerId == null) {
-    return null;
-  }
-
-  const { changedTouches } = event;
-  for (let i = 0; i < changedTouches.length; i++) {
-    const touch = changedTouches[i];
-    if (touch.identifier === pointerId) {
-      return touch;
-    }
-  }
-
-  return null;
-}

package/src/utils/globalListeners.ts

@@ -1,142 +0,0 @@
-/**
- * Global listener management utility.
- * Based on @react-aria/utils useGlobalListeners hook, adapted for SolidJS.
- *
- * In SolidJS, we use onCleanup for automatic cleanup instead of useEffect return.
- */
-
-import { onCleanup } from 'solid-js';
-
-export interface GlobalListenerOptions extends AddEventListenerOptions {
-  /** Whether to add the listener to the window instead of document */
-  isWindow?: boolean;
-}
-
-/**
- * Creates a manager for global event listeners that automatically cleans up.
- * Use this in a component to register document/window level listeners
- * that will be removed when the component unmounts.
- */
-export function createGlobalListeners() {
-  const listeners: Array<{
-    target: EventTarget;
-    type: string;
-    handler: EventListener;
-    options?: AddEventListenerOptions;
-  }> = [];
-
-  /**
-   * Adds a global event listener.
-   */
-  function addGlobalListener<K extends keyof DocumentEventMap>(
-    type: K,
-    handler: (ev: DocumentEventMap[K]) => void,
-    options?: GlobalListenerOptions
-  ): void;
-  function addGlobalListener<K extends keyof WindowEventMap>(
-    type: K,
-    handler: (ev: WindowEventMap[K]) => void,
-    options?: GlobalListenerOptions & { isWindow: true }
-  ): void;
-  function addGlobalListener(
-    type: string,
-    handler: EventListener,
-    options?: GlobalListenerOptions
-  ): void {
-    const target = options?.isWindow ? window : document;
-    const listenerOptions = options
-      ? {
-          capture: options.capture,
-          passive: options.passive,
-          once: options.once,
-        }
-      : undefined;
-
-    target.addEventListener(type, handler, listenerOptions);
-    listeners.push({ target, type, handler, options: listenerOptions });
-  }
-
-  /**
-   * Removes a specific global event listener.
-   */
-  function removeGlobalListener<K extends keyof DocumentEventMap>(
-    type: K,
-    handler: (ev: DocumentEventMap[K]) => void,
-    options?: AddEventListenerOptions
-  ): void;
-  function removeGlobalListener<K extends keyof WindowEventMap>(
-    type: K,
-    handler: (ev: WindowEventMap[K]) => void,
-    options?: AddEventListenerOptions & { isWindow: true }
-  ): void;
-  function removeGlobalListener(
-    type: string,
-    handler: EventListener,
-    options?: AddEventListenerOptions & { isWindow?: boolean }
-  ): void {
-    const target = options?.isWindow ? window : document;
-    const listenerOptions = options
-      ? {
-          capture: options.capture,
-        }
-      : undefined;
-
-    target.removeEventListener(type, handler, listenerOptions);
-
-    // Remove from tracked listeners
-    const index = listeners.findIndex(
-      (l) =>
-        l.target === target &&
-        l.type === type &&
-        l.handler === handler &&
-        l.options?.capture === listenerOptions?.capture
-    );
-    if (index !== -1) {
-      listeners.splice(index, 1);
-    }
-  }
-
-  /**
-   * Removes all registered global listeners.
-   */
-  function removeAllGlobalListeners(): void {
-    for (const { target, type, handler, options } of listeners) {
-      target.removeEventListener(type, handler, options);
-    }
-    listeners.length = 0;
-  }
-
-  // Automatically clean up when the component/scope is disposed
-  onCleanup(removeAllGlobalListeners);
-
-  return {
-    addGlobalListener,
-    removeGlobalListener,
-    removeAllGlobalListeners,
-  };
-}
-
-/**
- * Simple utility to add a single global listener with automatic cleanup.
- * For one-off listeners where the full manager isn't needed.
- */
-export function addGlobalListenerOnce<K extends keyof DocumentEventMap>(
-  type: K,
-  handler: (ev: DocumentEventMap[K]) => void,
-  options?: GlobalListenerOptions
-): () => void {
-  const target = options?.isWindow ? window : document;
-  const listenerOptions = options
-    ? {
-        capture: options.capture,
-        passive: options.passive,
-        once: options.once,
-      }
-    : undefined;
-
-  target.addEventListener(type, handler as EventListener, listenerOptions);
-
-  return () => {
-    target.removeEventListener(type, handler as EventListener, listenerOptions);
-  };
-}

package/src/utils/index.ts

@@ -1,80 +0,0 @@
-export { mergeProps } from './mergeProps';
-export { filterDOMProps, type FilterDOMPropsOptions } from './filterDOMProps';
-
-// Reactivity utilities
-export { access, isAccessor, type MaybeAccessor, type MaybeAccessorValue } from './reactivity';
-
-// Platform detection
-export {
-  isMac,
-  isIPhone,
-  isIPad,
-  isIOS,
-  isAppleDevice,
-  isWebKit,
-  isChrome,
-  isAndroid,
-  isFirefox,
-} from './platform';
-
-// DOM utilities
-export {
-  getOwnerDocument,
-  getOwnerWindow,
-  nodeContains,
-  getEventTarget,
-  isFocusable,
-  isValidKeyboardEvent,
-  isValidInputKey,
-  isHTMLAnchorLink,
-  shouldPreventDefaultKeyboard,
-  shouldPreventDefaultUp,
-  openLink,
-  isScrollable,
-  getScrollParent,
-  willOpenKeyboard,
-} from './dom';
-
-// Geometry utilities
-export {
-  areRectanglesOverlapping,
-  getPointClientRect,
-  isPointOverTarget,
-  getTouchFromEvent,
-  getTouchById,
-  type Rect,
-  type EventPoint,
-} from './geometry';
-
-// Event utilities
-export {
-  isVirtualClick,
-  isVirtualPointerEvent,
-  createMouseEvent,
-  chain,
-  setEventTarget,
-} from './events';
-
-// Text selection management
-export { disableTextSelection, restoreTextSelection } from './textSelection';
-
-// Focus utilities
-export { focusWithoutScrolling, focusSafely, preventFocus } from './focus';
-
-// Global listener management
-export {
-  createGlobalListeners,
-  addGlobalListenerOnce,
-  type GlobalListenerOptions,
-} from './globalListeners';
-
-// Environment detection
-export { isTestEnv, isDevEnv, isProdEnv } from './env';
-
-// Description utility for aria-describedby
-export {
-  createDescription,
-  type DescriptionProps,
-  getDescriptionNodeCount,
-  clearDescriptionNodes,
-} from './createDescription';

package/src/utils/mergeProps.ts

@@ -1,52 +0,0 @@
-type Props = { [key: string]: unknown };
-
-/**
- * Merges multiple props objects together, handling event handlers specially
- * by chaining them rather than replacing.
- *
- * Based on react-aria's mergeProps but adapted for SolidJS.
- *
- * @param args - Props objects to merge
- * @returns Merged props object. Use type parameter R to specify the result type.
- */
-export function mergeProps<R extends object = Record<string, unknown>, T extends object = object>(...args: T[]): R {
-  const result: Props = {};
-
-  for (const props of args) {
-    for (const key in props) {
-      const value = props[key];
-      const existingValue = result[key];
-
-      if (
-        typeof existingValue === 'function' &&
-        typeof value === 'function' &&
-        key.startsWith('on') &&
-        key[2] === key[2]?.toUpperCase()
-      ) {
-        // Chain event handlers
-        result[key] = chainHandlers(existingValue as Function, value as Function);
-      } else if (key === 'class' || key === 'className') {
-        // Merge class names
-        result[key] = mergeClassNames(existingValue, value);
-      } else if (key === 'style' && typeof existingValue === 'object' && typeof value === 'object') {
-        // Merge style objects
-        result[key] = { ...(existingValue as object), ...(value as object) };
-      } else if (value !== undefined) {
-        result[key] = value;
-      }
-    }
-  }
-
-  return result as R;
-}
-
-function chainHandlers(existingHandler: Function, newHandler: Function) {
-  return (...args: unknown[]) => {
-    existingHandler(...args);
-    newHandler(...args);
-  };
-}
-
-function mergeClassNames(...classes: unknown[]): string {
-  return classes.filter(Boolean).join(' ');
-}

package/src/utils/platform.ts

@@ -1,52 +0,0 @@
-/**
- * Platform detection utilities.
- * Based on @react-aria/utils platform detection.
- */
-
-function testPlatform(re: RegExp): boolean {
-  return typeof window !== 'undefined' && window.navigator != null
-    ? re.test(window.navigator.platform || (window.navigator as any).userAgentData?.platform || '')
-    : false;
-}
-
-function testUserAgent(re: RegExp): boolean {
-  return typeof window !== 'undefined' && window.navigator != null
-    ? re.test(window.navigator.userAgent)
-    : false;
-}
-
-export function isMac(): boolean {
-  return testPlatform(/^Mac/i);
-}
-
-export function isIPhone(): boolean {
-  return testPlatform(/^iPhone/i);
-}
-
-export function isIPad(): boolean {
-  return testPlatform(/^iPad/i) || (isMac() && navigator.maxTouchPoints > 1);
-}
-
-export function isIOS(): boolean {
-  return isIPhone() || isIPad();
-}
-
-export function isAppleDevice(): boolean {
-  return isMac() || isIOS();
-}
-
-export function isWebKit(): boolean {
-  return testUserAgent(/AppleWebKit/i) && !isChrome();
-}
-
-export function isChrome(): boolean {
-  return testUserAgent(/Chrome/i);
-}
-
-export function isAndroid(): boolean {
-  return testUserAgent(/Android/i);
-}
-
-export function isFirefox(): boolean {
-  return testUserAgent(/Firefox/i);
-}