@remix-run/ui 0.0.0 → 0.1.1

package/dist/runtime/mixins/ref-mixin.d.ts

@@ -0,0 +1,9 @@
+import type { ElementProps } from '../jsx.ts';
+/**
+ * Callback invoked with the bound node and a lifetime signal.
+ */
+export type RefCallback<node extends EventTarget> = (node: node, signal: AbortSignal) => void;
+/**
+ * Calls a callback when an element is inserted and aborts it when removed.
+ */
+export declare const ref: <boundNode extends Element = Element>(callback: (node: boundNode, signal: AbortSignal) => void) => import("./mixin.ts").MixinDescriptor<boundNode, [callback: (node: boundNode, signal: AbortSignal) => void], ElementProps>;

package/dist/runtime/mixins/ref-mixin.js

@@ -0,0 +1,21 @@
+import { createMixin } from "./mixin.js";
+/**
+ * Calls a callback when an element is inserted and aborts it when removed.
+ */
+export const ref = createMixin((handle) => {
+    let controller;
+    handle.addEventListener('insert', (event) => {
+        controller = new AbortController();
+        callback(event.node, controller.signal);
+    });
+    handle.addEventListener('remove', () => {
+        controller?.abort(new DOMException('', 'AbortError'));
+        controller = undefined;
+    });
+    let callback = () => { };
+    return (nextCallback) => {
+        callback = nextCallback;
+        return handle.element;
+    };
+});
+//# sourceMappingURL=ref-mixin.js.map

package/dist/runtime/mixins/ref-mixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ref-mixin.js","sourceRoot":"","sources":["../../../src/runtime/mixins/ref-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAQxC;;GAEG;AACH,MAAM,CAAC,MAAM,GAAG,GAAG,WAAW,CAC5B,CAAC,MAAM,EAAE,EAAE;IACT,IAAI,UAAuC,CAAA;IAE3C,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;QAC1C,UAAU,GAAG,IAAI,eAAe,EAAE,CAAA;QAClC,QAAQ,CAAC,KAAK,CAAC,IAAI,EAAE,UAAU,CAAC,MAAM,CAAC,CAAA;IACzC,CAAC,CAAC,CAAA;IAEF,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;QACrC,UAAU,EAAE,KAAK,CAAC,IAAI,YAAY,CAAC,EAAE,EAAE,YAAY,CAAC,CAAC,CAAA;QACrD,UAAU,GAAG,SAAS,CAAA;IACxB,CAAC,CAAC,CAAA;IAEF,IAAI,QAAQ,GAAyB,GAAG,EAAE,GAAE,CAAC,CAAA;IAC7C,OAAO,CAAC,YAAY,EAAE,EAAE;QACtB,QAAQ,GAAG,YAAY,CAAA;QACvB,OAAO,MAAM,CAAC,OAAO,CAAA;IACvB,CAAC,CAAA;AACH,CAAC,CACF,CAAA"}

package/dist/runtime/navigation.d.ts

@@ -0,0 +1,28 @@
+import { getTopFrame, getNamedFrame } from './run.ts';
+/**
+ * Options for client-side frame-aware navigation.
+ */
+export type NavigationOptions = {
+    src?: string;
+    target?: string;
+    history?: 'push' | 'replace';
+    resetScroll?: boolean;
+};
+/**
+ * Performs a Navigation API transition understood by Remix frame runtime state.
+ *
+ * @param href Destination URL.
+ * @param options Navigation options.
+ */
+export declare function navigate(href: string, options?: NavigationOptions): Promise<void>;
+/**
+ * Starts listening for Navigation API transitions and routes them through frame reloads.
+ *
+ * @param signal Abort signal used to remove the listener.
+ * @returns void
+ */
+export declare function startNavigationListener(signal: AbortSignal): void;
+export declare function startNavigationListenerImpl(signal: AbortSignal, options: {
+    getTopFrame: typeof getTopFrame;
+    getNamedFrame: typeof getNamedFrame;
+}): void;

package/dist/runtime/navigation.js

