@proyecto-viviana/solidaria-components 0.3.1 → 0.4.0

package/dist/DragAndDrop.jsx

@@ -0,0 +1,160 @@
+import { dataAttr, useRenderProps } from "./utils.jsx";
+import { createContext, createMemo, useContext } from "solid-js";
+//#region src/DragAndDrop.tsx
+/**
+* Drag and drop composition helpers for solidaria-components.
+*
+* Compatibility target: react-aria-components DragAndDrop exports.
+*/
+const DragAndDropContext = createContext({});
+const DropIndicatorContext = createContext(null);
+function DefaultDropIndicator(props) {
+	const dnd = useContext(DragAndDropContext);
+	const isDropTarget = createMemo(() => {
+		const target = props.target;
+		return dnd.dropState?.isDropTarget?.(target) ?? false;
+	});
+	const renderProps = useRenderProps({
+		get children() {
+			return props.children;
+		},
+		class: props.class,
+		style: props.style,
+		defaultClassName: "solidaria-DropIndicator"
+	}, () => ({ isDropTarget: isDropTarget() }));
+	return <div role="option" aria-disabled={true} class={renderProps.class()} style={renderProps.style()} data-drop-target={dataAttr(isDropTarget())}>
+      {renderProps.renderChildren()}
+    </div>;
+}
+function DropIndicator(props) {
+	const context = useContext(DropIndicatorContext);
+	if (context) return context.render(props);
+	return <DefaultDropIndicator {...props} />;
+}
+function useRenderDropIndicator(hooksOrDropState, maybeDropState) {
+	const looksLikeDropState = (value) => {
+		return Boolean(value && typeof value === "object" && ("isDropTarget" in value || "target" in value));
+	};
+	const dragAndDropHooks = looksLikeDropState(hooksOrDropState) ? void 0 : hooksOrDropState;
+	const dropState = looksLikeDropState(hooksOrDropState) ? hooksOrDropState : maybeDropState;
+	if (dragAndDropHooks && !dragAndDropHooks.useDropIndicator) return void 0;
+	if (!dropState && !dragAndDropHooks?.renderDropIndicator) return void 0;
+	const targetsEqual = (a, b) => {
+		if (!a) return false;
+		if (a.type !== b.type) return false;
+		if (a.type === "root" && b.type === "root") return true;
+		if (a.type !== "item" || b.type !== "item") return false;
+		return a.key === b.key && a.dropPosition === b.dropPosition;
+	};
+	return (target) => {
+		const stateIsDropTarget = dropState?.isDropTarget;
+		const isTarget = typeof stateIsDropTarget === "function" ? stateIsDropTarget(target) : stateIsDropTarget === true ? targetsEqual(dropState?.target, target) : false;
+		const isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.() ?? false;
+		if (!isTarget && !isVirtualDragging) return void 0;
+		return dragAndDropHooks?.renderDropIndicator ? dragAndDropHooks.renderDropIndicator(target) : <DropIndicator target={target} />;
+	};
+}
+function resolveKey(value) {
+	if (typeof value === "function") return value();
+	return value;
+}
+function getAfterDropNormalizedKey(target, collection) {
+	if (target.dropPosition !== "after" || !collection) return target.key;
+	let nextKey = collection.getKeyAfter(target.key);
+	let lastDescendantKey = null;
+	if (nextKey != null) {
+		const targetLevel = collection.getItem(target.key)?.level ?? 0;
+		while (nextKey != null) {
+			const node = collection.getItem(nextKey);
+			if (!node) break;
+			if (node.type && node.type !== "item") {
+				nextKey = collection.getKeyAfter(nextKey);
+				continue;
+			}
+			if ((node.level ?? 0) <= targetLevel) break;
+			lastDescendantKey = nextKey;
+			nextKey = collection.getKeyAfter(nextKey);
+		}
+	}
+	return nextKey ?? lastDescendantKey ?? target.key;
+}
+function getNormalizedDropTargetKey(target, collection) {
+	if (!target || target.type !== "item") return null;
+	return getAfterDropNormalizedKey(target, collection);
+}
+function useDndPersistedKeys(selectionManager, dragAndDropHooks, dropState, collection) {
+	return createMemo(() => {
+		const focusedKey = resolveKey(selectionManager?.focusedKey);
+		let dropTargetKey;
+		if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === "item") dropTargetKey = getNormalizedDropTargetKey(dropState.target, collection) ?? void 0;
+		const keys = /* @__PURE__ */ new Set();
+		if (focusedKey != null) keys.add(focusedKey);
+		if (dropTargetKey != null) keys.add(dropTargetKey);
+		return keys;
+	});
+}
+function mergePersistedKeysIntoVirtualRange(baseRange, persistedIndexes, itemCount, layoutInfoProvider, maxExtraItems = 60, options) {
+	const validPersistedIndexes = Array.from(new Set(persistedIndexes.filter((index) => index >= 0 && index < itemCount))).sort((a, b) => a - b);
+	const forceIndexes = Array.from(new Set((options?.forceIncludeIndexes ?? []).filter((index) => index >= 0 && index < itemCount)));
+	if (itemCount <= 0) return baseRange;
+	if (validPersistedIndexes.length === 0 && forceIndexes.length === 0) return baseRange;
+	const baseSpan = Math.max(1, baseRange.end - baseRange.start);
+	const maxSpan = Math.max(baseSpan, baseSpan + maxExtraItems);
+	let start = baseRange.start;
+	let end = baseRange.end;
+	const distanceToBaseRange = (index) => {
+		if (index < baseRange.start) return baseRange.start - index;
+		if (index >= baseRange.end) return index - (baseRange.end - 1);
+		return 0;
+	};
+	for (const index of validPersistedIndexes.sort((a, b) => distanceToBaseRange(a) - distanceToBaseRange(b))) {
+		const nextStart = Math.min(start, index);
+		const nextEnd = Math.max(end, index + 1);
+		if (nextEnd - nextStart <= maxSpan) {
+			start = nextStart;
+			end = nextEnd;
+		}
+	}
+	if (forceIndexes.length > 0) {
+		const forceMaxSpan = Math.max(maxSpan, options?.forceIncludeMaxSpan ?? Math.max(maxSpan, 300));
+		for (const index of forceIndexes) {
+			const nextStart = Math.min(start, index);
+			const nextEnd = Math.max(end, index + 1);
+			if (nextEnd - nextStart <= forceMaxSpan) {
+				start = nextStart;
+				end = nextEnd;
+			}
+		}
+		if (options?.fallbackToForcedWindow !== false) {
+			const missingForced = forceIndexes.filter((index) => index < start || index >= end);
+			if (missingForced.length > 0) {
+				const nearestForced = missingForced[0];
+				const forceMaxSpan = Math.max(maxSpan, options?.forceIncludeMaxSpan ?? Math.max(maxSpan, 300));
+				const windowSpan = Math.min(itemCount, Math.max(baseSpan, forceMaxSpan));
+				const centeredStart = Math.max(0, Math.min(itemCount - windowSpan, nearestForced - Math.floor(windowSpan / 2)));
+				start = centeredStart;
+				end = Math.min(itemCount, centeredStart + windowSpan);
+			}
+		}
+	}
+	if (start === baseRange.start && end === baseRange.end) return baseRange;
+	const startRect = start > 0 ? layoutInfoProvider.getLayoutInfo(start).rect : {
+		y: 0,
+		height: 0
+	};
+	const lastRect = layoutInfoProvider.getLayoutInfo(itemCount - 1).rect;
+	const endRect = end > 0 ? layoutInfoProvider.getLayoutInfo(end - 1).rect : {
+		y: 0,
+		height: 0
+	};
+	return {
+		start,
+		end,
+		offsetTop: Math.max(0, startRect.y),
+		offsetBottom: Math.max(0, lastRect.y + lastRect.height - (endRect.y + endRect.height))
+	};
+}
+//#endregion
+export { DragAndDropContext, DropIndicator, DropIndicatorContext, getNormalizedDropTargetKey, mergePersistedKeysIntoVirtualRange, useDndPersistedKeys, useRenderDropIndicator };
+
+//# sourceMappingURL=DragAndDrop.jsx.map

