@selfcommunity/react-ui 0.2.7-alpha.1 → 0.2.8-alpha.1

package/lib/esm/shared/InfiniteScroll/index.d.ts

@@ -0,0 +1,65 @@
+import { Component, ReactNode, CSSProperties } from 'react';
+declare type Fn = () => any;
+export interface Props {
+    next?: Fn;
+    hasMoreNext?: boolean;
+    previous?: Fn;
+    hasMorePrevious?: boolean;
+    children: ReactNode;
+    loaderNext?: ReactNode;
+    loaderPrevious?: ReactNode;
+    scrollThreshold?: number | string;
+    endMessage?: ReactNode;
+    style?: CSSProperties;
+    height?: number | string;
+    scrollableTarget?: ReactNode;
+    hasChildren?: boolean;
+    pullDownToRefresh?: boolean;
+    pullDownToRefreshContent?: ReactNode;
+    releaseToRefreshContent?: ReactNode;
+    pullDownToRefreshThreshold?: number;
+    refreshFunction?: Fn;
+    onScroll?: (e: MouseEvent) => any;
+    dataLength: number;
+    initialScrollY?: number;
+    className?: string;
+}
+interface State {
+    showLoaderNext: boolean;
+    showLoaderPrevious: boolean;
+    pullToRefreshThresholdBreached: boolean;
+    prevDataLength: number | undefined;
+}
+export default class InfiniteScroll extends Component<Props, State> {
+    constructor(props: Props);
+    private throttledOnScrollListener;
+    private _scrollableNode;
+    private el;
+    private _infScroll;
+    private lastScrollTop;
+    private actionTriggered;
+    private _pullDown;
+    private startY;
+    private currentY;
+    private dragging;
+    private maxPullDownDistance;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    componentDidUpdate(prevProps: Props): void;
+    static getDerivedStateFromProps(nextProps: Props, prevState: State): {
+        prevDataLength: number;
+        showLoaderNext: boolean;
+        showLoaderPrevious: boolean;
+        pullToRefreshThresholdBreached: boolean;
+    };
+    getScrollableTarget: () => HTMLElement;
+    onStart: EventListener;
+    onMove: EventListener;
+    onEnd: EventListener;
+    isElementAtTop(target: HTMLElement, scrollThreshold?: string | number): boolean;
+    isElementAtBottom(target: HTMLElement, scrollThreshold?: string | number): boolean;
+    onScrollListener: (event: MouseEvent) => void;
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/esm/shared/InfiniteScroll/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/shared/InfiniteScroll/index.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,SAAS,EAAE,SAAS,EAAE,aAAa,EAAC,MAAM,OAAO,CAAC;AAIjE,aAAK,EAAE,GAAG,MAAM,GAAG,CAAC;AACpB,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,EAAE,CAAC;IACV,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,EAAE,CAAC;IACd,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,wBAAwB,CAAC,EAAE,SAAS,CAAC;IACrC,uBAAuB,CAAC,EAAE,SAAS,CAAC;IACpC,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,eAAe,CAAC,EAAE,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,GAAG,CAAC;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,KAAK;IACb,cAAc,EAAE,OAAO,CAAC;IACxB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,8BAA8B,EAAE,OAAO,CAAC;IACxC,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC;AAED,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;gBACrD,KAAK,EAAE,KAAK;IAgBxB,OAAO,CAAC,yBAAyB,CAA0B;IAC3D,OAAO,CAAC,eAAe,CAAiC;IACxD,OAAO,CAAC,EAAE,CAAyD;IACnE,OAAO,CAAC,UAAU,CAA6B;IAC/C,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,eAAe,CAAS;IAChC,OAAO,CAAC,SAAS,CAA6B;IAG9C,OAAO,CAAC,MAAM,CAAK;IACnB,OAAO,CAAC,QAAQ,CAAK;IACrB,OAAO,CAAC,QAAQ,CAAS;IAIzB,OAAO,CAAC,mBAAmB,CAAK;IAEhC,iBAAiB;IA6CjB,oBAAoB;IAgBpB,kBAAkB,CAAC,SAAS,EAAE,KAAK;IAanC,MAAM,CAAC,wBAAwB,CAAC,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK;;;;;;IAalE,mBAAmB,oBAYjB;IAEF,OAAO,EAAE,aAAa,CAgBpB;IAEF,MAAM,EAAE,aAAa,CAyBnB;IAEF,KAAK,EAAE,aAAa,CAqBlB;IAEF,cAAc,CAAC,MAAM,EAAE,WAAW,EAAE,eAAe,GAAE,MAAM,GAAG,MAAY;IAgB1E,iBAAiB,CAAC,MAAM,EAAE,WAAW,EAAE,eAAe,GAAE,MAAM,GAAG,MAAY;IAY7E,gBAAgB,UAAW,UAAU,UAoCnC;IAEF,MAAM;CAwCP"}

package/lib/esm/shared/InfiniteScroll/index.js

@@ -0,0 +1,238 @@
+import React, { Component } from 'react';
+import { throttle } from 'throttle-debounce';
+import { ThresholdUnits, parseThreshold } from '../../utils/threshold';
+export default class InfiniteScroll extends Component {
+    constructor(props) {
+        super(props);
+        this.lastScrollTop = 0;
+        this.actionTriggered = false;
+        // variables to keep track of pull down behaviour
+        this.startY = 0;
+        this.currentY = 0;
+        this.dragging = false;
+        // will be populated in componentDidMount
+        // based on the height of the pull down element
+        this.maxPullDownDistance = 0;
+        this.getScrollableTarget = () => {
+            if (this.props.scrollableTarget instanceof HTMLElement)
+                return this.props.scrollableTarget;
+            if (typeof this.props.scrollableTarget === 'string') {
+                return document.getElementById(this.props.scrollableTarget);
+            }
+            if (this.props.scrollableTarget === null) {
+                console.warn(`You are trying to pass scrollableTarget but it is null. This might
+        happen because the element may not have been added to DOM yet.
+        See https://github.com/ankeetmaini/react-infinite-scroll-component/issues/59 for more info.
+      `);
+            }
+            return null;
+        };
+        this.onStart = (evt) => {
+            if (this.lastScrollTop)
+                return;
+            this.dragging = true;
+            if (evt instanceof MouseEvent) {
+                this.startY = evt.pageY;
+            }
+            else if (evt instanceof TouchEvent) {
+                this.startY = evt.touches[0].pageY;
+            }
+            this.currentY = this.startY;
+            if (this._infScroll) {
+                this._infScroll.style.willChange = 'transform';
+                this._infScroll.style.transition = `transform 0.2s cubic-bezier(0,0,0.31,1)`;
+            }
+        };
+        this.onMove = (evt) => {
+            if (!this.dragging)
+                return;
+            if (evt instanceof MouseEvent) {
+                this.currentY = evt.pageY;
+            }
+            else if (evt instanceof TouchEvent) {
+                this.currentY = evt.touches[0].pageY;
+            }
+            // user is scrolling down to up
+            if (this.currentY < this.startY)
+                return;
+            if (this.currentY - this.startY >= Number(this.props.pullDownToRefreshThreshold)) {
+                this.setState({
+                    pullToRefreshThresholdBreached: true
+                });
+            }
+            // so you can drag upto 1.5 times of the maxPullDownDistance
+            if (this.currentY - this.startY > this.maxPullDownDistance * 1.5)
+                return;
+            if (this._infScroll) {
+                this._infScroll.style.overflow = 'visible';
+                this._infScroll.style.transform = `translate3d(0px, ${this.currentY - this.startY}px, 0px)`;
+            }
+        };
+        this.onEnd = () => {
+            this.startY = 0;
+            this.currentY = 0;
+            this.dragging = false;
+            if (this.state.pullToRefreshThresholdBreached) {
+                this.props.refreshFunction && this.props.refreshFunction();
+                this.setState({
+                    pullToRefreshThresholdBreached: false
+                });
+            }
+            requestAnimationFrame(() => {
+                // this._infScroll
+                if (this._infScroll) {
+                    this._infScroll.style.overflow = 'auto';
+                    this._infScroll.style.transform = 'none';
+                    this._infScroll.style.willChange = 'unset';
+                }
+            });
+        };
+        this.onScrollListener = (event) => {
+            if (typeof this.props.onScroll === 'function') {
+                // Execute this callback in next tick so that it does not affect the
+                // functionality of the library.
+                setTimeout(() => this.props.onScroll && this.props.onScroll(event), 0);
+            }
+            const target = this.props.height || this._scrollableNode
+                ? event.target
+                : document.documentElement.scrollTop
+                    ? document.documentElement
+                    : document.body;
+            // return immediately if the action has already been triggered,
+            // prevents multiple triggers.
+            if (this.actionTriggered)
+                return;
+            const atBottom = this.isElementAtBottom(target, this.props.scrollThreshold);
+            const atTop = this.isElementAtTop(target, this.props.scrollThreshold);
+            // call the `next` function in the props to trigger the next data fetch
+            if (atBottom && this.props.hasMoreNext) {
+                this.actionTriggered = true;
+                this.setState({ showLoaderNext: true });
+                this.props.next && this.props.next();
+            }
+            // call the `next` function in the props to trigger the next data fetch
+            if (atTop && this.props.hasMorePrevious) {
+                this.actionTriggered = true;
+                this.setState({ showLoaderPrevious: true });
+                this.props.previous && this.props.previous();
+            }
+            this.lastScrollTop = target.scrollTop;
+        };
+        this.state = {
+            showLoaderNext: false,
+            showLoaderPrevious: false,
+            pullToRefreshThresholdBreached: false,
+            prevDataLength: props.dataLength
+        };
+        this.throttledOnScrollListener = throttle(150, this.onScrollListener).bind(this);
+        this.onStart = this.onStart.bind(this);
+        this.onMove = this.onMove.bind(this);
+        this.onEnd = this.onEnd.bind(this);
+    }
+    componentDidMount() {
+        if (typeof this.props.dataLength === 'undefined') {
+            throw new Error(`mandatory prop "dataLength" is missing. The prop is needed` + ` when loading more content. Check README.md for usage`);
+        }
+        this._scrollableNode = this.getScrollableTarget();
+        this.el = this.props.height ? this._infScroll : this._scrollableNode || window;
+        if (this.el) {
+            this.el.addEventListener('scroll', this.throttledOnScrollListener);
+        }
+        if (typeof this.props.initialScrollY === 'number' &&
+            this.el &&
+            this.el instanceof HTMLElement &&
+            this.el.scrollHeight > this.props.initialScrollY) {
+            this.el.scrollTo(0, this.props.initialScrollY);
+        }
+        if (this.props.pullDownToRefresh && this.el) {
+            this.el.addEventListener('touchstart', this.onStart);
+            this.el.addEventListener('touchmove', this.onMove);
+            this.el.addEventListener('touchend', this.onEnd);
+            this.el.addEventListener('mousedown', this.onStart);
+            this.el.addEventListener('mousemove', this.onMove);
+            this.el.addEventListener('mouseup', this.onEnd);
+            // get BCR of pullDown element to position it above
+            this.maxPullDownDistance =
+                (this._pullDown && this._pullDown.firstChild && this._pullDown.firstChild.getBoundingClientRect().height) || 0;
+            this.forceUpdate();
+            if (typeof this.props.refreshFunction !== 'function') {
+                throw new Error(`Mandatory prop "refreshFunction" missing.
+          Pull Down To Refresh functionality will not work
+          as expected. Check README.md for usage'`);
+            }
+        }
+    }
+    componentWillUnmount() {
+        if (this.el) {
+            this.el.removeEventListener('scroll', this.throttledOnScrollListener);
+            if (this.props.pullDownToRefresh) {
+                this.el.removeEventListener('touchstart', this.onStart);
+                this.el.removeEventListener('touchmove', this.onMove);
+                this.el.removeEventListener('touchend', this.onEnd);
+                this.el.removeEventListener('mousedown', this.onStart);
+                this.el.removeEventListener('mousemove', this.onMove);
+                this.el.removeEventListener('mouseup', this.onEnd);
+            }
+        }
+    }
+    componentDidUpdate(prevProps) {
+        // do nothing when dataLength is unchanged
+        if (this.props.dataLength === prevProps.dataLength)
+            return;
+        this.actionTriggered = false;
+        // update state when new data was sent in
+        this.setState({
+            showLoaderPrevious: false,
+            showLoaderNext: false
+        });
+    }
+    static getDerivedStateFromProps(nextProps, prevState) {
+        const dataLengthChanged = nextProps.dataLength !== prevState.prevDataLength;
+        // reset when data changes
+        if (dataLengthChanged) {
+            return Object.assign(Object.assign({}, prevState), { prevDataLength: nextProps.dataLength });
+        }
+        return null;
+    }
+    isElementAtTop(target, scrollThreshold = 0.8) {
+        const clientHeight = target === document.body || target === document.documentElement ? window.screen.availHeight : target.clientHeight;
+        const threshold = parseThreshold(scrollThreshold);
+        if (threshold.unit === ThresholdUnits.Pixel) {
+            // return target.scrollTop <= threshold.value + clientHeight - target.scrollHeight + 1;
+            return (target.scrollTop <= threshold.value &&
+                Math.abs(this.lastScrollTop - target.scrollTop) >= threshold.value / 3 &&
+                target.scrollTop < this.lastScrollTop);
+        }
+        return target.scrollTop <= threshold.value / 100 + clientHeight && target.scrollTop < this.lastScrollTop;
+    }
+    isElementAtBottom(target, scrollThreshold = 0.8) {
+        const clientHeight = target === document.body || target === document.documentElement ? window.screen.availHeight : target.clientHeight;
+        const threshold = parseThreshold(scrollThreshold);
+        if (threshold.unit === ThresholdUnits.Pixel) {
+            return target.scrollTop + clientHeight >= target.scrollHeight - threshold.value;
+        }
+        return target.scrollTop + clientHeight >= (threshold.value / 100) * target.scrollHeight;
+    }
+    render() {
+        const style = Object.assign({ height: this.props.height || 'auto', overflow: 'auto', WebkitOverflowScrolling: 'touch' }, this.props.style);
+        const hasChildren = this.props.hasChildren || !!(this.props.children && this.props.children instanceof Array && this.props.children.length);
+        // because heighted infiniteScroll visualy breaks
+        // on drag down as overflow becomes visible
+        const outerDivStyle = this.props.pullDownToRefresh && this.props.height ? { overflow: 'auto' } : {};
+        return (React.createElement("div", { style: outerDivStyle, className: "infinite-scroll-component__outerdiv" },
+            React.createElement("div", { className: `infinite-scroll-component ${this.props.className || ''}`, ref: (infScroll) => (this._infScroll = infScroll), style: style },
+                this.props.pullDownToRefresh && (React.createElement("div", { style: { position: 'relative' }, ref: (pullDown) => (this._pullDown = pullDown) },
+                    React.createElement("div", { style: {
+                            position: 'absolute',
+                            left: 0,
+                            right: 0,
+                            top: -1 * this.maxPullDownDistance
+                        } }, this.state.pullToRefreshThresholdBreached ? this.props.releaseToRefreshContent : this.props.pullDownToRefreshContent))),
+                this.state.showLoaderPrevious && this.props.hasMorePrevious && this.props.loaderPrevious,
+                this.props.children,
+                !this.state.showLoaderNext && !hasChildren && this.props.hasMoreNext && this.props.loaderNext,
+                this.state.showLoaderNext && this.props.hasMoreNext && this.props.loaderNext,
+                !this.props.hasMoreNext && this.props.endMessage)));
+    }
+}
+//# sourceMappingURL=index.js.map

package/lib/esm/shared/InfiniteScroll/index.js.map

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

package/lib/esm/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export default class App extends React.Component {
+    state: {
+        items: unknown[];
+        hasMore: boolean;
+    };
+    fetchMoreData: () => void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=InfiniteScrollWithHeight.d.ts.map

package/lib/esm/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfiniteScrollWithHeight.d.ts","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAC9C,KAAK;;;MAGH;IAEF,aAAa,aAYX;IAEF,MAAM;CAyBP"}

package/lib/esm/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import { render } from 'react-dom';
+import InfiniteScroll from '../index';
+const style = {
+    height: 30,
+    border: '1px solid green',
+    margin: 6,
+    padding: 8
+};
+export default class App extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            items: Array.from({ length: 20 }),
+            hasMore: true
+        };
+        this.fetchMoreData = () => {
+            if (this.state.items.length >= 500) {
+                this.setState({ hasMore: false });
+                return;
+            }
+            // a fake async api call like which sends
+            // 20 more records in .5 secs
+            setTimeout(() => {
+                this.setState({
+                    items: this.state.items.concat(Array.from({ length: 20 }))
+                });
+            }, 500);
+        };
+    }
+    render() {
+        return (React.createElement("div", null,
+            React.createElement("h1", null, "demo: Infinite Scroll with fixed height"),
+            React.createElement("hr", null),
+            React.createElement(InfiniteScroll, { dataLength: this.state.items.length, next: this.fetchMoreData, hasMoreNext: this.state.hasMore, loaderNext: React.createElement("h4", null, "Loading..."), height: 400, endMessage: React.createElement("p", { style: { textAlign: 'center' } },
+                    React.createElement("b", null, "Yay! You have seen it all")) }, this.state.items.map((_, index) => (React.createElement("div", { style: style, key: index },
+                "div - #",
+                index))))));
+    }
+}
+render(React.createElement(App, null), document.getElementById('root'));
+//# sourceMappingURL=InfiniteScrollWithHeight.js.map

