amotify 0.0.0

package/dist/@comps/Functions/Effects/Fade.d.ts

@@ -0,0 +1 @@
+export declare const FadeEffects: amotify.fn.Effects.Methods;

package/dist/@comps/Functions/Effects/Fade.js

@@ -0,0 +1,80 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FadeEffects = void 0;
+var _a = amotify.glob.React, useState = _a.useState, useEffect = _a.useEffect, Box = amotify.atoms.Box;
+exports.FadeEffects = __assign(__assign({}, {}), { FadeIn: function (params) {
+        var _a = params.animationDelay, animationDelay = _a === void 0 ? 100 : _a, _b = params.animationTime, animationTime = _b === void 0 ? 300 : _b, _c = params.componentID, componentID = _c === void 0 ? $.uuidGen() : _c, others = __rest(params, ["animationDelay", "animationTime", "componentID"]);
+        var _d = __read(useState(componentID), 1), val_componentID = _d[0];
+        useEffect(function () {
+            setTimeout(function () {
+                var Element = $('[data-component-id="' + val_componentID + '"]');
+                if (!Element[0])
+                    return;
+                Element.css({
+                    transition: animationTime + 'ms'
+                })
+                    .await(1)
+                    .css({
+                    opacity: 1
+                });
+            }, animationDelay);
+        }, []);
+        return (React.createElement(Box, __assign({}, others, { freeCSS: __assign(__assign({}, others.freeCSS), { opacity: 0 }), componentID: val_componentID })));
+    }, FadeUp: function (params) {
+        var _a = params.animationDelay, animationDelay = _a === void 0 ? 100 : _a, _b = params.animationTime, animationTime = _b === void 0 ? 300 : _b, _c = params.componentID, componentID = _c === void 0 ? $.uuidGen() : _c, others = __rest(params, ["animationDelay", "animationTime", "componentID"]);
+        var _d = __read(useState(componentID), 1), val_componentID = _d[0];
+        useEffect(function () {
+            setTimeout(function () {
+                var Element = $('[data-component-id="' + val_componentID + '"]');
+                if (!Element[0])
+                    return;
+                Element.css({
+                    transition: animationTime + 'ms'
+                })
+                    .await(1)
+                    .css({
+                    opacity: 1,
+                    paddingTop: 0
+                });
+            }, animationDelay);
+        }, []);
+        return (React.createElement(Box, __assign({ paddingTop: 2 }, others, { freeCSS: __assign(__assign({}, others.freeCSS), { opacity: 0 }), componentID: val_componentID })));
+    } });

package/dist/@comps/Functions/Effects/Ripple.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/@comps/Functions/Effects/Ripple.js

