@sprawlify/solid 0.0.14 → 0.0.15

package/dist/index.jsx

@@ -1,499 +1,6 @@
-import { t as createContext } from "./utils-DSKoW7eB.jsx";
-import { Key } from "@solid-primitives/keyed";
-import { INIT_STATE, MachineStatus, createScope, mergeProps as mergeProps$1 } from "@sprawlify/primitives/core";
-import { compact, ensure, isEqual, isFunction, isNumber, isObject, isString, toArray, warn } from "@sprawlify/primitives/utils";
-import { Show, createEffect, createMemo, createSignal, mergeProps as mergeProps$2, onCleanup, onMount, untrack } from "solid-js";
-import { createNormalizer } from "@sprawlify/primitives/types";
-import { getDocument, getWindow } from "@sprawlify/primitives/dom-query";
-import { createCollator, createFilter, isRTL } from "@sprawlify/primitives/i18n-utils";
+import { a as useMachine, i as mergeProps, n as Key, r as normalizeProps } from "./run-if-fn-DRWB51JE.jsx";
+import { t as createContext } from "./create-context-h3cXiEld.jsx";
+import { a as EnvironmentProvider, i as useLocaleContext, n as useCollator, o as useEnvironmentContext, r as LocaleProvider, t as useFilter } from "./providers-CHqGPEsc.jsx";
+import "./utils-DrvO4Hk3.jsx";
 
