@sprawlify/vue 0.0.64 → 0.0.66

package/dist/chunk-BN_g-Awi.js

@@ -0,0 +1,18 @@
+//#region rolldown:runtime
+var __defProp = Object.defineProperty;
+var __exportAll = (all, symbols) => {
+	let target = {};
+	for (var name in all) {
+		__defProp(target, name, {
+			get: all[name],
+			enumerable: true
+		});
+	}
+	if (symbols) {
+		__defProp(target, Symbol.toStringTag, { value: "Module" });
+	}
+	return target;
+};
+
+//#endregion
+export { __exportAll as t };

package/dist/clean-props-ChPEW0vT.js

@@ -0,0 +1,9 @@
+//#region src/utils/clean-props.ts
+const cleanProps = (obj) => {
+	const result = {};
+	for (const [key, value] of Object.entries(obj)) if (value !== void 0) result[key] = value;
+	return result;
+};
+
+//#endregion
+export { cleanProps as t };

package/dist/collapsible-BBV8R9Wm.js

@@ -0,0 +1,259 @@
+import { t as __exportAll } from "./chunk-BN_g-Awi.js";
+import { n as useMachine, r as normalizeProps$1 } from "./core-DNndr38p.js";
+import { a as useLocaleContext, c as useEnvironmentContext, i as DEFAULT_LOCALE, s as DEFAULT_ENVIRONMENT } from "./providers-B2CNPFg1.js";
+import { r as createContext, t as useForwardExpose } from "./use-forward-expose-4p5AGAI3.js";
+import { t as sprawlify } from "./factory-BH3WrWd2.js";
+import { t as cleanProps } from "./clean-props-ChPEW0vT.js";
+import { computed, createBlock, createCommentVNode, defineComponent, guardReactiveProps, mergeDefaults, mergeProps, normalizeProps, openBlock, ref, renderSlot, toValue, unref, useId, watch, withCtx } from "vue";
+import * as collapsible from "@sprawlify/primitives/machines/collapsible";
+import { anatomy as collapsibleAnatomy } from "@sprawlify/primitives/machines/collapsible";
+
+//#region src/components/collapsible/use-collapsible-context.ts
+const [CollapsibleProvider, useCollapsibleContext] = createContext("CollapsibleContext");
+
+//#endregion
+//#region src/components/collapsible/collapsible-content.vue?vue&type=script&setup=true&lang.ts
+var collapsible_content_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-content",
+	props: { asChild: {
+		type: Boolean,
+		required: false
+	} },
+	setup(__props) {
+		const collapsible = useCollapsibleContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return !unref(collapsible).unmounted ? (openBlock(), createBlock(unref(sprawlify).div, mergeProps({ key: 0 }, unref(collapsible).getContentProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"])) : createCommentVNode("v-if", true);
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-content.vue
+var collapsible_content_default = collapsible_content_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/collapsible-context.vue?vue&type=script&setup=true&lang.ts
+var collapsible_context_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-context",
+	setup(__props) {
+		const collapsible = useCollapsibleContext();
+		return (_ctx, _cache) => {
+			return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(collapsible))));
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-context.vue
+var collapsible_context_default = collapsible_context_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/collapsible-root-provider.vue?vue&type=script&setup=true&lang.ts
+var collapsible_root_provider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-root-provider",
+	props: {
+		value: {
+			type: null,
+			required: true
+		},
+		asChild: {
+			type: Boolean,
+			required: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const collapsible = computed(() => props.value);
+		CollapsibleProvider(collapsible);
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(sprawlify).div, mergeProps(collapsible.value.getRootProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-root-provider.vue
+var collapsible_root_provider_default = collapsible_root_provider_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/use-collapsible.ts
+const useCollapsible = (props = {}, emits) => {
+	const id = useId();
+	const env = useEnvironmentContext(DEFAULT_ENVIRONMENT);
+	const locale = useLocaleContext(DEFAULT_LOCALE);
+	const context = computed(() => {
+		const localeProps = toValue(props);
+		return {
+			id,
+			dir: locale.value.dir,
+			getRootNode: env?.value.getRootNode,
+			...cleanProps(localeProps),
+			onExitComplete: () => {
+				emits?.("exitComplete");
+				localeProps.onExitComplete?.();
+			},
+			onOpenChange: (details) => {
+				emits?.("openChange", details);
+				emits?.("update:open", details.open);
+				localeProps.onOpenChange?.(details);
+			}
+		};
+	});
+	const service = useMachine(collapsible.machine, context);
+	const api = computed(() => collapsible.connect(service, normalizeProps$1));
+	const wasVisible = ref(false);
+	watch(() => api.value.visible, () => {
+		if (api.value.visible) wasVisible.value = true;
+	});
+	return computed(() => {
+		const localeProps = toValue(props);
+		return {
+			...api.value,
+			unmounted: !api.value.visible && !wasVisible.value && localeProps.lazyMount || localeProps.unmountOnExit && !api.value.visible && wasVisible.value
+		};
+	});
+};
+
+//#endregion
+//#region src/components/collapsible/collapsible-root.vue?vue&type=script&setup=true&lang.ts
+var collapsible_root_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-root",
+	props: /* @__PURE__ */ mergeDefaults({
+		collapsedHeight: {
+			type: [Number, String],
+			required: false
+		},
+		collapsedWidth: {
+			type: [Number, String],
+			required: false
+		},
+		defaultOpen: {
+			type: Boolean,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		ids: {
+			type: Object,
+			required: false
+		},
+		lazyMount: {
+			type: Boolean,
+			required: false
+		},
+		open: {
+			type: Boolean,
+			required: false
+		},
+		unmountOnExit: {
+			type: Boolean,
+			required: false
+		},
+		asChild: {
+			type: Boolean,
+			required: false
+		}
+	}, {
+		defaultOpen: void 0,
+		disabled: void 0,
+		lazyMount: void 0,
+		open: void 0,
+		unmountOnExit: void 0
+	}),
+	emits: [
+		"exitComplete",
+		"openChange",
+		"update:open"
+	],
+	setup(__props, { emit: __emit }) {
+		const collapsible = useCollapsible(__props, __emit);
+		CollapsibleProvider(collapsible);
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(sprawlify).div, mergeProps(unref(collapsible).getRootProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-root.vue
+var collapsible_root_default = collapsible_root_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/collapsible-trigger.vue?vue&type=script&setup=true&lang.ts
+var collapsible_trigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-trigger",
+	props: { asChild: {
+		type: Boolean,
+		required: false
+	} },
+	setup(__props) {
+		const collapsible = useCollapsibleContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(sprawlify).button, mergeProps(unref(collapsible).getTriggerProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-trigger.vue
+var collapsible_trigger_default = collapsible_trigger_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/collapsible-indicator.vue?vue&type=script&setup=true&lang.ts
+var collapsible_indicator_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "collapsible-indicator",
+	props: { asChild: {
+		type: Boolean,
+		required: false
+	} },
+	setup(__props) {
+		const collapsible = useCollapsibleContext();
+		useForwardExpose();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(sprawlify).div, mergeProps(unref(collapsible).getIndicatorProps(), { "as-child": __props.asChild }), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["as-child"]);
+		};
+	}
+});
+
+//#endregion
+//#region src/components/collapsible/collapsible-indicator.vue
+var collapsible_indicator_default = collapsible_indicator_vue_vue_type_script_setup_true_lang_default;
+
+//#endregion
+//#region src/components/collapsible/collapsible.ts
+var collapsible_exports = /* @__PURE__ */ __exportAll({
+	Content: () => collapsible_content_default,
+	Context: () => collapsible_context_default,
+	Indicator: () => collapsible_indicator_default,
+	Root: () => collapsible_root_default,
+	RootProvider: () => collapsible_root_provider_default,
+	Trigger: () => collapsible_trigger_default
+});
+
+//#endregion
+export { collapsible_root_default as a, collapsible_context_default as c, collapsible_trigger_default as i, collapsible_content_default as l, collapsibleAnatomy as n, useCollapsible as o, collapsible_indicator_default as r, collapsible_root_provider_default as s, collapsible_exports as t, useCollapsibleContext as u };

package/dist/collection-DR2kMzrX.js

@@ -0,0 +1,218 @@
+import { n as useMachine } from "./core-DNndr38p.js";
+import { t as cleanProps } from "./clean-props-ChPEW0vT.js";
+import { computed, ref, shallowRef, toValue, watch } from "vue";
+import { GridCollection, ListCollection, Selection, TreeCollection, filePathToTree } from "@sprawlify/primitives/collection";
+import * as asyncList from "@sprawlify/primitives/machines/async-list";
+
+//#region src/components/collection/grid-collection.ts
+const createGridCollection = (options) => new GridCollection(options);
+
+//#endregion
+//#region src/components/collection/list-collection.ts
+const createListCollection = (options) => new ListCollection(options);
+
+//#endregion
+//#region src/components/collection/tree-collection.ts
+const createTreeCollection = (options) => new TreeCollection(options);
+const createFileTreeCollection = (paths) => filePathToTree(paths);
+
+//#endregion
+//#region src/components/collection/use-async-list.ts
+const useAsyncList = (props = {}) => {
+	const context = computed(() => cleanProps(toValue(props)));
+	const service = useMachine(asyncList.machine, context);
+	return computed(() => asyncList.connect(service));
+};
+
+//#endregion
+//#region src/components/collection/use-list-collection.ts
+function useListCollection(props) {
+	const resolvedProps = computed(() => {
+		const { initialItems = [], filter, limit, ...collectionOptions } = toValue(props);
+		return [{
+			initialItems,
+			filter,
+			limit
+		}, collectionOptions];
+	});
+	const init = () => {
+		const { initialItems } = resolvedProps.value[0];
+		return initialItems;
+	};
+	const items = ref(init());
+	const filterText = ref("");
+	const setItems = (newItems) => {
+		items.value = newItems;
+		filterText.value = "";
+	};
+	const create = (itemsToCreate) => {
+		const [, collectionOptions] = resolvedProps.value;
+		return createListCollection({
+			...collectionOptions,
+			items: itemsToCreate
+		});
+	};
+	return {
+		collection: computed(() => {
+			const [localProps, collectionOptions] = resolvedProps.value;
+			let activeItems = items.value;
+			const filter = localProps.filter;
+			if (filterText.value && filter) activeItems = create(items.value).filter((itemString, _index, item) => filter(itemString, filterText.value, item)).items;
+			const limitedItems = localProps.limit == null ? activeItems : activeItems.slice(0, localProps.limit);
+			return createListCollection({
+				...collectionOptions,
+				items: limitedItems
+			});
+		}),
+		filter: (inputValue = "") => {
+			filterText.value = inputValue;
+		},
+		set: (newItems) => {
+			setItems(newItems);
+		},
+		reset: () => {
+			const [localProps] = resolvedProps.value;
+			setItems(localProps.initialItems);
+		},
+		clear: () => {
+			setItems([]);
+		},
+		insert: (index, ...itemsToInsert) => {
+			const newItems = create(items.value).insert(index, ...itemsToInsert).items;
+			setItems(newItems);
+		},
+		insertBefore: (value, ...itemsToInsert) => {
+			const newItems = create(items.value).insertBefore(value, ...itemsToInsert).items;
+			setItems(newItems);
+		},
+		insertAfter: (value, ...itemsToInsert) => {
+			const newItems = create(items.value).insertAfter(value, ...itemsToInsert).items;
+			setItems(newItems);
+		},
+		remove: (...itemOrValues) => {
+			const newItems = create(items.value).remove(...itemOrValues).items;
+			setItems(newItems);
+		},
+		move: (value, to) => {
+			const newItems = create(items.value).move(value, to).items;
+			setItems(newItems);
+		},
+		moveBefore: (value, ...values) => {
+			const newItems = create(items.value).moveBefore(value, ...values).items;
+			setItems(newItems);
+		},
+		moveAfter: (value, ...values) => {
+			const newItems = create(items.value).moveAfter(value, ...values).items;
+			setItems(newItems);
+		},
+		reorder: (from, to) => {
+			const newItems = create(items.value).reorder(from, to).items;
+			setItems(newItems);
+		},
+		append: (...itemsToAppend) => {
+			const newItems = create(items.value).append(...itemsToAppend).items;
+			setItems(newItems);
+		},
+		upsert: (value, item, mode = "append") => {
+			const newItems = create(items.value).upsert(value, item, mode).items;
+			setItems(newItems);
+		},
+		prepend: (...itemsToPrepend) => {
+			const newItems = create(items.value).prepend(...itemsToPrepend).items;
+			setItems(newItems);
+		},
+		update: (value, item) => {
+			const newItems = create(items.value).update(value, item).items;
+			setItems(newItems);
+		}
+	};
+}
+
+//#endregion
+//#region src/components/collection/use-list-selection.ts
+function useListSelection(props) {
+	const resolvedProps = computed(() => {
+		const { collection, selectionMode = "single", deselectable = true, initialSelectedValues = [], resetOnCollectionChange = false } = toValue(props);
+		return {
+			collection,
+			selectionMode,
+			deselectable,
+			initialSelectedValues,
+			resetOnCollectionChange
+		};
+	});
+	const createSelection = (values = []) => {
+		const { selectionMode, deselectable } = resolvedProps.value;
+		const selection = new Selection(values);
+		selection.selectionMode = selectionMode;
+		selection.deselectable = deselectable;
+		return selection;
+	};
+	const init = () => {
+		const { initialSelectedValues } = resolvedProps.value;
+		return createSelection(initialSelectedValues);
+	};
+	const selection = shallowRef(init());
+	watch([() => resolvedProps.value.collection.getValues(), () => resolvedProps.value.resetOnCollectionChange], ([, resetOnCollectionChange]) => {
+		if (resetOnCollectionChange) selection.value = createSelection();
+	});
+	return {
+		selectedValues: computed(() => Array.from(selection.value)),
+		isEmpty: computed(() => selection.value.isEmpty()),
+		firstSelectedValue: computed(() => {
+			const { collection } = resolvedProps.value;
+			return selection.value.firstSelectedValue(collection);
+		}),
+		lastSelectedValue: computed(() => {
+			const { collection } = resolvedProps.value;
+			return selection.value.lastSelectedValue(collection);
+		}),
+		isSelected: (value) => {
+			return selection.value.isSelected(value);
+		},
+		isAllSelected: () => {
+			const { collection } = resolvedProps.value;
+			const allValues = collection.getValues();
+			return allValues.length > 0 && allValues.every((value) => selection.value.isSelected(value));
+		},
+		isSomeSelected: () => {
+			const { collection } = resolvedProps.value;
+			return collection.getValues().some((value) => selection.value.isSelected(value));
+		},
+		canSelect: (value) => {
+			const { collection } = resolvedProps.value;
+			return selection.value.canSelect(collection, value);
+		},
+		select: (value, forceToggle) => {
+			const { collection } = resolvedProps.value;
+			selection.value = selection.value.select(collection, value, forceToggle);
+		},
+		deselect: (value) => {
+			selection.value = selection.value.deselect(value);
+		},
+		toggle: (value) => {
+			const { collection } = resolvedProps.value;
+			selection.value = selection.value.toggleSelection(collection, value);
+		},
+		replace: (value) => {
+			const { collection } = resolvedProps.value;
+			selection.value = selection.value.replaceSelection(collection, value);
+		},
+		extend: (anchorValue, targetValue) => {
+			const { collection } = resolvedProps.value;
+			selection.value = selection.value.extendSelection(collection, anchorValue, targetValue);
+		},
+		setSelectedValues: (values) => {
+			selection.value = selection.value.setSelection(values);
+		},
+		clear: () => {
+			selection.value = selection.value.clearSelection();
+		},
+		resetSelection: () => {
+			selection.value = createSelection();
+		}
+	};
+}
+
+//#endregion
+export { createTreeCollection as a, createFileTreeCollection as i, useListCollection as n, createListCollection as o, useAsyncList as r, createGridCollection as s, useListSelection as t };