@@ -0,0 +1,107 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+new /** @class */ (function () {
+    function class_1() {
+        this.UserEvent();
+    }
+    class_1.prototype.UserEvent = function () {
+        var RippleElementClassName = 'eff_ripple';
+        var EffectStart = function (event) {
+            var startedAt = $.Time().time;
+            var target = event.target;
+            var RippleElement = $(target.closest('.' + RippleElementClassName));
+            var Color = RippleElement.findClass(/^eff_ripple-/)[0].split('-')[1];
+            var ID = 'RippleWrap-' + $.uuidGen(), _a = RippleElement.position(), left = _a.left, top = _a.top, height = _a.height, width = _a.width, _b = $.getScreenSize(), pageXOffset = _b.pageXOffset, pageYOffset = _b.pageYOffset, _c = $.getCursor(event), cursorX = _c.x, cursorY = _c.y, size = Math.min(width * 1.5, 300), x = Math.max(cursorX - (left + pageXOffset), 0), y = Math.max(cursorY - (top + pageYOffset), 0);
+            var effectInfo = {
+                RippleElement: RippleElement,
+                startedAt: startedAt,
+                size: size
+            };
+            $(document).addEvent({
+                eventID: 'RippleMouseUp',
+                eventType: 'mouseup',
+                callback: function () {
+                    EffectEnd(effectInfo);
+                }
+            }).addEvent({
+                eventID: 'RippleTouchEnd',
+                eventType: 'touchend',
+                callback: function () {
+                    setTimeout(function () {
+                        EffectEnd(effectInfo);
+                    }, 20);
+                }
+            });
+            $(RippleElement)
+                .addClass([
+                style_module_scss_1.default.RippleElement,
+                style_module_scss_1.default['Color_' + Color]
+            ])
+                .append("<div class=\"".concat(style_module_scss_1.default.RippleWrap, "\" id=\"").concat(ID, "\">\n            <div class=\"").concat(style_module_scss_1.default.Wave, "\" />\n          </div>"))
+                .addEvent({
+                eventID: 'RippleMouseOut',
+                eventType: 'mouseout',
+                callback: function (event) {
+                    EffectEnd(effectInfo);
+                }
+            })
+                .find('#' + ID)
+                .find('.' + style_module_scss_1.default.Wave)
+                .css({ left: x, top: y })
+                .await(10)
+                .css({
+                height: size,
+                width: size,
+                opacity: '.3',
+                transition: '.25s'
+            });
+        };
+        var EffectEnd = function (effectInfo) {
+            var RippleElement = effectInfo.RippleElement, startedAt = effectInfo.startedAt, size = effectInfo.size;
+            var processTime = $.Time().time - startedAt;
+            var transition = processTime <= 400 ? '.75s' : '.55s';
+            var diameter = size * 2.5;
+            $(document).removeEvent([
+                'RippleMouseUp',
+                'RippleTouchMove',
+                'RippleTouchEnd',
+            ]);
+            RippleElement
+                .removeEvent(['RippleMouseOut'])
+                .find('.' + style_module_scss_1.default.Wave)
+                .css({
+                height: diameter,
+                width: diameter,
+                opacity: '0',
+                transition: transition
+            })
+                .await(750)
+                .parent()
+                .callback(function (Parent) {
+                Parent.remove();
+            });
+        };
+        $(document)
+            .addEvent({
+            eventType: 'touchstart',
+            target: '.' + RippleElementClassName,
+            callback: function (event) {
+                EffectStart(event);
+            }
+        })
+            .addEvent({
+            eventType: 'mousedown',
+            target: '.' + RippleElementClassName,
+            callback: function (event) {
+                if (amotify.config.device.isTouchDevice)
+                    return;
+                EffectStart(event);
+            }
+        });
+    };
+    return class_1;
+}());

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

@@ -0,0 +1,3 @@
+import './Ripple';
+declare const Effects: amotify.fn.Effects.Methods;
+export { Effects };

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

@@ -0,0 +1,43 @@
+"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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Effects = void 0;
+require("./Ripple");
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+var Fade_1 = require("./Fade");
+var Effects = __assign({}, Fade_1.FadeEffects);
+exports.Effects = Effects;
+/** PuddingEffect */
+new /** @class */ (function () {
+    function class_1() {
+        this.UserEvent();
+    }
+    class_1.prototype.UserEvent = function () {
+        $(document).addEvent({
+            eventType: 'click',
+            target: '.eff_pudding',
+            callback: function () {
+                $(this)
+                    .removeClass(style_module_scss_1.default.PuddingEffect)
+                    .await(1)
+                    .addClass(style_module_scss_1.default.PuddingEffect)
+                    .await(510)
+                    .removeClass(style_module_scss_1.default.PuddingEffect);
+            }
+        });
+    };
+    return class_1;
+}());

package/dist/@comps/Functions/Input/Chips/Selector.d.ts

@@ -0,0 +1 @@
+export declare const ChipsInputFNs: amotify.fn.Input.Chips.FNs;

package/dist/@comps/Functions/Input/Chips/Selector.js