package/lib/esm/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfiniteScrollWithHeight.js","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/InfiniteScrollWithHeight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAC;AACjC,OAAO,cAAc,MAAM,UAAU,CAAC;AAEtC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,EAAE;IACV,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAAhD;;QACE,UAAK,GAAG;YACN,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC;YAC/B,OAAO,EAAE,IAAI;SACd,CAAC;QAEF,kBAAa,GAAG,GAAG,EAAE;YACnB,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,IAAI,GAAG,EAAE;gBAClC,IAAI,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAE,KAAK,EAAC,CAAC,CAAC;gBAChC,OAAO;aACR;YACD,yCAAyC;YACzC,6BAA6B;YAC7B,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC,CAAC;iBACzD,CAAC,CAAC;YACL,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC,CAAC;IA2BJ,CAAC;IAzBC,MAAM;QACJ,OAAO,CACL;YACE,0EAAgD;YAChD,+BAAM;YACN,oBAAC,cAAc,IACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EACnC,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,WAAW,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAC/B,UAAU,EAAE,6CAAmB,EAC/B,MAAM,EAAE,GAAG,EACX,UAAU,EACR,2BAAG,KAAK,EAAE,EAAC,SAAS,EAAE,QAAQ,EAAC;oBAC7B,2DAAgC,CAC9B,IAEL,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,6BAAK,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK;;gBACnB,KAAK,CACT,CACP,CAAC,CACa,CACb,CACP,CAAC;IACJ,CAAC;CACF;AAED,MAAM,CAAC,oBAAC,GAAG,OAAG,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC"}