-//#region src/core/bindable.ts
-function createBindable(props) {
-	const initial = props().value ?? props().defaultValue;
-	const eq = props().isEqual ?? Object.is;
-	const [value, setValue] = createSignal(initial);
-	const controlled = createMemo(() => props().value != void 0);
-	const valueRef = { current: value() };
-	const prevValue = { current: void 0 };
-	createEffect(() => {
-		const v = controlled() ? props().value : value();
-		prevValue.current = v;
-		valueRef.current = v;
-	});
-	const set = (v) => {
-		const prev = prevValue.current;
-		const next = isFunction(v) ? v(valueRef.current) : v;
-		if (props().debug) console.log(`[bindable > ${props().debug}] setValue`, {
-			next,
-			prev
-		});
-		if (!controlled()) setValue(next);
-		if (!eq(next, prev)) props().onChange?.(next, prev);
-	};
-	function get() {
-		const v = controlled() ? props().value : value;
-		return isFunction(v) ? v() : v;
-	}
-	return {
-		initial,
-		ref: valueRef,
-		get,
-		set,
-		invoke(nextValue, prevValue$1) {
-			props().onChange?.(nextValue, prevValue$1);
-		},
-		hash(value$1) {
-			return props().hash?.(value$1) ?? String(value$1);
-		}
-	};
-}
-createBindable.cleanup = (fn) => {
-	onCleanup(() => fn());
-};
-createBindable.ref = (defaultValue) => {
-	let value = defaultValue;
-	return {
-		get: () => value,
-		set: (next) => {
-			value = next;
-		}
-	};
-};
-
-//#endregion
-//#region src/core/refs.ts
-function createRefs(refs) {
-	const ref = { current: refs };
-	return {
-		get(key) {
-			return ref.current[key];
-		},
-		set(key, value) {
-			ref.current[key] = value;
-		}
-	};
-}
-
-//#endregion
-//#region src/core/track.ts
-function access$1(v) {
-	if (isFunction(v)) return v();
-	return v;
-}
-const createTrack = (deps, effect) => {
-	let prevDeps = [];
-	let isFirstRun = true;
-	createEffect(() => {
-		if (isFirstRun) {
-			prevDeps = deps.map((d) => access$1(d));
-			isFirstRun = false;
-			return;
-		}
-		let changed = false;
-		for (let i = 0; i < deps.length; i++) if (!isEqual(prevDeps[i], access$1(deps[i]))) {
-			changed = true;
-			break;
-		}
-		if (changed) {
-			prevDeps = deps.map((d) => access$1(d));
-			effect();
-		}
-	});
-};
-
-//#endregion
-//#region src/core/machine.ts
-function useMachine(machine, userProps = {}) {
-	const scope = createMemo(() => {
-		const { id, ids, getRootNode } = access(userProps);
-		return createScope({
-			id,
-			ids,
-			getRootNode
-		});
-	});
-	const debug = (...args) => {
-		if (machine.debug) console.log(...args);
-	};
-	const prop = createProp(createMemo(() => machine.props?.({
-		props: compact(access(userProps)),
-		scope: scope()
-	}) ?? access(userProps)));
-	const context = machine.context?.({
-		prop,
-		bindable: createBindable,
-		get scope() {
-			return scope();
-		},
-		flush,
-		getContext() {
-			return ctx;
-		},
-		getComputed() {
-			return computed;
-		},
-		getRefs() {
-			return refs;
-		},
-		getEvent() {
-			return getEvent();
-		}
-	});
-	const ctx = {
-		get(key) {
-			return context?.[key].get();
-		},
-		set(key, value) {
-			context?.[key].set(value);
-		},
-		initial(key) {
-			return context?.[key].initial;
-		},
-		hash(key) {
-			const current = context?.[key].get();
-			return context?.[key].hash(current);
-		}
-	};
-	const effects = { current: /* @__PURE__ */ new Map() };
-	const transitionRef = { current: null };
-	const previousEventRef = { current: null };
-	const eventRef = { current: { type: "" } };
-	const getEvent = () => mergeProps$2(eventRef.current, {
-		current() {
-			return eventRef.current;
-		},
-		previous() {
-			return previousEventRef.current;
-		}
-	});
-	const getState = () => mergeProps$2(state, {
-		matches(...values) {
-			const current = state.get();
-			return values.includes(current);
-		},
-		hasTag(tag) {
-			const current = state.get();
-			return !!machine.states[current]?.tags?.includes(tag);
-		}
-	});
-	const refs = createRefs(machine.refs?.({
-		prop,
-		context: ctx
-	}) ?? {});
-	const getParams = () => ({
-		state: getState(),
-		context: ctx,
-		event: getEvent(),
-		prop,
-		send,
-		action,
-		guard,
-		track: createTrack,
-		refs,
-		computed,
-		flush,
-		get scope() {
-			return scope();
-		},
-		choose
-	});
-	const action = (keys) => {
-		const strs = isFunction(keys) ? keys(getParams()) : keys;
-		if (!strs) return;
-		const fns = strs.map((s) => {
-			const fn = machine.implementations?.actions?.[s];
-			if (!fn) warn(`[sprawlify-js] No implementation found for action "${JSON.stringify(s)}"`);
-			return fn;
-		});
-		for (const fn of fns) fn?.(getParams());
-	};
-	const guard = (str) => {
-		if (isFunction(str)) return str(getParams());
-		return machine.implementations?.guards?.[str](getParams());
-	};
-	const effect = (keys) => {
-		const strs = isFunction(keys) ? keys(getParams()) : keys;
-		if (!strs) return;
-		const fns = strs.map((s) => {
-			const fn = machine.implementations?.effects?.[s];
-			if (!fn) warn(`[sprawlify-js] No implementation found for effect "${JSON.stringify(s)}"`);
-			return fn;
-		});
-		const cleanups = [];
-		for (const fn of fns) {
-			const cleanup = fn?.(getParams());
-			if (cleanup) cleanups.push(cleanup);
-		}
-		return () => cleanups.forEach((fn) => fn?.());
-	};
-	const choose = (transitions) => {
-		return toArray(transitions).find((t) => {
-			let result = !t.guard;
-			if (isString(t.guard)) result = !!guard(t.guard);
-			else if (isFunction(t.guard)) result = t.guard(getParams());
-			return result;
-		});
-	};
-	const computed = (key) => {
-		ensure(machine.computed, () => `[sprawlify-js] No computed object found on machine`);
-		const fn = machine.computed[key];
-		return fn({
-			context: ctx,
-			event: eventRef.current,
-			prop,
-			refs,
-			scope: scope(),
-			computed
-		});
-	};
-	const state = createBindable(() => ({
-		defaultValue: machine.initialState({ prop }),
-		onChange(nextState, prevState) {
-			if (prevState) {
-				effects.current.get(prevState)?.();
-				effects.current.delete(prevState);
-			}
-			if (prevState) action(machine.states[prevState]?.exit);
-			action(transitionRef.current?.actions);
-			const cleanup = effect(machine.states[nextState]?.effects);
-			if (cleanup) effects.current.set(nextState, cleanup);
-			if (prevState === INIT_STATE) {
-				action(machine.entry);
-				const cleanup$1 = effect(machine.effects);
-				if (cleanup$1) effects.current.set(INIT_STATE, cleanup$1);
-			}
-			action(machine.states[nextState]?.entry);
-		}
-	}));
-	let status = MachineStatus.NotStarted;
-	onMount(() => {
-		const started = status === MachineStatus.Started;
-		status = MachineStatus.Started;
-		debug(started ? "rehydrating..." : "initializing...");
-		state.invoke(state.initial, INIT_STATE);
-	});
-	onCleanup(() => {
-		debug("unmounting...");
-		status = MachineStatus.Stopped;
-		effects.current.forEach((fn) => fn?.());
-		effects.current = /* @__PURE__ */ new Map();
-		transitionRef.current = null;
-		action(machine.exit);
-	});
-	const send = (event) => {
-		queueMicrotask(() => {
-			if (status !== MachineStatus.Started) return;
-			previousEventRef.current = eventRef.current;
-			eventRef.current = event;
-			let currentState = untrack(() => state.get());
-			const transition = choose(machine.states[currentState].on?.[event.type] ?? machine.on?.[event.type]);
-			if (!transition) return;
-			transitionRef.current = transition;
-			const target = transition.target ?? currentState;
-			debug("transition", event.type, transition.target || currentState, `(${transition.actions})`);
-			const changed = target !== currentState;
-			if (changed) state.set(target);
-			else if (transition.reenter && !changed) state.invoke(currentState, currentState);
-			else action(transition.actions);
-		});
-	};
-	machine.watch?.(getParams());
-	return {
-		state: getState(),
-		send,
-		context: ctx,
-		prop,
-		get scope() {
-			return scope();
-		},
-		refs,
-		computed,
-		event: getEvent(),
-		getStatus: () => status
-	};
-}
-function flush(fn) {
-	fn();
-}
-function access(value) {
-	return isFunction(value) ? value() : value;
-}
-function createProp(value) {
-	return function get(key) {
-		return value()[key];
-	};
-}
-
-//#endregion
-//#region src/core/merge-props.ts
-function mergeProps(...sources) {
-	const target = {};
-	for (let i = 0; i < sources.length; i++) {
-		let source = sources[i];
-		if (typeof source === "function") source = source();
-		if (source) {
-			const descriptors = Object.getOwnPropertyDescriptors(source);
-			for (const key in descriptors) {
-				if (key in target) continue;
-				Object.defineProperty(target, key, {
-					enumerable: true,
-					get() {
-						let e = {};
-						if (key === "style" || key === "class" || key === "className" || key.startsWith("on")) {
-							for (let i$1 = 0; i$1 < sources.length; i$1++) {
-								let s = sources[i$1];
-								if (typeof s === "function") s = s();
-								e = mergeProps$1(e, { [key]: (s || {})[key] });
-							}
-							return e[key];
-						}
-						for (let i$1 = sources.length - 1; i$1 >= 0; i$1--) {
-							let v, s = sources[i$1];
-							if (typeof s === "function") s = s();
-							v = (s || {})[key];
-							if (v !== void 0) return v;
-						}
-					}
-				});
-			}
-		}
-	}
-	return target;
-}
-
-//#endregion
-//#region src/core/normalize-props.ts
-const eventMap = {
-	onFocus: "onFocusIn",
-	onBlur: "onFocusOut",
-	onDoubleClick: "onDblClick",
-	onChange: "onInput",
-	defaultChecked: "checked",
-	defaultValue: "value",
-	htmlFor: "for",
-	className: "class"
-};
-const format = (v) => v.startsWith("--") ? v : hyphenateStyleName(v);
-function toSolidProp(prop) {
-	return prop in eventMap ? eventMap[prop] : prop;
-}
-const normalizeProps = createNormalizer((props) => {
-	const normalized = {};
-	for (const key in props) {
-		const value = props[key];
-		if (key === "readOnly" && value === false) continue;
-		if (key === "style" && isObject(value)) {
-			normalized["style"] = cssify(value);
-			continue;
-		}
-		if (key === "children") {
-			if (isString(value)) normalized["textContent"] = value;
-			continue;
-		}
-		normalized[toSolidProp(key)] = value;
-	}
-	return normalized;
-});
-function cssify(style) {
-	let css = {};
-	for (const property in style) {
-		const value = style[property];
-		if (!isString(value) && !isNumber(value)) continue;
-		css[format(property)] = value;
-	}
-	return css;
-}
-const uppercasePattern = /[A-Z]/g;
-const msPattern = /^ms-/;
-function toHyphenLower(match) {
-	return "-" + match.toLowerCase();
-}
-const cache = {};
-function hyphenateStyleName(name) {
-	if (cache.hasOwnProperty(name)) return cache[name];
-	var hName = name.replace(uppercasePattern, toHyphenLower);
-	return cache[name] = msPattern.test(hName) ? "-" + hName : hName;
-}
-
-//#endregion
-//#region src/utils/run-if-fn.ts
-const isFunction$1 = (value) => typeof value === "function";
-const runIfFn = (valueOrFn, ...args) => isFunction$1(valueOrFn) ? valueOrFn(...args) : valueOrFn;
-
-//#endregion
-//#region src/providers/environment/use-environment-context.ts
-const [EnvironmentContextProvider, useEnvironmentContext] = createContext({
-	hookName: "useEnvironmentContext",
-	providerName: "<EnvironmentProvider />",
-	strict: false,
-	defaultValue: () => ({
-		getRootNode: () => document,
-		getDocument: () => document,
-		getWindow: () => window
-	})
-});
-
-//#endregion
-//#region src/providers/environment/environment-provider.tsx
-const EnvironmentProvider = (props) => {
-	const [spanRef, setSpanRef] = createSignal();
-	const getRootNode = () => runIfFn(props.value) ?? spanRef()?.getRootNode() ?? document;
-	const environment = createMemo(() => ({
-		getRootNode,
-		getDocument: () => getDocument(getRootNode()),
-		getWindow: () => getWindow(getRootNode())
-	}));
-	return <EnvironmentContextProvider value={environment}>
-      {props.children}
-      <Show when={!props.value}>
-        <span hidden ref={setSpanRef} />
-      </Show>
-    </EnvironmentContextProvider>;
-};
-
-//#endregion
-//#region src/providers/locale/use-locale-context.ts
-const [LocaleContextProvider, useLocaleContext] = createContext({
-	hookName: "useEnvironmentContext",
-	providerName: "<EnvironmentProvider />",
-	strict: false,
-	defaultValue: () => ({
-		dir: "ltr",
-		locale: "en-US"
-	})
-});
-
-//#endregion
-//#region src/providers/locale/locale-provider.tsx
-const LocaleProvider = (props) => {
-	const context = createMemo(() => ({
-		locale: props.locale,
-		dir: isRTL(props.locale) ? "rtl" : "ltr"
-	}));
-	return <LocaleContextProvider value={context}>{props.children}</LocaleContextProvider>;
-};
-
-//#endregion
-//#region src/providers/locale/use-collator.ts
-function useCollator(props = {}) {
-	const env = useLocaleContext();
-	const locale = () => props.locale ?? env().locale;
-	return createMemo(() => {
-		const { locale: _, ...options } = props;
-		return createCollator(locale(), options);
-	});
-}
-
-//#endregion
-//#region src/providers/locale/use-filter.ts
-function useFilter(props) {
-	const env = useLocaleContext();
-	const locale = createMemo(() => props.locale ?? env().locale);
-	return createMemo(() => createFilter({
-		...props,
-		locale: locale()
-	}));
-}
-
-//#endregion
 export { EnvironmentProvider, Key, LocaleProvider, createContext, mergeProps, normalizeProps, useCollator, useEnvironmentContext, useFilter, useLocaleContext, useMachine };

