@mkbabb/glass-ui 3.2.0 → 3.4.0

package/dist/composables/sortable/useSortable.d.ts

@@ -1,162 +1,34 @@
 /**
  * useSortable — pointer-capture drag-reorder for Vue lists.
  *
- * Headless composable that owns all pointer handling, drop-target
- * resolution, splice math, AND a DOM-clone drag ghost. Consumers
- * spread the returned per-item binding on each row; the composable
- * handles everything else. No `#preview` slot required — the
- * ghost is a cloned snapshot of the row the user grabbed, so it
- * always looks exactly like what's being dragged regardless of the
- * row's markup.
+ * Headless composable that owns all pointer handling, drop-target resolution,
+ * splice math, AND a DOM-clone drag ghost. Consumers spread the returned per-item
+ * binding on each row; the composable handles everything else. No `#preview` slot
+ * required — the ghost is a cloned snapshot of the row the user grabbed, so it
+ * always looks exactly like what's being dragged regardless of the row's markup.
  *
- * Why pointer events (not HTML5 DnD): HTML5 DnD is flaky inside
- * reactive rendering loops, doesn't respect `user-select: none`
- * ancestors, and can't render a non-ghost drag preview without
- * fighting the browser. Pointer capture gives us direct control
- * over the entire drag lifecycle and composes cleanly with other
+ * Why pointer events (not HTML5 DnD): HTML5 DnD is flaky inside reactive rendering
+ * loops, doesn't respect `user-select: none` ancestors, and can't render a
+ * non-ghost drag preview without fighting the browser. Pointer capture gives us
+ * direct control over the entire drag lifecycle and composes cleanly with other
  * pointer-driven UI (canvas editors, pan/zoom, hover popovers).
  *
- * Cross-list drops via `group`: two or more SortableList
- * instances that share a group id accept items from each other.
- * On drag move, the composable hit-tests `elementFromPoint` for
- * any `[data-sortable-container]` element matching the same
- * group; when the cursor crosses into a sibling instance, the
- * drop target transfers to that instance. On drop into a
- * foreign group, the source's `onReorder` emits the removal
- * and the target's `onInsert` receives the item + insertion
- * index.
+ * Cross-list drops via `group`: two or more SortableList instances that share a
+ * group id accept items from each other. On drag move, the composable hit-tests
+ * the sibling instance registry; when the cursor crosses into a sibling instance,
+ * the drop target transfers to that instance. On drop into a foreign group, the
+ * source's `onReorder` emits the removal and the target's `onInsert` receives the
+ * item + insertion index.
  *
- * Drop resolution walks registered row elements via a data
- * attribute rather than subscribing to each row's bounding-box
- * reactively — that keeps the cost at O(rows) per pointermove
- * frame and avoids a layout thrash storm.
+ * This module is the thin orchestrator. It composes five cohesive services:
+ *   - dragController   — the drag-state lifecycle + cross-list routing
+ *   - dropResolver     — pure collision/measure math + the instance registry
+ *   - ghostRenderer    — the snap-physics + visual clone
+ *   - touchGate        — the handle constraint + pointer-capture optimization
+ *   - transitionTiming — the drop-target class grammar
  */