package/lib/esm/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export default class App extends React.Component {
+    state: {
+        items: unknown[];
+    };
+    fetchMoreData: () => void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=PullDownToRefreshInfScroll.d.ts.map

package/lib/esm/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullDownToRefreshInfScroll.d.ts","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAC9C,KAAK;;MAEH;IAEF,aAAa,aAQX;IAEF,MAAM;CAuBP"}

package/lib/esm/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { render } from 'react-dom';
+import InfiniteScroll from '../index';
+const style = {
+    height: 30,
+    border: '1px solid green',
+    margin: 6,
+    padding: 8
+};
+export default class App extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            items: Array.from({ length: 20 })
+        };
+        this.fetchMoreData = () => {
+            // a fake async api call like which sends
+            // 20 more records in 1.5 secs
+            setTimeout(() => {
+                this.setState({
+                    items: this.state.items.concat(Array.from({ length: 20 }))
+                });
+            }, 1500);
+        };
+    }
+    render() {
+        return (React.createElement("div", null,
+            React.createElement("h1", null, "demo: Pull down to refresh"),
+            React.createElement("hr", null),
+            React.createElement(InfiniteScroll, { dataLength: this.state.items.length, hasMoreNext: true, next: this.fetchMoreData, loaderNext: React.createElement("h4", null, "Loading..."), pullDownToRefresh: true, pullDownToRefreshContent: React.createElement("h3", { style: { textAlign: 'center' } }, "\u2193 Pull down to refresh"), releaseToRefreshContent: React.createElement("h3", { style: { textAlign: 'center' } }, "\u2191 Release to refresh"), refreshFunction: this.fetchMoreData }, this.state.items.map((_, index) => (React.createElement("div", { style: style, key: index },
+                "div - #",
+                index))))));
+    }
+}
+render(React.createElement(App, null), document.getElementById('root'));
+//# sourceMappingURL=PullDownToRefreshInfScroll.js.map