@@ -0,0 +1,356 @@
+"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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChipsInputFNs = void 0;
+var _global_1 = require("@global");
+var useEffect = React.useEffect, useState = React.useState;
+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"));
+var Selector = function (params) {
+    var _a = __read(useState('show'), 2), val_status = _a[0], set_status = _a[1];
+    var _b = __read(useState(''), 2), val_keyword = _b[0], set_keyword = _b[1];
+    var _c = __read(useState($.uuidGen()), 1), val_componentID = _c[0];
+    var _d = __read(useState(params.options), 2), val_options = _d[0], set_options = _d[1];
+    var _e = __read(useState(val_options[0] || null), 2), val_focus = _e[0], set_focus = _e[1];
+    var _f = __read(useState(params.selected), 2), val_selected = _f[0], set_selected = _f[1];
+    var _g = __read(useState('init'), 2), val_keyEvent = _g[0], set_keyEvent = _g[1];
+    useEffect(function () {
+        _global_1.useStore.set({
+            key: params.selectorID,
+            value: {
+                updateOptions: function (options) {
+                    set_options(options);
+                },
+                updateSelected: function (selected) {
+                    set_selected(selected);
+                }
+            }
+        });
+    }, []);
+    var mountedOptions = React.useRef(false);
+    useEffect(function () {
+        if (mountedOptions.current) {
+            _functions_1.Sheet.reposition(params.selectorID);
+        }
+        else {
+            mountedOptions.current = true;
+        }
+    }, [val_options]);
+    var mountedKeyword = React.useRef(false);
+    useEffect(function () {
+        if (mountedKeyword.current) {
+            set_status('interlude');
+            set_focus(val_options[0] || null);
+            if (params.onDynamicSearch) {
+                $.interval.clear(val_componentID + '-dynamicSearch');
+                $.interval.standBy(val_componentID + '-dynamicSearch', 400, function () { return __awaiter(void 0, void 0, void 0, function () {
+                    var options;
+                    return __generator(this, function (_a) {
+                        switch (_a.label) {
+                            case 0: return [4 /*yield*/, params.onDynamicSearch(val_keyword)];
+                            case 1:
+                                options = (_a.sent()).options;
+                                set_options(options);
+                                set_status('show');
+                                return [2 /*return*/];
+                        }
+                    });
+                }); });
+            }
+            else {
+                $.interval.clear(val_componentID + '-staticSearch');
+                $.interval.standBy(val_componentID + '-staticSearch', 400, function () { return __awaiter(void 0, void 0, void 0, function () {
+                    var regExp, newSelection;
+                    return __generator(this, function (_a) {
+                        regExp = new RegExp(val_keyword, 'ig');
+                        newSelection = [];
+                        __spreadArray([], __read(params.options), false).forEach(function (o) {
+                            var _a;
+                            var match = Boolean(!val_keyword || ((_a = String(o.label)) !== null && _a !== void 0 ? _a : String(o.value)).match(regExp));
+                            if (match)
+                                newSelection.push(o);
+                        });
+                        set_options(newSelection);
+                        set_status('show');
+                        return [2 /*return*/];
+                    });
+                }); });
+            }
+        }
+        else {
+            mountedKeyword.current = true;
+        }
+    }, [val_keyword]);
+    var mountedSelected = React.useRef(false);
+    useEffect(function () {
+        if (mountedSelected.current) {
+            params.onUpdated({
+                values: val_selected
+            });
+        }
+        else {
+            mountedSelected.current = true;
+        }
+    }, [val_selected]);
+    useEffect(function () {
+        $.fnScope(function () {
+            if ($.is.nullish(val_focus))
+                return;
+            if (val_keyEvent == 'MouseEvent')
+                return;
+            var Wrapper = $('#' + val_componentID + '-Selector-Cell-Wrap');
+            if (!Wrapper[0])
+                return;
+            var focusCell = $('[data-chips-selector-cell="' + val_componentID + '-' + JSON.stringify((val_focus === null || val_focus === void 0 ? void 0 : val_focus.value) || '').replace(/\"/ig, '') + '"]');
+            if (!focusCell[0])
+                return;
+            var _a = Wrapper.position(), pTop = _a.top, pHeight = _a.height;
+            var _b = focusCell.position(), cTop = _b.top, cHeight = _b.height;
+            if (pTop <= cTop && cTop + cHeight <= pTop + pHeight)
+                return;
+            var scroll = Wrapper[0].scrollTop + (cTop - pTop);
+            if (val_keyEvent == 'ArrowDown') {
+                scroll -= (pHeight - cHeight) - 20;
+            }
+            else if (val_keyEvent == 'ArrowUp') {
+                scroll -= 20;
+            }
+            Wrapper[0].scrollTop = scroll;
+        });
+    }, [val_focus]);
+    var List = [];
+    if (val_status == 'interlude') {
+        List = [React.createElement(_mols_1.Row.Center, { padding: 2, gap: 0 },
+                React.createElement(_functions_1.Loader.Theme.R, { showInitial: true }),
+                React.createElement(_atoms_1.Box, { padding: [0, 1], fontSize: '1.mini', fontColor: '4.thin' }, "\u691C\u7D22\u4E2D..."))];
+    }
+    else {
+        List = [
+            val_options.map(function (option, index) {
+                var value = option.value, label = option.label;
+                var safeValue = String(JSON.stringify(value));
+                var findIndex = val_selected.findIndex(function (v) { return JSON.stringify(v.value) == safeValue; });
+                var isSelected = findIndex != -1;
+                var isFocused = JSON.stringify((val_focus === null || val_focus === void 0 ? void 0 : val_focus.value) || '') == safeValue;
+                var styles = {};
+                if (isSelected || isFocused) {
+                    styles = {
+                        fontColor: 'theme',
+                        isBoldFont: true,
+                    };
+                }
+                if (isFocused) {
+                    styles = __assign(__assign({}, styles), { backgroundColor: 'cloud', paddingLeft: '2/3' });
+                }
+                if (isSelected) {
+                    styles = __assign(__assign({}, styles), { backgroundColor: 'tcOpFew' });
+                }
+                return React.createElement(_functions_1.Buttons.Button.Clear.R, __assign({ color: 'cloud', padding: '1/3', tabIndex: -1, textAlign: 'left', "data-chips-selector-cell": val_componentID + '-' + safeValue.replace(/\"/ig, ''), isActive: isSelected || isFocused, isActiveStyles: styles }, styles, { onMouseOver: function () {
+                        set_keyEvent('MouseEvent');
+                        set_focus(option);
+                    }, onClick: function () {
+                        var newSelected = __spreadArray([], __read(val_selected), false);
+                        if (isSelected) {
+                            newSelected.splice(findIndex, 1);
+                        }
+                        else {
+                            newSelected = __spreadArray(__spreadArray([], __read(newSelected), false), [
+                                option
+                            ], false);
+                            if (params.limit && newSelected.length > params.limit) {
+                                newSelected.shift();
+                            }
+                        }
+                        set_selected(newSelected);
+                    } }),
+                    React.createElement(params.SelectorCellComponent, { isSelected: isSelected, isFocused: isFocused, value: value, label: label }));
+            })
+        ];
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(_mols_1.Column, { padding: '2/3', gap: '2/3', borderBottom: true },
+            React.createElement(_mols_1.Row.Separate, null,
+                React.createElement(_functions_1.Input.Text.Normal, { value: val_keyword, onUpdateValidValue: function (_a) {
+                        var value = _a.value;
+                        set_keyword(value);
+                    }, id: params.selectorID + '-KeywordInput', padding: '2/3', placeholder: '\u691C\u7D22...', leftIcon: React.createElement(_functions_1.Input.Comps.LeftIcon, { right: '2/3', fontSize: '1.mini', fontColor: '3.blur' },
+                        React.createElement(_atoms_1.FAIcon.Search, null)), onKeyDown: function (event) {
+                        var key = event.key, metaKey = event.metaKey, ctrlKey = event.ctrlKey;
+                        var auxKey = metaKey || ctrlKey;
+                        if (['ArrowDown', 'ArrowUp'].includes(key)) {
+                            var dir = Number(key == 'ArrowDown') * 2 - 1;
+                            if (auxKey) {
+                                var next = val_options[dir == 1 ? val_options.length - 1 : 0];
+                                set_focus(next);
+                            }
+                            else {
+                                var nextIndex = val_options.findIndex(function (v) { return JSON.stringify(v.value) == JSON.stringify((val_focus === null || val_focus === void 0 ? void 0 : val_focus.value) || ''); }) + dir;
+                                if (val_options[nextIndex]) {
+                                    set_focus(val_options[nextIndex]);
+                                }
+                                else {
+                                    set_focus(val_options[dir == 1 ? 0 : val_options.length - 1] || null);
+                                }
+                            }
+                        }
+                        else if (key == 'Enter') {
+                            var selectedIndex = val_selected.findIndex(function (v) { return JSON.stringify(v.value) == JSON.stringify((val_focus === null || val_focus === void 0 ? void 0 : val_focus.value) || ''); });
+                            var isSelected = selectedIndex != -1;
+                            var newSelected = __spreadArray([], __read(val_selected), false);
+                            if (isSelected) {
+                                newSelected.splice(selectedIndex, 1);
+                            }
+                            else {
+                                var optionsIndex = val_options.findIndex(function (v) { return JSON.stringify(v.value) == JSON.stringify((val_focus === null || val_focus === void 0 ? void 0 : val_focus.value) || ''); });
+                                if (optionsIndex == -1)
+                                    return;
+                                newSelected = __spreadArray(__spreadArray([], __read(newSelected), false), [
+                                    val_options[optionsIndex],
+                                ], false);
+                                if (params.limit && newSelected.length > params.limit) {
+                                    newSelected.shift();
+                                }
+                            }
+                            set_selected(newSelected);
+                        }
+                        set_keyEvent(key);
+                    } }),
+                React.createElement(_functions_1.Buttons.Button.Border.S, { marginRight: '1/3', ssSphere: 2, backgroundColor: 'cloud', borderRadius: '2.tone.secondary', onClick: function () {
+                        _functions_1.Sheet.close(params.selectorID);
+                    } },
+                    React.createElement(_atoms_1.FAIcon, { d: 'window-minimize' }))),
+            React.createElement(_mols_1.Row.Separate, null,
+                React.createElement(_mols_1.Row.Left, { gap: '1/2', verticalAlign: 'baseline' },
+                    React.createElement(_atoms_1.Span, { fontColor: 'theme' }, val_options.length),
+                    React.createElement(_atoms_1.Box, { fontSize: '1.mini', fontColor: '3.blur' }, "\u4EF6\u306E\u30D2\u30C3\u30C8")),
+                React.createElement(_mols_1.Row.Right, null, params.limit ? React.createElement(_atoms_1.Span, { fontColor: '3.blur', fontSize: '1.mini' },
+                    React.createElement(_atoms_1.Span, { fontSize: '3.paragraph', fontColor: 'theme', isBoldFont: true }, val_selected.length),
+                    " / ",
+                    params.limit,
+                    " \u4EF6") : null))),
+        React.createElement(_mols_1.Column, { gap: '1/4', padding: '1/2', overflow: 'auto', freeCSS: {
+                maxHeight: 12 * 26,
+                maxWidth: 12 * 26
+            }, id: val_componentID + '-Selector-Cell-Wrap', className: style_module_scss_1.default.SelectorWrapper }, List),
+        params.bottomContent));
+};
+exports.ChipsInputFNs = {
+    openSelector: function (params) {
+        var selectorID = params.selectorID, options = params.options, selected = params.selected, limit = params.limit, bottomContent = params.bottomContent, onDynamicSearch = params.onDynamicSearch, SelectorCellComponent = params.SelectorCellComponent, onUpdated = params.onUpdated, onClosed = params.onClosed, parent = params.parent, sheetarams = __rest(params, ["selectorID", "options", "selected", "limit", "bottomContent", "onDynamicSearch", "SelectorCellComponent", "onUpdated", "onClosed", "parent"]);
+        var sheetID = selectorID;
+        SelectorCellComponent = SelectorCellComponent || (function (params) {
+            return React.createElement(_mols_1.Row.Left, null,
+                React.createElement(_atoms_1.FAIcon.CheckCircle, { isSolidIcon: params.isSelected, isRegularIcon: !params.isSelected, fontColor: params.isSelected ? 'theme' : '6.clear' }),
+                params.label);
+        });
+        _functions_1.Sheet.open(__assign(__assign({ parent: parent, sheetID: sheetID, type: 'custom', gravityPoint: 22, padding: [1, 0], holdState: true, closeOption: {
+                aroundClick: true,
+                escapeKeyDown: true
+            } }, sheetarams), { content: React.createElement(_atoms_1.Box, { borderRadius: '2.tone.secondary', backgroundColor: '1.layer.base', border: true, boxShadow: 'borderBox', overflow: 'hidden' },
+                React.createElement(Selector, { selectorID: selectorID, options: options, limit: limit, selected: selected, onUpdated: onUpdated, SelectorCellComponent: SelectorCellComponent, bottomContent: bottomContent, onDynamicSearch: onDynamicSearch })), openAfter: function () {
+                $('#' + params.selectorID + '-KeywordInput').focus();
+            }, closeAfter: function () {
+                onClosed();
+            } }));
+    },
+    closeSelector: function (selectorID) {
+        _functions_1.Sheet.close(selectorID);
+    },
+    updateOptions: function (selectorID, options) {
+        var C = _global_1.useStore.get(selectorID);
+        if (C && C.updateOptions)
+            C.updateOptions(options);
+    },
+    updateSelected: function (selectorID, selected) {
+        var C = _global_1.useStore.get(selectorID);
+        if (C && C.updateSelected)
+            C.updateSelected(selected);
+    }
+};

package/dist/@comps/Functions/Input/Chips/_.d.ts

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