-import { type ComputedRef, type Ref } from "vue";
-/**
- * Identifier type for sortable rows. Must be stable across
- * reorders (e.g. a record id, not a positional index).
- */
-export type SortableId = string | number;
-interface SortableOptions<T> {
-    /** The reactive array being reordered. */
-    items: Ref<readonly T[]> | ComputedRef<readonly T[]>;
-    /**
-     * Extract a stable id from an item. The id is used both as
-     * the drop-target key (via `data-sortable-id`) and as the
-     * row registration key. Two items with the same id in the
-     * same list is undefined behavior.
-     */
-    getId: (item: T) => SortableId;
-    /**
-     * Called once per successful same-list drop with the full
-     * reordered array. Also called with the post-removal array
-     * when an item is transferred OUT to another list in the
-     * same group.
-     */
-    onReorder: (next: T[]) => void;
-    /**
-     * Cross-list group id. Instances that share a group id
-     * accept drops from each other. Undefined (the default)
-     * isolates this instance — drags stay within the same list.
-     */
-    group?: string;
-    /**
-     * Called when a foreign item is dropped into this list. The
-     * consumer is responsible for the insert (typically by
-     * calling its own onReorder counterpart to mutate the
-     * source-of-truth). The item type is `unknown` because the
-     * source list may own a different T — the group id is the
-     * only contract that asserts compatibility.
-     */
-    onInsert?: (index: number, item: unknown) => void;
-    /**
-     * Optional grip constraint. When set, drag only starts if
-     * the pointerdown target is (or is a descendant of) an
-     * element matching this selector. Defaults to
-     * `[data-sortable-handle]` — the selector that
-     * <SortableHandle> emits. Pass `null` to allow drag from
-     * anywhere on the row.
-     */
-    handleSelector?: string | null;
-    /**
-     * Axis constraint for drop resolution. `"y"` uses row
-     * midpoint Y (vertical list), `"x"` uses row midpoint X
-     * (horizontal list). Default: `"y"`.
-     */
-    axis?: "x" | "y";
-}
-/**
- * Handlers + attrs to spread on a row element. `SortableList`
- * calls `registerItem(id)` once per row and forwards these via
- * a `v-bind` on the row's root.
- */
-interface SortableRowBinding {
-    /**
-     * Template ref callback. Spread on the row's root element
-     * via `:ref="binding.ref"`.
-     */
-    ref: (el: Element | null) => void;
-    /** Data attribute set — includes `data-sortable-id`. */
-    dataAttrs: Record<string, string>;
-    /**
-     * Reactive class object — carries the drop-target hint
-     * classes (`is-sortable-drop-above` / `-below`) when this
-     * row is the live drop target during a drag.
-     */
-    class: ComputedRef<Record<string, boolean>>;
-    /** Pointerdown handler — spread as `@pointerdown`. */
-    onPointerdown: (e: PointerEvent) => void;
-}
-/**
- * Container binding — spread on the list's root element so the
- * composable can hit-test it during cross-list drags.
- */
-export interface SortableContainerBinding {
-    ref: (el: Element | null) => void;
-    dataAttrs: Record<string, string>;
-}
-export interface UseSortableReturn {
-    /**
-     * Register a row by its stable id. Returns the binding
-     * object the row should spread on its root element.
-     * Idempotent — calling with the same id returns the same
-     * binding so Vue's `v-bind` stays stable across rerenders.
-     */
-    registerItem: (id: SortableId) => SortableRowBinding;
-    /**
-     * Binding to spread on the list's container element. Marks
-     * it as a drop target for cross-list drags in the same
-     * group and exposes the container bounding rect for hit
-     * testing.
-     */
-    container: SortableContainerBinding;
-    /** True while a drag is in progress. */
-    isDragging: ComputedRef<boolean>;
-    /** Id of the row currently being dragged, or null. */
-    dragId: ComputedRef<SortableId | null>;
-    /**
-     * Live pointer position in page coordinates while a drag
-     * is in progress.
-     */
-    dragPosition: ComputedRef<{
-        x: number;
-        y: number;
-    } | null>;
-    /** Index the drop will land at, or null when no target. */
-    dropIndex: ComputedRef<number | null>;
-}
-/**
- * True when a computed `border-radius` string has any non-zero
- * corner. Computed values resolve to space-separated lengths
- * (e.g. `"0px"`, `"6px"`, `"12px 12px 0px 0px"`) with an optional
- * `/` separating the horizontal/vertical radii of elliptical
- * corners. A radius is "zero" only when every numeric component
- * parses to 0; a non-length token (`%`, `auto`) counts as
- * non-zero so we never miss a rounded corner.
- *
- * Exported (not re-exported from the package barrel) for the D9 drag-ring
- * regression test — keep it a pure string predicate.
- */
-export declare function isNonZeroRadius(radius: string): boolean;
+import type { SortableOptions, UseSortableReturn } from "./types";
+import { isNonZeroRadius } from "./ghostRenderer";
 export declare function useSortable<T>(options: SortableOptions<T>): UseSortableReturn;