package/lib/esm/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullDownToRefreshInfScroll.js","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/PullDownToRefreshInfScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAC;AACjC,OAAO,cAAc,MAAM,UAAU,CAAC;AAEtC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,EAAE;IACV,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAAhD;;QACE,UAAK,GAAG;YACN,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC;SAChC,CAAC;QAEF,kBAAa,GAAG,GAAG,EAAE;YACnB,yCAAyC;YACzC,8BAA8B;YAC9B,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC,CAAC;iBACzD,CAAC,CAAC;YACL,CAAC,EAAE,IAAI,CAAC,CAAC;QACX,CAAC,CAAC;IAyBJ,CAAC;IAvBC,MAAM;QACJ,OAAO,CACL;YACE,6DAAmC;YACnC,+BAAM;YACN,oBAAC,cAAc,IACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EACnC,WAAW,EAAE,IAAI,EACjB,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,UAAU,EAAE,6CAAmB,EAC/B,iBAAiB,QACjB,wBAAwB,EAAE,4BAAI,KAAK,EAAE,EAAC,SAAS,EAAE,QAAQ,EAAC,kCAAmC,EAC7F,uBAAuB,EAAE,4BAAI,KAAK,EAAE,EAAC,SAAS,EAAE,QAAQ,EAAC,gCAAiC,EAC1F,eAAe,EAAE,IAAI,CAAC,aAAa,IAClC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,6BAAK,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK;;gBACnB,KAAK,CACT,CACP,CAAC,CACa,CACb,CACP,CAAC;IACJ,CAAC;CACF;AAED,MAAM,CAAC,oBAAC,GAAG,OAAG,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC"}

