amotify 0.0.0

package/dist/@comps/Functions/Layout/RootViewController/parts.js

@@ -0,0 +1,202 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RootViewController = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var _mols_1 = require("@mols");
+var _functions_1 = require("@functions");
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+exports.RootViewController = {
+    Base: function (params) {
+        var topNavigation = params.topNavigation, sideNavigation = params.sideNavigation, footerNavigation = params.footerNavigation, children = params.children, className = params.className, others = __rest(params, ["topNavigation", "sideNavigation", "footerNavigation", "children", "className"]);
+        var Key = _global_1.useRecycle.set('RootViewController');
+        _global_1.React.useEffect(function () {
+            calcHeights();
+            setTimeout(function () {
+                calcHeights();
+            }, 100);
+            var getSideNavigationHeight = 'ResizeCB';
+            var beforeunload = 'RemovePageEventCB';
+            $(window).addEvent({
+                eventType: 'resize',
+                eventID: getSideNavigationHeight,
+                callback: function () {
+                    if (!amotify.config.device.isPhonepoint())
+                        calcHeights();
+                }
+            });
+            return function () {
+                $(window).removeEvent(beforeunload);
+                $(window).removeEvent(getSideNavigationHeight);
+            };
+        }, []);
+        var Chilren = children;
+        return (_global_1.React.createElement(_mols_1.Column, __assign({ key: Key, className: [
+                className,
+                style_module_scss_1.default.Root,
+            ].join(' '), backgroundColor: '1.layer.base' }, others, { gap: 0, minHeight: 'viewHeight' }),
+            topNavigation,
+            _global_1.React.createElement(_atoms_1.Flex, { className: style_module_scss_1.default.Body, flexWrap: false, position: 'relative', flexSizing: 0 },
+                sideNavigation,
+                _global_1.React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Content, position: 'relative', flexSizing: 0, width: 0, UnderBreakPointStyles: {
+                        width: 1
+                    } }, Chilren)),
+            footerNavigation));
+    },
+    TopNavigation: function (params) {
+        var className = params.className, children = params.children, others = __rest(params, ["className", "children"]);
+        var _a = __read(_global_1.React.useState($.uuidGen()), 1), val_componentID = _a[0];
+        _global_1.React.useEffect(function () {
+            var height = $("[data-id=\"".concat(val_componentID, "\"]")).position().height;
+            height = height | 0;
+            var topBase = height;
+            if ($('#TopNavigation').getStyleProperty('position') != 'sticky') {
+                topBase = 0;
+            }
+            $(document.body)
+                .setStyleProperty('--topNavHeight', height + 'px')
+                .setStyleProperty('--topBase', topBase + 'px');
+        }, []);
+        return (_global_1.React.createElement(_atoms_1.Flex, __assign({ key: val_componentID, "data-id": val_componentID, flexSizing: 'none', flexType: 'col', position: 'sticky', top: 0, backgroundColor: '1.layer.base' }, others, { id: 'TopNavigation', className: [
+                className,
+                style_module_scss_1.default.TopNav
+            ].join(' ') }),
+            _global_1.React.createElement(_atoms_1.Box, { position: 'absolute', left: 0, right: 0, backgroundColor: 'inherit', className: style_module_scss_1.default.TopCover, freeCSS: {
+                    top: '-1rem',
+                    height: '2rem',
+                    zIndex: -1
+                } }),
+            children));
+    },
+    SideNavigation: function (params) {
+        var _a = params.className, className = _a === void 0 ? '' : _a, baseStyles = params.baseStyles, others = __rest(params, ["className", "baseStyles"]);
+        return (_global_1.React.createElement(_atoms_1.Box, __assign({ flexSizing: 'none', className: [
+                className,
+                style_module_scss_1.default.SideNav
+            ].join(' '), minHeight: 'sideNavigationHeight' }, others)));
+    },
+    FooterNavigation: function (params) {
+        var _a = params.className, className = _a === void 0 ? '' : _a, baseStyles = params.baseStyles, others = __rest(params, ["className", "baseStyles"]);
+        var _b = __read(_global_1.React.useState($.uuidGen()), 1), val_componentID = _b[0];
+        _global_1.React.useEffect(function () {
+            var height = $("[data-id=\"".concat(val_componentID, "\"]")).position().height;
+            height = height | 0;
+            $(document.body).setStyleProperty('--footerNavHeight', height + 'px');
+        }, []);
+        return (_global_1.React.createElement(_atoms_1.Flex, __assign({ "data-id": val_componentID, borderTop: true, position: 'sticky', bottom: 0, overflow: 'auto', backgroundColor: '1.layer.base', paddingBottom: 'safeAreaBottom', display: 'none' }, baseStyles, { UnderBreakPointStyles: __assign({ display: 'flex' }, baseStyles === null || baseStyles === void 0 ? void 0 : baseStyles.UnderBreakPointStyles), className: [
+                style_module_scss_1.default.FooterNav,
+                className
+            ].join(' ') }),
+            _global_1.React.createElement(_atoms_1.Flex, __assign({ gap: 1, flexWrap: false, padding: '2/3', margin: 'auto' }, others))));
+    },
+    Comps: {
+        Button: function (params) {
+            var e_1, _a;
+            var isActive = params.isActive, uri = params.uri, uriGroup = params.uriGroup, _b = params.activeClassName, activeClassName = _b === void 0 ? '' : _b, others = __rest(params, ["isActive", "uri", "uriGroup", "activeClassName"]);
+            var groups = $.flatArray(uriGroup);
+            var currentURL = location.pathname + location.search;
+            {
+                var isCurrentURL = false;
+                if ($.is.exist(uri) && $.is.string(uri)) {
+                    var url = [
+                        location.origin,
+                        uri.replace(/\//, '')
+                    ].join('/');
+                    isCurrentURL = currentURL == new URL(url).pathname;
+                }
+                if (!isCurrentURL) {
+                    if (groups.length) {
+                        try {
+                            for (var groups_1 = __values(groups), groups_1_1 = groups_1.next(); !groups_1_1.done; groups_1_1 = groups_1.next()) {
+                                var group = groups_1_1.value;
+                                if ($.is.nullish(group))
+                                    continue;
+                                if (!!currentURL.match(new RegExp(group)))
+                                    isCurrentURL = true;
+                            }
+                        }
+                        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                        finally {
+                            try {
+                                if (groups_1_1 && !groups_1_1.done && (_a = groups_1.return)) _a.call(groups_1);
+                            }
+                            finally { if (e_1) throw e_1.error; }
+                        }
+                    }
+                }
+                isActive = isActive !== null && isActive !== void 0 ? isActive : isCurrentURL;
+            }
+            return _global_1.React.createElement(_functions_1.Buttons.Button.Clear.R, __assign({ padding: ['3/4', 1], display: 'flex', gap: '1/2', fontColor: 'inherit', width: 1, flexSizing: 'none', flexWrap: false, ssEffectsOnActive: 'ripple.cloud', verticalAlign: 'center', textAlign: 'left', isBoldFont: true, isActive: isActive, isActiveStyles: {
+                    fontColor: 'theme',
+                    backgroundColor: 'cloud'
+                }, onClick: function (event) {
+                    if ($.is.exist(uri) && $.is.string(uri))
+                        _global_1.pageTransit.push(uri, event.ctrlKey || event.metaKey);
+                }, color: 'cloud' }, others));
+        },
+        Bar: function (params) { return (_global_1.React.createElement(_atoms_1.Box, __assign({ backgroundColor: 'lcOpMiddle', unitHeight: '1/3', margin: ['2/3', 1], borderRadius: 'sphere' }, params))); },
+        Title: function (params) { return (_global_1.React.createElement(_atoms_1.Box, __assign({ fontSize: '3.paragraph', isBoldFont: true, padding: [0, 1] }, params))); },
+    }
+};
+var calcHeights = function () {
+    var Body = $(document.body);
+    var viewHeight = window.innerHeight;
+    var topNavHeight = Number(Body.getStyleProperty('--topNavHeight').removeLetters());
+    var footerNavHeight = Number(Body.getStyleProperty('--footerNavHeight').removeLetters());
+    var contentHeight = viewHeight - topNavHeight - footerNavHeight;
+    Body.setStyleProperty('--viewHeight', viewHeight + 'px')
+        .setStyleProperty('--sideNavHeight', contentHeight + 'px')
+        .setStyleProperty('--contentHeight', contentHeight + 'px');
+};

