@orvui/vue 0.0.0-stage → 0.1.1

package/dist/bounce-sidebar-BgZi66Pj.js

@@ -0,0 +1,134 @@
+import { s as e } from "./composables-BJ1sih_H.js";
+import { n as t } from "./state-DWNDjqAL.js";
+import { t as n } from "./utils-DIrLOK2M.js";
+import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, defineComponent as u, nextTick as d, normalizeClass as f, normalizeStyle as p, onBeforeUnmount as m, onMounted as h, openBlock as g, ref as _, renderList as v, renderSlot as y, resolveDynamicComponent as b, toDisplayString as x, unref as S, watch as C, withCtx as w } from "vue";
+import { animate as T } from "motion-v";
+// src/motion/bounce-sidebar/src/trajectory.ts
+function E(e, t) {
+	let n = t - e.y, r = Math.abs(n), i = Math.max(0, Math.min(1, (r - 48) / 120)), a = Math.min(.26, 40 / Math.max(1, r)) * r;
+	return {
+		transition: {
+			type: "spring",
+			stiffness: 280 - 60 * i,
+			damping: 18 + i,
+			mass: .3 + .15 * i
+		},
+		at(t) {
+			return {
+				x: e.x * (1 - t) - 2 * a * t * (1 - t),
+				y: e.y + n * t
+			};
+		}
+	};
+}
+// src/motion/bounce-sidebar/src/BounceSidebar.vue?vue&type=script&setup=true&lang.ts
+var D = ["aria-label"], O = {
+	key: 0,
+	"aria-hidden": "true",
+	role: "presentation",
+	class: "pointer-events-none absolute inset-0"
+}, k = {
+	key: 0,
+	"aria-hidden": "true",
+	class: "shrink-0"
+}, A = /* @__PURE__ */ u({
+	__name: "BounceSidebar",
+	props: {
+		items: {},
+		modelValue: {},
+		defaultValue: {},
+		ariaLabel: { default: "Sidebar navigation" },
+		listClassName: {},
+		itemClassName: {},
+		indicatorClassName: {}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(u, { emit: A }) {
+		let j = u, M = t(j, A, "modelValue", j.defaultValue ?? j.items[0]?.id ?? ""), N = i(() => j.items.some((e) => e.id === M.value) ? M.value : j.items[0]?.id ?? ""), P = i(() => j.items.findIndex((e) => e.id === N.value)), F = _(null), I = _({
+			x: 0,
+			y: 0
+		}), L = e(), R = /* @__PURE__ */ new Map(), z, B, V = !1, H = P.value, U = 0, W = !1;
+		async function G(e = !0) {
+			let t = ++U;
+			if (await d(), W || t !== U) return;
+			let n = R.get(N.value);
+			if (!n) return;
+			let r = n.offsetTop + (n.offsetHeight - 6) / 2;
+			if (B?.stop(), !V || L.value || !e || H === P.value) I.value = {
+				x: 0,
+				y: r
+			}, V = !0;
+			else {
+				let e = E(I.value, r);
+				B = T(0, 1, {
+					...e.transition,
+					onUpdate(t) {
+						W || (I.value = e.at(t));
+					}
+				});
+			}
+			H = P.value;
+		}
+		function K(e, t) {
+			t.disabled ? e.preventDefault() : e.defaultPrevented || (M.value = t.id);
+		}
+		function q(e, t) {
+			t ? R.set(e, t) : R.delete(e);
+		}
+		return C(N, () => void G()), C(L, () => void G(!1)), h(() => {
+			G(!1), F.value && typeof ResizeObserver < "u" && (z = new ResizeObserver(() => void G(!1)), z.observe(F.value));
+		}), m(() => {
+			W = !0, U += 1, z?.disconnect(), B?.stop(), R.clear();
+		}), (e, t) => (g(), s("nav", {
+			"aria-label": u.ariaLabel,
+			class: "relative"
+		}, [c("ul", {
+			ref_key: "list",
+			ref: F,
+			class: f(S(n)("relative flex list-none flex-col gap-1.5 pl-6", u.listClassName))
+		}, [P.value >= 0 ? (g(), s("li", O, [c("span", {
+			class: f(S(n)("absolute left-3 top-0 h-1.5 w-1.5 rounded-full bg-primary", u.indicatorClassName)),
+			style: p({ transform: `translate(${I.value.x}px,${I.value.y}px)` })
+		}, null, 6)])) : o("", !0), (g(!0), s(r, null, v(j.items, (t) => (g(), s("li", {
+			key: t.id,
+			ref_for: !0,
+			ref: (e) => q(t.id, e),
+			class: "relative"
+		}, [(g(), a(b(t.href ? "a" : "button"), {
+			type: t.href ? void 0 : "button",
+			href: t.href,
+			target: t.target,
+			rel: t.rel ?? (t.target === "_blank" ? "noreferrer noopener" : void 0),
+			"aria-current": t.href && N.value === t.id ? "page" : void 0,
+			"aria-pressed": t.href ? void 0 : N.value === t.id,
+			"aria-disabled": t.disabled || void 0,
+			disabled: t.href ? void 0 : t.disabled,
+			"data-active": N.value === t.id || void 0,
+			tabindex: t.disabled ? -1 : void 0,
+			onClick: (e) => K(e, t),
+			class: f(S(n)("flex min-h-9 w-full items-center gap-2 rounded-lg px-2 text-left text-sm font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background", N.value === t.id ? "text-foreground" : "text-muted-foreground hover:text-foreground", t.disabled && "cursor-not-allowed opacity-40", u.itemClassName))
+		}, {
+			default: w(() => [t.icon ? (g(), s("span", k, [(g(), a(b(t.icon), { class: "size-4" }))])) : o("", !0), c("span", null, [y(e.$slots, "item", {
+				item: t,
+				active: N.value === t.id
+			}, () => [l(x(t.label), 1)])])]),
+			_: 2
+		}, 1032, [
+			"type",
+			"href",
+			"target",
+			"rel",
+			"aria-current",
+			"aria-pressed",
+			"aria-disabled",
+			"disabled",
+			"data-active",
+			"tabindex",
+			"onClick",
+			"class"
+		]))]))), 128))], 2)], 8, D));
+	}
+});
+export { A as t };
+
+//# sourceMappingURL=bounce-sidebar-BgZi66Pj.js.map

package/dist/bounce-sidebar-BgZi66Pj.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bounce-sidebar-BgZi66Pj.js","names":["emit","_openBlock","_createElementBlock","_createElementVNode","_normalizeClass","_unref","_normalizeStyle","_createCommentVNode","_Fragment","_renderList","_createBlock","_resolveDynamicComponent","_withCtx","_renderSlot","_createTextVNode","_toDisplayString","_sfc_main","useReducedMotion","useMotionState","cn","sidebarTrajectory","distance","toY","from","travel","longJump","bow","progress","_hoisted_1","_hoisted_2","_hoisted_3","BounceSidebar_default","defineComponent","__emit","props","__props","requested","selected","computed","item","index","list","ref","dot","reduced","items","observer","animation","positioned","previousIndex","version","disposed","position","revision","nextTick","y","animateMovement","path","animate","choose","event","register","node","id","watch","onMounted","onBeforeUnmount","openBlock","createElementBlock","createElementVNode","normalizeClass","unref","normalizeStyle","createCommentVNode","Fragment","renderList","createBlock","resolveDynamicComponent","$event","withCtx","renderSlot","_ctx","createTextVNode","toDisplayString"],"sources":["../src/motion/bounce-sidebar/src/trajectory.ts","../src/motion/bounce-sidebar/src/BounceSidebar.vue","../src/motion/bounce-sidebar/src/BounceSidebar.vue"],"sourcesContent":["export function sidebarTrajectory(from: { x: number; y: number }, toY: number) {\n  const distance = toY - from.y, travel = Math.abs(distance);\n  const longJump = Math.max(0, Math.min(1, (travel - 48) / 120));\n  const bow = Math.min(0.26, 40 / Math.max(1, travel)) * travel;\n  return {\n    transition: { type: \"spring\" as const, stiffness: 280 - 60 * longJump, damping: 18 + longJump, mass: 0.3 + 0.15 * longJump },\n    at(progress: number) { return { x: from.x * (1 - progress) - 2 * bow * progress * (1 - progress), y: from.y + distance * progress }; },\n  };\n}\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { cn } from \"../../../lib/utils\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { useMotionState } from \"../../state\";\nimport { sidebarTrajectory } from \"./trajectory\";\nexport interface BounceSidebarItem { id: string; label: string; href?: string; icon?: any; disabled?: boolean; target?: string; rel?: string }\nconst props = withDefaults(defineProps<{\n  items: BounceSidebarItem[]; modelValue?: string; defaultValue?: string; ariaLabel?: string;\n  listClassName?: string; itemClassName?: string; indicatorClassName?: string;\n}>(), { ariaLabel: \"Sidebar navigation\" });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst requested = useMotionState(props, emit, \"modelValue\", props.defaultValue ?? props.items[0]?.id ?? \"\");\nconst selected = computed(() => props.items.some(item => item.id === requested.value) ? requested.value : props.items[0]?.id ?? \"\");\nconst index = computed(() => props.items.findIndex(item => item.id === selected.value));\nconst list = ref<HTMLUListElement | null>(null), dot = ref({ x: 0, y: 0 }), reduced = useReducedMotion();\nconst items = new Map<string, HTMLLIElement>();\nlet observer: ResizeObserver | undefined, animation: ReturnType<typeof animate> | undefined;\nlet positioned = false, previousIndex = index.value, version = 0, disposed = false;\nasync function position(animateMovement = true) {\n  const revision = ++version;\n  await nextTick();\n  if (disposed || revision !== version) return;\n  const item = items.get(selected.value);\n  if (!item) return;\n  const y = item.offsetTop + (item.offsetHeight - 6) / 2;\n  animation?.stop();\n  if (!positioned || reduced.value || !animateMovement || previousIndex === index.value) {\n    dot.value = { x: 0, y }; positioned = true;\n  } else {\n    const path = sidebarTrajectory(dot.value, y);\n    animation = animate(0, 1, { ...path.transition, onUpdate(progress) { if (!disposed) dot.value = path.at(progress); } });\n  }\n  previousIndex = index.value;\n}\nfunction choose(event: MouseEvent, item: BounceSidebarItem) {\n  if (item.disabled) { event.preventDefault(); return; }\n  if (!event.defaultPrevented) requested.value = item.id;\n}\nfunction register(id: string, node: any) { if (node) items.set(id, node); else items.delete(id); }\nwatch(selected, () => void position());\nwatch(reduced, () => void position(false));\nonMounted(() => {\n  void position(false);\n  if (list.value && typeof ResizeObserver !== \"undefined\") { observer = new ResizeObserver(() => void position(false)); observer.observe(list.value); }\n});\nonBeforeUnmount(() => { disposed = true; version += 1; observer?.disconnect(); animation?.stop(); items.clear(); });\n</script>\n<template><nav :aria-label=\"ariaLabel\" class=\"relative\"><ul ref=\"list\" :class=\"cn('relative flex list-none flex-col gap-1.5 pl-6', listClassName)\">\n  <li v-if=\"index >= 0\" aria-hidden=\"true\" role=\"presentation\" class=\"pointer-events-none absolute inset-0\"><span :class=\"cn('absolute left-3 top-0 h-1.5 w-1.5 rounded-full bg-primary', indicatorClassName)\" :style=\"{ transform: `translate(${dot.x}px,${dot.y}px)` }\" /></li>\n  <li v-for=\"item in props.items\" :key=\"item.id\" :ref=\"node => register(item.id, node)\" class=\"relative\">\n    <component :is=\"item.href ? 'a' : 'button'\" :type=\"item.href ? undefined : 'button'\" :href=\"item.href\" :target=\"item.target\"\n      :rel=\"item.rel ?? (item.target === '_blank' ? 'noreferrer noopener' : undefined)\" :aria-current=\"item.href && selected === item.id ? 'page' : undefined\"\n      :aria-pressed=\"!item.href ? selected === item.id : undefined\" :aria-disabled=\"item.disabled || undefined\" :disabled=\"!item.href ? item.disabled : undefined\"\n      :data-active=\"selected === item.id || undefined\" :tabindex=\"item.disabled ? -1 : undefined\" @click=\"choose($event, item)\"\n      :class=\"cn('flex min-h-9 w-full items-center gap-2 rounded-lg px-2 text-left text-sm font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background', selected === item.id ? 'text-foreground' : 'text-muted-foreground hover:text-foreground', item.disabled && 'cursor-not-allowed opacity-40', itemClassName)\">\n      <span v-if=\"item.icon\" aria-hidden=\"true\" class=\"shrink-0\"><component :is=\"item.icon\" class=\"size-4\" /></span>\n      <span><slot name=\"item\" :item=\"item\" :active=\"selected === item.id\">{{ item.label }}</slot></span>\n    </component>\n  </li>\n</ul></nav></template>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { cn } from \"../../../lib/utils\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { useMotionState } from \"../../state\";\nimport { sidebarTrajectory } from \"./trajectory\";\nexport interface BounceSidebarItem { id: string; label: string; href?: string; icon?: any; disabled?: boolean; target?: string; rel?: string }\nconst props = withDefaults(defineProps<{\n  items: BounceSidebarItem[]; modelValue?: string; defaultValue?: string; ariaLabel?: string;\n  listClassName?: string; itemClassName?: string; indicatorClassName?: string;\n}>(), { ariaLabel: \"Sidebar navigation\" });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst requested = useMotionState(props, emit, \"modelValue\", props.defaultValue ?? props.items[0]?.id ?? \"\");\nconst selected = computed(() => props.items.some(item => item.id === requested.value) ? requested.value : props.items[0]?.id ?? \"\");\nconst index = computed(() => props.items.findIndex(item => item.id === selected.value));\nconst list = ref<HTMLUListElement | null>(null), dot = ref({ x: 0, y: 0 }), reduced = useReducedMotion();\nconst items = new Map<string, HTMLLIElement>();\nlet observer: ResizeObserver | undefined, animation: ReturnType<typeof animate> | undefined;\nlet positioned = false, previousIndex = index.value, version = 0, disposed = false;\nasync function position(animateMovement = true) {\n  const revision = ++version;\n  await nextTick();\n  if (disposed || revision !== version) return;\n  const item = items.get(selected.value);\n  if (!item) return;\n  const y = item.offsetTop + (item.offsetHeight - 6) / 2;\n  animation?.stop();\n  if (!positioned || reduced.value || !animateMovement || previousIndex === index.value) {\n    dot.value = { x: 0, y }; positioned = true;\n  } else {\n    const path = sidebarTrajectory(dot.value, y);\n    animation = animate(0, 1, { ...path.transition, onUpdate(progress) { if (!disposed) dot.value = path.at(progress); } });\n  }\n  previousIndex = index.value;\n}\nfunction choose(event: MouseEvent, item: BounceSidebarItem) {\n  if (item.disabled) { event.preventDefault(); return; }\n  if (!event.defaultPrevented) requested.value = item.id;\n}\nfunction register(id: string, node: any) { if (node) items.set(id, node); else items.delete(id); }\nwatch(selected, () => void position());\nwatch(reduced, () => void position(false));\nonMounted(() => {\n  void position(false);\n  if (list.value && typeof ResizeObserver !== \"undefined\") { observer = new ResizeObserver(() => void position(false)); observer.observe(list.value); }\n});\nonBeforeUnmount(() => { disposed = true; version += 1; observer?.disconnect(); animation?.stop(); items.clear(); });\n</script>\n<template><nav :aria-label=\"ariaLabel\" class=\"relative\"><ul ref=\"list\" :class=\"cn('relative flex list-none flex-col gap-1.5 pl-6', listClassName)\">\n  <li v-if=\"index >= 0\" aria-hidden=\"true\" role=\"presentation\" class=\"pointer-events-none absolute inset-0\"><span :class=\"cn('absolute left-3 top-0 h-1.5 w-1.5 rounded-full bg-primary', indicatorClassName)\" :style=\"{ transform: `translate(${dot.x}px,${dot.y}px)` }\" /></li>\n  <li v-for=\"item in props.items\" :key=\"item.id\" :ref=\"node => register(item.id, node)\" class=\"relative\">\n    <component :is=\"item.href ? 'a' : 'button'\" :type=\"item.href ? undefined : 'button'\" :href=\"item.href\" :target=\"item.target\"\n      :rel=\"item.rel ?? (item.target === '_blank' ? 'noreferrer noopener' : undefined)\" :aria-current=\"item.href && selected === item.id ? 'page' : undefined\"\n      :aria-pressed=\"!item.href ? selected === item.id : undefined\" :aria-disabled=\"item.disabled || undefined\" :disabled=\"!item.href ? item.disabled : undefined\"\n      :data-active=\"selected === item.id || undefined\" :tabindex=\"item.disabled ? -1 : undefined\" @click=\"choose($event, item)\"\n      :class=\"cn('flex min-h-9 w-full items-center gap-2 rounded-lg px-2 text-left text-sm font-medium outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background', selected === item.id ? 'text-foreground' : 'text-muted-foreground hover:text-foreground', item.disabled && 'cursor-not-allowed opacity-40', itemClassName)\">\n      <span v-if=\"item.icon\" aria-hidden=\"true\" class=\"shrink-0\"><component :is=\"item.icon\" class=\"size-4\" /></span>\n      <span><slot name=\"item\" :item=\"item\" :active=\"selected === item.id\">{{ item.label }}</slot></span>\n    </component>\n  </li>\n</ul></nav></template>\n"],"mappings":"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"}

package/dist/bouncy-accordion-BzPQWPqf.js

@@ -0,0 +1,235 @@
+import { s as e, t } from "./composables-BJ1sih_H.js";
+import { n, t as r } from "./state-DWNDjqAL.js";
+import { r as i } from "./ease-rIvCM4O3.js";
+import { t as a } from "./utils-DIrLOK2M.js";
+import { t as o } from "./RenderContent-CwtJ7hLl.js";
+import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createSlots as p, createVNode as m, defineComponent as h, mergeProps as g, normalizeClass as _, normalizeStyle as v, onBeforeUnmount as y, onMounted as b, openBlock as x, ref as S, renderList as C, renderSlot as w, unref as T, useId as E, watch as D, withCtx as O } from "vue";
+import { motion as k } from "motion-v";
+import { ChevronDown as A } from "lucide-vue-next";
+// src/motion/bouncy-accordion/src/BouncyAccordionRow.vue?vue&type=script&setup=true&lang.ts
+var j = [
+	"id",
+	"aria-labelledby",
+	"aria-hidden",
+	"inert"
+], M = /* @__PURE__ */ h({
+	__name: "BouncyAccordionRow",
+	props: {
+		item: {},
+		open: { type: Boolean },
+		startsGroup: { type: Boolean },
+		endsGroup: { type: Boolean },
+		separatedFromPrevious: { type: Boolean },
+		contentId: {},
+		triggerId: {},
+		reduce: { type: Boolean },
+		layoutTransition: {},
+		layoutDependency: {},
+		classNames: {}
+	},
+	emits: ["toggle"],
+	setup(e, { emit: n }) {
+		let r = e, s = n, c = S(null), p = S(0), h;
+		function g() {
+			p.value = c.value?.offsetHeight ?? 0;
+		}
+		b(() => {
+			g(), c.value && typeof ResizeObserver < "u" && (h = new ResizeObserver(g), h.observe(c.value));
+		}), y(() => h?.disconnect());
+		function C(e) {
+			!r.item.disabled && !e.defaultPrevented && s("toggle");
+		}
+		return (n, r) => (x(), l(T(k).div, {
+			layout: !e.reduce && "position",
+			"layout-dependency": e.layoutDependency,
+			initial: !1,
+			style: v({ marginTop: e.separatedFromPrevious ? "12px" : "0px" }),
+			transition: { layout: e.layoutTransition }
+		}, {
+			default: O(() => [m(T(k).div, {
+				"data-state": e.open ? "open" : "closed",
+				layout: !e.reduce,
+				"layout-dependency": e.layoutDependency,
+				initial: !1,
+				animate: {
+					borderTopLeftRadius: e.startsGroup ? "28px" : "0px",
+					borderTopRightRadius: e.startsGroup ? "28px" : "0px",
+					borderBottomLeftRadius: e.endsGroup ? "28px" : "0px",
+					borderBottomRightRadius: e.endsGroup ? "28px" : "0px"
+				},
+				transition: e.reduce ? { duration: 0 } : e.layoutTransition,
+				style: { originY: 0 },
+				class: _(T(a)("overflow-hidden bg-card text-card-foreground", e.item.disabled && "opacity-50", e.classNames?.item))
+			}, {
+				default: O(() => [m(T(k).button, {
+					id: e.triggerId,
+					type: "button",
+					disabled: e.item.disabled,
+					"aria-expanded": e.open,
+					"aria-controls": e.contentId,
+					onClick: C,
+					layout: !e.reduce && "position",
+					"layout-dependency": e.layoutDependency,
+					transition: { layout: e.layoutTransition },
+					style: { originY: 0 },
+					class: _(T(a)("flex min-h-[54px] w-full items-center gap-4 px-5 text-left outline-none transition-colors focus-visible:bg-muted/25 disabled:pointer-events-none", e.classNames?.trigger))
+				}, {
+					default: O(() => [
+						e.item.icon ? (x(), d("span", {
+							key: 0,
+							class: _(T(a)("grid h-7 w-7 shrink-0 place-items-center text-muted-foreground", e.classNames?.icon))
+						}, [m(T(o), { node: e.item.icon }, null, 8, ["node"])], 2)) : u("", !0),
+						f("span", { class: _(T(a)("min-w-0 flex-1 truncate text-[15px] font-medium text-foreground", e.classNames?.title)) }, [w(n.$slots, "title", { item: e.item }, () => [m(T(o), { node: e.item.title }, null, 8, ["node"])])], 2),
+						m(T(k).span, {
+							"aria-hidden": "true",
+							animate: { rotate: e.open ? 180 : 0 },
+							transition: e.reduce ? { duration: 0 } : {
+								type: "spring",
+								duration: .42,
+								bounce: .28
+							},
+							class: _(T(a)("grid h-6 w-6 shrink-0 place-items-center", e.open && !e.item.disabled ? "text-primary" : "text-muted-foreground", e.classNames?.chevron))
+						}, {
+							default: O(() => [m(T(A), { class: "h-4 w-4" })]),
+							_: 1
+						}, 8, [
+							"animate",
+							"transition",
+							"class"
+						])
+					]),
+					_: 3
+				}, 8, [
+					"id",
+					"disabled",
+					"aria-expanded",
+					"aria-controls",
+					"layout",
+					"layout-dependency",
+					"transition",
+					"class"
+				]), f("section", {
+					id: e.contentId,
+					"aria-labelledby": e.triggerId,
+					"aria-hidden": !e.open,
+					inert: !e.open,
+					style: v({ height: e.open && (e.item.description || n.$slots.content) ? p.value ? `${p.value}px` : "auto" : "0px" }),
+					class: _(e.classNames?.content)
+				}, [m(T(k).div, {
+					ref: (e) => c.value = T(t)(e),
+					layout: !e.reduce && "position",
+					"layout-dependency": e.layoutDependency,
+					initial: !1,
+					animate: { opacity: +!!e.open },
+					transition: {
+						opacity: e.reduce ? { duration: 0 } : {
+							duration: .18,
+							ease: T(i)
+						},
+						layout: e.layoutTransition
+					},
+					style: { originY: 0 },
+					class: "px-5 pb-5"
+				}, {
+					default: O(() => [f("div", { class: _(T(a)("text-[15px] leading-6 text-muted-foreground", e.classNames?.description)) }, [w(n.$slots, "content", { item: e.item }, () => [m(T(o), { node: e.item.description }, null, 8, ["node"])])], 2)]),
+					_: 3
+				}, 8, [
+					"layout",
+					"layout-dependency",
+					"animate",
+					"transition"
+				])], 14, j)]),
+				_: 3
+			}, 8, [
+				"data-state",
+				"layout",
+				"layout-dependency",
+				"animate",
+				"transition",
+				"class"
+			])]),
+			_: 3
+		}, 8, [
+			"layout",
+			"layout-dependency",
+			"style",
+			"transition"
+		]));
+	}
+}), N = /* @__PURE__ */ h({
+	__name: "BouncyAccordion",
+	props: {
+		items: {},
+		modelValue: {},
+		defaultValue: { default: null },
+		collapsible: {
+			type: Boolean,
+			default: !0
+		},
+		classNames: {}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(t, { emit: i }) {
+		let o = t, u = n(o, i, "modelValue", o.defaultValue), f = c(() => o.items.findIndex((e) => e.id === u.value)), m = e(), h = E(), v = S({
+			type: "spring",
+			duration: .46,
+			bounce: 0
+		});
+		D(u, (e, t) => {
+			v.value = e !== null && t === null ? {
+				type: "spring",
+				duration: .58,
+				bounce: .32
+			} : {
+				type: "spring",
+				duration: .46,
+				bounce: 0
+			};
+		}, { flush: "sync" });
+		function y(e) {
+			e.disabled || (u.value === e.id ? o.collapsible && (u.value = null) : u.value = e.id);
+		}
+		return (e, n) => (x(), d("div", {
+			class: _(T(a)("w-full", t.classNames?.root)),
+			onKeydown: n[0] ||= (e) => T(r)(e, "button:not(:disabled)")
+		}, [(x(!0), d(s, null, C(t.items, (n, r) => (x(), l(M, {
+			key: n.id,
+			item: n,
+			open: T(u) === n.id,
+			"starts-group": T(u) === n.id || r === 0 || f.value === r - 1,
+			"ends-group": T(u) === n.id || r === t.items.length - 1 || f.value === r + 1,
+			"separated-from-previous": r > 0 && (T(u) === n.id || f.value === r - 1),
+			"content-id": `${T(h)}-${n.id}-content`,
+			"trigger-id": `${T(h)}-${n.id}-trigger`,
+			reduce: T(m),
+			"layout-transition": T(m) ? { duration: 0 } : v.value,
+			"layout-dependency": T(u),
+			"class-names": t.classNames,
+			onToggle: (e) => y(n)
+		}, p({ _: 2 }, [e.$slots.title ? {
+			name: "title",
+			fn: O((t) => [w(e.$slots, "title", g({ ref_for: !0 }, t))]),
+			key: "0"
+		} : void 0, e.$slots.content ? {
+			name: "content",
+			fn: O((t) => [w(e.$slots, "content", g({ ref_for: !0 }, t))]),
+			key: "1"
+		} : void 0]), 1032, [
+			"item",
+			"open",
+			"starts-group",
+			"ends-group",
+			"separated-from-previous",
+			"content-id",
+			"trigger-id",
+			"reduce",
+			"layout-transition",
+			"layout-dependency",
+			"class-names",
+			"onToggle"
+		]))), 128))], 34));
+	}
+});
+export { N as t };
+
+//# sourceMappingURL=bouncy-accordion-BzPQWPqf.js.map

package/dist/bouncy-accordion-BzPQWPqf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bouncy-accordion-BzPQWPqf.js","names":["$slots","_openBlock","_createBlock","_unref","_normalizeStyle","_withCtx","_createVNode","_normalizeClass","_createElementBlock","RenderContent","_createCommentVNode","_createElementVNode","_renderSlot","_sfc_main","$slots","emit","_openBlock","_createElementBlock","_normalizeClass","_unref","_Fragment","_renderList","_createBlock","BouncyAccordionRow","_createSlots","_withCtx","_renderSlot","_mergeProps","_sfc_main","useReducedMotion","focusList","EASE_OUT","cn","RenderContent_default","_hoisted_1","BouncyAccordionRow_default","defineComponent","__emit","props","__props","emit","content","ref","height","observer","measure","onMounted","onBeforeUnmount","toggle","event","openBlock","createBlock","unref","motion","normalizeStyle","withCtx","createVNode","normalizeClass","createElementBlock","createCommentVNode","createElementVNode","renderSlot","_ctx","ChevronDown","resolveElement","node","BouncyAccordion_default","current","useMotionState","selectedIndex","computed","item","reduced","id","useId","timing","next","before","_cache","$event","Fragment","renderList","index","createSlots","mergeProps","scope"],"sources":["../src/motion/bouncy-accordion/src/BouncyAccordionRow.vue","../src/motion/bouncy-accordion/src/BouncyAccordionRow.vue","../src/motion/bouncy-accordion/src/BouncyAccordion.vue","../src/motion/bouncy-accordion/src/BouncyAccordion.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { ChevronDown } from \"lucide-vue-next\";\nimport { cn } from \"../../../lib/utils\";\nimport { EASE_OUT } from \"../../../lib/ease\";\nimport { resolveElement } from \"../../../lib/composables\";\nimport RenderContent from \"../../../lib/RenderContent\";\nconst props = defineProps<{\n  item: { id: string; title: any; description?: any; icon?: any; disabled?: boolean }; open: boolean;\n  startsGroup: boolean; endsGroup: boolean; separatedFromPrevious: boolean; contentId: string; triggerId: string;\n  reduce: boolean; layoutTransition: any; layoutDependency: string | null; classNames?: Record<string, string>;\n}>();\nconst emit = defineEmits<{ toggle: [] }>();\nconst content = ref<HTMLElement | null>(null), height = ref(0);\nlet observer: ResizeObserver | undefined;\nfunction measure() { height.value = content.value?.offsetHeight ?? 0; }\nonMounted(() => { measure(); if (content.value && typeof ResizeObserver !== \"undefined\") { observer = new ResizeObserver(measure); observer.observe(content.value); } });\nonBeforeUnmount(() => observer?.disconnect());\nfunction toggle(event: MouseEvent) { if (!props.item.disabled && !event.defaultPrevented) emit(\"toggle\"); }\n</script>\n<template><motion.div :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :initial=\"false\" :style=\"{ marginTop: separatedFromPrevious ? '12px' : '0px' }\" :transition=\"{ layout: layoutTransition }\">\n  <motion.div :data-state=\"open ? 'open' : 'closed'\" :layout=\"!reduce\" :layout-dependency=\"layoutDependency\" :initial=\"false\"\n    :animate=\"{ borderTopLeftRadius: startsGroup ? '28px' : '0px', borderTopRightRadius: startsGroup ? '28px' : '0px', borderBottomLeftRadius: endsGroup ? '28px' : '0px', borderBottomRightRadius: endsGroup ? '28px' : '0px' }\"\n    :transition=\"reduce ? { duration: 0 } : layoutTransition\" :style=\"{ originY: 0 }\" :class=\"cn('overflow-hidden bg-card text-card-foreground', item.disabled && 'opacity-50', classNames?.item)\">\n    <motion.button :id=\"triggerId\" type=\"button\" :disabled=\"item.disabled\" :aria-expanded=\"open\" :aria-controls=\"contentId\" @click=\"toggle\" :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :transition=\"{ layout: layoutTransition }\" :style=\"{ originY: 0 }\"\n      :class=\"cn('flex min-h-[54px] w-full items-center gap-4 px-5 text-left outline-none transition-colors focus-visible:bg-muted/25 disabled:pointer-events-none', classNames?.trigger)\">\n      <span v-if=\"item.icon\" :class=\"cn('grid h-7 w-7 shrink-0 place-items-center text-muted-foreground', classNames?.icon)\"><RenderContent :node=\"item.icon\" /></span>\n      <span :class=\"cn('min-w-0 flex-1 truncate text-[15px] font-medium text-foreground', classNames?.title)\"><slot name=\"title\" :item=\"item\"><RenderContent :node=\"item.title\" /></slot></span>\n      <motion.span aria-hidden=\"true\" :animate=\"{ rotate: open ? 180 : 0 }\" :transition=\"reduce ? { duration: 0 } : { type: 'spring', duration: 0.42, bounce: 0.28 }\" :class=\"cn('grid h-6 w-6 shrink-0 place-items-center', open && !item.disabled ? 'text-primary' : 'text-muted-foreground', classNames?.chevron)\"><ChevronDown class=\"h-4 w-4\" /></motion.span>\n    </motion.button>\n    <section :id=\"contentId\" :aria-labelledby=\"triggerId\" :aria-hidden=\"!open\" :inert=\"!open\" :style=\"{ height: open && (item.description || $slots.content) ? height ? `${height}px` : 'auto' : '0px' }\" :class=\"classNames?.content\">\n      <motion.div :ref=\"node => content = resolveElement<HTMLElement>(node)\" :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :initial=\"false\" :animate=\"{ opacity: open ? 1 : 0 }\"\n        :transition=\"{ opacity: reduce ? { duration: 0 } : { duration: 0.18, ease: EASE_OUT }, layout: layoutTransition }\" :style=\"{ originY: 0 }\" class=\"px-5 pb-5\">\n        <div :class=\"cn('text-[15px] leading-6 text-muted-foreground', classNames?.description)\"><slot name=\"content\" :item=\"item\"><RenderContent :node=\"item.description\" /></slot></div>\n      </motion.div>\n    </section>\n  </motion.div>\n</motion.div></template>\n","<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { ChevronDown } from \"lucide-vue-next\";\nimport { cn } from \"../../../lib/utils\";\nimport { EASE_OUT } from \"../../../lib/ease\";\nimport { resolveElement } from \"../../../lib/composables\";\nimport RenderContent from \"../../../lib/RenderContent\";\nconst props = defineProps<{\n  item: { id: string; title: any; description?: any; icon?: any; disabled?: boolean }; open: boolean;\n  startsGroup: boolean; endsGroup: boolean; separatedFromPrevious: boolean; contentId: string; triggerId: string;\n  reduce: boolean; layoutTransition: any; layoutDependency: string | null; classNames?: Record<string, string>;\n}>();\nconst emit = defineEmits<{ toggle: [] }>();\nconst content = ref<HTMLElement | null>(null), height = ref(0);\nlet observer: ResizeObserver | undefined;\nfunction measure() { height.value = content.value?.offsetHeight ?? 0; }\nonMounted(() => { measure(); if (content.value && typeof ResizeObserver !== \"undefined\") { observer = new ResizeObserver(measure); observer.observe(content.value); } });\nonBeforeUnmount(() => observer?.disconnect());\nfunction toggle(event: MouseEvent) { if (!props.item.disabled && !event.defaultPrevented) emit(\"toggle\"); }\n</script>\n<template><motion.div :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :initial=\"false\" :style=\"{ marginTop: separatedFromPrevious ? '12px' : '0px' }\" :transition=\"{ layout: layoutTransition }\">\n  <motion.div :data-state=\"open ? 'open' : 'closed'\" :layout=\"!reduce\" :layout-dependency=\"layoutDependency\" :initial=\"false\"\n    :animate=\"{ borderTopLeftRadius: startsGroup ? '28px' : '0px', borderTopRightRadius: startsGroup ? '28px' : '0px', borderBottomLeftRadius: endsGroup ? '28px' : '0px', borderBottomRightRadius: endsGroup ? '28px' : '0px' }\"\n    :transition=\"reduce ? { duration: 0 } : layoutTransition\" :style=\"{ originY: 0 }\" :class=\"cn('overflow-hidden bg-card text-card-foreground', item.disabled && 'opacity-50', classNames?.item)\">\n    <motion.button :id=\"triggerId\" type=\"button\" :disabled=\"item.disabled\" :aria-expanded=\"open\" :aria-controls=\"contentId\" @click=\"toggle\" :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :transition=\"{ layout: layoutTransition }\" :style=\"{ originY: 0 }\"\n      :class=\"cn('flex min-h-[54px] w-full items-center gap-4 px-5 text-left outline-none transition-colors focus-visible:bg-muted/25 disabled:pointer-events-none', classNames?.trigger)\">\n      <span v-if=\"item.icon\" :class=\"cn('grid h-7 w-7 shrink-0 place-items-center text-muted-foreground', classNames?.icon)\"><RenderContent :node=\"item.icon\" /></span>\n      <span :class=\"cn('min-w-0 flex-1 truncate text-[15px] font-medium text-foreground', classNames?.title)\"><slot name=\"title\" :item=\"item\"><RenderContent :node=\"item.title\" /></slot></span>\n      <motion.span aria-hidden=\"true\" :animate=\"{ rotate: open ? 180 : 0 }\" :transition=\"reduce ? { duration: 0 } : { type: 'spring', duration: 0.42, bounce: 0.28 }\" :class=\"cn('grid h-6 w-6 shrink-0 place-items-center', open && !item.disabled ? 'text-primary' : 'text-muted-foreground', classNames?.chevron)\"><ChevronDown class=\"h-4 w-4\" /></motion.span>\n    </motion.button>\n    <section :id=\"contentId\" :aria-labelledby=\"triggerId\" :aria-hidden=\"!open\" :inert=\"!open\" :style=\"{ height: open && (item.description || $slots.content) ? height ? `${height}px` : 'auto' : '0px' }\" :class=\"classNames?.content\">\n      <motion.div :ref=\"node => content = resolveElement<HTMLElement>(node)\" :layout=\"reduce ? false : 'position'\" :layout-dependency=\"layoutDependency\" :initial=\"false\" :animate=\"{ opacity: open ? 1 : 0 }\"\n        :transition=\"{ opacity: reduce ? { duration: 0 } : { duration: 0.18, ease: EASE_OUT }, layout: layoutTransition }\" :style=\"{ originY: 0 }\" class=\"px-5 pb-5\">\n        <div :class=\"cn('text-[15px] leading-6 text-muted-foreground', classNames?.description)\"><slot name=\"content\" :item=\"item\"><RenderContent :node=\"item.description\" /></slot></div>\n      </motion.div>\n    </section>\n  </motion.div>\n</motion.div></template>\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from \"vue\";\nimport { cn } from \"../../../lib/utils\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { focusList, useMotionState } from \"../../state\";\nimport BouncyAccordionRow from \"./BouncyAccordionRow.vue\";\nconst props = withDefaults(defineProps<{\n  items: { id: string; title: any; description?: any; icon?: any; disabled?: boolean }[];\n  modelValue?: string | null; defaultValue?: string | null; collapsible?: boolean; classNames?: Record<string, string>;\n}>(), { defaultValue: null, collapsible: true });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst current = useMotionState<string | null>(props, emit, \"modelValue\", props.defaultValue);\nconst selectedIndex = computed(() => props.items.findIndex(item => item.id === current.value));\nconst reduced = useReducedMotion(), id = useId();\nconst timing = ref({ type: \"spring\" as const, duration: 0.46, bounce: 0 });\nwatch(current, (next, before) => { timing.value = next !== null && before === null ? { type: \"spring\", duration: 0.58, bounce: 0.32 } : { type: \"spring\", duration: 0.46, bounce: 0 }; }, { flush: \"sync\" });\nfunction toggle(item: typeof props.items[number]) {\n  if (item.disabled) return;\n  if (current.value !== item.id) current.value = item.id;\n  else if (props.collapsible) current.value = null;\n}\n</script>\n<template><div :class=\"cn('w-full', classNames?.root)\" @keydown=\"focusList($event, 'button:not(:disabled)')\">\n  <BouncyAccordionRow v-for=\"(item, index) in items\" :key=\"item.id\" :item=\"item\" :open=\"current === item.id\"\n    :starts-group=\"current === item.id || index === 0 || selectedIndex === index - 1\" :ends-group=\"current === item.id || index === items.length - 1 || selectedIndex === index + 1\"\n    :separated-from-previous=\"index > 0 && (current === item.id || selectedIndex === index - 1)\" :content-id=\"`${id}-${item.id}-content`\" :trigger-id=\"`${id}-${item.id}-trigger`\"\n    :reduce=\"reduced\" :layout-transition=\"reduced ? { duration: 0 } : timing\" :layout-dependency=\"current\" :class-names=\"classNames\" @toggle=\"toggle(item)\">\n    <template v-if=\"$slots.title\" #title=\"scope\"><slot name=\"title\" v-bind=\"scope\" /></template><template v-if=\"$slots.content\" #content=\"scope\"><slot name=\"content\" v-bind=\"scope\" /></template>\n  </BouncyAccordionRow>\n</div></template>\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from \"vue\";\nimport { cn } from \"../../../lib/utils\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { focusList, useMotionState } from \"../../state\";\nimport BouncyAccordionRow from \"./BouncyAccordionRow.vue\";\nconst props = withDefaults(defineProps<{\n  items: { id: string; title: any; description?: any; icon?: any; disabled?: boolean }[];\n  modelValue?: string | null; defaultValue?: string | null; collapsible?: boolean; classNames?: Record<string, string>;\n}>(), { defaultValue: null, collapsible: true });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst current = useMotionState<string | null>(props, emit, \"modelValue\", props.defaultValue);\nconst selectedIndex = computed(() => props.items.findIndex(item => item.id === current.value));\nconst reduced = useReducedMotion(), id = useId();\nconst timing = ref({ type: \"spring\" as const, duration: 0.46, bounce: 0 });\nwatch(current, (next, before) => { timing.value = next !== null && before === null ? { type: \"spring\", duration: 0.58, bounce: 0.32 } : { type: \"spring\", duration: 0.46, bounce: 0 }; }, { flush: \"sync\" });\nfunction toggle(item: typeof props.items[number]) {\n  if (item.disabled) return;\n  if (current.value !== item.id) current.value = item.id;\n  else if (props.collapsible) current.value = null;\n}\n</script>\n<template><div :class=\"cn('w-full', classNames?.root)\" @keydown=\"focusList($event, 'button:not(:disabled)')\">\n  <BouncyAccordionRow v-for=\"(item, index) in items\" :key=\"item.id\" :item=\"item\" :open=\"current === item.id\"\n    :starts-group=\"current === item.id || index === 0 || selectedIndex === index - 1\" :ends-group=\"current === item.id || index === items.length - 1 || selectedIndex === index + 1\"\n    :separated-from-previous=\"index > 0 && (current === item.id || selectedIndex === index - 1)\" :content-id=\"`${id}-${item.id}-content`\" :trigger-id=\"`${id}-${item.id}-trigger`\"\n    :reduce=\"reduced\" :layout-transition=\"reduced ? { duration: 0 } : timing\" :layout-dependency=\"current\" :class-names=\"classNames\" @toggle=\"toggle(item)\">\n    <template v-if=\"$slots.title\" #title=\"scope\"><slot name=\"title\" v-bind=\"scope\" /></template><template v-if=\"$slots.content\" #content=\"scope\"><slot name=\"content\" v-bind=\"scope\" /></template>\n  </BouncyAccordionRow>\n</div></template>\n"],"mappings":"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"}