package/lib/esm/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export default class App extends React.Component {
+    state: {
+        items: unknown[];
+    };
+    fetchMoreData: () => void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=ScrollableTargetInfScroll.d.ts.map

package/lib/esm/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollableTargetInfScroll.d.ts","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAC9C,KAAK;;MAEH;IAEF,aAAa,aAQX;IAEF,MAAM;CAsBP"}

package/lib/esm/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import { render } from 'react-dom';
+import InfiniteScroll from '../index';
+const style = {
+    height: 30,
+    border: '1px solid green',
+    margin: 6,
+    padding: 8
+};
+export default class App extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            items: Array.from({ length: 20 })
+        };
+        this.fetchMoreData = () => {
+            // a fake async api call like which sends
+            // 20 more records in 1.5 secs
+            setTimeout(() => {
+                this.setState({
+                    items: this.state.items.concat(Array.from({ length: 20 }))
+                });
+            }, 1500);
+        };
+    }
+    render() {
+        return (React.createElement("div", null,
+            React.createElement("h1", null, "demo: Infinite Scroll with scrollable target"),
+            React.createElement("hr", null),
+            React.createElement("div", { id: "scrollableDiv", style: { height: 300, overflow: 'auto' } },
+                React.createElement(InfiniteScroll, { dataLength: this.state.items.length, hasMoreNext: true, next: this.fetchMoreData, loaderNext: React.createElement("h4", null, "Loading..."), scrollableTarget: "scrollableDiv" }, this.state.items.map((_, index) => (React.createElement("div", { style: style, key: index },
+                    "div - #",
+                    index)))))));
+    }
+}
+render(React.createElement(App, null), document.getElementById('root'));
+//# sourceMappingURL=ScrollableTargetInfScroll.js.map