package/dist/@comps/Functions/Layout/SwipeView/parts.d.ts

@@ -0,0 +1,2 @@
+export declare const SwipeView: (params: amotify.fn.Layout.SwipeView.Params) => JSX.Element;
+export declare const Core: FNC<amotify.fn.Layout.SwipeView.Params>;

package/dist/@comps/Functions/Layout/SwipeView/parts.js

@@ -0,0 +1,319 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Core = exports.SwipeView = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var useState = React.useState, useEffect = React.useEffect, useRef = React.useRef;
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+var SwipeView = function (params) {
+    return (React.createElement(exports.Core, __assign({}, params, { slideIndex: Math.max(Math.min(params.slideIndex, params.slides.length - 1), 0) })));
+};
+exports.SwipeView = SwipeView;
+var Core = function (params) {
+    var _a = params.options, _b = _a === void 0 ? {} : _a, onSlideCallback = _b.onSlideCallback, _c = _b.visibilitySurroundSlide, visibilitySurroundSlide = _c === void 0 ? true : _c, _d = _b.autoSwipeSeconds, autoSwipeSeconds = _d === void 0 ? 0 : _d, _e = _b.loop, loop = _e === void 0 ? false : _e, _f = _b.disableMousedrag, disableMousedrag = _f === void 0 ? false : _f, _g = _b.disableTouch, disableTouch = _g === void 0 ? false : _g, _h = params.wrapper, wrapper = _h === void 0 ? function (slide) { return (slide); } : _h, _j = params.slides, slides = _j === void 0 ? [] : _j, others = __rest(params, ["options", "wrapper", "slides"]);
+    var _k = __read(useState($.uuidGen()), 1), val_swipeID = _k[0];
+    var _l = __read(useState({
+        eventType: 'init',
+        index: params.slideIndex
+    }), 2), val_event = _l[0], set_event = _l[1];
+    useEffect(function () {
+        _global_1.useStore.set({
+            key: 'SwipeTimer-' + val_swipeID,
+            value: null
+        });
+    }, []);
+    var mounted = useRef(false);
+    useEffect(function () {
+        set_event({
+            eventType: 'usr',
+            index: params.slideIndex
+        });
+        if (!mounted.current)
+            mounted.current = true;
+    }, [params.slideIndex]);
+    useEffect(function () {
+        var Index = val_event.index + (loop ? 1 : 0);
+        var CopyIndex = [-1, slides.length].includes(val_event.index);
+        if (!CopyIndex)
+            if (onSlideCallback)
+                setTimeout(function () {
+                    onSlideCallback(val_event.index);
+                }, 300);
+        var Base = $('#Swiper-' + val_swipeID);
+        if (val_event.eventType == 'adjustLoop') {
+            Base
+                .await(250)
+                .css({
+                transition: '0s',
+                transform: FNs.TrasformString(Index)
+            })
+                .children()
+                .removeClass(style_module_scss_1.default.Display)
+                .parent().children(Index)
+                .addClass([style_module_scss_1.default.Display, style_module_scss_1.default.LoopAdjusting])
+                .await(100).removeClass(style_module_scss_1.default.LoopAdjusting);
+        }
+        else if (val_event.eventType == 'sys') {
+            Base
+                .await(250)
+                .css({
+                transform: FNs.TrasformString(Index)
+            })
+                .children()
+                .removeClass(style_module_scss_1.default.Display)
+                .parent().children(Index)
+                .addClass(style_module_scss_1.default.Display);
+        }
+        else {
+            Base
+                .children()
+                .removeClass(style_module_scss_1.default.Display)
+                .parent().children(Index)
+                .addClass(style_module_scss_1.default.Display)
+                .parent()
+                .css({
+                transition: '0.3s',
+                transform: FNs.TrasformString(Index)
+            })
+                .await(250).css({ transition: '0s' });
+            if (CopyIndex) {
+                var ajastIndex = val_event.index == -1 ? slides.length - 1 : 0;
+                set_event({
+                    eventType: 'adjustLoop',
+                    index: ajastIndex
+                });
+            }
+        }
+        if (autoSwipeSeconds && !CopyIndex) {
+            $.interval.clear('SwipeTimer-' + val_swipeID);
+            $.interval.standBy('SwipeTimer-' + val_swipeID, autoSwipeSeconds - (val_event.eventType == 'sys' ? 310 : 0), function () {
+                var newIndex = val_event.index + 1;
+                if (!loop && newIndex > slides.length - 1)
+                    newIndex = 0;
+                set_event({
+                    eventType: 'usr',
+                    index: newIndex
+                });
+            });
+        }
+    }, [val_event]);
+    var Slides = slides.map(function (slide, index) { return React.createElement(_atoms_1.Box, { key: index, flexSizing: 'none', width: 1, height: 0, className: style_module_scss_1.default.Child, children: wrapper(slide) }); });
+    if (loop) {
+        Slides.push(Slides[0]);
+        Slides.unshift(Slides[Slides.length - 2]);
+    }
+    var info = {
+        x: 0,
+        y: 0,
+        process: false,
+        effectStartAt: 0,
+        id: val_swipeID,
+        loop: loop,
+        index: val_event.index,
+        minIndex: loop ? -1 : 0,
+        maxIndex: slides.length + (loop ? 1 : -1),
+        width: 0,
+        set_event: set_event
+    };
+    var Index = val_event.index + (loop ? 1 : 0);
+    return (React.createElement(_atoms_1.Box, __assign({ overflow: 'hidden', position: 'relative' }, others, { freeCSS: __assign({ zIndex: 1 }, others.freeCSS), "data-swipe-id": val_swipeID, onMouseDown: function (event) {
+            if (disableMousedrag)
+                return;
+            if (event.buttons != 1)
+                return;
+            FNs.EffectStart(event, info);
+        }, onTouchStart: function (event) {
+            var _a;
+            if (disableTouch)
+                return;
+            if (((_a = event.touches) === null || _a === void 0 ? void 0 : _a.length) != 1)
+                return;
+            FNs.EffectStart(event, info);
+        } }),
+        React.createElement(_atoms_1.Flex, { flexWrap: false, gap: 1, transition: 'long', className: [
+                style_module_scss_1.default.Rail,
+                style_module_scss_1.default['ShowOther_' + visibilitySurroundSlide]
+            ].join(' '), id: 'Swiper-' + val_swipeID, freeCSS: __assign({}, !mounted.current ? {
+                transform: FNs.TrasformString(Index)
+            } : {}), children: Slides })));
+};
+exports.Core = Core;
+var FNs = {
+    TrasformString: function (Index) { return ("translateX( calc( ".concat(-100 * Index, "%  - ").concat(12 * (Index), "px ) )")); },
+    EffectStart: function (event, info) {
+        var _a = $.getCursor(event), x = _a.x, y = _a.y;
+        var eventTarget = event.currentTarget;
+        var target = event.target;
+        if (['SELECT', 'BUTTON', 'LABEL', 'INPUT'].includes(target.tagName))
+            return;
+        info = __assign(__assign({}, info), { x: x - info.x + window.scrollX, y: y - info.y + window.scrollY, effectStartAt: new Date().getTime(), width: $('#Swiper-' + info.id).position().width });
+        var swipeId = eventTarget.dataset.swipeId;
+        if (swipeId == info.id) {
+            $(document)
+                .addEvent({
+                eventID: 'SwipeMouseMove', eventType: 'mousemove',
+                callback: function (event) { FNs.EffectCheck(event, info); },
+                option: { passive: false }
+            })
+                .addEvent({
+                eventID: 'SwipeTouchMove', eventType: 'touchmove',
+                callback: function (event) { FNs.EffectCheck(event, info); },
+                option: { passive: false }
+            })
+                .addEvent({
+                eventID: 'SwipeMouseUp', eventType: 'mouseup',
+                callback: function (event) { FNs.EffectEnd(event, info); },
+                option: { passive: false }
+            })
+                .addEvent({
+                eventID: 'SwipeTouchEnd', eventType: 'touchend',
+                callback: function (event) { FNs.EffectEnd(event, info); },
+                option: { passive: false }
+            });
+        }
+    },
+    EffectCheck: function (event, info) {
+        if (info.process)
+            return;
+        var _a = $.getCursor(event), x = _a.x, y = _a.y;
+        var X = Math.abs(x - info.x + window.scrollX);
+        var Y = Math.abs(y - info.y + window.scrollY);
+        if (event.touches && event.touches.length > 1)
+            return;
+        if (Y + X < 15)
+            return;
+        if (Y > X / 2) {
+            $(document).removeEvent([
+                'SwipeMouseMove',
+                'SwipeTouchMove'
+            ]);
+        }
+        else {
+            info.process = true;
+            var Index = info.index + (info.loop ? 1 : 0);
+            $('#Swiper-' + info.id).children(Index - 1).addClass(style_module_scss_1.default.Display);
+            $('#Swiper-' + info.id).children(Index + 1).addClass(style_module_scss_1.default.Display);
+            $(document)
+                .addEvent({
+                eventID: 'SwipeCheckMouseMove', eventType: 'mousemove',
+                callback: function (event) { FNs.EffectMove(event, info); },
+                option: { passive: false }
+            })
+                .addEvent({
+                eventID: 'SwipeCheckTouchMove', eventType: 'touchmove',
+                callback: function (event) { FNs.EffectMove(event, info); },
+                option: { passive: false }
+            });
+            event.preventDefault();
+            return;
+        }
+    },
+    EffectMove: function (event, info) {
+        if (event.touches && event.touches.length > 1)
+            return;
+        var x = $.getCursor(event).x;
+        var X = x - info.x + window.scrollX;
+        var Index = info.index + (info.loop ? 1 : 0);
+        var rate = Index - X / info.width;
+        if (rate < 0) {
+            rate /= 2;
+        }
+        else if (rate > info.maxIndex) {
+            var excess = rate - info.maxIndex;
+            rate = info.maxIndex + excess / 2;
+        }
+        $('#Swiper-' + info.id).css({
+            transition: '0s',
+            transform: FNs.TrasformString(rate)
+        });
+        event.preventDefault();
+        return;
+    },
+    EffectEnd: function (event, info) {
+        if (info.process) {
+            var cursor = $.getCursor(event);
+            var X = cursor.x - info.x + window.scrollX;
+            var current = new Date().getTime();
+            var totalTime = current - info.effectStartAt;
+            var Index = info.index + (info.loop ? 1 : 0);
+            var newIndex = 0;
+            if (totalTime < 400) {
+                newIndex = Index - (Number(X > 0) * 2 - 1);
+            }
+            else {
+                newIndex = Math.round(Index - X / info.width);
+            }
+            newIndex = Math.max(Math.min(newIndex, info.maxIndex), info.minIndex);
+            info.process = false;
+            if (Index === newIndex) {
+                info.effectStartAt = current;
+                $('#Swiper-' + info.id)
+                    .css({
+                    transition: '.2s',
+                    transform: FNs.TrasformString(newIndex)
+                })
+                    .await(310)
+                    .css({
+                    transition: '0s'
+                })
+                    .children().removeClass(style_module_scss_1.default.Display)
+                    .parent().children(Index).addClass(style_module_scss_1.default.Display);
+            }
+            else {
+                info.set_event({
+                    eventType: 'usr',
+                    index: newIndex + info.minIndex
+                });
+            }
+        }
+        $(document).removeEvent([
+            'SwipeMouseMove',
+            'SwipeTouchMove',
+            'SwipeCheckMouseMove',
+            'SwipeCheckTouchMove',
+            'SwipeMouseUp',
+            'SwipeTouchEnd'
+        ]);
+    }
+};