package/dist/DragAndDrop.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"DragAndDrop.jsx","names":[],"sources":["../src/DragAndDrop.tsx"],"sourcesContent":["/**\n * Drag and drop composition helpers for solidaria-components.\n *\n * Compatibility target: react-aria-components DragAndDrop exports.\n */\n\nimport { type JSX, type Accessor, createContext, createMemo, useContext } from \"solid-js\";\nimport type {\n  DragTypes,\n  DropOperation,\n  DropTarget,\n  ItemDropTarget,\n  Key,\n} from \"@proyecto-viviana/solid-stately\";\nimport type { DragAndDropHooks } from \"./useDragAndDrop\";\nimport {\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type SlotProps,\n  useRenderProps,\n  dataAttr,\n} from \"./utils\";\n\nexport interface DragAndDropContextValue {\n  dragAndDropHooks?: DragAndDropHooks<unknown>;\n  dragState?: unknown;\n  dropState?: {\n    target?: DropTarget | null;\n    isDropTarget?: (target: DropTarget) => boolean;\n  };\n}\n\nexport const DragAndDropContext = createContext<DragAndDropContextValue>({});\n\nexport interface DropIndicatorRenderProps {\n  isDropTarget: boolean;\n}\n\nexport interface DropIndicatorProps extends SlotProps {\n  target: ItemDropTarget;\n  children?: JSX.Element | ((props: DropIndicatorRenderProps) => JSX.Element);\n  class?: ClassNameOrFunction<DropIndicatorRenderProps>;\n  style?: StyleOrFunction<DropIndicatorRenderProps>;\n}\n\ninterface DropIndicatorContextValue {\n  render: (props: DropIndicatorProps) => JSX.Element;\n}\n\nexport const DropIndicatorContext = createContext<DropIndicatorContextValue | null>(null);\n\nfunction DefaultDropIndicator(props: DropIndicatorProps): JSX.Element {\n  const dnd = useContext(DragAndDropContext);\n  const isDropTarget = createMemo(() => {\n    const target = props.target;\n    return dnd.dropState?.isDropTarget?.(target) ?? false;\n  });\n\n  const renderProps = useRenderProps(\n    {\n      get children() {\n        return props.children;\n      },\n      class: props.class,\n      style: props.style,\n      defaultClassName: \"solidaria-DropIndicator\",\n    },\n    () => ({\n      isDropTarget: isDropTarget(),\n    }),\n  );\n\n  return (\n    <div\n      role=\"option\"\n      aria-disabled={true}\n      class={renderProps.class()}\n      style={renderProps.style()}\n      data-drop-target={dataAttr(isDropTarget())}\n    >\n      {renderProps.renderChildren()}\n    </div>\n  );\n}\n\nexport function DropIndicator(props: DropIndicatorProps): JSX.Element {\n  const context = useContext(DropIndicatorContext);\n  if (context) return context.render(props);\n  return <DefaultDropIndicator {...props} />;\n}\n\nexport function useRenderDropIndicator(\n  hooksOrDropState?:\n    | Pick<\n        DragAndDropHooks<unknown>,\n        \"renderDropIndicator\" | \"isVirtualDragging\" | \"useDropIndicator\"\n      >\n    | {\n        target?: DropTarget | null;\n        isDropTarget?: ((target: DropTarget) => boolean) | boolean;\n      },\n  maybeDropState?: {\n    target?: DropTarget | null;\n    isDropTarget?: ((target: DropTarget) => boolean) | boolean;\n  },\n): ((target: ItemDropTarget) => JSX.Element | undefined) | undefined {\n  const looksLikeDropState = (\n    value: unknown,\n  ): value is {\n    target?: DropTarget | null;\n    isDropTarget?: ((target: DropTarget) => boolean) | boolean;\n  } => {\n    return Boolean(\n      value &&\n      typeof value === \"object\" &&\n      (\"isDropTarget\" in (value as Record<string, unknown>) ||\n        \"target\" in (value as Record<string, unknown>)),\n    );\n  };\n\n  const dragAndDropHooks = looksLikeDropState(hooksOrDropState) ? undefined : hooksOrDropState;\n  const dropState = looksLikeDropState(hooksOrDropState) ? hooksOrDropState : maybeDropState;\n\n  // RAC only renders collection indicators when drop hooks are present.\n  if (dragAndDropHooks && !dragAndDropHooks.useDropIndicator) return undefined;\n  if (!dropState && !dragAndDropHooks?.renderDropIndicator) return undefined;\n\n  const targetsEqual = (a: DropTarget | null | undefined, b: DropTarget): boolean => {\n    if (!a) return false;\n    if (a.type !== b.type) return false;\n    if (a.type === \"root\" && b.type === \"root\") return true;\n    if (a.type !== \"item\" || b.type !== \"item\") return false;\n    return a.key === b.key && a.dropPosition === b.dropPosition;\n  };\n\n  return (target: ItemDropTarget) => {\n    const stateIsDropTarget = dropState?.isDropTarget;\n    const isTarget =\n      typeof stateIsDropTarget === \"function\"\n        ? stateIsDropTarget(target)\n        : stateIsDropTarget === true\n          ? targetsEqual(dropState?.target, target)\n          : false;\n    const isVirtualDragging = dragAndDropHooks?.isVirtualDragging?.() ?? false;\n    if (!isTarget && !isVirtualDragging) return undefined;\n    return dragAndDropHooks?.renderDropIndicator ? (\n      dragAndDropHooks.renderDropIndicator(target)\n    ) : (\n      <DropIndicator target={target} />\n    );\n  };\n}\n\ntype KeyAccessor = Key | null | undefined | Accessor<Key | null | undefined>;\n\ninterface SelectionManagerLike {\n  focusedKey?: KeyAccessor;\n}\n\ninterface CollectionLike {\n  getKeyAfter: (key: Key) => Key | null;\n  getItem: (key: Key) => { level?: number; type?: string } | null | undefined;\n}\n\ninterface DroppableCollectionStateLike {\n  target?: DropTarget | null;\n}\n\nexport interface VirtualRangeLike {\n  start: number;\n  end: number;\n  offsetTop: number;\n  offsetBottom: number;\n}\n\nexport interface LayoutInfoProviderLike {\n  getLayoutInfo: (index: number) => { rect: { y: number; height: number } };\n}\n\nfunction resolveKey(value: KeyAccessor): Key | null | undefined {\n  if (typeof value === \"function\") {\n    return (value as Accessor<Key | null | undefined>)();\n  }\n  return value;\n}\n\nfunction getAfterDropNormalizedKey(target: ItemDropTarget, collection?: CollectionLike): Key {\n  if (target.dropPosition !== \"after\" || !collection) return target.key;\n\n  let nextKey = collection.getKeyAfter(target.key);\n  let lastDescendantKey: Key | null = null;\n\n  if (nextKey != null) {\n    const targetLevel = collection.getItem(target.key)?.level ?? 0;\n    while (nextKey != null) {\n      const node = collection.getItem(nextKey);\n      if (!node) break;\n      if (node.type && node.type !== \"item\") {\n        nextKey = collection.getKeyAfter(nextKey);\n        continue;\n      }\n      if ((node.level ?? 0) <= targetLevel) break;\n      lastDescendantKey = nextKey;\n      nextKey = collection.getKeyAfter(nextKey);\n    }\n  }\n\n  return nextKey ?? lastDescendantKey ?? target.key;\n}\n\nexport function getNormalizedDropTargetKey(\n  target: DropTarget | null | undefined,\n  collection?: CollectionLike,\n): Key | null {\n  if (!target || target.type !== \"item\") return null;\n  return getAfterDropNormalizedKey(target, collection);\n}\n\nexport function useDndPersistedKeys(\n  selectionManager: SelectionManagerLike | null | undefined,\n  dragAndDropHooks?: Pick<DragAndDropHooks<unknown>, \"isVirtualDragging\">,\n  dropState?: DroppableCollectionStateLike,\n  collection?: CollectionLike,\n): Accessor<Set<Key>> {\n  return createMemo(() => {\n    const focusedKey = resolveKey(selectionManager?.focusedKey);\n    let dropTargetKey: Key | null | undefined;\n\n    if (dragAndDropHooks?.isVirtualDragging?.() && dropState?.target?.type === \"item\") {\n      dropTargetKey = getNormalizedDropTargetKey(dropState.target, collection) ?? undefined;\n    }\n\n    const keys = new Set<Key>();\n    if (focusedKey != null) keys.add(focusedKey);\n    if (dropTargetKey != null) keys.add(dropTargetKey);\n    return keys;\n  });\n}\n\nexport function mergePersistedKeysIntoVirtualRange(\n  baseRange: VirtualRangeLike,\n  persistedIndexes: number[],\n  itemCount: number,\n  layoutInfoProvider: LayoutInfoProviderLike,\n  maxExtraItems = 60,\n  options?: {\n    forceIncludeIndexes?: number[];\n    forceIncludeMaxSpan?: number;\n    fallbackToForcedWindow?: boolean;\n  },\n): VirtualRangeLike {\n  const validPersistedIndexes = Array.from(\n    new Set(persistedIndexes.filter((index) => index >= 0 && index < itemCount)),\n  ).sort((a, b) => a - b);\n  const forceIndexes = Array.from(\n    new Set(\n      (options?.forceIncludeIndexes ?? []).filter((index) => index >= 0 && index < itemCount),\n    ),\n  );\n\n  if (itemCount <= 0) return baseRange;\n  if (validPersistedIndexes.length === 0 && forceIndexes.length === 0) return baseRange;\n\n  const baseSpan = Math.max(1, baseRange.end - baseRange.start);\n  const maxSpan = Math.max(baseSpan, baseSpan + maxExtraItems);\n\n  let start = baseRange.start;\n  let end = baseRange.end;\n\n  const distanceToBaseRange = (index: number): number => {\n    if (index < baseRange.start) return baseRange.start - index;\n    if (index >= baseRange.end) return index - (baseRange.end - 1);\n    return 0;\n  };\n\n  for (const index of validPersistedIndexes.sort(\n    (a, b) => distanceToBaseRange(a) - distanceToBaseRange(b),\n  )) {\n    const nextStart = Math.min(start, index);\n    const nextEnd = Math.max(end, index + 1);\n    if (nextEnd - nextStart <= maxSpan) {\n      start = nextStart;\n      end = nextEnd;\n    }\n  }\n\n  if (forceIndexes.length > 0) {\n    const forceMaxSpan = Math.max(maxSpan, options?.forceIncludeMaxSpan ?? Math.max(maxSpan, 300));\n    for (const index of forceIndexes) {\n      const nextStart = Math.min(start, index);\n      const nextEnd = Math.max(end, index + 1);\n      if (nextEnd - nextStart <= forceMaxSpan) {\n        start = nextStart;\n        end = nextEnd;\n      }\n    }\n\n    if (options?.fallbackToForcedWindow !== false) {\n      const missingForced = forceIndexes.filter((index) => index < start || index >= end);\n      if (missingForced.length > 0) {\n        const nearestForced = missingForced[0];\n        const forceMaxSpan = Math.max(\n          maxSpan,\n          options?.forceIncludeMaxSpan ?? Math.max(maxSpan, 300),\n        );\n        const windowSpan = Math.min(itemCount, Math.max(baseSpan, forceMaxSpan));\n        const centeredStart = Math.max(\n          0,\n          Math.min(itemCount - windowSpan, nearestForced - Math.floor(windowSpan / 2)),\n        );\n        start = centeredStart;\n        end = Math.min(itemCount, centeredStart + windowSpan);\n      }\n    }\n  }\n\n  if (start === baseRange.start && end === baseRange.end) return baseRange;\n\n  const startRect = start > 0 ? layoutInfoProvider.getLayoutInfo(start).rect : { y: 0, height: 0 };\n  const lastRect = layoutInfoProvider.getLayoutInfo(itemCount - 1).rect;\n  const endRect = end > 0 ? layoutInfoProvider.getLayoutInfo(end - 1).rect : { y: 0, height: 0 };\n\n  return {\n    start,\n    end,\n    offsetTop: Math.max(0, startRect.y),\n    offsetBottom: Math.max(0, lastRect.y + lastRect.height - (endRect.y + endRect.height)),\n  };\n}\n\nexport type DropTargetDelegate = {\n  getDropTargetFromPoint: (\n    x: number,\n    y: number,\n    isValidDropTarget: (target: DropTarget) => boolean,\n  ) => DropTarget | null;\n  getDropOperation: (\n    target: DropTarget,\n    types: DragTypes,\n    allowedOperations: DropOperation[],\n  ) => DropOperation;\n};\n"],"mappings":"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"}