package/lib/esm/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollableTargetInfScroll.js","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/ScrollableTargetInfScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAC;AACjC,OAAO,cAAc,MAAM,UAAU,CAAC;AAEtC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,EAAE;IACV,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAAhD;;QACE,UAAK,GAAG;YACN,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC;SAChC,CAAC;QAEF,kBAAa,GAAG,GAAG,EAAE;YACnB,yCAAyC;YACzC,8BAA8B;YAC9B,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC,CAAC;iBACzD,CAAC,CAAC;YACL,CAAC,EAAE,IAAI,CAAC,CAAC;QACX,CAAC,CAAC;IAwBJ,CAAC;IAtBC,MAAM;QACJ,OAAO,CACL;YACE,+EAAqD;YACrD,+BAAM;YACN,6BAAK,EAAE,EAAC,eAAe,EAAC,KAAK,EAAE,EAAC,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAC;gBAC5D,oBAAC,cAAc,IACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EACnC,WAAW,EAAE,IAAI,EACjB,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,UAAU,EAAE,6CAAmB,EAC/B,gBAAgB,EAAC,eAAe,IAC/B,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,6BAAK,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK;;oBACnB,KAAK,CACT,CACP,CAAC,CACa,CACb,CACF,CACP,CAAC;IACJ,CAAC;CACF;AAED,MAAM,CAAC,oBAAC,GAAG,OAAG,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC"}

