@solid2-aria/components 0.0.0-stage → 0.0.1

package/dist/server/collection-dnd.js

@@ -0,0 +1,217 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/GridList.tsx.
+ * Modified for Solid Aria: collections, selection, drag and drop, and DOM rendering use Solid 2 ownership and reactive getters; uses Solid class props.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { assignRef, createRenderProps, dom } from "./utils.js";
+import { DragAndDropContext } from "./drag-and-drop.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { Show, createMemo, createSignal, merge, untrack, useContext } from "solid-js";
+import { dynamic, memo, mergeProps as mergeProps$1, ssrElement } from "@solidjs/web";
+import { requireValue } from "@solid2-aria/core/utils/require-value";
+import { createVisuallyHidden } from "@solid2-aria/core/visually-hidden/visually-hidden";
+import { ListKeyboardDelegate } from "@solid2-aria/core/selection/list-keyboard-delegate";
+// src/collection-dnd.tsx
+var _sk$ = (k) => k === "role";
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _m$5 = Symbol();
+var _m$6 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].columnCount;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$2 = {
+	get() {
+		const hidden = this[_m$2];
+		const aria = this[_m$3];
+		const render = this[_m$4];
+		return [ssrElement("div", () => {
+			return mergeProps(merge(() => hidden.visuallyHiddenProps ?? {}), merge(() => aria.dropIndicatorProps ?? {}));
+		}, void 0, true, _sk$, " role=\"button\""), memo(() => {
+			return render.children;
+		})];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p, _p2, _p3, _p4, _p5) {
+	this[_m$] = _p;
+	this[_m$2] = _p2;
+	this[_m$3] = _p3;
+	this[_m$4] = _p4;
+	this.role = _p5;
+	Object.defineProperty(this, "colspan", _d$);
+	Object.defineProperty(this, "children", _d$2);
+}
+_P$.prototype = Object.prototype;
+var _d$3 = {
+	get() {
+		return this[_m$].isDropTarget || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		const Cell = this[_m$2];
+		const props = this[_m$3];
+		const hidden = this[_m$4];
+		const aria = this[_m$];
+		const render = this[_m$5];
+		return Cell(new _P$(props, hidden, aria, render, "gridcell"));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p6, _p7, _p8, _p9, _p0, _p1, _p10) {
+	this[_m$] = _p6;
+	this[_m$2] = _p7;
+	this[_m$3] = _p8;
+	this[_m$4] = _p9;
+	this[_m$5] = _p0;
+	this.role = _p1;
+	this.ref = _p10;
+	Object.defineProperty(this, "data-drop-target", _d$3);
+	Object.defineProperty(this, "children", _d$4);
+}
+_P$2.prototype = Object.prototype;
+var _d$5 = {
+	get() {
+		return !this[_m$].isHidden;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$6 = {
+	get() {
+		const Tag = this[_m$2];
+		const render = this[_m$3];
+		const aria = this[_m$];
+		const Cell = this[_m$4];
+		const props = this[_m$5];
+		const hidden = this[_m$6];
+		return Tag(mergeProps$1(render, new _P$2(aria, Cell, props, hidden, render, "row", (element) => {
+			assignRef(untrack(() => props.ref), element);
+		})));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p11, _p12, _p13, _p14, _p15, _p16) {
+	this[_m$] = _p11;
+	this[_m$2] = _p12;
+	this[_m$3] = _p13;
+	this[_m$4] = _p14;
+	this[_m$5] = _p15;
+	this[_m$6] = _p16;
+	Object.defineProperty(this, "when", _d$5);
+	Object.defineProperty(this, "children", _d$6);
+}
+_P$3.prototype = Object.prototype;
+function createCollectionDragAndDrop(options) {
+	const hooks = untrack(() => options.hooks);
+	const [previewRef, setPreviewRef] = createSignal(null, { ownedWrite: true });
+	const dragState = hooks?.createDraggableCollectionState?.({
+		get collection() {
+			return options.collection;
+		},
+		preview: hooks.renderDragPreview ? previewRef : void 0,
+		get selectionManager() {
+			return options.selectionManager;
+		}
+	});
+	if (dragState) hooks?.createDraggableCollection?.({}, dragState, options.ref);
+	const dropState = hooks?.createDroppableCollectionState?.({
+		get collection() {
+			return options.collection;
+		},
+		get selectionManager() {
+			return options.selectionManager;
+		}
+	});
+	const liveCollection = { [Symbol.iterator]() {
+		return (options.dropTargetCollection ?? options.collection)[Symbol.iterator]();
+	} };
+	const fallbackKeyboard = createMemo(() => new ListKeyboardDelegate(options.collection, options.selectionManager.disabledKeys, options.ref));
+	const result = dropState ? hooks?.createDroppableCollection?.({
+		dropTargetDelegate: options.dropTargetDelegate ?? hooks.dropTargetDelegate ?? new hooks.ListDropTargetDelegate(liveCollection, options.ref, {
+			direction: options.direction,
+			layout: options.layout,
+			orientation: options.orientation
+		}),
+		get keyboardDelegate() {
+			return options.keyboardDelegate ?? fallbackKeyboard();
+		},
+		onDropActivate: options.onDropActivate,
+		onKeyDown: options.onKeyDown
+	}, dropState, options.ref) : void 0;
+	const Preview = hooks?.DragPreview;
+	const renderDragPreview = hooks?.renderDragPreview;
+	return {
+		get collectionProps() {
+			return result?.collectionProps;
+		},
+		dragAndDropHooks: hooks,
+		dragState,
+		dropState,
+		get preview() {
+			return Preview && renderDragPreview && Preview({
+				ref: (element) => {
+					setPreviewRef(() => element);
+				},
+				children: renderDragPreview
+			});
+		}
+	};
+}
+function CollectionDropIndicator(props) {
+	const context = useContext(DragAndDropContext);
+	const [buttonRef, setButtonRef] = createSignal(null, { ownedWrite: true });
+	const aria = untrack(() => requireValue(requireValue(context.dragAndDropHooks, "Expected context.dragAndDropHooks").createDropIndicator, "Expected context.dragAndDropHooks!.createDropIndicator")(props, requireValue(context.dropState, "Expected context.dropState"), buttonRef));
+	const hidden = createVisuallyHidden();
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-DropIndicator",
+		get values() {
+			return { isDropTarget: aria.isDropTarget };
+		}
+	}));
+	const Tag = dynamic(() => props.table === true ? dom.tr : dom.div);
+	const Cell = dynamic(() => props.table === true ? dom.td : dom.div);
+	return Show(new _P$3(aria, Tag, render, Cell, props, hidden));
+}
+function createCollectionItemDragAndDrop(context, key, dropRef, activateButtonRef) {
+	return {
+		drag: context.dragState ? context.dragAndDropHooks?.createDraggableItem?.({
+			hasDragButton: true,
+			key
+		}, context.dragState) : void 0,
+		drop: context.dropState ? context.dragAndDropHooks?.createDropIndicator?.({
+			activateButtonRef,
+			target: {
+				dropPosition: "on",
+				key,
+				type: "item"
+			}
+		}, context.dropState, dropRef) : void 0
+	};
+}
+export { CollectionDropIndicator, createCollectionDragAndDrop, createCollectionItemDragAndDrop };
+
+//# sourceMappingURL=collection-dnd.js.map

package/dist/server/collection-dnd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-dnd.js","names":["<div\n            {...mergeProps(\n              merge(() => hidden.visuallyHiddenProps ?? {}),\n              merge(() => aria.dropIndicatorProps ?? {})\n            )}\n            role=\"button\"\n            ref={(element: HTMLDivElement) => {\n              setButtonRef(element);\n            }}\n          />","{render.children}","ref={(element: DragPreviewRenderer | null) => {\n                setPreviewRef(() => element);\n              }}","<Preview\n              ref={(element: DragPreviewRenderer | null) => {\n                setPreviewRef(() => element);\n              }}\n            >\n              {renderDragPreview}\n            </Preview>","_$ssrElement","_$memo","_$mergeProps"],"sources":["../../src/collection-dnd.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/GridList.tsx.\n * Modified for Solid Aria: collections, selection, drag and drop, and DOM rendering use Solid 2 ownership and reactive getters; uses Solid class props.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport type { DroppableCollectionOptions } from \"@solid2-aria/core/dnd/create-droppable-collection\";\nimport { ListKeyboardDelegate } from \"@solid2-aria/core/selection/list-keyboard-delegate\";\nimport type { HTMLAttributes } from \"@solid2-aria/core/types\";\nimport { mergeProps } from \"@solid2-aria/core/utils/merge-props\";\nimport { requireValue } from \"@solid2-aria/core/utils/require-value\";\nimport { createVisuallyHidden } from \"@solid2-aria/core/visually-hidden/visually-hidden\";\nimport type { DraggableCollectionState } from \"@solid2-aria/stately/dnd/create-draggable-collection-state\";\nimport type { DroppableCollectionState } from \"@solid2-aria/stately/dnd/create-droppable-collection-state\";\nimport type { MultipleSelectionManager } from \"@solid2-aria/stately/selection/types\";\nimport type {\n  Collection as ICollection,\n  Node,\n  Key,\n  DragPreviewRenderer,\n  Orientation,\n  KeyboardDelegate,\n  DroppableCollectionProps,\n  DropTargetDelegate,\n} from \"@solid2-aria/types-shared\";\nimport { dynamic } from \"@solidjs/web\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n  merge,\n  untrack,\n  createSignal,\n  createMemo,\n  useContext,\n  Show,\n} from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\n\nimport type { DragAndDropHooks } from \"./create-drag-and-drop\";\nimport { DragAndDropContext } from \"./drag-and-drop\";\nimport type {\n  DragAndDropContextValue,\n  DropIndicatorProps,\n} from \"./drag-and-drop\";\nimport { assignRef, dom, createRenderProps } from \"./utils\";\n\nexport interface CollectionDragAndDrop<T> {\n  readonly collectionProps: HTMLAttributes | undefined;\n  dragAndDropHooks: DragAndDropHooks<T> | undefined;\n  dragState: DraggableCollectionState | undefined;\n  dropState: DroppableCollectionState | undefined;\n  readonly preview: JSX.Element;\n}\n\nexport function createCollectionDragAndDrop<T>(options: {\n  hooks?: DragAndDropHooks<T>;\n  collection: ICollection<Node<T>>;\n  selectionManager: MultipleSelectionManager;\n  ref: Accessor<HTMLElement | null>;\n  keyboardDelegate?: KeyboardDelegate;\n  dropTargetCollection?: Iterable<Node<T>>;\n  onDropActivate?: DroppableCollectionProps[\"onDropActivate\"];\n  onKeyDown?: DroppableCollectionOptions[\"onKeyDown\"];\n  dropTargetDelegate?: DropTargetDelegate;\n  layout?: \"stack\" | \"grid\";\n  orientation?: Orientation;\n  direction?: \"ltr\" | \"rtl\";\n}): CollectionDragAndDrop<T> {\n  const hooks = untrack(() => options.hooks);\n\n  const [previewRef, setPreviewRef] = createSignal<DragPreviewRenderer | null>(\n    null,\n    { ownedWrite: true }\n  );\n\n  const dragState = hooks?.createDraggableCollectionState?.({\n    get collection() {\n      return options.collection;\n    },\n    preview: hooks.renderDragPreview ? previewRef : undefined,\n    get selectionManager() {\n      return options.selectionManager;\n    },\n  });\n\n  if (dragState) {\n    hooks?.createDraggableCollection?.({}, dragState, options.ref);\n  }\n\n  const dropState = hooks?.createDroppableCollectionState?.({\n    get collection() {\n      return options.collection;\n    },\n    get selectionManager() {\n      return options.selectionManager;\n    },\n  });\n\n  const liveCollection: Iterable<Node<T>> = {\n    [Symbol.iterator]() {\n      return (options.dropTargetCollection ?? options.collection)[\n        Symbol.iterator\n      ]();\n    },\n  };\n\n  const fallbackKeyboard = createMemo(\n    () =>\n      new ListKeyboardDelegate(\n        options.collection,\n        options.selectionManager.disabledKeys,\n        options.ref\n      )\n  );\n\n  const result = dropState\n    ? hooks?.createDroppableCollection?.(\n        {\n          dropTargetDelegate:\n            options.dropTargetDelegate ??\n            hooks.dropTargetDelegate ??\n            new hooks.ListDropTargetDelegate(liveCollection, options.ref, {\n              direction: options.direction,\n              layout: options.layout,\n              orientation: options.orientation,\n            }),\n          get keyboardDelegate() {\n            return options.keyboardDelegate ?? fallbackKeyboard();\n          },\n          onDropActivate: options.onDropActivate,\n          onKeyDown: options.onKeyDown,\n        },\n        dropState,\n        options.ref\n      )\n    : undefined;\n\n  const Preview = hooks?.DragPreview;\n  const renderDragPreview = hooks?.renderDragPreview;\n\n  return {\n    get collectionProps() {\n      return result?.collectionProps;\n    },\n    dragAndDropHooks: hooks,\n    dragState,\n    dropState,\n    get preview() {\n      return (\n        <>\n          {Preview && renderDragPreview && (\n            <Preview\n              ref={(element: DragPreviewRenderer | null) => {\n                setPreviewRef(() => element);\n              }}\n            >\n              {renderDragPreview}\n            </Preview>\n          )}\n        </>\n      );\n    },\n  };\n}\n\nexport function CollectionDropIndicator(\n  props: DropIndicatorProps & { table?: boolean; columnCount?: number }\n) {\n  const context = useContext(DragAndDropContext);\n\n  const [buttonRef, setButtonRef] = createSignal<HTMLDivElement | null>(null, {\n    ownedWrite: true,\n  });\n\n  const aria = untrack(() =>\n    requireValue(\n      requireValue(\n        context.dragAndDropHooks,\n        \"Expected context.dragAndDropHooks\"\n      ).createDropIndicator,\n      \"Expected context.dragAndDropHooks!.createDropIndicator\"\n    )(\n      props,\n      requireValue(context.dropState, \"Expected context.dropState\"),\n      buttonRef\n    )\n  );\n\n  const hidden = createVisuallyHidden();\n\n  const render = createRenderProps(\n    mergeProps(props, {\n      defaultClass: \"solid2-aria-DropIndicator\",\n      get values() {\n        return { isDropTarget: aria.isDropTarget };\n      },\n    })\n  );\n\n  const Tag = dynamic(() => (props.table === true ? dom.tr : dom.div));\n  const Cell = dynamic(() => (props.table === true ? dom.td : dom.div));\n\n  return (\n    <Show when={!aria.isHidden}>\n      <Tag\n        {...render}\n        role=\"row\"\n        ref={(element: HTMLElement) => {\n          assignRef(\n            untrack(() => props.ref),\n            element\n          );\n        }}\n        data-drop-target={aria.isDropTarget || undefined}\n      >\n        <Cell role=\"gridcell\" colspan={props.columnCount}>\n          <div\n            {...mergeProps(\n              merge(() => hidden.visuallyHiddenProps ?? {}),\n              merge(() => aria.dropIndicatorProps ?? {})\n            )}\n            role=\"button\"\n            ref={(element: HTMLDivElement) => {\n              setButtonRef(element);\n            }}\n          />\n          {render.children}\n        </Cell>\n      </Tag>\n    </Show>\n  );\n}\n\nexport function createCollectionItemDragAndDrop(\n  context: DragAndDropContextValue,\n  key: Key,\n  dropRef: Accessor<HTMLElement | null>,\n  activateButtonRef?: Accessor<HTMLElement | null>\n) {\n  const drag = context.dragState\n    ? context.dragAndDropHooks?.createDraggableItem?.(\n        { hasDragButton: true, key },\n        context.dragState\n      )\n    : undefined;\n\n  const drop = context.dropState\n    ? context.dragAndDropHooks?.createDropIndicator?.(\n        {\n          activateButtonRef,\n          target: { dropPosition: \"on\", key, type: \"item\" },\n        },\n        context.dropState,\n        dropRef\n      )\n    : undefined;\n\n  return { drag, drop };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiO8B,O,SAAS,CAAM;;;;;;;;;;EAArC,OAAkD,CAChDA,WAAAA,aACM;GACF,OAAA,WAAA,YAAY,OAAO,uBAAuB,CAAC,CAAC,GAC5C,YAAY,KAAK,sBAAsB,CAAC,CAAC,CAC3C;EAJF,GAAA,KAAA,GAAA,MAAA,MAAA,kBASC,GACDC,WAAAA;GAAC,OAAA,OAAO;EAAQ,CAAA,CAVjB;;;;;;;;;;;;;;;;;EAHD,O,SAAkB,CAAK,gBAAgB,KAAA;;;;;;;;;;;;EAEvC,OAAA,KAAA,IAAA,IAA+B,OAGb,QACA,MAOf,QAXG,UAYA,CAAA;;;;;;;;;;;;;;;;;;;EAxBJ,OAAM,C,SAAC,CAAK;;;;;;;;;;;;;EAChB,OAAA,IAAAK,aACM,QADN,IAAA,KASoB,MAAA,MAEa,OAGb,QAQf,QApBH,QACM,YAAyB;GAC7B,UACE,cAAc,MAAM,GAAG,GACvB,OACF;EACF,CAgBG,CAAA,CAAA;;;;;;;;;;;;;;;;AA9KX,SAAgB,4BAA+B,SAalB;CAC3B,MAAM,QAAQ,cAAc,QAAQ,KAAK;CAEzC,MAAM,CAAC,YAAY,iBAAiB,aAClC,MACA,EAAE,YAAY,KAAK,CACrB;CAEA,MAAM,YAAY,OAAO,iCAAiC;EACxD,IAAI,aAAa;GACf,OAAO,QAAQ;EACjB;EACA,SAAS,MAAM,oBAAoB,aAAa,KAAA;EAChD,IAAI,mBAAmB;GACrB,OAAO,QAAQ;EACjB;CACF,CAAC;CAED,IAAI,WACF,OAAO,4BAA4B,CAAC,GAAG,WAAW,QAAQ,GAAG;CAG/D,MAAM,YAAY,OAAO,iCAAiC;EACxD,IAAI,aAAa;GACf,OAAO,QAAQ;EACjB;EACA,IAAI,mBAAmB;GACrB,OAAO,QAAQ;EACjB;CACF,CAAC;CAED,MAAM,iBAAoC,EACxC,CAAC,OAAO,YAAY;EAClB,QAAQ,QAAQ,wBAAwB,QAAQ,WAAA,CAC9C,OAAO,SACR,CAAC;CACJ,EACF;CAEA,MAAM,mBAAmB,iBAErB,IAAI,qBACF,QAAQ,YACR,QAAQ,iBAAiB,cACzB,QAAQ,GACV,CACJ;CAEA,MAAM,SAAS,YACX,OAAO,4BACL;EACE,oBACE,QAAQ,sBACR,MAAM,sBACN,IAAI,MAAM,uBAAuB,gBAAgB,QAAQ,KAAK;GAC5D,WAAW,QAAQ;GACnB,QAAQ,QAAQ;GAChB,aAAa,QAAQ;EACvB,CAAC;EACH,IAAI,mBAAmB;GACrB,OAAO,QAAQ,oBAAoB,iBAAiB;EACtD;EACA,gBAAgB,QAAQ;EACxB,WAAW,QAAQ;CACrB,GACA,WACA,QAAQ,GACV,IACA,KAAA;CAEJ,MAAM,UAAU,OAAO;CACvB,MAAM,oBAAoB,OAAO;CAEjC,OAAO;EACL,IAAI,kBAAkB;GACpB,OAAO,QAAQ;EACjB;EACA,kBAAkB;EAClB;EACA;EACA,IAAI,UAAU;GACZ,OAEK,WAAW,qBAAA,QACV;IACEJ,MAAM,YAAwC;KAC5C,oBAAoB,OAAO;IAC7B;IAHFC,UAKG;GACM,CAAA;EAIjB;CACF;AACF;AAEA,SAAgB,wBACd,OACA;CACA,MAAM,UAAU,WAAW,kBAAkB;CAE7C,MAAM,CAAC,WAAW,gBAAgB,aAAoC,MAAM,EAC1E,YAAY,KACd,CAAC;CAED,MAAM,OAAO,cACX,aACE,aACE,QAAQ,kBACR,mCACF,CAAC,CAAC,qBACF,wDACF,CAAC,CACC,OACA,aAAa,QAAQ,WAAW,4BAA4B,GAC5D,SACF,CACF;CAEA,MAAM,SAAS,qBAAqB;CAEpC,MAAM,SAAS,kBACb,WAAW,OAAO;EAChB,cAAc;EACd,IAAI,SAAS;GACX,OAAO,EAAE,cAAc,KAAK,aAAa;EAC3C;CACF,CAAC,CACH;CAEA,MAAM,MAAM,cAAe,MAAM,UAAU,OAAO,IAAI,KAAK,IAAI,GAAI;CACnE,MAAM,OAAO,cAAe,MAAM,UAAU,OAAO,IAAI,KAAK,IAAI,GAAI;CAEpE,OAAA,KACE,IAAA,KAAa,MAAA,KAEL,QAAA,MAU2B,OAGb,MAWhB,CAAA;AAEV;AAEA,SAAgB,gCACd,SACA,KACA,SACA,mBACA;CAmBA,OAAO;EAAE,MAlBI,QAAQ,YACjB,QAAQ,kBAAkB,sBACxB;GAAE,eAAe;GAAM;EAAI,GAC3B,QAAQ,SACV,IACA,KAAA;EAaW,MAXF,QAAQ,YACjB,QAAQ,kBAAkB,sBACxB;GACE;GACA,QAAQ;IAAE,cAAc;IAAM;IAAK,MAAM;GAAO;EAClD,GACA,QAAQ,WACR,OACF,IACA,KAAA;CAEgB;AACtB"}

package/dist/server/collection.js

@@ -0,0 +1,106 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/Collection.tsx.
+ * Modified for Solid Aria: adapted collection ownership, contexts, accessibility primitives, and reactive properties for Solid 2; uses Solid class props.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { assignRef } from "./utils.js";
+import { createContext, untrack, useContext } from "solid-js";
+import { memo, mergeProps } from "@solidjs/web";
+import { Collection, createBranchComponent } from "@solid2-aria/core/collections/collection-builder";
+import { createCachedChildren } from "@solid2-aria/core/collections/create-cached-children";
+// src/collection.tsx
+const SectionContext = createContext(null);
+const SectionCollection = createBranchComponent("section", (props, ref, section) => {
+	const context = useContext(SectionContext);
+	if (!context) throw new Error("Section must be rendered in a collection.");
+	return context.render(props, ref, section, "solid2-aria-Section");
+});
+function CollectionNodes(props) {
+	const content = createCachedChildren({
+		children(node) {
+			if (node.type === "content") return null;
+			const rendered = node.render?.(node) ?? node.rendered;
+			return [
+				memo(() => {
+					return memo(() => {
+						return !!(props.renderDropIndicator && node.type === "item");
+					})() ? props.renderDropIndicator({
+						dropPosition: "before",
+						key: node.key,
+						type: "item"
+					}) : null;
+				}),
+				rendered,
+				memo(() => {
+					return memo(() => {
+						return !!(props.renderDropIndicator && node.type === "item");
+					})() ? renderAfterDropIndicators(props.collection, node, props.renderDropIndicator) : null;
+				})
+			];
+		},
+		get dependencies() {
+			return [
+				props.collection,
+				props.parent,
+				props.renderDropIndicator
+			];
+		},
+		get items() {
+			return props.parent ? props.collection.getChildren?.(props.parent.key) : props.collection;
+		}
+	});
+	return memo(content);
+}
+const DefaultCollectionRenderer = {
+	CollectionBranch: (props) => CollectionNodes(props),
+	CollectionRoot: (props) => CollectionNodes(props)
+};
+const CollectionRendererContext = createContext(DefaultCollectionRenderer);
+function shouldRenderAfter(node, next) {
+	return next === null || node.parentKey !== next.parentKey && next.level < node.level;
+}
+function renderAfterDropIndicators(collection, node, renderDropIndicator) {
+	let keyAfter = collection.getKeyAfter(node.key);
+	let next = keyAfter === null || keyAfter === void 0 ? null : collection.getItem(keyAfter);
+	while (next && next.type !== "item") {
+		keyAfter = collection.getKeyAfter(next.key);
+		next = keyAfter === null || keyAfter === void 0 ? null : collection.getItem(keyAfter);
+	}
+	let sibling = node.nextKey === null || node.nextKey === void 0 ? null : collection.getItem(node.nextKey);
+	while (sibling && sibling.type !== "item") sibling = sibling.nextKey === null || sibling.nextKey === void 0 ? null : collection.getItem(sibling.nextKey);
+	const result = [];
+	if (!sibling) {
+		let current = node;
+		while (current?.type === "item" && shouldRenderAfter(current, next)) {
+			result.push(renderDropIndicator({
+				dropPosition: "after",
+				key: current.key,
+				type: "item"
+			}));
+			current = current.parentKey === null || current.parentKey === void 0 ? null : collection.getItem(current.parentKey);
+		}
+	}
+	return result;
+}
+function createPersistedKeys(focusedKey) {
+	return focusedKey === null || focusedKey === void 0 ? null : /* @__PURE__ */ new Set([focusedKey]);
+}
+function Section(props) {
+	return SectionCollection(mergeProps(props, { ref: (element) => {
+		assignRef(untrack(() => props.ref), element);
+	} }));
+}
+export { Collection, CollectionRendererContext, DefaultCollectionRenderer, Section, SectionContext, createPersistedKeys, renderAfterDropIndicators };
+
+//# sourceMappingURL=collection.js.map

package/dist/server/collection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection.js","names":["{props.renderDropIndicator && node.type === \"item\"\n            ? props.renderDropIndicator({\n                dropPosition: \"before\",\n                key: node.key,\n                type: \"item\",\n              })\n            : null}","{props.renderDropIndicator && node.type === \"item\"\n            ? renderAfterDropIndicators(\n                props.collection,\n                node,\n                props.renderDropIndicator\n              )\n            : null}","{content()}","<SectionCollection\n      {...props}\n      ref={(element: HTMLElement) => {\n        assignRef(\n          untrack(() => props.ref),\n          element\n        );\n      }}\n    />","ref={(element: HTMLElement) => {\n        assignRef(\n          untrack(() => props.ref),\n          element\n        );\n      }}","_$memo","_$mergeProps"],"sources":["../../src/collection.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/Collection.tsx.\n * Modified for Solid Aria: adapted collection ownership, contexts, accessibility primitives, and reactive properties for Solid 2; uses Solid class props.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport { createBranchComponent } from \"@solid2-aria/core/collections/collection-builder\";\nimport { createCachedChildren } from \"@solid2-aria/core/collections/create-cached-children\";\nimport type {\n  CollectionBase,\n  DropTargetDelegate,\n  ItemDropTarget,\n  Key,\n  LayoutDelegate,\n  Collection as ICollection,\n  Node,\n  SelectionBehavior,\n  SelectionMode,\n  SectionProps as SharedSectionProps,\n} from \"@solid2-aria/types-shared\";\nimport type { GlobalDOMAttributes } from \"@solid2-aria/types-shared-web\";\nimport type { JSX } from \"@solidjs/web\";\nimport { untrack, createContext, useContext } from \"solid-js\";\nimport type { Accessor, Component } from \"solid-js\";\n\nimport { assignRef } from \"./utils\";\nimport type { Ref, StyleProps } from \"./utils\";\n\nexport const SectionContext = createContext<SectionContextValue | null>(null);\n\nexport interface CollectionProps<T> extends Omit<\n  CollectionBase<T>,\n  \"children\"\n> {\n  /** The contents of the collection. */\n  children?: JSX.Element | ((item: T) => JSX.Element);\n  /** Values that should invalidate the item cache when using dynamic collections. */\n  // oxlint-disable-next-line typescript/no-explicit-any -- Collection contexts erase item types; each typed factory restores its owner's item contract.\n  dependencies?: readonly any[];\n}\n\nexport interface ItemRenderProps {\n  /**\n   * Whether the item is currently hovered with a mouse.\n   *\n   * @selector [data-hovered]\n   */\n  isHovered: boolean;\n  /**\n   * Whether the item is currently in a pressed state.\n   *\n   * @selector [data-pressed]\n   */\n  isPressed: boolean;\n  /**\n   * Whether the item is currently selected.\n   *\n   * @selector [data-selected]\n   */\n  isSelected: boolean;\n  /**\n   * Whether the item is currently focused.\n   *\n   * @selector [data-focused]\n   */\n  isFocused: boolean;\n  /**\n   * Whether the item is currently keyboard focused.\n   *\n   * @selector [data-focus-visible]\n   */\n  isFocusVisible: boolean;\n  /**\n   * Whether the item is non-interactive, i.e. both selection and actions are disabled and the item\n   * may not be focused. Dependent on `disabledKeys` and `disabledBehavior`.\n   *\n   * @selector [data-disabled]\n   */\n  isDisabled: boolean;\n  /**\n   * The type of selection that is allowed in the collection.\n   *\n   * @selector [data-selection-mode=\"single | multiple\"]\n   */\n  selectionMode: SelectionMode;\n  /** The selection behavior for the collection. */\n  selectionBehavior: SelectionBehavior;\n  /**\n   * Whether the item allows dragging.\n   *\n   * Note: This property is only available in collection components that support drag and drop.\n   * @selector [data-allows-dragging]\n   */\n  allowsDragging?: boolean;\n  /**\n   * Whether the item is currently being dragged.\n   *\n   * Note: This property is only available in collection components that support drag and drop.\n   * @selector [data-dragging]\n   */\n  isDragging?: boolean;\n  /**\n   * Whether the item is currently an active drop target.\n   *\n   * Note: This property is only available in collection components that support drag and drop.\n   * @selector [data-drop-target]\n   */\n  isDropTarget?: boolean;\n}\n\nexport interface SectionProps<T>\n  extends\n    Omit<SharedSectionProps<T>, \"children\" | \"title\">,\n    StyleProps,\n    GlobalDOMAttributes<HTMLElement> {\n  /** The unique id of the section. */\n  id?: Key;\n  /**\n   * The object value that this section represents. When using dynamic collections, this is set\n   * automatically.\n   */\n  value?: T;\n  /** Static child items or a function to render children. */\n  children?: JSX.Element | ((item: T) => JSX.Element);\n  /** Values that should invalidate the item cache when using dynamic collections. */\n  // oxlint-disable-next-line typescript/no-explicit-any -- Collection contexts erase item types; each typed factory restores its owner's item contract.\n  dependencies?: readonly any[];\n}\n\nexport interface CollectionBranchProps {\n  /** The collection of items to render. */\n  collection: ICollection<Node<unknown>>;\n  /** The parent node of the items to render. */\n  parent: Node<unknown>;\n  /** A function that renders a drop indicator between items. */\n  renderDropIndicator?: (target: ItemDropTarget) => JSX.Element;\n}\n\nexport interface CollectionRootProps extends JSX.HTMLAttributes<HTMLElement> {\n  /** The collection of items to render. */\n  collection: ICollection<Node<unknown>>;\n  /** A set of keys for items that should always be persisted in the DOM. */\n  persistedKeys?: Set<Key> | null;\n  /** A ref to the scroll container for the collection. */\n  scrollRef?: Accessor<HTMLElement | null>;\n  /** A function that renders a drop indicator between items. */\n  renderDropIndicator?: (target: ItemDropTarget) => JSX.Element;\n}\n\nexport interface CollectionRenderer {\n  /** Whether this is a virtualized collection. */\n  isVirtualized?: boolean;\n  /** A delegate object that provides layout information for items in the collection. */\n  layoutDelegate?: LayoutDelegate;\n  /** A delegate object that provides drop targets for pointer coordinates within the collection. */\n  dropTargetDelegate?: DropTargetDelegate;\n  /** A component that renders the root collection items. */\n  CollectionRoot: Component<CollectionRootProps>;\n  /** A component that renders the child collection items. */\n  CollectionBranch: Component<CollectionBranchProps>;\n}\n\nexport interface SectionContextValue {\n  name: string;\n  render: (\n    // oxlint-disable-next-line typescript/no-explicit-any -- Collection contexts erase item types; each typed factory restores its owner's item contract.\n    props: SectionProps<any>,\n    ref: Ref<HTMLElement>,\n    node: Node<unknown>,\n    defaultClass?: string\n  ) => JSX.Element;\n}\n\nconst SectionCollection = createBranchComponent(\n  \"section\",\n  // oxlint-disable-next-line typescript/no-explicit-any -- Collection contexts erase item types; each typed factory restores its owner's item contract.\n  (props: SectionProps<any>, ref: Ref<HTMLElement>, section: Node<any>) => {\n    const context = useContext(SectionContext);\n\n    if (!context) {\n      throw new Error(\"Section must be rendered in a collection.\");\n    }\n\n    return context.render(props, ref, section, \"solid2-aria-Section\");\n  }\n);\n\nfunction CollectionNodes(props: {\n  collection: ICollection<Node<unknown>>;\n  parent?: Node<unknown>;\n  renderDropIndicator?: CollectionBranchProps[\"renderDropIndicator\"];\n}): JSX.Element {\n  const content = createCachedChildren({\n    children(node: Node<unknown>) {\n      if (node.type === \"content\") {\n        // oxlint-disable-next-line solid/components-return-once -- Static collection traversal and context registration are fixed when the owner is created.\n        return null;\n      }\n\n      const rendered = node.render?.(node) ?? node.rendered;\n\n      return (\n        <>\n          {props.renderDropIndicator && node.type === \"item\"\n            ? props.renderDropIndicator({\n                dropPosition: \"before\",\n                key: node.key,\n                type: \"item\",\n              })\n            : null}\n          {rendered}\n          {props.renderDropIndicator && node.type === \"item\"\n            ? renderAfterDropIndicators(\n                props.collection,\n                node,\n                props.renderDropIndicator\n              )\n            : null}\n        </>\n      );\n    },\n    get dependencies() {\n      return [props.collection, props.parent, props.renderDropIndicator];\n    },\n    get items() {\n      return props.parent\n        ? props.collection.getChildren?.(props.parent.key)\n        : props.collection;\n    },\n  });\n\n  return <>{content()}</>;\n}\n\nexport const DefaultCollectionRenderer: CollectionRenderer = {\n  CollectionBranch: (props) => <CollectionNodes {...props} />,\n  CollectionRoot: (props) => <CollectionNodes {...props} />,\n};\n\nexport const CollectionRendererContext = createContext<CollectionRenderer>(\n  DefaultCollectionRenderer\n);\n\nfunction shouldRenderAfter(\n  node: Node<unknown>,\n  next: Node<unknown> | null\n): boolean {\n  return (\n    next === null ||\n    (node.parentKey !== next.parentKey && next.level < node.level)\n  );\n}\n\nexport function renderAfterDropIndicators(\n  collection: ICollection<Node<unknown>>,\n  node: Node<unknown>,\n  renderDropIndicator: (target: ItemDropTarget) => JSX.Element\n): JSX.Element {\n  let keyAfter = collection.getKeyAfter(node.key);\n\n  let next =\n    keyAfter === null || keyAfter === undefined\n      ? null\n      : collection.getItem(keyAfter);\n\n  while (next && next.type !== \"item\") {\n    keyAfter = collection.getKeyAfter(next.key);\n    next =\n      keyAfter === null || keyAfter === undefined\n        ? null\n        : collection.getItem(keyAfter);\n  }\n\n  let sibling =\n    node.nextKey === null || node.nextKey === undefined\n      ? null\n      : collection.getItem(node.nextKey);\n\n  while (sibling && sibling.type !== \"item\") {\n    sibling =\n      sibling.nextKey === null || sibling.nextKey === undefined\n        ? null\n        : collection.getItem(sibling.nextKey);\n  }\n\n  const result: JSX.Element[] = [];\n\n  if (!sibling) {\n    let current: Node<unknown> | null = node;\n\n    while (current?.type === \"item\" && shouldRenderAfter(current, next)) {\n      result.push(\n        renderDropIndicator({\n          dropPosition: \"after\",\n          key: current.key,\n          type: \"item\",\n        })\n      );\n      current =\n        current.parentKey === null || current.parentKey === undefined\n          ? null\n          : collection.getItem(current.parentKey);\n    }\n  }\n\n  return result;\n}\n\nexport function createPersistedKeys(focusedKey: Key | null): Set<Key> | null {\n  return focusedKey === null || focusedKey === undefined\n    ? null\n    : new Set([focusedKey]);\n}\n\nexport { Collection } from \"@solid2-aria/core/collections/collection-builder\";\n\nexport function Section<T>(\n  props: SectionProps<T> & { ref?: Ref<HTMLElement> }\n): JSX.Element {\n  return (\n    <SectionCollection\n      {...props}\n      ref={(element: HTMLElement) => {\n        assignRef(\n          untrack(() => props.ref),\n          element\n        );\n      }}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuCA,MAAa,iBAAiB,cAA0C,IAAI;AAiJ5E,MAAM,oBAAoB,sBACxB,YAEC,OAA0B,KAAuB,YAAuB;CACvE,MAAM,UAAU,WAAW,cAAc;CAEzC,IAAI,CAAC,SACH,MAAM,IAAI,MAAM,2CAA2C;CAG7D,OAAO,QAAQ,OAAO,OAAO,KAAK,SAAS,qBAAqB;AAClE,CACF;AAEA,SAAS,gBAAgB,OAIT;CACd,MAAM,UAAU,qBAAqB;EACnC,SAAS,MAAqB;GAC5B,IAAI,KAAK,SAAS,WAEhB,OAAO;GAGT,MAAM,WAAW,KAAK,SAAS,IAAI,KAAK,KAAK;GAE7C,OACE;IACEA,WAAAA;;MAAC,OAAA,CAAA,EAAA,MAAM,uBAAuB,KAAK,SAAS;KAMpC,CAAA,CAAC,CAAD,IALJ,MAAM,oBAAoB;MACxB,cAAc;MACd,KAAK,KAAK;MACV,MAAM;KACR,CAAC,IACD;IAAI,CAAA;IACP;IACDC,WAAAA;;MAAC,OAAA,CAAA,EAAA,MAAM,uBAAuB,KAAK,SAAS;KAMpC,CAAA,CAAC,CAAD,IALJ,0BACE,MAAM,YACN,MACA,MAAM,mBACR,IACA;IAAI,CAAA;GACR;EAEN;EACA,IAAI,eAAe;GACjB,OAAO;IAAC,MAAM;IAAY,MAAM;IAAQ,MAAM;GAAmB;EACnE;EACA,IAAI,QAAQ;GACV,OAAO,MAAM,SACT,MAAM,WAAW,cAAc,MAAM,OAAO,GAAG,IAC/C,MAAM;EACZ;CACF,CAAC;CAED,OAASC,KAAC,OAAS;AACrB;AAEA,MAAa,4BAAgD;CAC3D,mBAAmB,UAAA,gBAA+B,KAAQ;CAC1D,iBAAiB,UAAA,gBAA+B,KAAQ;AAC1D;AAEA,MAAa,4BAA4B,cACvC,yBACF;AAEA,SAAS,kBACP,MACA,MACS;CACT,OACE,SAAS,QACR,KAAK,cAAc,KAAK,aAAa,KAAK,QAAQ,KAAK;AAE5D;AAEA,SAAgB,0BACd,YACA,MACA,qBACa;CACb,IAAI,WAAW,WAAW,YAAY,KAAK,GAAG;CAE9C,IAAI,OACF,aAAa,QAAQ,aAAa,KAAA,IAC9B,OACA,WAAW,QAAQ,QAAQ;CAEjC,OAAO,QAAQ,KAAK,SAAS,QAAQ;EACnC,WAAW,WAAW,YAAY,KAAK,GAAG;EAC1C,OACE,aAAa,QAAQ,aAAa,KAAA,IAC9B,OACA,WAAW,QAAQ,QAAQ;CACnC;CAEA,IAAI,UACF,KAAK,YAAY,QAAQ,KAAK,YAAY,KAAA,IACtC,OACA,WAAW,QAAQ,KAAK,OAAO;CAErC,OAAO,WAAW,QAAQ,SAAS,QACjC,UACE,QAAQ,YAAY,QAAQ,QAAQ,YAAY,KAAA,IAC5C,OACA,WAAW,QAAQ,QAAQ,OAAO;CAG1C,MAAM,SAAwB,CAAC;CAE/B,IAAI,CAAC,SAAS;EACZ,IAAI,UAAgC;EAEpC,OAAO,SAAS,SAAS,UAAU,kBAAkB,SAAS,IAAI,GAAG;GACnE,OAAO,KACL,oBAAoB;IAClB,cAAc;IACd,KAAK,QAAQ;IACb,MAAM;GACR,CAAC,CACH;GACA,UACE,QAAQ,cAAc,QAAQ,QAAQ,cAAc,KAAA,IAChD,OACA,WAAW,QAAQ,QAAQ,SAAS;EAC5C;CACF;CAEA,OAAO;AACT;AAEA,SAAgB,oBAAoB,YAAyC;CAC3E,OAAO,eAAe,QAAQ,eAAe,KAAA,IACzC,uBACA,IAAI,IAAI,CAAC,UAAU,CAAC;AAC1B;AAIA,SAAgB,QACd,OACa;CACb,OAAA,kBACEC,WACM,OADN,EAEEC,MAAM,YAAyB;EAC7B,UACE,cAAc,MAAM,GAAG,GACvB,OACF;CACF,EACD,CAAA,CAAA;AAEL"}

package/dist/server/color-area.js

@@ -0,0 +1,142 @@
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/ColorArea.tsx.
+ * Modified for Solid Aria: composed Solid Aria and Stately primitives with Solid 2 contexts, reactive getters, and DOM refs; uses Solid class props.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { createContextProps, createRenderProps, dom } from "./utils.js";
+import { InternalColorThumbContext } from "./color-thumb.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { createContext, createSignal, merge, omit, untrack } from "solid-js";
+import { memo, mergeProps as mergeProps$1 } from "@solidjs/web";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { createColorArea } from "@solid2-aria/core/color/create-color-area";
+import { createColorAreaState } from "@solid2-aria/stately/color/create-color-area-state";
+// src/color-area.tsx
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p, _p2) {
+	this[_m$] = _p;
+	this.value = _p2;
+	Object.defineProperty(this, "children", _d$);
+}
+_P$.prototype = Object.prototype;
+var _d$2 = {
+	get() {
+		const render = this[_m$];
+		const thumb = this[_m$2];
+		return InternalColorThumbContext(new _P$(render, thumb));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p3, _p4, _p5) {
+	this[_m$] = _p3;
+	this[_m$2] = _p4;
+	this.value = _p5;
+	Object.defineProperty(this, "children", _d$2);
+}
+_P$2.prototype = Object.prototype;
+var _d$3 = {
+	get() {
+		const props = this[_m$];
+		return memo(() => {
+			return !!(typeof props.slot === "string" && props.slot.length > 0);
+		})() ? props.slot : void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		return this[_m$].isDisabled === true ? true : void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$5 = {
+	get() {
+		const render = this[_m$2];
+		const thumb = this[_m$3];
+		const state = this[_m$4];
+		return ColorAreaStateContext(new _P$2(render, thumb, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p6, _p7, _p8, _p9, _p0) {
+	this[_m$] = _p6;
+	this[_m$2] = _p7;
+	this[_m$3] = _p8;
+	this[_m$4] = _p9;
+	this.ref = _p0;
+	Object.defineProperty(this, "slot", _d$3);
+	Object.defineProperty(this, "data-disabled", _d$4);
+	Object.defineProperty(this, "children", _d$5);
+}
+_P$3.prototype = Object.prototype;
+const ColorAreaContext = createContext(null);
+const ColorAreaStateContext = createContext(null);
+function ColorArea(input) {
+	const [inputXRef, setInputXRef] = createSignal(null, { ownedWrite: true });
+	const [inputYRef, setInputYRef] = createSignal(null, { ownedWrite: true });
+	const [props, ref, setRef] = createContextProps(input, untrack(() => input.ref), ColorAreaContext);
+	const state = createColorAreaState(props);
+	const aria = createColorArea(mergeProps(props, {
+		containerRef: ref,
+		inputXRef,
+		inputYRef
+	}), state);
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-ColorArea",
+		get defaultStyle() {
+			const { style } = aria.colorAreaProps;
+			return typeof style === "object" ? style : void 0;
+		},
+		values: {
+			get isDisabled() {
+				return props.isDisabled ?? false;
+			},
+			state
+		}
+	}));
+	const thumb = {
+		inputXRef,
+		inputYRef,
+		get isDisabled() {
+			return props.isDisabled;
+		},
+		setInputXRef: (element) => {
+			setInputXRef(element);
+		},
+		setInputYRef: (element) => {
+			setInputYRef(element);
+		},
+		state,
+		get thumbProps() {
+			return aria.thumbProps;
+		},
+		get xInputProps() {
+			return aria.xInputProps;
+		},
+		get yInputProps() {
+			return aria.yInputProps;
+		}
+	};
+	return dom.div(mergeProps$1(() => {
+		return mergeProps(omit(filterDOMProps(props, { global: true }), "id"), merge(() => aria.colorAreaProps), render);
+	}, new _P$3(props, render, thumb, state, (element) => {
+		setRef(element);
+	})));
+}
+export { ColorArea, ColorAreaContext, ColorAreaStateContext };
+
+//# sourceMappingURL=color-area.js.map

package/dist/server/color-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-area.js","names":["typeof props.slot === \"string\" && props.slot.length > 0\n          ? props.slot\n          : undefined","dom.div","<dom.div\n      {...mergeProps(\n        omit(filterDOMProps(props, { global: true }), \"id\"),\n        merge(() => aria.colorAreaProps),\n        render\n      )}\n      ref={(element: HTMLDivElement) => {\n        setRef(element);\n      }}\n      slot={\n        typeof props.slot === \"string\" && props.slot.length > 0\n          ? props.slot\n          : undefined\n      }\n      data-disabled={props.isDisabled === true ? true : undefined}\n    >\n      <ColorAreaStateContext value={state}>\n        <InternalColorThumbContext value={thumb}>\n          {render.children}\n        </InternalColorThumbContext>\n      </ColorAreaStateContext>\n    </dom.div>","_$memo","_$mergeProps"],"sources":["../../src/color-area.tsx"],"sourcesContent":["/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/ColorArea.tsx.\n * Modified for Solid Aria: composed Solid Aria and Stately primitives with Solid 2 contexts, reactive getters, and DOM refs; uses Solid class props.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport { createColorArea } from \"@solid2-aria/core/color/create-color-area\";\nimport type { AriaColorAreaProps } from \"@solid2-aria/core/color/create-color-area\";\nimport { filterDOMProps } from \"@solid2-aria/core/utils/filter-dom-props\";\nimport { mergeProps } from \"@solid2-aria/core/utils/merge-props\";\nimport { createColorAreaState } from \"@solid2-aria/stately/color/create-color-area-state\";\nimport type { ColorAreaState } from \"@solid2-aria/stately/color/create-color-area-state\";\nimport type { GlobalDOMAttributes } from \"@solid2-aria/types-shared-web\";\nimport type { JSX } from \"@solidjs/web\";\nimport { untrack, createSignal, merge, createContext, omit } from \"solid-js\";\n\nimport { InternalColorThumbContext } from \"./color-thumb\";\nimport { dom, createContextProps, createRenderProps } from \"./utils\";\nimport type { ContextValue, RenderProps, SlotProps, Ref } from \"./utils\";\n\nexport interface ColorAreaRenderProps {\n  isDisabled: boolean;\n  state: ColorAreaState;\n}\n\nexport interface ColorAreaProps\n  extends\n    AriaColorAreaProps,\n    RenderProps<ColorAreaRenderProps>,\n    SlotProps,\n    GlobalDOMAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const ColorAreaContext =\n  createContext<ContextValue<Partial<ColorAreaProps>, HTMLDivElement>>(null);\n\nexport const ColorAreaStateContext = createContext<ColorAreaState | null>(null);\n\nexport function ColorArea(input: ColorAreaProps): JSX.Element {\n  const [inputXRef, setInputXRef] = createSignal<HTMLInputElement | null>(\n    null,\n    { ownedWrite: true }\n  );\n\n  const [inputYRef, setInputYRef] = createSignal<HTMLInputElement | null>(\n    null,\n    { ownedWrite: true }\n  );\n\n  const [props, ref, setRef] = createContextProps(\n    input,\n    untrack(() => input.ref),\n    ColorAreaContext\n  );\n\n  const state = createColorAreaState(props);\n\n  const aria = createColorArea(\n    mergeProps(props, { containerRef: ref, inputXRef, inputYRef }),\n    state\n  );\n\n  const values: ColorAreaRenderProps = {\n    get isDisabled() {\n      return props.isDisabled ?? false;\n    },\n    state,\n  };\n\n  const render = createRenderProps(\n    mergeProps(props, {\n      defaultClass: \"solid2-aria-ColorArea\",\n      get defaultStyle() {\n        const { style } = aria.colorAreaProps;\n\n        return typeof style === \"object\" ? style : undefined;\n      },\n      values,\n    })\n  );\n\n  const thumb = {\n    inputXRef,\n    inputYRef,\n    get isDisabled() {\n      return props.isDisabled;\n    },\n    setInputXRef: (element: HTMLInputElement) => {\n      setInputXRef(element);\n    },\n    setInputYRef: (element: HTMLInputElement) => {\n      setInputYRef(element);\n    },\n    state,\n    get thumbProps() {\n      return aria.thumbProps;\n    },\n    get xInputProps() {\n      return aria.xInputProps;\n    },\n    get yInputProps() {\n      return aria.yInputProps;\n    },\n  };\n\n  return (\n    <dom.div\n      {...mergeProps(\n        omit(filterDOMProps(props, { global: true }), \"id\"),\n        merge(() => aria.colorAreaProps),\n        render\n      )}\n      ref={(element: HTMLDivElement) => {\n        setRef(element);\n      }}\n      slot={\n        typeof props.slot === \"string\" && props.slot.length > 0\n          ? props.slot\n          : undefined\n      }\n      data-disabled={props.isDisabled === true ? true : undefined}\n    >\n      <ColorAreaStateContext value={state}>\n        <InternalColorThumbContext value={thumb}>\n          {render.children}\n        </InternalColorThumbContext>\n      </ColorAreaStateContext>\n    </dom.div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EA6HU,O,SAAC,CAAO;;;;;;;;;;;;;;;EADV,OAAA,0BAAA,IAAA,IACG,QAD+B,KAEP,CAAA;;;;;;;;;;;;;;;EAV7B,OACEA,WAAAA;GAAO,OAAA,CAAA,EAAA,OAAA,MAAM,SAAS,YAAY,MAAM,KAAK,SAAS;EAE1C,CAAA,CAAC,CAAD,IADR,MAAM,OACN,KAAA;;;;;;;EAEN,O,SAAe,CAAM,eAAe,OAAO,OAAO,KAAA;;;;;;;;;;EAElD,OAAA,sBAAA,IAAA,KAEK,QAD+B,OADN,KAIP,CAAA;;;;;;;;;;;;;;;;AA7F7B,MAAa,mBACX,cAAqE,IAAI;AAE3E,MAAa,wBAAwB,cAAqC,IAAI;AAE9E,SAAgB,UAAU,OAAoC;CAC5D,MAAM,CAAC,WAAW,gBAAgB,aAChC,MACA,EAAE,YAAY,KAAK,CACrB;CAEA,MAAM,CAAC,WAAW,gBAAgB,aAChC,MACA,EAAE,YAAY,KAAK,CACrB;CAEA,MAAM,CAAC,OAAO,KAAK,UAAU,mBAC3B,OACA,cAAc,MAAM,GAAG,GACvB,gBACF;CAEA,MAAM,QAAQ,qBAAqB,KAAK;CAExC,MAAM,OAAO,gBACX,WAAW,OAAO;EAAE,cAAc;EAAK;EAAW;CAAU,CAAC,GAC7D,KACF;CASA,MAAM,SAAS,kBACb,WAAW,OAAO;EAChB,cAAc;EACd,IAAI,eAAe;GACjB,MAAM,EAAE,UAAU,KAAK;GAEvB,OAAO,OAAO,UAAU,WAAW,QAAQ,KAAA;EAC7C;EACA,QAAA;GAdF,IAAI,aAAa;IACf,OAAO,MAAM,cAAc;GAC7B;GACA;EAWE;CACF,CAAC,CACH;CAEA,MAAM,QAAQ;EACZ;EACA;EACA,IAAI,aAAa;GACf,OAAO,MAAM;EACf;EACA,eAAe,YAA8B;GAC3C,aAAa,OAAO;EACtB;EACA,eAAe,YAA8B;GAC3C,aAAa,OAAO;EACtB;EACA;EACA,IAAI,aAAa;GACf,OAAO,KAAK;EACd;EACA,IAAI,cAAc;GAChB,OAAO,KAAK;EACd;EACA,IAAI,cAAc;GAChB,OAAO,KAAK;EACd;CACF;CAEA,OAAA,IACGC,IAADC,mBACE;EAAI,OAAA,WACF,KAAK,eAAe,OAAO,EAAE,QAAQ,KAAK,CAAC,GAAG,IAAI,GAClD,YAAY,KAAK,cAAc,GAC/B,MACF;CAAC,GALH,IAAA,KAUW,OAQJ,QAD+B,OADN,QAVxB,YAA4B;EAChC,OAAO,OAAO;CAChB,CAaO,CAAA,CAAA;AAEb"}