package/dist/@comps/Functions/Layout/TabBar.d.ts

@@ -0,0 +1 @@
+export declare const TabBar: FNC<amotify.fn.Layout.TabBar.Params>;

package/dist/@comps/Functions/Layout/TabBar.js

@@ -0,0 +1,49 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TabBar = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var _functions_1 = require("@functions");
+var useEffect = _global_1.React.useEffect, useState = _global_1.React.useState;
+var TabBar = function (params) {
+    var tabIndex = params.tabIndex, tabs = params.tabs, onTabChange = params.onTabChange, componentDidMount = params.componentDidMount, others = __rest(params, ["tabIndex", "tabs", "onTabChange", "componentDidMount"]);
+    useEffect(function () {
+        if (componentDidMount)
+            componentDidMount();
+    }, []);
+    return (_global_1.React.createElement(_atoms_1.Flex, __assign({ position: 'relative', overflow: 'auto', flexWrap: false }, others, { freeCSS: __assign({ zIndex: 3, whiteSpace: 'nowrap' }, others.freeCSS) }),
+        _global_1.React.createElement(_atoms_1.Box, { margin: [0, 'auto'] },
+            _global_1.React.createElement(_functions_1.Input.Segmented.BottomLine, { value: tabIndex, fontColor: 'inherit', override: 'force', gap: 0, options: tabs.map(function (tab, index) {
+                    return {
+                        value: index,
+                        label: tab
+                    };
+                }), onUpdateValidValue: function (args) {
+                    var value = args.value[0];
+                    if (onTabChange)
+                        onTabChange(value);
+                } }))));
+};
+exports.TabBar = TabBar;