package/lib/esm/shared/InfiniteScroll/stories/ScrolleableTop.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export default class App extends React.Component {
+    state: {
+        items: unknown[];
+    };
+    fetchMoreData: () => void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=ScrolleableTop.d.ts.map

package/lib/esm/shared/InfiniteScroll/stories/ScrolleableTop.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrolleableTop.d.ts","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/ScrolleableTop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAC9C,KAAK;;MAEH;IAEF,aAAa,aAQX;IAEF,MAAM;CA4BP"}

package/lib/esm/shared/InfiniteScroll/stories/ScrolleableTop.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import { render } from 'react-dom';
+import InfiniteScroll from '../index';
+const style = {
+    height: 30,
+    border: '1px solid green',
+    margin: 6,
+    padding: 8
+};
+export default class App extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            items: Array.from({ length: 20 })
+        };
+        this.fetchMoreData = () => {
+            // a fake async api call like which sends
+            // 20 more records in 1.5 secs
+            setTimeout(() => {
+                this.setState({
+                    items: this.state.items.concat(Array.from({ length: 20 }))
+                });
+            }, 500);
+        };
+    }
+    render() {
+        return (React.createElement("div", null,
+            React.createElement("h1", null, "demo: Infinite Scroll on top"),
+            React.createElement("hr", null),
+            React.createElement("div", { id: "scrollableDiv", style: {
+                    height: 300,
+                    overflow: 'auto'
+                } },
+                React.createElement(InfiniteScroll, { dataLength: this.state.items.length, previous: this.fetchMoreData, hasMorePrevious: true, loaderPrevious: React.createElement("h4", null, "Loading prev..."), scrollableTarget: "scrollableDiv", scrollThreshold: '0px' }, this.state.items.map((_, index) => (React.createElement("div", { style: style, key: index },
+                    "div - #",
+                    index)))))));
+    }
+}
+render(React.createElement(App, null), document.getElementById('root'));
+//# sourceMappingURL=ScrolleableTop.js.map

package/lib/esm/shared/InfiniteScroll/stories/ScrolleableTop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrolleableTop.js","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/ScrolleableTop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAC;AACjC,OAAO,cAAc,MAAM,UAAU,CAAC;AAEtC,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,EAAE;IACV,MAAM,EAAE,iBAAiB;IACzB,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,KAAK,CAAC,SAAS;IAAhD;;QACE,UAAK,GAAG;YACN,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC;SAChC,CAAC;QAEF,kBAAa,GAAG,GAAG,EAAE;YACnB,yCAAyC;YACzC,8BAA8B;YAC9B,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,CAAC,CAAC;iBACzD,CAAC,CAAC;YACL,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC,CAAC;IA8BJ,CAAC;IA5BC,MAAM;QACJ,OAAO,CACL;YACE,+DAAqC;YACrC,+BAAM;YACN,6BACE,EAAE,EAAC,eAAe,EAClB,KAAK,EAAE;oBACL,MAAM,EAAE,GAAG;oBACX,QAAQ,EAAE,MAAM;iBACjB;gBACD,oBAAC,cAAc,IACb,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EACnC,QAAQ,EAAE,IAAI,CAAC,aAAa,EAC5B,eAAe,EAAE,IAAI,EACrB,cAAc,EAAE,kDAAwB,EACxC,gBAAgB,EAAC,eAAe,EAChC,eAAe,EAAE,KAAK,IACrB,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAClC,6BAAK,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK;;oBACnB,KAAK,CACT,CACP,CAAC,CACa,CACb,CACF,CACP,CAAC;IACJ,CAAC;CACF;AAED,MAAM,CAAC,oBAAC,GAAG,OAAG,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC"}