package/dist/DropZone.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropZone.d.ts","sourceRoot":"","sources":["../src/DropZone.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EACL,KAAK,GAAG,EAOT,MAAM,UAAU,CAAC;AAClB,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,aACf,SACE,IAAI,CAAC,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,EACnF,IAAI,CAAC,eAAe,EAAE,eAAe,CAAC,EACtC,WAAW,EACX,SAAS;IACX,QAAQ,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;IACjD,KAAK,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC,CAAC;CAC9C;AAED,eAAO,MAAM,eAAe,kDAA4C,CAAC;AAgBzE;;GAEG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAgK1D"}
+{"version":3,"file":"DropZone.d.ts","sourceRoot":"","sources":["../src/DropZone.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EACL,KAAK,GAAG,EAOT,MAAM,UAAU,CAAC;AAClB,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,SAAS,EAGf,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,aACf,SACE,IAAI,CAAC,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,EACnF,IAAI,CAAC,eAAe,EAAE,eAAe,CAAC,EACtC,WAAW,EACX,SAAS;IACX,QAAQ,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;IACjD,KAAK,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC,CAAC;CAC9C;AAED,eAAO,MAAM,eAAe,kDAA4C,CAAC;AAgBzE;;GAEG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAkK1D"}

package/dist/DropZone.js

@@ -0,0 +1,189 @@
+import { filterDOMProps, useRenderProps } from "./utils.js";
+import { VisuallyHidden } from "./VisuallyHidden.js";
+import { createComponent, getNextElement, getNextMarker, insert, mergeProps, runHydrationEvents, spread, template, use } from "solid-js/web";
+import { createContext, createMemo, createSignal, mergeProps as mergeProps$1, splitProps, useContext } from "solid-js";
+import { createDrop, createFocusRing, createHover, readFromDataTransfer } from "@proyecto-viviana/solidaria";
+//#region src/DropZone.tsx
+/**
+* DropZone primitive for solidaria-components.
+*
+* A drop target area for drag and drop operations.
+* Parity target: react-aria-components/src/DropZone.tsx
+*/
+var _tmpl$ = /*#__PURE__*/ template(`<button>`), _tmpl$2 = /*#__PURE__*/ template(`<div><!$><!/><!$><!/>`);
+const DropZoneContext = createContext(null);
+const DEFAULT_DROPZONE_LABEL = "Drop files";
+const FOCUSABLE_SELECTOR = [
+	"a[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]:not([tabindex=\"-1\"])",
+	"[contenteditable=\"true\"]"
+].join(",");
+function isFocusableElement(target) {
+	return target instanceof HTMLElement && target.matches(FOCUSABLE_SELECTOR);
+}
+/**
+* A drop zone is an area into which one or multiple objects can be dropped.
+*/
+function DropZone(props) {
+	const [local, dropProps, hoverEventProps, domProps] = splitProps(mergeProps$1(useContext(DropZoneContext) ?? {}, props), [
+		"children",
+		"class",
+		"style",
+		"slot",
+		"aria-label",
+		"aria-labelledby"
+	], [
+		"getDropOperation",
+		"getDropOperationForPoint",
+		"onDropEnter",
+		"onDropMove",
+		"onDropActivate",
+		"onDropExit",
+		"onDrop",
+		"isDisabled"
+	], [
+		"onHoverStart",
+		"onHoverEnd",
+		"onHoverChange"
+	]);
+	const [dropZoneRef, setDropZoneRef] = createSignal(null);
+	const [dropButtonRef, setDropButtonRef] = createSignal(null);
+	const dropAria = createDrop(() => ({
+		getDropOperation: dropProps.getDropOperation,
+		getDropOperationForPoint: dropProps.getDropOperationForPoint,
+		onDropEnter: dropProps.onDropEnter,
+		onDropMove: dropProps.onDropMove,
+		onDropActivate: dropProps.onDropActivate,
+		onDropExit: dropProps.onDropExit,
+		onDrop: dropProps.onDrop,
+		hasDropButton: true,
+		isDisabled: dropProps.isDisabled
+	}));
+	const { isHovered, hoverProps } = createHover(() => ({
+		isDisabled: dropProps.isDisabled,
+		onHoverStart: hoverEventProps.onHoverStart,
+		onHoverEnd: hoverEventProps.onHoverEnd,
+		onHoverChange: hoverEventProps.onHoverChange
+	}));
+	const { isFocused, isFocusVisible, focusProps } = createFocusRing();
+	const renderValues = createMemo(() => ({
+		isHovered: isHovered(),
+		isFocused: isFocused(),
+		isFocusVisible: isFocusVisible(),
+		isDropTarget: dropAria.isDropTarget,
+		isDisabled: !!dropProps.isDisabled
+	}));
+	const renderProps = useRenderProps({
+		get children() {
+			return local.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-DropZone"
+	}, renderValues);
+	const filteredDomProps = createMemo(() => filterDOMProps(domProps, { global: true }));
+	const cleanDropProps = () => {
+		const { ref: _ref, ...rest } = dropAria.dropProps;
+		return rest;
+	};
+	const cleanHoverProps = () => {
+		const { ref: _ref, ...rest } = hoverProps;
+		return rest;
+	};
+	const cleanFocusProps = () => {
+		const { ref: _ref, ...rest } = focusProps;
+		return rest;
+	};
+	const cleanDropButtonProps = () => {
+		const { ref: _ref, ...rest } = dropAria.dropButtonProps;
+		return rest;
+	};
+	const onRootClick = (e) => {
+		const onClick = filteredDomProps().onClick;
+		onClick?.(e);
+		if (e.defaultPrevented || dropProps.isDisabled) return;
+		const root = dropZoneRef();
+		const hiddenButton = dropButtonRef();
+		if (!root || !hiddenButton) return;
+		let target = e.target instanceof Element ? e.target : root;
+		while (target && root.contains(target)) {
+			if (isFocusableElement(target)) return;
+			if (target === root) {
+				hiddenButton.focus();
+				return;
+			}
+			target = target.parentElement;
+		}
+	};
+	const onHiddenButtonPaste = (e) => {
+		if (dropProps.isDisabled || !e.clipboardData) return;
+		const items = readFromDataTransfer(e.clipboardData);
+		if (items.length === 0) return;
+		e.preventDefault();
+		dropProps.onDrop?.({
+			type: "drop",
+			x: 0,
+			y: 0,
+			items,
+			dropOperation: "copy"
+		});
+	};
+	const dropButtonAriaLabel = createMemo(() => local["aria-label"] ?? (!local["aria-labelledby"] ? DEFAULT_DROPZONE_LABEL : void 0));
+	return (() => {
+		var _el$ = getNextElement(_tmpl$2), _el$3 = _el$.firstChild, [_el$4, _co$] = getNextMarker(_el$3.nextSibling), _el$5 = _el$4.nextSibling, [_el$6, _co$2] = getNextMarker(_el$5.nextSibling);
+		use(setDropZoneRef, _el$);
+		spread(_el$, mergeProps(filteredDomProps, cleanDropProps, cleanHoverProps, {
+			"onClick": onRootClick,
+			get ["class"]() {
+				return renderProps.class();
+			},
+			get style() {
+				return renderProps.style();
+			},
+			get slot() {
+				return local.slot;
+			},
+			get ["data-hovered"]() {
+				return isHovered() || void 0;
+			},
+			get ["data-focused"]() {
+				return isFocused() || void 0;
+			},
+			get ["data-focus-visible"]() {
+				return isFocusVisible() || void 0;
+			},
+			get ["data-drop-target"]() {
+				return dropAria.isDropTarget || void 0;
+			},
+			get ["data-disabled"]() {
+				return dropProps.isDisabled || void 0;
+			}
+		}), false, true);
+		insert(_el$, createComponent(VisuallyHidden, { get children() {
+			var _el$2 = getNextElement(_tmpl$);
+			use(setDropButtonRef, _el$2);
+			spread(_el$2, mergeProps(cleanDropButtonProps, cleanFocusProps, {
+				get ["aria-label"]() {
+					return dropButtonAriaLabel();
+				},
+				get ["aria-labelledby"]() {
+					return local["aria-labelledby"];
+				},
+				"onPaste": onHiddenButtonPaste
+			}), false, false);
+			runHydrationEvents();
+			return _el$2;
+		} }), _el$4, _co$);
+		insert(_el$, () => renderProps.renderChildren(), _el$6, _co$2);
+		runHydrationEvents();
+		return _el$;
+	})();
+}
+//#endregion
+export { DropZone, DropZoneContext };
+
+//# sourceMappingURL=DropZone.js.map

package/dist/DropZone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropZone.js","names":["JSX","createContext","createMemo","createSignal","mergeProps","splitProps","useContext","createDrop","createFocusRing","createHover","readFromDataTransfer","HoverEvents","AriaDropOptions","ClassNameOrFunction","StyleOrFunction","RenderChildren","SlotProps","useRenderProps","filterDOMProps","VisuallyHidden","DropZoneRenderProps","isHovered","isFocused","isFocusVisible","isDropTarget","isDisabled","DropZoneProps","Omit","HTMLAttributes","HTMLDivElement","children","class","style","DropZoneContext","DEFAULT_DROPZONE_LABEL","FOCUSABLE_SELECTOR","join","isFocusableElement","target","Element","HTMLElement","matches","DropZone","props","contextProps","mergedProps","local","dropProps","hoverEventProps","domProps","dropZoneRef","setDropZoneRef","dropButtonRef","setDropButtonRef","HTMLButtonElement","dropAria","getDropOperation","getDropOperationForPoint","onDropEnter","onDropMove","onDropActivate","onDropExit","onDrop","hasDropButton","hoverProps","onHoverStart","onHoverEnd","onHoverChange","focusProps","renderValues","renderProps","defaultClassName","filteredDomProps","global","cleanDropProps","ref","_ref","rest","Record","cleanHoverProps","cleanFocusProps","cleanDropButtonProps","dropButtonProps","onRootClick","EventHandler","MouseEvent","e","onClick","defaultPrevented","root","hiddenButton","contains","focus","parentElement","onHiddenButtonPaste","ClipboardEvent","clipboardData","items","length","preventDefault","type","x","y","dropOperation","dropButtonAriaLabel","undefined","_el$","_$getNextElement","_tmpl$2","_el$3","firstChild","_el$4","_co$","_$getNextMarker","nextSibling","_el$5","_el$6","_co$2","_$use","_$spread","_$mergeProps","slot","data-hovered","data-focused","data-focus-visible","data-drop-target","data-disabled","_$insert","_$createComponent","_el$2","_tmpl$","aria-label","aria-labelledby","_$runHydrationEvents","renderChildren"],"sources":["../src/DropZone.tsx"],"sourcesContent":["/**\n * DropZone primitive for solidaria-components.\n *\n * A drop target area for drag and drop operations.\n * Parity target: react-aria-components/src/DropZone.tsx\n */\n\nimport {\n  type JSX,\n  createContext,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport {\n  createDrop,\n  createFocusRing,\n  createHover,\n  readFromDataTransfer,\n  type HoverEvents,\n  type AriaDropOptions,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type RenderChildren,\n  type SlotProps,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\nimport { VisuallyHidden } from \"./VisuallyHidden\";\n\nexport interface DropZoneRenderProps {\n  isHovered: boolean;\n  isFocused: boolean;\n  isFocusVisible: boolean;\n  isDropTarget: boolean;\n  isDisabled: boolean;\n}\n\nexport interface DropZoneProps\n  extends\n    Omit<JSX.HTMLAttributes<HTMLDivElement>, \"children\" | \"class\" | \"style\" | \"onDrop\">,\n    Omit<AriaDropOptions, \"hasDropButton\">,\n    HoverEvents,\n    SlotProps {\n  children?: RenderChildren<DropZoneRenderProps>;\n  class?: ClassNameOrFunction<DropZoneRenderProps>;\n  style?: StyleOrFunction<DropZoneRenderProps>;\n}\n\nexport const DropZoneContext = createContext<DropZoneProps | null>(null);\nconst DEFAULT_DROPZONE_LABEL = \"Drop files\";\nconst FOCUSABLE_SELECTOR = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  'input:not([disabled]):not([type=\"hidden\"])',\n  \"select:not([disabled])\",\n  \"textarea:not([disabled])\",\n  '[tabindex]:not([tabindex=\"-1\"])',\n  '[contenteditable=\"true\"]',\n].join(\",\");\n\nfunction isFocusableElement(target: Element): boolean {\n  return target instanceof HTMLElement && target.matches(FOCUSABLE_SELECTOR);\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dropped.\n */\nexport function DropZone(props: DropZoneProps): JSX.Element {\n  const contextProps = useContext(DropZoneContext);\n  const mergedProps = mergeProps(contextProps ?? {}, props);\n  const [local, dropProps, hoverEventProps, domProps] = splitProps(\n    mergedProps,\n    [\"children\", \"class\", \"style\", \"slot\", \"aria-label\", \"aria-labelledby\"],\n    [\n      \"getDropOperation\",\n      \"getDropOperationForPoint\",\n      \"onDropEnter\",\n      \"onDropMove\",\n      \"onDropActivate\",\n      \"onDropExit\",\n      \"onDrop\",\n      \"isDisabled\",\n    ],\n    [\"onHoverStart\", \"onHoverEnd\", \"onHoverChange\"],\n  );\n\n  const [dropZoneRef, setDropZoneRef] = createSignal<HTMLDivElement | null>(null);\n  const [dropButtonRef, setDropButtonRef] = createSignal<HTMLButtonElement | null>(null);\n\n  const dropAria = createDrop(() => ({\n    getDropOperation: dropProps.getDropOperation,\n    getDropOperationForPoint: dropProps.getDropOperationForPoint,\n    onDropEnter: dropProps.onDropEnter,\n    onDropMove: dropProps.onDropMove,\n    onDropActivate: dropProps.onDropActivate,\n    onDropExit: dropProps.onDropExit,\n    onDrop: dropProps.onDrop,\n    hasDropButton: true,\n    isDisabled: dropProps.isDisabled,\n  }));\n\n  const { isHovered, hoverProps } = createHover(() => ({\n    isDisabled: dropProps.isDisabled,\n    onHoverStart: hoverEventProps.onHoverStart,\n    onHoverEnd: hoverEventProps.onHoverEnd,\n    onHoverChange: hoverEventProps.onHoverChange,\n  }));\n  const { isFocused, isFocusVisible, focusProps } = createFocusRing();\n\n  const renderValues = createMemo<DropZoneRenderProps>(() => ({\n    isHovered: isHovered(),\n    isFocused: isFocused(),\n    isFocusVisible: isFocusVisible(),\n    isDropTarget: dropAria.isDropTarget,\n    isDisabled: !!dropProps.isDisabled,\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      get children() {\n        return local.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-DropZone\",\n    },\n    renderValues,\n  );\n\n  const filteredDomProps = createMemo(() => filterDOMProps(domProps, { global: true }));\n\n  const cleanDropProps = () => {\n    const { ref: _ref, ...rest } = dropAria.dropProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanHoverProps = () => {\n    const { ref: _ref, ...rest } = hoverProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanFocusProps = () => {\n    const { ref: _ref, ...rest } = focusProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanDropButtonProps = () => {\n    const { ref: _ref, ...rest } = dropAria.dropButtonProps as Record<string, unknown>;\n    return rest;\n  };\n\n  const onRootClick: JSX.EventHandler<HTMLDivElement, MouseEvent> = (e) => {\n    const onClick = (filteredDomProps() as JSX.HTMLAttributes<HTMLDivElement>).onClick as\n      | JSX.EventHandler<HTMLDivElement, MouseEvent>\n      | undefined;\n    onClick?.(e);\n    if (e.defaultPrevented || dropProps.isDisabled) {\n      return;\n    }\n\n    const root = dropZoneRef();\n    const hiddenButton = dropButtonRef();\n    if (!root || !hiddenButton) {\n      return;\n    }\n\n    let target: Element | null = e.target instanceof Element ? e.target : root;\n    while (target && root.contains(target)) {\n      if (isFocusableElement(target)) {\n        return;\n      }\n      if (target === root) {\n        hiddenButton.focus();\n        return;\n      }\n      target = target.parentElement;\n    }\n  };\n\n  const onHiddenButtonPaste: JSX.EventHandler<HTMLButtonElement, ClipboardEvent> = (e) => {\n    if (dropProps.isDisabled || !e.clipboardData) {\n      return;\n    }\n\n    const items = readFromDataTransfer(e.clipboardData);\n    if (items.length === 0) {\n      return;\n    }\n\n    e.preventDefault();\n    dropProps.onDrop?.({\n      type: \"drop\",\n      x: 0,\n      y: 0,\n      items,\n      dropOperation: \"copy\",\n    });\n  };\n\n  const dropButtonAriaLabel = createMemo(\n    () => local[\"aria-label\"] ?? (!local[\"aria-labelledby\"] ? DEFAULT_DROPZONE_LABEL : undefined),\n  );\n\n  return (\n    <div\n      ref={setDropZoneRef}\n      {...filteredDomProps()}\n      {...cleanDropProps()}\n      {...cleanHoverProps()}\n      onClick={onRootClick}\n      class={renderProps.class()}\n      style={renderProps.style()}\n      slot={local.slot}\n      data-hovered={isHovered() || undefined}\n      data-focused={isFocused() || undefined}\n      data-focus-visible={isFocusVisible() || undefined}\n      data-drop-target={dropAria.isDropTarget || undefined}\n      data-disabled={dropProps.isDisabled || undefined}\n    >\n      <VisuallyHidden>\n        <button\n          ref={setDropButtonRef}\n          {...cleanDropButtonProps()}\n          {...cleanFocusProps()}\n          aria-label={dropButtonAriaLabel()}\n          aria-labelledby={local[\"aria-labelledby\"]}\n          onPaste={onHiddenButtonPaste}\n        />\n      </VisuallyHidden>\n      {renderProps.renderChildren()}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/DropZone.jsx

@@ -0,0 +1,144 @@
+import { filterDOMProps, useRenderProps } from "./utils.jsx";
+import { VisuallyHidden } from "./VisuallyHidden.jsx";
+import { createContext, createMemo, createSignal, mergeProps, splitProps, useContext } from "solid-js";
+import { createDrop, createFocusRing, createHover, readFromDataTransfer } from "@proyecto-viviana/solidaria";
+//#region src/DropZone.tsx
+/**
+* DropZone primitive for solidaria-components.
+*
+* A drop target area for drag and drop operations.
+* Parity target: react-aria-components/src/DropZone.tsx
+*/
+const DropZoneContext = createContext(null);
+const DEFAULT_DROPZONE_LABEL = "Drop files";
+const FOCUSABLE_SELECTOR = [
+	"a[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]:not([tabindex=\"-1\"])",
+	"[contenteditable=\"true\"]"
+].join(",");
+function isFocusableElement(target) {
+	return target instanceof HTMLElement && target.matches(FOCUSABLE_SELECTOR);
+}
+/**
+* A drop zone is an area into which one or multiple objects can be dropped.
+*/
+function DropZone(props) {
+	const [local, dropProps, hoverEventProps, domProps] = splitProps(mergeProps(useContext(DropZoneContext) ?? {}, props), [
+		"children",
+		"class",
+		"style",
+		"slot",
+		"aria-label",
+		"aria-labelledby"
+	], [
+		"getDropOperation",
+		"getDropOperationForPoint",
+		"onDropEnter",
+		"onDropMove",
+		"onDropActivate",
+		"onDropExit",
+		"onDrop",
+		"isDisabled"
+	], [
+		"onHoverStart",
+		"onHoverEnd",
+		"onHoverChange"
+	]);
+	const [dropZoneRef, setDropZoneRef] = createSignal(null);
+	const [dropButtonRef, setDropButtonRef] = createSignal(null);
+	const dropAria = createDrop(() => ({
+		getDropOperation: dropProps.getDropOperation,
+		getDropOperationForPoint: dropProps.getDropOperationForPoint,
+		onDropEnter: dropProps.onDropEnter,
+		onDropMove: dropProps.onDropMove,
+		onDropActivate: dropProps.onDropActivate,
+		onDropExit: dropProps.onDropExit,
+		onDrop: dropProps.onDrop,
+		hasDropButton: true,
+		isDisabled: dropProps.isDisabled
+	}));
+	const { isHovered, hoverProps } = createHover(() => ({
+		isDisabled: dropProps.isDisabled,
+		onHoverStart: hoverEventProps.onHoverStart,
+		onHoverEnd: hoverEventProps.onHoverEnd,
+		onHoverChange: hoverEventProps.onHoverChange
+	}));
+	const { isFocused, isFocusVisible, focusProps } = createFocusRing();
+	const renderValues = createMemo(() => ({
+		isHovered: isHovered(),
+		isFocused: isFocused(),
+		isFocusVisible: isFocusVisible(),
+		isDropTarget: dropAria.isDropTarget,
+		isDisabled: !!dropProps.isDisabled
+	}));
+	const renderProps = useRenderProps({
+		get children() {
+			return local.children;
+		},
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-DropZone"
+	}, renderValues);
+	const filteredDomProps = createMemo(() => filterDOMProps(domProps, { global: true }));
+	const cleanDropProps = () => {
+		const { ref: _ref, ...rest } = dropAria.dropProps;
+		return rest;
+	};
+	const cleanHoverProps = () => {
+		const { ref: _ref, ...rest } = hoverProps;
+		return rest;
+	};
+	const cleanFocusProps = () => {
+		const { ref: _ref, ...rest } = focusProps;
+		return rest;
+	};
+	const cleanDropButtonProps = () => {
+		const { ref: _ref, ...rest } = dropAria.dropButtonProps;
+		return rest;
+	};
+	const onRootClick = (e) => {
+		const onClick = filteredDomProps().onClick;
+		onClick?.(e);
+		if (e.defaultPrevented || dropProps.isDisabled) return;
+		const root = dropZoneRef();
+		const hiddenButton = dropButtonRef();
+		if (!root || !hiddenButton) return;
+		let target = e.target instanceof Element ? e.target : root;
+		while (target && root.contains(target)) {
+			if (isFocusableElement(target)) return;
+			if (target === root) {
+				hiddenButton.focus();
+				return;
+			}
+			target = target.parentElement;
+		}
+	};
+	const onHiddenButtonPaste = (e) => {
+		if (dropProps.isDisabled || !e.clipboardData) return;
+		const items = readFromDataTransfer(e.clipboardData);
+		if (items.length === 0) return;
+		e.preventDefault();
+		dropProps.onDrop?.({
+			type: "drop",
+			x: 0,
+			y: 0,
+			items,
+			dropOperation: "copy"
+		});
+	};
+	const dropButtonAriaLabel = createMemo(() => local["aria-label"] ?? (!local["aria-labelledby"] ? DEFAULT_DROPZONE_LABEL : void 0));
+	return <div ref={setDropZoneRef} {...filteredDomProps()} {...cleanDropProps()} {...cleanHoverProps()} onClick={onRootClick} class={renderProps.class()} style={renderProps.style()} slot={local.slot} data-hovered={isHovered() || void 0} data-focused={isFocused() || void 0} data-focus-visible={isFocusVisible() || void 0} data-drop-target={dropAria.isDropTarget || void 0} data-disabled={dropProps.isDisabled || void 0}>
+      <VisuallyHidden>
+        <button ref={setDropButtonRef} {...cleanDropButtonProps()} {...cleanFocusProps()} aria-label={dropButtonAriaLabel()} aria-labelledby={local["aria-labelledby"]} onPaste={onHiddenButtonPaste} />
+      </VisuallyHidden>
+      {renderProps.renderChildren()}
+    </div>;
+}
+//#endregion
+export { DropZone, DropZoneContext };
+
+//# sourceMappingURL=DropZone.jsx.map

package/dist/DropZone.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropZone.jsx","names":[],"sources":["../src/DropZone.tsx"],"sourcesContent":["/**\n * DropZone primitive for solidaria-components.\n *\n * A drop target area for drag and drop operations.\n * Parity target: react-aria-components/src/DropZone.tsx\n */\n\nimport {\n  type JSX,\n  createContext,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport {\n  createDrop,\n  createFocusRing,\n  createHover,\n  readFromDataTransfer,\n  type HoverEvents,\n  type AriaDropOptions,\n} from \"@proyecto-viviana/solidaria\";\nimport {\n  type ClassNameOrFunction,\n  type StyleOrFunction,\n  type RenderChildren,\n  type SlotProps,\n  useRenderProps,\n  filterDOMProps,\n} from \"./utils\";\nimport { VisuallyHidden } from \"./VisuallyHidden\";\n\nexport interface DropZoneRenderProps {\n  isHovered: boolean;\n  isFocused: boolean;\n  isFocusVisible: boolean;\n  isDropTarget: boolean;\n  isDisabled: boolean;\n}\n\nexport interface DropZoneProps\n  extends\n    Omit<JSX.HTMLAttributes<HTMLDivElement>, \"children\" | \"class\" | \"style\" | \"onDrop\">,\n    Omit<AriaDropOptions, \"hasDropButton\">,\n    HoverEvents,\n    SlotProps {\n  children?: RenderChildren<DropZoneRenderProps>;\n  class?: ClassNameOrFunction<DropZoneRenderProps>;\n  style?: StyleOrFunction<DropZoneRenderProps>;\n}\n\nexport const DropZoneContext = createContext<DropZoneProps | null>(null);\nconst DEFAULT_DROPZONE_LABEL = \"Drop files\";\nconst FOCUSABLE_SELECTOR = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  'input:not([disabled]):not([type=\"hidden\"])',\n  \"select:not([disabled])\",\n  \"textarea:not([disabled])\",\n  '[tabindex]:not([tabindex=\"-1\"])',\n  '[contenteditable=\"true\"]',\n].join(\",\");\n\nfunction isFocusableElement(target: Element): boolean {\n  return target instanceof HTMLElement && target.matches(FOCUSABLE_SELECTOR);\n}\n\n/**\n * A drop zone is an area into which one or multiple objects can be dropped.\n */\nexport function DropZone(props: DropZoneProps): JSX.Element {\n  const contextProps = useContext(DropZoneContext);\n  const mergedProps = mergeProps(contextProps ?? {}, props);\n  const [local, dropProps, hoverEventProps, domProps] = splitProps(\n    mergedProps,\n    [\"children\", \"class\", \"style\", \"slot\", \"aria-label\", \"aria-labelledby\"],\n    [\n      \"getDropOperation\",\n      \"getDropOperationForPoint\",\n      \"onDropEnter\",\n      \"onDropMove\",\n      \"onDropActivate\",\n      \"onDropExit\",\n      \"onDrop\",\n      \"isDisabled\",\n    ],\n    [\"onHoverStart\", \"onHoverEnd\", \"onHoverChange\"],\n  );\n\n  const [dropZoneRef, setDropZoneRef] = createSignal<HTMLDivElement | null>(null);\n  const [dropButtonRef, setDropButtonRef] = createSignal<HTMLButtonElement | null>(null);\n\n  const dropAria = createDrop(() => ({\n    getDropOperation: dropProps.getDropOperation,\n    getDropOperationForPoint: dropProps.getDropOperationForPoint,\n    onDropEnter: dropProps.onDropEnter,\n    onDropMove: dropProps.onDropMove,\n    onDropActivate: dropProps.onDropActivate,\n    onDropExit: dropProps.onDropExit,\n    onDrop: dropProps.onDrop,\n    hasDropButton: true,\n    isDisabled: dropProps.isDisabled,\n  }));\n\n  const { isHovered, hoverProps } = createHover(() => ({\n    isDisabled: dropProps.isDisabled,\n    onHoverStart: hoverEventProps.onHoverStart,\n    onHoverEnd: hoverEventProps.onHoverEnd,\n    onHoverChange: hoverEventProps.onHoverChange,\n  }));\n  const { isFocused, isFocusVisible, focusProps } = createFocusRing();\n\n  const renderValues = createMemo<DropZoneRenderProps>(() => ({\n    isHovered: isHovered(),\n    isFocused: isFocused(),\n    isFocusVisible: isFocusVisible(),\n    isDropTarget: dropAria.isDropTarget,\n    isDisabled: !!dropProps.isDisabled,\n  }));\n\n  const renderProps = useRenderProps(\n    {\n      get children() {\n        return local.children;\n      },\n      class: local.class,\n      style: local.style,\n      defaultClassName: \"solidaria-DropZone\",\n    },\n    renderValues,\n  );\n\n  const filteredDomProps = createMemo(() => filterDOMProps(domProps, { global: true }));\n\n  const cleanDropProps = () => {\n    const { ref: _ref, ...rest } = dropAria.dropProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanHoverProps = () => {\n    const { ref: _ref, ...rest } = hoverProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanFocusProps = () => {\n    const { ref: _ref, ...rest } = focusProps as Record<string, unknown>;\n    return rest;\n  };\n  const cleanDropButtonProps = () => {\n    const { ref: _ref, ...rest } = dropAria.dropButtonProps as Record<string, unknown>;\n    return rest;\n  };\n\n  const onRootClick: JSX.EventHandler<HTMLDivElement, MouseEvent> = (e) => {\n    const onClick = (filteredDomProps() as JSX.HTMLAttributes<HTMLDivElement>).onClick as\n      | JSX.EventHandler<HTMLDivElement, MouseEvent>\n      | undefined;\n    onClick?.(e);\n    if (e.defaultPrevented || dropProps.isDisabled) {\n      return;\n    }\n\n    const root = dropZoneRef();\n    const hiddenButton = dropButtonRef();\n    if (!root || !hiddenButton) {\n      return;\n    }\n\n    let target: Element | null = e.target instanceof Element ? e.target : root;\n    while (target && root.contains(target)) {\n      if (isFocusableElement(target)) {\n        return;\n      }\n      if (target === root) {\n        hiddenButton.focus();\n        return;\n      }\n      target = target.parentElement;\n    }\n  };\n\n  const onHiddenButtonPaste: JSX.EventHandler<HTMLButtonElement, ClipboardEvent> = (e) => {\n    if (dropProps.isDisabled || !e.clipboardData) {\n      return;\n    }\n\n    const items = readFromDataTransfer(e.clipboardData);\n    if (items.length === 0) {\n      return;\n    }\n\n    e.preventDefault();\n    dropProps.onDrop?.({\n      type: \"drop\",\n      x: 0,\n      y: 0,\n      items,\n      dropOperation: \"copy\",\n    });\n  };\n\n  const dropButtonAriaLabel = createMemo(\n    () => local[\"aria-label\"] ?? (!local[\"aria-labelledby\"] ? DEFAULT_DROPZONE_LABEL : undefined),\n  );\n\n  return (\n    <div\n      ref={setDropZoneRef}\n      {...filteredDomProps()}\n      {...cleanDropProps()}\n      {...cleanHoverProps()}\n      onClick={onRootClick}\n      class={renderProps.class()}\n      style={renderProps.style()}\n      slot={local.slot}\n      data-hovered={isHovered() || undefined}\n      data-focused={isFocused() || undefined}\n      data-focus-visible={isFocusVisible() || undefined}\n      data-drop-target={dropAria.isDropTarget || undefined}\n      data-disabled={dropProps.isDisabled || undefined}\n    >\n      <VisuallyHidden>\n        <button\n          ref={setDropButtonRef}\n          {...cleanDropButtonProps()}\n          {...cleanFocusProps()}\n          aria-label={dropButtonAriaLabel()}\n          aria-labelledby={local[\"aria-labelledby\"]}\n          onPaste={onHiddenButtonPaste}\n        />\n      </VisuallyHidden>\n      {renderProps.renderChildren()}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/FieldError.js

@@ -0,0 +1,66 @@
+import { filterDOMProps, useRenderProps } from "./utils.js";
+import { createComponent, getNextElement, insert, memo, mergeProps, runHydrationEvents, spread, template } from "solid-js/web";
+import { Show, createContext, createMemo, splitProps, useContext } from "solid-js";
+import { DEFAULT_VALIDATION_RESULT } from "@proyecto-viviana/solid-stately";
+//#region src/FieldError.tsx
+/**
+* FieldError primitive for solidaria-components.
+*
+* Displays validation errors for a field from context or explicit validation prop.
+* Port direction: react-aria-components/src/FieldError.tsx
+*/
+var _tmpl$ = /*#__PURE__*/ template(`<div>`);
+const FieldErrorContext = createContext(null);
+function FieldError(props) {
+	const contextValue = useContext(FieldErrorContext);
+	const contextValidation = () => {
+		if (contextValue && "validation" in contextValue) return contextValue.validation;
+		return contextValue;
+	};
+	const contextErrorMessageProps = () => {
+		if (contextValue && "validation" in contextValue) return contextValue.errorMessageProps ?? {};
+		return {};
+	};
+	const [local, domProps] = splitProps(props, [
+		"validation",
+		"children",
+		"class",
+		"style",
+		"slot"
+	]);
+	const validation = createMemo(() => local.validation ?? contextValidation());
+	const renderProps = useRenderProps({
+		children: local.children ?? ((currentValidation) => currentValidation.validationErrors.join(" ")),
+		class: local.class,
+		style: local.style,
+		defaultClassName: "solidaria-FieldError"
+	}, () => validation() ?? DEFAULT_VALIDATION_RESULT);
+	const filteredDomProps = filterDOMProps(domProps, { global: true });
+	const children = () => renderProps.renderChildren();
+	return createComponent(Show, {
+		get when() {
+			return memo(() => !!validation()?.isInvalid)() && children();
+		},
+		get children() {
+			var _el$ = getNextElement(_tmpl$);
+			spread(_el$, mergeProps(() => contextErrorMessageProps(), filteredDomProps, {
+				get slot() {
+					return local.slot ?? "errorMessage";
+				},
+				get ["class"]() {
+					return renderProps.class();
+				},
+				get style() {
+					return renderProps.style();
+				}
+			}), false, true);
+			insert(_el$, children);
+			runHydrationEvents();
+			return _el$;
+		}
+	});
+}
+//#endregion
+export { FieldError, FieldErrorContext };
+
+//# sourceMappingURL=FieldError.js.map