@xh/hoist 72.0.0-SNAPSHOT.1737150473558 → 72.0.0-SNAPSHOT.1737472364423

package/build/types/mobile/cmp/navigator/impl/swipe/BackIndicator.d.ts

@@ -1,6 +0,0 @@
-import { SwiperModel } from './SwiperModel';
-/**
- * Indicator for the swipeToGoBack affordance
- * @internal
- */
-export declare const backIndicator: import("@xh/hoist/core").ElementFactory<import("@xh/hoist/core").DefaultHoistProps<SwiperModel>>;

package/build/types/mobile/cmp/navigator/impl/swipe/RefreshIndicator.d.ts

@@ -1,6 +0,0 @@
-import { SwiperModel } from './SwiperModel';
-/**
- * Indicator for the pulldownToRefresh affordance
- * @internal
- */
-export declare const refreshIndicator: import("@xh/hoist/core").ElementFactory<import("@xh/hoist/core").DefaultHoistProps<SwiperModel>>;

package/build/types/mobile/cmp/navigator/impl/swipe/Swiper.d.ts

@@ -1,8 +0,0 @@
-import './Swiper.scss';
-import { SwiperModel } from './SwiperModel';
-/**
- * Wrap the Onsen Navigator with drag gesture handling.
- *
- * @internal
- */
-export declare const swiper: import("@xh/hoist/core").ElementFactory<import("@xh/hoist/core").DefaultHoistProps<SwiperModel>>;

package/mobile/cmp/navigator/impl/swipe/BackIndicator.ts

@@ -1,34 +0,0 @@
-/*
- * This file belongs to Hoist, an application development toolkit
- * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
- *
- * Copyright © 2025 Extremely Heavy Industries Inc.
- */
-import {div} from '@xh/hoist/cmp/layout';
-import {hoistCmp} from '@xh/hoist/core';
-import {Icon} from '@xh/hoist/icon';
-import classNames from 'classnames';
-import {SwiperModel} from './SwiperModel';
-
-/**
- * Indicator for the swipeToGoBack affordance
- * @internal
- */
-export const backIndicator = hoistCmp.factory<SwiperModel>(({model}) => {
-    const {backStarted, backProgress, backCompleted} = model,
-        left = -40 + backProgress * 60,
-        className = classNames(
-            'xh-swiper-indicator',
-            backCompleted ? 'xh-swiper-indicator--complete' : null,
-            backStarted ? 'xh-swiper-indicator--started' : null
-        );
-    return div({
-        className,
-        style: {
-            top: '50%',
-            left,
-            transform: `translateY(-50%)`
-        },
-        item: Icon.chevronLeft()
-    });
-});

package/mobile/cmp/navigator/impl/swipe/RefreshIndicator.ts

@@ -1,36 +0,0 @@
-/*
- * This file belongs to Hoist, an application development toolkit
- * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
- *
- * Copyright © 2025 Extremely Heavy Industries Inc.
- */
-import {div} from '@xh/hoist/cmp/layout';
-import {hoistCmp} from '@xh/hoist/core';
-import {Icon} from '@xh/hoist/icon';
-import classNames from 'classnames';
-import {SwiperModel} from './SwiperModel';
-
-/**
- * Indicator for the pulldownToRefresh affordance
- * @internal
- */
-export const refreshIndicator = hoistCmp.factory<SwiperModel>(({model}) => {
-    const {refreshStarted, refreshProgress, refreshCompleted} = model,
-        top = -40 + refreshProgress * 85,
-        degrees = Math.floor(refreshProgress * 360),
-        className = classNames(
-            'xh-swiper-indicator',
-            refreshCompleted ? 'xh-swiper-indicator--complete' : null,
-            refreshStarted ? 'xh-swiper-indicator--started' : null
-        );
-
-    return div({
-        className,
-        style: {
-            top,
-            left: '50%',
-            transform: `translateX(-50%) rotate(${degrees}deg)`
-        },
-        item: Icon.refresh()
-    });
-});

package/mobile/cmp/navigator/impl/swipe/Swiper.ts

@@ -1,35 +0,0 @@
-/*
- * This file belongs to Hoist, an application development toolkit
- * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
- *
- * Copyright © 2025 Extremely Heavy Industries Inc.
- */
-import {frame} from '@xh/hoist/cmp/layout';
-import {creates, hoistCmp} from '@xh/hoist/core';
-import {gestureDetector} from '@xh/hoist/kit/onsen';
-import {backIndicator} from './BackIndicator';
-import {refreshIndicator} from './RefreshIndicator';
-import './Swiper.scss';
-import {SwiperModel} from './SwiperModel';
-
-/**
- * Wrap the Onsen Navigator with drag gesture handling.
- *
- * @internal
- */
-export const swiper = hoistCmp.factory({
-    model: creates(SwiperModel),
-
-    render({model, children}) {
-        return frame(
-            refreshIndicator(),
-            backIndicator(),
-            gestureDetector({
-                onDragStart: model.onDragStart,
-                onDrag: model.onDrag,
-                onDragEnd: model.onDragEnd,
-                item: children
-            })
-        );
-    }
-});

