@sprawlify/solid 0.0.14 → 0.0.15

package/dist/components/select/index.jsx

@@ -0,0 +1,310 @@
+import { t as __export } from "../../chunk-C4aQI7lE.jsx";
+import { a as useMachine, i as mergeProps$1, r as normalizeProps, t as runIfFn } from "../../run-if-fn-DRWB51JE.jsx";
+import { t as createContext$1 } from "../../create-context-h3cXiEld.jsx";
+import { i as useLocaleContext, o as useEnvironmentContext } from "../../providers-CHqGPEsc.jsx";
+import { n as sprawlify, t as createSplitProps } from "../../create-split-props-CQVsvhvg.jsx";
+import "../../render-strategy-CZDG_yDi.jsx";
+import { t as composeRefs } from "../../compose-refs-CzyOb8yH.jsx";
+import { a as splitPresenceProps, i as usePresence, n as usePresenceContext, t as PresenceProvider } from "../../presence-arWh1hVd.jsx";
+import "../../fieldset-BG-0ZqWT.jsx";
+import { m as useFieldContext } from "../../field-CphvciGc.jsx";
+import { n as useListCollection, o as createListCollection } from "../../collection-BlnS2UQy.jsx";
+import { Index, Show, createMemo, createUniqueId } from "solid-js";
+import * as select from "@sprawlify/primitives/machines/select";
+import { anatomy as selectAnatomy } from "@sprawlify/primitives/machines/select";
+
+//#region src/components/select/use-select-context.ts
+const [SelectProvider, useSelectContext] = createContext$1({
+	hookName: "useSelectContext",
+	providerName: "<SelectProvider />"
+});
+
+//#endregion
+//#region src/components/select/select-clear-trigger.tsx
+const SelectClearTrigger = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getClearTriggerProps(), props);
+	return <sprawlify.button {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-content.tsx
+const SelectContent = (props) => {
+	const select$1 = useSelectContext();
+	const presenceApi = usePresenceContext();
+	const mergedProps = mergeProps$1(() => select$1().getContentProps(), () => presenceApi().presenceProps, props);
+	return <Show when={!presenceApi().unmounted}>
+      <sprawlify.div {...mergedProps} ref={composeRefs(presenceApi().ref, props.ref)} />
+    </Show>;
+};
+
+//#endregion
+//#region src/components/select/select-context.tsx
+const SelectContext = (props) => props.children(useSelectContext());
+
+//#endregion
+//#region src/components/select/select-control.tsx
+const SelectControl = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getControlProps(), props);
+	return <sprawlify.div {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-hidden-select.tsx
+const SelectHiddenSelect = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getHiddenSelectProps(), props);
+	const isValueEmpty = createMemo(() => select$1().value.length === 0);
+	const field = useFieldContext();
+	return <sprawlify.select aria-describedby={field?.().ariaDescribedby} {...mergedProps}>
+      <Show when={isValueEmpty()}>
+        <option value="" />
+      </Show>
+      <Index each={select$1().collection.items}>
+        {(item) => <option value={select$1().collection.getItemValue(item()) ?? ""} disabled={select$1().collection.getItemDisabled(item())}>
+            {select$1().collection.stringifyItem(item())}
+          </option>}
+      </Index>
+    </sprawlify.select>;
+};
+
+//#endregion
+//#region src/components/select/select-indicator.tsx
+const SelectIndicator = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getIndicatorProps(), props);
+	return <sprawlify.div {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/use-select-item-context.ts
+const [SelectItemProvider, useSelectItemContext] = createContext$1({
+	hookName: "useSelectItemContext",
+	providerName: "<SelectItemProvider />"
+});
+
+//#endregion
+//#region src/components/select/use-select-item-props-context.ts
+const [SelectItemPropsProvider, useSelectItemPropsContext] = createContext$1({
+	hookName: "useSelectItemPropsContext",
+	providerName: "<SelectItemPropsProvider />"
+});
+
+//#endregion
+//#region src/components/select/select-item.tsx
+const SelectItem = (props) => {
+	const [itemProps, localProps] = createSplitProps()(props, ["item", "persistFocus"]);
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getItemProps(itemProps), localProps);
+	const itemState = createMemo(() => select$1().getItemState(itemProps));
+	return <SelectItemPropsProvider value={itemProps}>
+      <SelectItemProvider value={itemState}>
+        <sprawlify.div {...mergedProps} />
+      </SelectItemProvider>
+    </SelectItemPropsProvider>;
+};
+
+//#endregion
+//#region src/components/select/select-item-context.tsx
+const SelectItemContext = (props) => props.children(useSelectItemContext());
+
+//#endregion
+//#region src/components/select/use-select-item-group-props-context.ts
+const [SelectItemGroupPropsProvider, useSelectItemGroupPropsContext] = createContext$1({
+	hookName: "useSelectItemGroupPropsContext",
+	providerName: "<SelectItemGroupPropsProvider />"
+});
+
+//#endregion
+//#region src/components/select/select-item-group.tsx
+const SelectItemGroup = (props) => {
+	const [_itemGroupProps, localProps] = createSplitProps()(props, ["id"]);
+	const select$1 = useSelectContext();
+	const itemGroupProps = mergeProps$1({ id: createUniqueId() }, _itemGroupProps);
+	const mergedProps = mergeProps$1(() => select$1().getItemGroupProps(itemGroupProps), localProps);
+	return <SelectItemGroupPropsProvider value={itemGroupProps}>
+      <sprawlify.div {...mergedProps} />
+    </SelectItemGroupPropsProvider>;
+};
+
+//#endregion
+//#region src/components/select/select-item-group-label.tsx
+const SelectItemGroupLabel = (props) => {
+	const select$1 = useSelectContext();
+	const itemGroupProps = useSelectItemGroupPropsContext();
+	const mergedProps = mergeProps$1(() => select$1().getItemGroupLabelProps({ htmlFor: itemGroupProps.id }), props);
+	return <sprawlify.div {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-item-indicator.tsx
+const SelectItemIndicator = (props) => {
+	const select$1 = useSelectContext();
+	const itemProps = useSelectItemPropsContext();
+	const mergedProps = mergeProps$1(() => select$1().getItemIndicatorProps(itemProps), props);
+	return <sprawlify.div {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-item-text.tsx
+const SelectItemText = (props) => {
+	const select$1 = useSelectContext();
+	const itemProps = useSelectItemPropsContext();
+	const mergedProps = mergeProps$1(() => select$1().getItemTextProps(itemProps), props);
+	return <sprawlify.span {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-label.tsx
+const SelectLabel = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getLabelProps(), props);
+	return <sprawlify.label {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-list.tsx
+const SelectList = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getListProps(), props);
+	return <sprawlify.div {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-positioner.tsx
+const SelectPositioner = (props) => {
+	const select$1 = useSelectContext();
+	const presenceApi = usePresenceContext();
+	const mergedProps = mergeProps$1(() => select$1().getPositionerProps(), props);
+	return <Show when={!presenceApi().unmounted}>
+      <sprawlify.div {...mergedProps} />
+    </Show>;
+};
+
+//#endregion
+//#region src/components/select/use-select.ts
+const useSelect = (props) => {
+	const id = createUniqueId();
+	const locale = useLocaleContext();
+	const environment = useEnvironmentContext();
+	const field = useFieldContext();
+	const machineProps = createMemo(() => ({
+		id,
+		ids: {
+			label: field?.().ids.label,
+			hiddenSelect: field?.().ids.control
+		},
+		disabled: field?.().disabled,
+		readOnly: field?.().readOnly,
+		invalid: field?.().invalid,
+		required: field?.().required,
+		dir: locale().dir,
+		getRootNode: environment().getRootNode,
+		...runIfFn(props)
+	}));
+	const service = useMachine(select.machine, machineProps);
+	return createMemo(() => select.connect(service, normalizeProps));
+};
+
+//#endregion
+//#region src/components/select/select-root.tsx
+const SelectRoot = (props) => {
+	const [presenceProps, selectProps] = splitPresenceProps(props);
+	const [useSelectProps, localProps] = createSplitProps()(selectProps, [
+		"closeOnSelect",
+		"collection",
+		"composite",
+		"defaultHighlightedValue",
+		"defaultOpen",
+		"defaultValue",
+		"deselectable",
+		"disabled",
+		"form",
+		"highlightedValue",
+		"id",
+		"ids",
+		"invalid",
+		"loopFocus",
+		"multiple",
+		"name",
+		"onFocusOutside",
+		"onHighlightChange",
+		"onInteractOutside",
+		"onOpenChange",
+		"onPointerDownOutside",
+		"onSelect",
+		"onValueChange",
+		"open",
+		"positioning",
+		"readOnly",
+		"required",
+		"scrollToIndexFn",
+		"value"
+	]);
+	const select$1 = useSelect(useSelectProps);
+	const presenceApi = usePresence(mergeProps$1(() => ({ present: select$1().open }), presenceProps));
+	const mergedProps = mergeProps$1(() => select$1().getRootProps(), localProps);
+	return <SelectProvider value={select$1}>
+      <PresenceProvider value={presenceApi}>
+        <sprawlify.div {...mergedProps} />
+      </PresenceProvider>
+    </SelectProvider>;
+};
+
+//#endregion
+//#region src/components/select/select-root-provider.tsx
+const SelectRootProvider = (props) => {
+	const [presenceProps, selectProps] = splitPresenceProps(props);
+	const [{ value: select$1 }, localProps] = createSplitProps()(selectProps, ["value"]);
+	const presence = usePresence(mergeProps$1(() => ({ present: select$1().open }), presenceProps));
+	const mergedProps = mergeProps$1(() => select$1().getRootProps(), localProps);
+	return <SelectProvider value={select$1}>
+      <PresenceProvider value={presence}>
+        <sprawlify.div {...mergedProps} />
+      </PresenceProvider>
+    </SelectProvider>;
+};
+
+//#endregion
+//#region src/components/select/select-trigger.tsx
+const SelectTrigger = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getTriggerProps(), props);
+	return <sprawlify.button {...mergedProps} />;
+};
+
+//#endregion
+//#region src/components/select/select-value-text.tsx
+const SelectValueText = (props) => {
+	const select$1 = useSelectContext();
+	const mergedProps = mergeProps$1(() => select$1().getValueTextProps(), props);
+	return <sprawlify.span {...mergedProps}>{select$1().valueAsString || props.placeholder}</sprawlify.span>;
+};
+
+//#endregion
+//#region src/components/select/select.ts
+var select_exports = /* @__PURE__ */ __export({
+	ClearTrigger: () => SelectClearTrigger,
+	Content: () => SelectContent,
+	Context: () => SelectContext,
+	Control: () => SelectControl,
+	HiddenSelect: () => SelectHiddenSelect,
+	Indicator: () => SelectIndicator,
+	Item: () => SelectItem,
+	ItemContext: () => SelectItemContext,
+	ItemGroup: () => SelectItemGroup,
+	ItemGroupLabel: () => SelectItemGroupLabel,
+	ItemIndicator: () => SelectItemIndicator,
+	ItemText: () => SelectItemText,
+	Label: () => SelectLabel,
+	List: () => SelectList,
+	Positioner: () => SelectPositioner,
+	Root: () => SelectRoot,
+	RootProvider: () => SelectRootProvider,
+	Trigger: () => SelectTrigger,
+	ValueText: () => SelectValueText
+});
+
+//#endregion
+export { select_exports as Select, SelectClearTrigger, SelectContent, SelectContext, SelectControl, SelectHiddenSelect, SelectIndicator, SelectItem, SelectItemContext, SelectItemGroup, SelectItemGroupLabel, SelectItemIndicator, SelectItemText, SelectLabel, SelectList, SelectPositioner, SelectRoot, SelectRootProvider, SelectTrigger, SelectValueText, createListCollection, selectAnatomy, useListCollection, useSelect, useSelectContext, useSelectItemContext };

package/dist/compose-refs-CzyOb8yH.jsx

@@ -0,0 +1,20 @@
+import { createEffect } from "solid-js";
+
+//#region src/utils/compose-refs.ts
+const isRefFn = (ref) => typeof ref === "function";
+const setRefs = (refs, node) => {
+	for (const ref of refs) if (isRefFn(ref)) ref(node);
+};
+function composeRefs(...refs) {
+	let node = null;
+	createEffect(() => {
+		setRefs(refs, node);
+	});
+	return (el) => {
+		node = el;
+		setRefs(refs, el);
+	};
+}
+
+//#endregion
+export { composeRefs as t };

package/dist/compose-refs-vsrTrt13.js

@@ -0,0 +1,20 @@
+import { createEffect } from "solid-js";
+
+//#region src/utils/compose-refs.ts
+const isRefFn = (ref) => typeof ref === "function";
+const setRefs = (refs, node) => {
+	for (const ref of refs) if (isRefFn(ref)) ref(node);
+};
+function composeRefs(...refs) {
+	let node = null;
+	createEffect(() => {
+		setRefs(refs, node);
+	});
+	return (el) => {
+		node = el;
+		setRefs(refs, el);
+	};
+}
+
+//#endregion
+export { composeRefs as t };

package/dist/create-split-props-CQVsvhvg.jsx

@@ -0,0 +1,41 @@
+import { i as mergeProps$1 } from "./run-if-fn-DRWB51JE.jsx";
+import { Show, splitProps } from "solid-js";
+import { Dynamic } from "solid-js/web";
+
+//#region src/components/factory.tsx
+const withAsProp = (Component) => {
+	const SprawlifyComponent = (props) => {
+		const [localProps, parentProps] = splitProps(props, ["asChild"]);
+		return <Show when={localProps.asChild} fallback={<Dynamic component={Component} {...parentProps} />}>
+        {(asChild) => {
+			const propsFn = (userProps) => {
+				const [, restProps] = splitProps(parentProps, ["ref"]);
+				return mergeProps$1(restProps, userProps);
+			};
+			return asChild()(propsFn);
+		}}
+      </Show>;
+	};
+	return SprawlifyComponent;
+};
+function jsxFactory() {
+	const cache = /* @__PURE__ */ new Map();
+	return new Proxy(withAsProp, {
+		apply(_target, _thisArg, argArray) {
+			return withAsProp(argArray[0]);
+		},
+		get(_, element) {
+			const asElement = element;
+			if (!cache.has(asElement)) cache.set(asElement, withAsProp(asElement));
+			return cache.get(asElement);
+		}
+	});
+}
+const sprawlify = jsxFactory();
+
+//#endregion
+//#region src/utils/create-split-props.ts
+const createSplitProps = () => (props, keys) => splitProps(props, keys);
+
+//#endregion
+export { sprawlify as n, createSplitProps as t };

package/dist/factory-B6RK6SH4.d.ts

@@ -0,0 +1,14 @@
+import { JSX } from "solid-js";
+
+//#region src/components/factory.d.ts
+type ElementType = keyof JSX.IntrinsicElements;
+type ParentProps$1<T extends ElementType> = (userProps?: JSX.IntrinsicElements[T]) => JSX.HTMLAttributes<any>;
+type PolymorphicProps<T extends ElementType> = {
+  /**
+   * Use the provided child element as the default rendered element, combining their props and behavior.
+   */
+  asChild?: (props: ParentProps$1<T>) => JSX.Element;
+};
+type HTMLProps<E$1 extends ElementType> = JSX.IntrinsicElements[E$1];
+//#endregion
+export { PolymorphicProps as n, HTMLProps as t };

package/dist/factory-CEdj72aS.js

@@ -0,0 +1,47 @@
+import { i as mergeProps$2 } from "./run-if-fn-eYlaegHy.js";
+import { Show, splitProps } from "solid-js";
+import { Dynamic, createComponent, mergeProps as mergeProps$1 } from "solid-js/web";
+
+//#region src/utils/create-split-props.ts
+const createSplitProps = () => (props, keys) => splitProps(props, keys);
+
+//#endregion
+//#region src/components/factory.tsx
+const withAsProp = (Component) => {
+	const SprawlifyComponent = (props) => {
+		const [localProps, parentProps] = splitProps(props, ["asChild"]);
+		return createComponent(Show, {
+			get when() {
+				return localProps.asChild;
+			},
+			get fallback() {
+				return createComponent(Dynamic, mergeProps$1({ component: Component }, parentProps));
+			},
+			children: (asChild) => {
+				const propsFn = (userProps) => {
+					const [, restProps] = splitProps(parentProps, ["ref"]);
+					return mergeProps$2(restProps, userProps);
+				};
+				return asChild()(propsFn);
+			}
+		});
+	};
+	return SprawlifyComponent;
+};
+function jsxFactory() {
+	const cache = /* @__PURE__ */ new Map();
+	return new Proxy(withAsProp, {
+		apply(_target, _thisArg, argArray) {
+			return withAsProp(argArray[0]);
+		},
+		get(_, element) {
+			const asElement = element;
+			if (!cache.has(asElement)) cache.set(asElement, withAsProp(asElement));
+			return cache.get(asElement);
+		}
+	});
+}
+const sprawlify = jsxFactory();
+
+//#endregion
+export { createSplitProps as n, sprawlify as t };