package/dist/@comps/Functions/Layout/_.d.ts

@@ -0,0 +1,2 @@
+declare const Layout: amotify.fn.Layout.Methods;
+export { Layout };

package/dist/@comps/Functions/Layout/_.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Layout = void 0;
+var parts_1 = require("./SwipeView/parts");
+var parts_2 = require("./PageViewController/parts");
+var TabBar_1 = require("./TabBar");
+var Plate_1 = require("./Plate");
+var PageNotFound_1 = require("./PageNotFound");
+var PageRouter_1 = require("./PageRouter");
+var parts_3 = require("./RootViewController/parts");
+var Layout = {
+    PageViewController: parts_2.PageViewController,
+    TabBar: TabBar_1.TabBar,
+    Plate: Plate_1.Plate,
+    SwipeView: parts_1.SwipeView,
+    PageRouter: PageRouter_1.PageRouter,
+    PageNotFound: PageNotFound_1.PageNotFound,
+    RootViewController: parts_3.RootViewController
+};
+exports.Layout = Layout;

package/dist/@comps/Functions/Loader/corner.d.ts

@@ -0,0 +1 @@
+export declare const Corner: () => JSX.Element;

package/dist/@comps/Functions/Loader/corner.js

@@ -0,0 +1,59 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Corner = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var useEffect = React.useEffect, useState = React.useState;
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+var parts_1 = require("./parts");
+var Corner = function () {
+    var _a = __read(useState(false), 2), val_active = _a[0], set_active = _a[1];
+    useEffect(function () {
+        _global_1.useStore.set({
+            key: parts_1.memoryID + '-corner',
+            value: {
+                active: function () {
+                    set_active(true);
+                },
+                stop: function () {
+                    set_active(false);
+                }
+            }
+        });
+    }, []);
+    return React.createElement(_atoms_1.Flex, { className: [
+            style_module_scss_1.default.CornerLoader,
+            style_module_scss_1.default['Active_' + val_active]
+        ].join(' '), gap: '1/2', padding: ['1/2', '3/4'], borderRadius: '2/3', backgroundColor: 'theme', position: 'fixed', boxShadow: 2, right: 1, bottom: 1, opacity: 'trans', transition: 'short', freeCSS: {
+            pointerEvents: 'none'
+        } },
+        React.createElement(_atoms_1.Flex, { className: style_module_scss_1.default.Wrap, flexWrap: false, verticalAlign: 'center', horizontalAlign: 'center' },
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld4 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld3 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld2 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld1 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld2 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld3 }),
+            React.createElement(_atoms_1.Box, { className: style_module_scss_1.default.Ld4 })),
+        React.createElement(_atoms_1.Box, { fontColor: 'white', fontSize: '0.xs', isBoldFont: true }, "Loading"));
+};
+exports.Corner = Corner;