amotify 0.0.0

package/dist/@comps/Functions/Input/File/_.js

@@ -0,0 +1,458 @@
+"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.FileInput = 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 core_1 = require("../core");
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+function DefaultValidation(props) {
+    var value = props.value, params = props.params;
+    var required = params.required;
+    var notice = [];
+    if (required && !value.length) {
+        notice.push({ type: 'invalid', label: '必須項目です' });
+    }
+    return {
+        ok: !notice.filter(function (_a) {
+            var type = _a.type;
+            return type == 'invalid';
+        }).length,
+        notice: notice
+    };
+}
+var FileComponent = function (params) {
+    var tone = params.tone, required = params.required, form = params.form, _a = params.fileNameEdit, fileNameEdit = _a === void 0 ? true : _a, _b = params.systemOnly, systemOnly = _b === void 0 ? false : _b, _c = params.accept, accept = _c === void 0 ? '*' : _c, _d = params.limit, limit = _d === void 0 ? 1 : _d, checkValidationAtFirst = params.checkValidationAtFirst, onChange = params.onChange, onValidate = params.onValidate, onUpdateValue = params.onUpdateValue, onUpdateValidValue = params.onUpdateValidValue, _e = params.value, value = _e === void 0 ? [] : _e, className = params.className, cellStyles = params.cellStyles, cellClassName = params.cellClassName, others = __rest(params, ["tone", "required", "form", "fileNameEdit", "systemOnly", "accept", "limit", "checkValidationAtFirst", "onChange", "onValidate", "onUpdateValue", "onUpdateValidValue", "value", "className", "cellStyles", "cellClassName"]);
+    var Default_Status = {
+        componentID: params.componentID || '',
+        dataValue: value,
+        eventType: 'init',
+        eventID: $.uuidGen()
+    };
+    var _f = __read(useState(Default_Status), 2), val_status = _f[0], set_status = _f[1];
+    var _g = __read(useState({
+        ok: false,
+        notice: []
+    }), 2), val_validate = _g[0], set_validate = _g[1];
+    (0, core_1.CommonEffects)({
+        type: 'file',
+        params: params,
+        val_status: val_status,
+        set_status: set_status,
+        val_validate: val_validate,
+        set_validate: set_validate,
+        DefaultValidation: DefaultValidation,
+        onUpdateValue: onUpdateValue,
+        onUpdateValidValue: onUpdateValidValue,
+        ExtraOverrideParams: {
+            dataValue: value,
+            formatValue: value,
+        },
+        ExtraStoreParams: {
+            AddFiles: function (files) { return __awaiter(void 0, void 0, void 0, function () {
+                var currentFiles, newFiles, i, file, type, name_1;
+                return __generator(this, function (_a) {
+                    currentFiles = _global_1.useStore.get(val_status.componentID).Files;
+                    newFiles = [];
+                    for (i = 0; i < (files === null || files === void 0 ? void 0 : files.length); i++) {
+                        file = files[i];
+                        type = file.type, name_1 = file.name;
+                        if (i + 1 + currentFiles.length > limit) {
+                            _functions_1.SnackBar.add({
+                                componentID: name_1,
+                                secondsToClose: 12000,
+                                children: "\u30D5\u30A1\u30A4\u30EB\u9078\u629E\u4E0A\u9650\u3092\u8D85\u3048\u305F\u305F\u3081\u3001".concat(name_1, "}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002"),
+                                backgroundColor: 'nega'
+                            });
+                            continue;
+                        }
+                        if (accept) {
+                            if (accept == 'image') {
+                                if (!type.match(/image/)) {
+                                    _functions_1.SnackBar.add({
+                                        componentID: name_1,
+                                        secondsToClose: 12000,
+                                        children: "\u30D5\u30A1\u30A4\u30EB\u5F62\u5F0F\u304C\u7570\u306A\u308B\u305F\u3081\u3001".concat(name_1, " \u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3002"),
+                                        backgroundColor: 'nega'
+                                    });
+                                    continue;
+                                }
+                            }
+                        }
+                        newFiles.push(file);
+                    }
+                    set_status(__assign(__assign({}, val_status), { dataValue: __spreadArray(__spreadArray([], __read(currentFiles), false), __read(newFiles), false), eventType: 'update', eventID: $.uuidGen() }));
+                    return [2 /*return*/];
+                });
+            }); }
+        }
+    });
+    var Accept = '';
+    if (accept) {
+        if (accept == 'image')
+            Accept = 'image/png,image/jpeg';
+        else
+            Accept = accept;
+    }
+    return (React.createElement(core_1.BoxWrapper, { val_status: val_status, set_status: set_status, val_validate: val_validate, params: params },
+        React.createElement("input", __assign({ type: 'file', className: style_module_scss_1.default.Input, "data-form": form, "data-input-type": 'file', "data-component-id": val_status.componentID, "data-validation": val_validate.ok, accept: Accept, multiple: limit == 1 ? false : true, onChange: function (event) { return __awaiter(void 0, void 0, void 0, function () {
+                var Input, files, newFiles, i, file, fileName;
+                return __generator(this, function (_a) {
+                    Input = event.target;
+                    files = Input.files;
+                    newFiles = [];
+                    for (i = 0; i < (files === null || files === void 0 ? void 0 : files.length); i++) {
+                        file = files[i];
+                        fileName = file.name;
+                        file.id = $.uuidGen();
+                        if (i + 1 + val_status.dataValue.length > limit) {
+                            _functions_1.SnackBar.add({
+                                componentID: fileName,
+                                secondsToClose: 12000,
+                                children: "\u30D5\u30A1\u30A4\u30EB\u767B\u9332\u6570\u3092\u8D85\u3048\u305F\u305F\u3081\u3001".concat(fileName, "}\u306F\u8FFD\u52A0\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002"),
+                                backgroundColor: 'nega'
+                            });
+                            continue;
+                        }
+                        newFiles.push(file);
+                    }
+                    set_status(__assign(__assign({}, val_status), { dataValue: __spreadArray(__spreadArray([], __read(val_status.dataValue), false), __read(newFiles), false), eventType: 'update', eventID: $.uuidGen() }));
+                    Input.value = '';
+                    return [2 /*return*/];
+                });
+            }); } }, others, { tabIndex: -1, value: '' })),
+        !systemOnly ? React.createElement(FileList, { files: val_status.dataValue, params: params, val_status: val_status, set_status: set_status }) : null));
+};
+var FileList = function (props) {
+    var files = props.files, params = props.params, val_status = props.val_status, set_status = props.set_status;
+    var Left = (params.limit || 1) - val_status.dataValue.length;
+    var Files = files.map(function (file, index) {
+        return (React.createElement(FileCell, { key: file.name, index: index, file: file, className: params.cellClassName, val_status: val_status, set_status: set_status, fileNameEdit: params.fileNameEdit }));
+    });
+    if (Left > 0) {
+        Files.push(React.createElement(_functions_1.Buttons.Label.Plain, { key: 'AddButton', className: [params.cellClassName, style_module_scss_1.default.AddButton].join(' '), htmlFor: params.id, tabIndex: params.tabIndex, onKeyDown: function (event) {
+                var key = event.key;
+                if (params.tabIndex != -1) {
+                    if ([' ', 'Enter'].includes(key)) {
+                        $('#' + params.id).click();
+                    }
+                }
+            } },
+            React.createElement(_mols_1.Row.Center, { padding: ['1/3', 0] },
+                React.createElement(_atoms_1.Box, { isRounded: true, className: style_module_scss_1.default.AddIcon },
+                    React.createElement(_atoms_1.FAIcon, { d: 'cloud-arrow-up', className: style_module_scss_1.default.Icon, fontColor: 'theme', backgroundColor: 'tcOpLow', padding: 0, unitWidth: 4, unitHeight: 4, isRounded: true })),
+                React.createElement(_atoms_1.Box, null,
+                    React.createElement(_atoms_1.Box, { children: 'ファイルを選択' + "\uFF08".concat(Left, "\uFF09"), fontColor: 'theme', fontSize: '2.normal', isBoldFont: true }),
+                    React.createElement(_atoms_1.Box, { children: 'または、ファイルをドロップ', fontColor: '4.thin', fontSize: '0.xs' })))));
+    }
+    return (React.createElement(_mols_1.Column, { flexSizing: 'auto', className: params.className, children: Files }));
+};
+var FileCell = function (props) {
+    var index = props.index, file = props.file, className = props.className, val_status = props.val_status, set_status = props.set_status, _a = props.fileNameEdit, fileNameEdit = _a === void 0 ? true : _a;
+    var fileName = file.name, size = file.size, type = file.type;
+    var _b = __read(useState(false), 2), val_edit = _b[0], set_edit = _b[1];
+    var FileID = $.uuidGen();
+    var Size = size.rank();
+    var _c = __read(fileName
+        .replace(/\s/, '')
+        .replace(/(.*)\.(.*)$/, '$1 $2').split(' '), 2), name = _c[0], extension = _c[1];
+    var FileType = {
+        name: '不明',
+        icon: 'fal file'
+    };
+    if (type.match(/image/)) {
+        FileType = {
+            name: type.replace(/image\//, ''),
+            icon: 'image'
+        };
+    }
+    else if (type.match(/pdf/)) {
+        FileType = {
+            name: 'PDF',
+            icon: 'file-pdf'
+        };
+    }
+    else if (type.match(/csv/)) {
+        FileType = {
+            name: 'CSV',
+            icon: 'file-csv'
+        };
+    }
+    else if (type.match(/spreadsheet/)) {
+        FileType = {
+            name: 'SpreadSheet',
+            icon: 'file-excel'
+        };
+    }
+    else if (type.match(/presentation/)) {
+        FileType = {
+            name: 'PowerPoint',
+            icon: 'file-powerpoint'
+        };
+    }
+    else if (type.match(/word/)) {
+        FileType = {
+            name: 'Word',
+            icon: 'file-word'
+        };
+    }
+    else if (type.match(/zip/)) {
+        FileType = {
+            name: 'Zip',
+            icon: 'file-zipper'
+        };
+    }
+    else if (type.match(/powerpoint/)) {
+        FileType = {
+            name: 'PowerPoint',
+            icon: 'file-powerpoint'
+        };
+    }
+    else if (type.match(/html/)) {
+        FileType = {
+            name: 'HTML',
+            icon: 'fab html5'
+        };
+    }
+    else if (type.match(/js/)) {
+        FileType = {
+            name: 'JS',
+            icon: 'fab js-square'
+        };
+    }
+    else if (type.match(/css/)) {
+        FileType = {
+            name: 'CSS',
+            icon: 'fab css3-alt'
+        };
+    }
+    else if (type.match(/text\/plain/)) {
+        FileType = {
+            name: 'テキスト',
+            icon: 'file-lines'
+        };
+    }
+    useEffect(function () {
+        if (val_edit) {
+            setTimeout(function () {
+                $('#' + FileID)[0].focus();
+            }, 100);
+        }
+    }, [val_edit]);
+    return (React.createElement(_atoms_1.Flex, { verticalAlign: 'center', flexWrap: false, gap: 1, className: className },
+        React.createElement(_atoms_1.FAIcon, { fontSize: '4.thirdTitle', fontColor: 'theme', d: FileType.icon }),
+        React.createElement(_atoms_1.Box, { flexSizing: 0 },
+            React.createElement(_atoms_1.Box, null,
+                React.createElement(_atoms_1.Flex, { verticalAlign: 'center', gap: '2/3', flexWrap: false, className: style_module_scss_1.default.FileName, children: !val_edit ? React.createElement(React.Fragment, null,
+                        fileName,
+                        fileNameEdit ?
+                            React.createElement(_functions_1.Buttons.Button.Clear.R, { padding: '1/3', ssEffectsOnActive: 'expand', children: React.createElement(_atoms_1.FAIcon, { d: 'pen' }), onClick: function () {
+                                    set_edit(true);
+                                } }) : null) : React.createElement(React.Fragment, null,
+                        React.createElement(_mols_1.Column, { gap: '1/2', flexSizing: 0 },
+                            React.createElement(_atoms_1.Flex, { gap: '2/3', verticalAlign: 'center' },
+                                React.createElement(_functions_1.Input.Text.Normal, { tone: 'border', wrapStyles: {
+                                        flexSizing: 'auto'
+                                    }, restrict: 'fileName', name: 'name', required: true, id: FileID, form: 'form-' + FileID, enableFormSubmit: true, value: name, onKeyDown: function (event) {
+                                        var key = event.key;
+                                        if (key == 'Escape')
+                                            set_edit(false);
+                                    } }),
+                                React.createElement(_atoms_1.Box, null,
+                                    ". ",
+                                    extension)),
+                            React.createElement(_atoms_1.Flex, { gap: '2/3', horizontalAlign: 'right', flexWrap: false },
+                                React.createElement(_functions_1.Buttons.Button.Sub.R, { padding: ['2/3', 1], children: '閉じる', onClick: function () {
+                                        set_edit(false);
+                                    } }),
+                                React.createElement(_functions_1.Buttons.Button.Prime.R, { padding: ['2/3', 1], submitOption: {
+                                        formName: 'form-' + FileID,
+                                        submitDelegationKey: 'auxEnter',
+                                        callback: function (form) { return __awaiter(void 0, void 0, void 0, function () {
+                                            var name, nextFiles, prevFile, id, target, dataUrl, newBlob, newFile;
+                                            return __generator(this, function (_a) {
+                                                switch (_a.label) {
+                                                    case 0:
+                                                        name = form.name;
+                                                        nextFiles = __spreadArray([], __read(val_status.dataValue), false);
+                                                        prevFile = nextFiles[index];
+                                                        id = prevFile.id;
+                                                        if (!prevFile)
+                                                            return [2 /*return*/];
+                                                        return [4 /*yield*/, prevFile.read()];
+                                                    case 1:
+                                                        target = (_a.sent()).target;
+                                                        if (!target)
+                                                            return [2 /*return*/];
+                                                        dataUrl = String(target.result);
+                                                        return [4 /*yield*/, dataUrl.toBlob(file.type)];
+                                                    case 2:
+                                                        newBlob = _a.sent();
+                                                        if (!newBlob)
+                                                            return [2 /*return*/];
+                                                        newFile = new File([newBlob], name + '.' + extension, { type: prevFile.type });
+                                                        newFile.id = id;
+                                                        nextFiles[index] = newFile;
+                                                        set_status(__assign(__assign({}, val_status), { dataValue: nextFiles, eventType: 'update', eventID: $.uuidGen() }));
+                                                        set_edit(false);
+                                                        return [2 /*return*/];
+                                                }
+                                            });
+                                        }); }
+                                    } }, "\u6C7A\u5B9A")))) })),
+            !val_edit ? React.createElement(React.Fragment, null,
+                React.createElement(_atoms_1.Box, { fontSize: '1.mini', fontColor: '4.thin', flexSizing: 0, children: FileType.name + 'ファイル / ' + Size + 'B' })) : null),
+        React.createElement(_functions_1.Buttons.Button.Sub.R, { ssSphere: 3, onClick: function () {
+                var nextFiles = __spreadArray([], __read(val_status.dataValue), false);
+                var prevFile = nextFiles[index];
+                if (!prevFile)
+                    return;
+                nextFiles.splice(index, 1);
+                set_status(__assign(__assign({}, val_status), { dataValue: nextFiles, eventType: 'update', eventID: $.uuidGen() }));
+            } },
+            React.createElement(_atoms_1.FAIcon.Times, null))));
+};
+(function () { return __awaiter(void 0, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+        $(document).addEvent({
+            eventType: 'dragover',
+            callback: function (event) {
+                event.preventDefault();
+                $('.' + style_module_scss_1.default.AddButton).addClass(style_module_scss_1.default.Draggable);
+            },
+            option: {
+                passive: false
+            }
+        }).addEvent({
+            eventType: 'drop',
+            callback: function (event) {
+                event.preventDefault();
+                $('.' + style_module_scss_1.default.AddButton).removeClass(style_module_scss_1.default.Draggable);
+                var Files = event.dataTransfer.files;
+                if (Files.length) {
+                    var Target = event.target;
+                    if ($(Target).hasClass(style_module_scss_1.default.AddButton)) {
+                        var inputComponentId = Target.dataset.inputComponentId;
+                        var component = _global_1.useStore.get(inputComponentId);
+                        if (component && component.AddFiles)
+                            component.AddFiles(Files);
+                    }
+                }
+            },
+            option: {
+                passive: false
+            }
+        });
+        return [2 /*return*/];
+    });
+}); })();
+var FileInput = FileComponent;
+exports.FileInput = FileInput;
+FileInput.fn = {
+    openDialog: function (params) {
+        var multiple = params.multiple, accept = params.accept;
+        return new Promise(function (resolve) {
+            var input = document.createElement('input');
+            input.type = 'file';
+            input.multiple = multiple !== null && multiple !== void 0 ? multiple : true;
+            if (accept) {
+                if (accept == 'image')
+                    input.accept = 'image/png,image/jpeg';
+                else
+                    input.accept = accept;
+            }
+            input.onchange = function (event) {
+                resolve(event.target.files);
+            };
+            input.click();
+        });
+    }
+};

package/dist/@comps/Functions/Input/Hidden.d.ts

@@ -0,0 +1 @@
+export declare const HiddenInput: FNC<amotify.fn.Input.Hidden.PlainParams>;

package/dist/@comps/Functions/Input/Hidden.js

@@ -0,0 +1,30 @@
+"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.HiddenInput = void 0;
+var HiddenInput = function (params) {
+    var _a = params.componentID, componentID = _a === void 0 ? '' : _a, form = params.form, _b = params.value, value = _b === void 0 ? '' : _b, others = __rest(params, ["componentID", "form", "value"]);
+    return (React.createElement("input", __assign({ value: JSON.stringify(value), "data-input-type": 'hidden', "data-form": form, "data-component-id": componentID, "data-value": JSON.stringify(value) }, others, { type: 'hidden' })));
+};
+exports.HiddenInput = HiddenInput;

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

@@ -0,0 +1 @@
+export declare const ListInput: FNC<amotify.fn.Input.List.OriginParams>;