package/lib/esm/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+declare type State = {
+    data: number[];
+};
+export default class WindowInfiniteScrollComponent extends React.Component<{}, State> {
+    state: {
+        data: number[];
+    };
+    next: () => void;
+    previous: () => void;
+    render(): JSX.Element;
+}
+export {};
+//# sourceMappingURL=WindowInfiniteScrollComponent.d.ts.map

package/lib/esm/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WindowInfiniteScrollComponent.d.ts","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,aAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,EAAE,CAAC;CAChB,CAAC;AACF,MAAM,CAAC,OAAO,OAAO,6BAA8B,SAAQ,KAAK,CAAC,SAAS,CAAC,EAAE,EAAE,KAAK,CAAC;IACnF,KAAK;;MAEH;IAEF,IAAI,aAMF;IAEF,QAAQ,aAWN;IAEF,MAAM;CAqBP"}

package/lib/esm/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import InfiniteScroll from '../index';
+export default class WindowInfiniteScrollComponent extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            data: Array.from({ length: 30 }, (_, i) => i)
+        };
+        this.next = () => {
+            setTimeout(() => {
+                const currentLength = this.state.data.length;
+                const newData = [...this.state.data, ...Array.from({ length: 5 }, (_, i) => i).map((i) => i + currentLength)];
+                this.setState({ data: newData });
+            }, 500);
+        };
+        this.previous = () => {
+            setTimeout(() => {
+                const currentLength = this.state.data[0];
+                const newData = [
+                    ...Array.from({ length: 5 }, (_, i) => i)
+                        .map((i) => i * -1 + currentLength - 1)
+                        .reverse(),
+                    ...this.state.data
+                ];
+                this.setState({ data: newData });
+            }, 500);
+        };
+    }
+    render() {
+        return (React.createElement(React.Fragment, null,
+            React.createElement(InfiniteScroll, { hasMoreNext: true, next: this.next, hasMorePrevious: true, previous: this.previous, loaderNext: React.createElement("h1", null, "Loading next..."), loaderPrevious: React.createElement("h1", null, "Loading prev..."), dataLength: this.state.data.length, scrollThreshold: 1 }, this.state.data.map((e) => (React.createElement("div", { key: e, style: { height: 200, margin: 4, border: '1px solid hotpink' } },
+                "#",
+                e,
+                " row"))))));
+    }
+}
+//# sourceMappingURL=WindowInfiniteScrollComponent.js.map

package/lib/esm/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WindowInfiniteScrollComponent.js","sourceRoot":"","sources":["../../../../../src/shared/InfiniteScroll/stories/WindowInfiniteScrollComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,cAAc,MAAM,UAAU,CAAC;AAItC,MAAM,CAAC,OAAO,OAAO,6BAA8B,SAAQ,KAAK,CAAC,SAAoB;IAArF;;QACE,UAAK,GAAG;YACN,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,EAAE,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;SAC5C,CAAC;QAEF,SAAI,GAAG,GAAG,EAAE;YACV,UAAU,CAAC,GAAG,EAAE;gBACd,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;gBAC7C,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,CAAC,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC;gBAC5G,IAAI,CAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC,CAAC;YACjC,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC,CAAC;QAEF,aAAQ,GAAG,GAAG,EAAE;YACd,UAAU,CAAC,GAAG,EAAE;gBACd,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBACzC,MAAM,OAAO,GAAG;oBACd,GAAG,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,CAAC,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;yBACpC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,aAAa,GAAG,CAAC,CAAC;yBACtC,OAAO,EAAE;oBACZ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI;iBACnB,CAAC;gBACF,IAAI,CAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC,CAAC;YACjC,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC,CAAC;IAuBJ,CAAC;IArBC,MAAM;QACJ,OAAO,CACL;YACE,oBAAC,cAAc,IACb,WAAW,EAAE,IAAI,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,eAAe,EAAE,IAAI,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,UAAU,EAAE,kDAAwB,EACpC,cAAc,EAAE,kDAAwB,EACxC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAClC,eAAe,EAAE,CAAC,IACjB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAC1B,6BAAK,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,EAAC,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,mBAAmB,EAAC;;gBACrE,CAAC;uBACC,CACP,CAAC,CACa,CAChB,CACJ,CAAC;IACJ,CAAC;CACF"}