package/dist/presence-Bfjusgm3.js

@@ -0,0 +1,79 @@
+import { a as useMachine, i as mergeProps$2, r as normalizeProps, t as runIfFn } from "./run-if-fn-eYlaegHy.js";
+import { t as createContext$1 } from "./create-context-PS2j4mEo.js";
+import { n as createSplitProps, t as sprawlify } from "./factory-CEdj72aS.js";
+import { n as splitRenderStrategyProps } from "./render-strategy-COrlrUuR.js";
+import { t as composeRefs } from "./compose-refs-vsrTrt13.js";
+import { Show, createEffect, createMemo, createSignal } from "solid-js";
+import { createComponent, mergeProps as mergeProps$1 } from "solid-js/web";
+import * as presence from "@sprawlify/primitives/machines/presence";
+
+//#region src/components/presence/split-presence-props.ts
+const splitPresenceProps = (props) => createSplitProps()(props, [
+	"immediate",
+	"lazyMount",
+	"onExitComplete",
+	"present",
+	"skipAnimationOnMount",
+	"unmountOnExit"
+]);
+
+//#endregion
+//#region src/components/presence/use-presence.ts
+const usePresence = (props) => {
+	const [renderStrategyProps, localProps] = splitRenderStrategyProps(runIfFn(props));
+	const [wasEverPresent, setWasEverPresent] = createSignal(false);
+	const service = useMachine(presence.machine, props);
+	const api = createMemo(() => presence.connect(service, normalizeProps));
+	createEffect(() => {
+		if (api().present) setWasEverPresent(true);
+	});
+	const setNode = (node) => {
+		if (!node) return;
+		service.send({
+			type: "NODE.SET",
+			node
+		});
+	};
+	return createMemo(() => ({
+		unmounted: !api().present && !wasEverPresent() && renderStrategyProps.lazyMount || renderStrategyProps.unmountOnExit && !api().present && wasEverPresent(),
+		present: api().present,
+		ref: setNode,
+		presenceProps: {
+			hidden: !api().present,
+			"data-state": api().skip && localProps.skipAnimationOnMount ? void 0 : localProps.present ? "open" : "closed"
+		}
+	}));
+};
+
+//#endregion
+//#region src/components/presence/presence.tsx
+const Presence = (props) => {
+	const [presenceProps, localProps] = splitPresenceProps(props);
+	const api = usePresence(presenceProps);
+	const mergedProps = mergeProps$2(() => api().presenceProps, localProps);
+	return createComponent(Show, {
+		get when() {
+			return !api().unmounted;
+		},
+		get children() {
+			return createComponent(sprawlify.div, mergeProps$1(mergedProps, {
+				ref(r$) {
+					var _ref$ = composeRefs(api().ref, props.ref);
+					typeof _ref$ === "function" && _ref$(r$);
+				},
+				"data-scope": "presence",
+				"data-part": "root"
+			}));
+		}
+	});
+};
+
+//#endregion
+//#region src/components/presence/use-presence-context.ts
+const [PresenceProvider, usePresenceContext] = createContext$1({
+	hookName: "usePresenceContext",
+	providerName: "<PresenceProvider />"
+});
+
+//#endregion
+export { splitPresenceProps as a, usePresence as i, usePresenceContext as n, Presence as r, PresenceProvider as t };