package/mobile/cmp/navigator/impl/swipe/SwiperModel.ts

@@ -1,153 +0,0 @@
-/*
- * This file belongs to Hoist, an application development toolkit
- * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
- *
- * Copyright © 2025 Extremely Heavy Industries Inc.
- */
-import {HoistModel, lookup, XH} from '@xh/hoist/core';
-import {action, computed, makeObservable, observable} from '@xh/hoist/mobx';
-import {consumeEvent} from '@xh/hoist/utils/js';
-import {isFinite, clamp} from 'lodash';
-import {NavigatorModel} from '../../NavigatorModel';
-
-import './Swiper.scss';
-
-/**
- * @internal
- */
-export class SwiperModel extends HoistModel {
-    @lookup(NavigatorModel) navigatorModel;
-
-    @observable backProgress = null;
-    @observable refreshProgress = null;
-
-    @computed get backStarted() {
-        return isFinite(this.backProgress);
-    }
-    @computed get backCompleted() {
-        return this.backProgress === 1;
-    }
-    @action backStart() {
-        this.backProgress = 0;
-    }
-    @action backEnd() {
-        this.backProgress = null;
-    }
-
-    @computed get refreshStarted() {
-        return isFinite(this.refreshProgress);
-    }
-    @computed get refreshCompleted() {
-        return this.refreshProgress === 1;
-    }
-    @action refreshStart() {
-        this.refreshProgress = 0;
-    }
-    @action refreshEnd() {
-        this.refreshProgress = null;
-    }
-
-    constructor() {
-        super();
-        makeObservable(this);
-    }
-
-    @action
-    onDragStart = e => {
-        const {navigatorModel} = this,
-            {direction} = e.gesture;
-
-        this.refreshEnd();
-        this.backEnd();
-
-        // Back
-        // Check we have a page to nav to and avoid conflict with browser back
-        if (
-            direction === 'right' &&
-            navigatorModel.swipeToGoBack &&
-            navigatorModel.stack.length >= 2 &&
-            e.gesture.startEvent.center.pageX > 20 &&
-            !this.isDraggingChild(e, 'right')
-        ) {
-            this.backStart();
-            consumeEvent(e);
-            return;
-        }
-
-        // Refresh
-        if (
-            direction === 'down' &&
-            navigatorModel.pullDownToRefresh &&
-            !this.isDraggingChild(e, 'down')
-        ) {
-            this.refreshStart();
-            consumeEvent(e);
-            return;
-        }
-    };
-
-    @action
-    onDrag = e => {
-        const {direction, deltaX, deltaY} = e.gesture;
-
-        // For either gesture we set normalised progress based on distance dragged, or kill it
-
-        // Back
-        if (this.backStarted) {
-            if (direction !== 'right') {
-                this.backEnd();
-                return;
-            }
-            this.backProgress = clamp(deltaX / 150, 0, 1);
-            consumeEvent(e);
-            return;
-        }
-
-        // Refresh
-        if (this.refreshStarted) {
-            if (direction !== 'down') {
-                this.refreshEnd();
-                return;
-            }
-            this.refreshProgress = clamp(deltaY / 150, 0, 1);
-            consumeEvent(e);
-            return;
-        }
-    };
-
-    @action
-    onDragEnd = e => {
-        // Back
-        if (this.backStarted) {
-            if (this.backCompleted) XH.popRoute();
-            this.backEnd();
-            consumeEvent(e);
-        }
-
-        // Refresh
-        if (this.refreshStarted) {
-            if (this.refreshCompleted) XH.refreshAppAsync();
-            this.refreshEnd();
-            consumeEvent(e);
-        }
-    };
-
-    isDraggingChild(e, dir) {
-        // Loop through the touch targets to ensure it is safe to swipe
-        for (let el = e.target; el && el !== document.body; el = el.parentNode) {
-            // Don't conflict with grid header reordering or chart dragging.
-            if (el.classList.contains('xh-grid-header') || el.classList.contains('xh-chart')) {
-                return true;
-            }
-
-            // Ensure any scrolling element in the target path takes priority over swipe navigation.
-            if (
-                (dir === 'right' && el.scrollWidth > el.offsetWidth && el.scrollLeft > 0) ||
-                (dir === 'down' && el.scrollHeight > el.offsetHeight && el.scrollTop > 0)
-            ) {
-                return true;
-            }
-        }
-        return false;
-    }
-}