-export {};
+export { isNonZeroRadius };
+export type { SortableId, SortableContainerBinding, UseSortableReturn } from "./types";

package/dist/configurator.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./useConfiguratorState-Dq2gNv4A.js";
+import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./useConfiguratorState-DUtC1jxr.js";
 export { e as CONFIGURATOR_DENSITY_KEY, t as Configurator, i as ConfiguratorLayer, n as ConfiguratorRow, r as provideConfiguratorDensity, o as useConfiguratorState, a as useOptionalConfiguratorDensity };

package/dist/confirm-dialog.js

@@ -1,5 +1,5 @@
 import { t as e } from "./createLucideIcon-DuDoe_ra.js";
-import { n as t } from "./button-DS3ULf5i.js";
+import { n as t } from "./button-Ckn3eDfB.js";
 import { t as n } from "./_plugin-vue_export-helper-C1je1s0u.js";
 import { Transition as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, openBlock as f, renderSlot as p, toDisplayString as m, unref as h, useModel as g, withCtx as _, withKeys as v, withModifiers as y } from "vue";
 var b = e("loader-circle", [["path", {

package/dist/controls.js

@@ -1,6 +1,6 @@
 import { t as e } from "./cn-DJXf4yaB.js";
 import { t } from "./_plugin-vue_export-helper-C1je1s0u.js";
-import { t as n } from "./useGlobalDark-BUUTZvkU.js";
+import { t as n } from "./useGlobalDark-CWiaCoEw.js";
 import { computed as r, createBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, openBlock as c, resolveDynamicComponent as l, unref as u, useAttrs as d, watchEffect as f, withCtx as p } from "vue";
 //#endregion
 //#region src/components/custom/controls/DarkModeToggle.vue
@@ -19,7 +19,7 @@ var m = /* @__PURE__ */ t(/* @__PURE__ */ o({
 		}
 	},
 	setup(t) {
-		let o = t, m = d(), h = r(() => e("dark-mode-toggle-button", "relative isolate inline-flex shrink-0 items-center justify-center", "cursor-pointer border-0 bg-transparent", "rounded-[var(--radius-pill)]", "opacity-80", "focus-ring", m.class)), { isDark: g, toggleDark: _, setDisableTransitions: v } = n(), y = r(() => {
+		let o = t, m = d(), h = r(() => e("dark-mode-toggle-button", "relative isolate inline-flex shrink-0 items-center justify-center", "cursor-pointer border-0 bg-transparent", "rounded-pill", "opacity-80", "focus-ring", m.class)), { isDark: g, toggleDark: _, setDisableTransitions: v } = n(), y = r(() => {
 			let { class: e, ...t } = m;
 			return o.passive ? t : {
 				type: "button",
@@ -37,7 +37,7 @@ var m = /* @__PURE__ */ t(/* @__PURE__ */ o({
 			default: p(() => [...n[1] ||= [a("svg", {
 				xmlns: "http://www.w3.org/2000/svg",
 				viewBox: "0 0 472.39 472.39",
-				class: "block h-full w-full fill-[var(--foreground)]"
+				class: "block h-full w-full fill-foreground"
 			}, [a("g", { class: "toggle-sun" }, [a("path", { d: "M403.21,167V69.18H305.38L236.2,0,167,69.18H69.18V167L0,236.2l69.18,69.18v97.83H167l69.18,69.18,69.18-69.18h97.83V305.38l69.18-69.18Zm-167,198.17a129,129,0,1,1,129-129A129,129,0,0,1,236.2,365.19Z" })]), a("g", { class: "toggle-circle" }, [a("circle", {
 				cx: "236.2",
 				cy: "236.2",
@@ -46,6 +46,6 @@ var m = /* @__PURE__ */ t(/* @__PURE__ */ o({
 			_: 1
 		}, 16, ["class", "data-size"]));
 	}
-}), [["__scopeId", "data-v-f361509a"]]);
+}), [["__scopeId", "data-v-10981347"]]);
 //#endregion
 export { m as DarkModeToggle };

package/dist/createContext-DBMGRlx4.js

@@ -0,0 +1,25 @@
+import { inject as e, provide as t } from "vue";
+//#region src/composables/context/createContext.ts
+function n(n, r) {
+	let i = Symbol(n);
+	return {
+		KEY: i,
+		provide: (e) => t(i, e),
+		use: () => {
+			let t = e(i);
+			if (!t) throw Error(r);
+			return t;
+		},
+		useOptional: () => e(i, null)
+	};
+}
+function r(n) {
+	let r = Symbol(n);
+	return {
+		KEY: r,
+		provide: (e) => t(r, e),
+		use: () => e(r, null)
+	};
+}
+//#endregion
+export { n, r as t };

package/dist/dark.d.ts

@@ -1 +1,2 @@
-export { useGlobalDark, installDarkModeSync } from "./composables/dark";
+export { useGlobalDark, installDarkModeSync, darkModeSyncScript, DARK_MODE_STORAGE_KEY, } from "./composables/dark";
+export type { UseGlobalDarkOptions, DarkModeSyncScriptOptions } from "./composables/dark";

package/dist/dark.js

@@ -1,4 +1,4 @@
-import { t as e } from "./useGlobalDark-BUUTZvkU.js";
+import { t as e } from "./useGlobalDark-CWiaCoEw.js";
 import { nextTick as t, watch as n } from "vue";
 //#region src/composables/dark/installDarkModeSync.ts
 function r(r) {
@@ -10,4 +10,11 @@ function r(r) {
 	});
 }
 //#endregion
-export { r as installDarkModeSync, e as useGlobalDark };
+//#region src/composables/dark/darkModeSyncScript.ts
+var i = "vueuse-color-scheme", a = "dark";
+function o(e = {}) {
+	let t = e.storageKey ?? "vueuse-color-scheme";
+	return `(function(){try{var m=localStorage.getItem(${JSON.stringify(t)});var d=m==="${a}"||((m===null||m==="auto")&&window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches);var e=document.documentElement;e.classList.toggle("${a}",d);e.style.colorScheme=d?"dark":"light";}catch(_){}})();`;
+}
+//#endregion
+export { i as DARK_MODE_STORAGE_KEY, o as darkModeSyncScript, r as installDarkModeSync, e as useGlobalDark };

package/dist/data-table.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./DataTable-BsrDYdoE.js";
+import { n as e, t } from "./DataTable-FfkaAg2z.js";
 export { t as DataTable, e as DataTablePagination };

package/dist/dialog.js

@@ -1,3 +1,3 @@
-import { n as e, t } from "./DialogContent-B61rP8lj.js";
+import { n as e, t } from "./DialogContent-IQ8_BRrC.js";
 import { a as n, i as r, n as i, o as a, r as o, s, t as c } from "./DialogFooter-Er0wA3K6.js";
 export { e as Dialog, s as DialogClose, t as DialogContent, o as DialogDescription, c as DialogFooter, n as DialogHeader, i as DialogScrollContent, r as DialogTitle, a as DialogTrigger };

package/dist/disco-glyph.js

@@ -1,2 +1,2 @@
-import { t as e } from "./DiscoGlyph-B7YooI2-.js";
+import { t as e } from "./DiscoGlyph-BaZ8OawK.js";
 export { e as DiscoGlyph };