package/dist/presence-arWh1hVd.jsx

@@ -0,0 +1,66 @@
+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 { n as sprawlify, t as createSplitProps } from "./create-split-props-CQVsvhvg.jsx";
+import { n as splitRenderStrategyProps } from "./render-strategy-CZDG_yDi.jsx";
+import { t as composeRefs } from "./compose-refs-CzyOb8yH.jsx";
+import { Show, createEffect, createMemo, createSignal } from "solid-js";
+import * as presence from "@sprawlify/primitives/machines/presence";
+
+//#region src/components/presence/split-presence-props.ts
+const splitPresenceProps = (props) => createSplitProps()(props, [
+	"immediate",
+	"lazyMount",
+	"onExitComplete",
+	"present",
+	"skipAnimationOnMount",
+	"unmountOnExit"
+]);
+
+//#endregion
+//#region src/components/presence/use-presence.ts
+const usePresence = (props) => {
+	const [renderStrategyProps, localProps] = splitRenderStrategyProps(runIfFn(props));
+	const [wasEverPresent, setWasEverPresent] = createSignal(false);
+	const service = useMachine(presence.machine, props);
+	const api = createMemo(() => presence.connect(service, normalizeProps));
+	createEffect(() => {
+		if (api().present) setWasEverPresent(true);
+	});
+	const setNode = (node) => {
+		if (!node) return;
+		service.send({
+			type: "NODE.SET",
+			node
+		});
+	};
+	return createMemo(() => ({
+		unmounted: !api().present && !wasEverPresent() && renderStrategyProps.lazyMount || renderStrategyProps.unmountOnExit && !api().present && wasEverPresent(),
+		present: api().present,
+		ref: setNode,
+		presenceProps: {
+			hidden: !api().present,
+			"data-state": api().skip && localProps.skipAnimationOnMount ? void 0 : localProps.present ? "open" : "closed"
+		}
+	}));
+};
+
+//#endregion
+//#region src/components/presence/presence.tsx
+const Presence = (props) => {
+	const [presenceProps, localProps] = splitPresenceProps(props);
+	const api = usePresence(presenceProps);
+	const mergedProps = mergeProps$1(() => api().presenceProps, localProps);
+	return <Show when={!api().unmounted}>
+      <sprawlify.div {...mergedProps} ref={composeRefs(api().ref, props.ref)} data-scope="presence" data-part="root" />
+    </Show>;
+};
+
+//#endregion
+//#region src/components/presence/use-presence-context.ts
+const [PresenceProvider, usePresenceContext] = createContext$1({
+	hookName: "usePresenceContext",
+	providerName: "<PresenceProvider />"
+});
+
+//#endregion
+export { splitPresenceProps as a, usePresence as i, usePresenceContext as n, Presence as r, PresenceProvider as t };