@@ -0,0 +1,107 @@
+import { getTopFrame, getNamedFrame } from "./run.js";
+/**
+ * Performs a Navigation API transition understood by Remix frame runtime state.
+ *
+ * @param href Destination URL.
+ * @param options Navigation options.
+ */
+export async function navigate(href, options) {
+    let state = {
+        target: options?.target,
+        src: options?.src ?? href,
+        resetScroll: options?.resetScroll !== false,
+        $rmx: true,
+    };
+    let transition = window.navigation.navigate(href, { state, history: options?.history });
+    await transition.finished;
+}
+/**
+ * Starts listening for Navigation API transitions and routes them through frame reloads.
+ *
+ * @param signal Abort signal used to remove the listener.
+ * @returns void
+ */
+export function startNavigationListener(signal) {
+    return startNavigationListenerImpl(signal, { getTopFrame, getNamedFrame });
+}
+// Internal version used by unit tests so we can inject stub frames
+export function startNavigationListenerImpl(signal, options) {
+    let navigation = window.navigation;
+    navigation.updateCurrentEntry({
+        state: { target: undefined, src: window.location.href, resetScroll: true, $rmx: true },
+    });
+    navigation.addEventListener('navigate', (event) => {
+        if (!event.canIntercept)
+            return;
+        let state = getRuntimeNavigationState(event);
+        if (!state)
+            return;
+        let topFrame = options.getTopFrame();
+        let namedFrame = state.target ? options.getNamedFrame(state.target) : undefined;
+        let frame = namedFrame ?? topFrame;
+        event.intercept({
+            async handler() {
+                if (event.navigationType !== 'traverse') {
+                    navigation.updateCurrentEntry({ state });
+                }
+                frame.src = frame === topFrame ? event.destination.url : state.src;
+                await frame.reload();
+                let isNewEntry = event.navigationType === 'push' || event.navigationType === 'replace';
+                if (state.resetScroll && isNewEntry) {
+                    window.scrollTo(0, 0);
+                }
+            },
+        });
+    }, { signal });
+}
+function isRuntimeNavigation(info) {
+    return typeof info === 'object' && info != null && '$rmx' in info;
+}
+function getRuntimeNavigationState(event) {
+    if (event.navigationType === 'traverse') {
+        return getTraverseNavigationState(event);
+    }
+    let sourceState = getSourceElementNavigationState(event);
+    if (sourceState)
+        return sourceState;
+    let destinationState = event.destination.getState();
+    if (isRuntimeNavigation(destinationState))
+        return destinationState;
+}
+function getTraverseNavigationState(event) {
+    let destinationState = event.destination.getState();
+    if (isRuntimeNavigation(destinationState)) {
+        return destinationState;
+    }
+    // Safari returns `null` for destination.getState(), even though its in the
+    // navigation.entries(), so we do its job for it and look it up.
+    let navigation = window.navigation;
+    let matchingEntry = navigation.entries().find((entry) => entry.key === event.destination.key);
+    if (matchingEntry) {
+        let state = matchingEntry.getState();
+        if (isRuntimeNavigation(state)) {
+            return state;
+        }
+    }
+    return undefined;
+}
+function getSourceElementNavigationState(event) {
+    let sourceEvent = event;
+    let sourceElement = sourceEvent.sourceElement;
+    if (!(sourceElement instanceof Element))
+        return;
+    let linkElement = sourceElement.closest('a, area');
+    if (!(linkElement instanceof Element))
+        return;
+    if (linkElement.hasAttribute('rmx-document'))
+        return;
+    if (linkElement.hasAttribute('download'))
+        return;
+    return {
+        target: linkElement.getAttribute('rmx-target') ?? undefined,
+        src: linkElement.getAttribute('rmx-src') ?? event.destination.url,
+        resetScroll: linkElement.getAttribute('rmx-reset-scroll') !== 'false',
+        $rmx: true,
+    };
+}
+//# sourceMappingURL=navigation.js.map

package/dist/runtime/navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../src/runtime/navigation.ts"],"names":[],"mappings":"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"}

package/dist/runtime/reconcile.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentHandle, FrameHandle } from './component.ts';
+import type { ComponentNode, VNode } from './vnode.ts';
+import type { StyleManager } from '../style/index.ts';
+import type { Scheduler } from './scheduler.ts';
+export declare function diffVNodes(curr: VNode | null, next: VNode, domParent: ParentNode, frame: FrameHandle, scheduler: Scheduler, styles: StyleManager, vParent: VNode, rootTarget: EventTarget, anchor?: Node, rootCursor?: Node | null): Node | null | undefined;
+export declare function renderComponent(handle: ComponentHandle, currContent: VNode | null, next: ComponentNode, domParent: ParentNode, frame: FrameHandle, scheduler: Scheduler, styles: StyleManager, rootTarget: EventTarget, vParent?: VNode, anchor?: Node, cursor?: Node | null): Node | null | undefined;
+export declare function remove(node: VNode, domParent: ParentNode, scheduler: Scheduler, styles: StyleManager): void;
+export declare function findFirstDomAnchor(node: VNode | null | undefined): Node | null;
+export declare function findLastDomAnchor(node: VNode | null | undefined): Node | null;
+export declare function setActiveSchedulerUpdateParents(parents: ParentNode[] | undefined): void;
+export declare function findNextSiblingDomAnchor(curr: VNode, vParent?: VNode): Node | null;