amotify 0.0.0

package/dist/@comps/Functions/Tooltips/parts.js

@@ -0,0 +1,71 @@
+"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 __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));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tooltips = void 0;
+var _atoms_1 = require("@atoms");
+var _functions_1 = require("@functions");
+var Tooltips = {
+    __memoryID: $.uuidGen(),
+    open: function (params) {
+        var _a = params.tipsID, tipsID = _a === void 0 ? $.uuidGen() : _a, _b = params.tipsGroups, tipsGroups = _b === void 0 ? [] : _b, sheetParams = __rest(params, ["tipsID", "tipsGroups"]);
+        _functions_1.Sheet.open(__assign({ sheetID: tipsID, sheetGroups: __spreadArray([
+                'tooltips'
+            ], __read(tipsGroups), false), closeOption: __assign({ aroundClick: true, elementBlur: params.parent, escapeKeyDown: true, pageTransit: true }, params.closeOption), type: 'custom' }, sheetParams));
+    },
+    close: function (tipsID) {
+        _functions_1.Sheet.close(tipsID);
+    },
+    closeALL: function () {
+        _functions_1.Sheet.closeGroup('tooltips');
+    },
+    Comps: {
+        Body: function (params) { return (React.createElement(_atoms_1.Box, __assign({ padding: ['1/3', '2/3'], backgroundColor: 'dark', borderRadius: '2.tone.secondary', fontColor: 'white', boxShadow: 2 }, params))); }
+    }
+};
+exports.Tooltips = Tooltips;

package/dist/@comps/Molecules/@export.d.ts

@@ -0,0 +1,21 @@
+import { List } from './List';
+import { Accordion } from './Accordion/parts';
+import { LinkifyText } from './LinkifyText/parts';
+declare const Text: {
+    Title: (params: amotify.atoms.BoxInput) => JSX.Element;
+    SubTitle: (params: amotify.atoms.BoxInput) => JSX.Element;
+    ThirdTitle: (params: amotify.atoms.BoxInput) => JSX.Element;
+    Paragraph: (params: amotify.atoms.BoxInput) => JSX.Element;
+    Normal: (params: amotify.atoms.BoxInput) => JSX.Element;
+    Description: (params: amotify.atoms.BoxInput) => JSX.Element;
+    Supplement: (params: amotify.atoms.BoxInput) => JSX.Element;
+    NowrapSpan: (params: amotify.atoms.SpanProps) => JSX.Element;
+};
+declare const Row: {
+    Center: (params: amotify.atoms.FlexProps) => JSX.Element;
+    Left: (params: amotify.atoms.FlexProps) => JSX.Element;
+    Right: (params: amotify.atoms.FlexProps) => JSX.Element;
+    Separate: (params: amotify.atoms.FlexProps) => JSX.Element;
+};
+declare const Column: (params: amotify.atoms.FlexProps) => JSX.Element;
+export { List, Accordion, LinkifyText, Text, Column, Row };

package/dist/@comps/Molecules/@export.js

@@ -0,0 +1,50 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Row = exports.Column = exports.Text = exports.LinkifyText = exports.Accordion = exports.List = void 0;
+var _atoms_1 = require("@atoms");
+var List_1 = require("./List");
+Object.defineProperty(exports, "List", { enumerable: true, get: function () { return List_1.List; } });
+var parts_1 = require("./Accordion/parts");
+Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return parts_1.Accordion; } });
+var parts_2 = require("./LinkifyText/parts");
+Object.defineProperty(exports, "LinkifyText", { enumerable: true, get: function () { return parts_2.LinkifyText; } });
+var Text = {
+    Title: function (params) { return (React.createElement(_atoms_1.Box, __assign({ fontSize: '6.title', fontWeight: '3.bold' }, params))); },
+    SubTitle: function (params) { return (React.createElement(_atoms_1.Box, __assign({ fontSize: '5.subTitle', fontWeight: '3.bold' }, params))); },
+    ThirdTitle: function (params) { return (React.createElement(_atoms_1.Box, __assign({ fontSize: '4.thirdTitle', fontWeight: '3.bold' }, params))); },
+    Paragraph: function (params) { return (React.createElement(_atoms_1.Box, __assign({ fontSize: '3.paragraph', fontWeight: '3.bold' }, params))); },
+    Normal: function (params) { return (React.createElement(_atoms_1.Box, __assign({}, params))); },
+    Description: function (params) { return (React.createElement(_atoms_1.Box, __assign({}, params, { freeCSS: __assign({ whiteSpace: 'pre-wrap' }, params.freeCSS) }))); },
+    Supplement: function (params) { return (React.createElement(_atoms_1.Box, __assign({ fontSize: '1.mini' }, params))); },
+    NowrapSpan: function (params) { return (React.createElement(_atoms_1.Span, __assign({}, params, { freeCSS: __assign({ whiteSpace: 'nowrap' }, params.freeCSS) }))); }
+};
+exports.Text = Text;
+var Row = {
+    Center: function (params) { return (React.createElement(_atoms_1.Flex, __assign({ horizontalAlign: 'center', verticalAlign: 'center', flexWrap: false, gap: 1 }, params))); },
+    Left: function (params) { return (React.createElement(_atoms_1.Flex, __assign({ horizontalAlign: 'left', verticalAlign: 'center', flexWrap: false, gap: 1 }, params))); },
+    Right: function (params) { return (React.createElement(_atoms_1.Flex, __assign({ horizontalAlign: 'right', verticalAlign: 'center', flexWrap: false, gap: 1 }, params))); },
+    Separate: function (params) { return (React.createElement(_atoms_1.Flex, __assign({ horizontalAlign: 'between', verticalAlign: 'center', flexWrap: false, gap: 1 }, params))); },
+};
+exports.Row = Row;
+var Column = function (params) { return (React.createElement(_atoms_1.Flex, __assign({ flexType: 'col', gap: 1 }, params))); };
+exports.Column = Column;
+global.amotify.mols = {
+    List: List_1.List,
+    Accordion: parts_1.Accordion,
+    LinkifyText: parts_2.LinkifyText,
+    Text: Text,
+    Column: Column,
+    Row: Row
+};
+Object.freeze(global.amotify.mols);

package/dist/@comps/Molecules/Accordion/parts.d.ts

@@ -0,0 +1,2 @@
+declare const Accordion: amotify.mols.Accordion.SetParams;
+export { Accordion };

package/dist/@comps/Molecules/Accordion/parts.js

@@ -0,0 +1,165 @@
+"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.Accordion = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var useEffect = _global_1.React.useEffect, useState = _global_1.React.useState;
+var style_module_scss_1 = __importDefault(require("./style.module.scss"));
+var Component = function (params) {
+    var _a = params.accordionID, accordionID = _a === void 0 ? '' : _a, _b = params.slideAnimation, slideAnimation = _b === void 0 ? 'fast' : _b, _c = params.open, open = _c === void 0 ? false : _c, others = __rest(params, ["accordionID", "slideAnimation", "open"]);
+    var _d = __read(useState($.uuidGen()), 1), val_wrapID = _d[0];
+    var _e = __read(useState($.uuidGen()), 1), val_contentID = _e[0];
+    var _f = __read(useState(open), 2), val_open = _f[0], set_open = _f[1];
+    if (val_open != open)
+        set_open(open);
+    var Query = '[data-accordion-content-id="' + val_contentID + '"]';
+    var mounted = _global_1.React.useRef(false);
+    useEffect(function () {
+        var Content = $(Query)[0];
+        if (Content) {
+            var contentHeight = Content.offsetHeight;
+            var transitionTime = 0;
+            if (slideAnimation == 'fast') {
+                transitionTime = contentHeight / 1000;
+                transitionTime = Math.max(transitionTime, .2);
+            }
+            else if (slideAnimation == 'slow') {
+                transitionTime = contentHeight / 300;
+            }
+            $('#' + val_wrapID).css({
+                transition: transitionTime + 's'
+            });
+        }
+    }, []);
+    useEffect(function () {
+        var Wrap = $('#' + val_wrapID);
+        var Content = $(Query)[0];
+        if (mounted.current) {
+            if (Content) {
+                var contentHeight = Content.offsetHeight;
+                if ($.is.exist(contentHeight)) {
+                    if (val_open) {
+                        Wrap.css({
+                            maxHeight: (contentHeight + 1) + 'px',
+                        }).await(200).css({
+                            maxHeight: 'unset',
+                            overflow: params.overflow || 'unset'
+                        });
+                    }
+                    else {
+                        Wrap.css({
+                            maxHeight: (contentHeight + 1) + 'px',
+                        }).await(100).css({
+                            maxHeight: 0 + 'px',
+                            overflow: 'hidden'
+                        });
+                    }
+                }
+            }
+        }
+        else {
+            mounted.current = true;
+            if (Content) {
+                var contentHeight = Content.offsetHeight;
+                if ($.is.exist(contentHeight)) {
+                    if (val_open) {
+                        Wrap.css({
+                            maxHeight: (contentHeight + 1) + 'px',
+                        }).await(200).css({
+                            maxHeight: 'unset',
+                            overflow: params.overflow || 'unset'
+                        });
+                    }
+                    else {
+                        Wrap
+                            .css({
+                            maxHeight: 0 + 'px',
+                            overflow: 'hidden'
+                        });
+                    }
+                }
+            }
+        }
+    }, [val_open]);
+    if (accordionID) {
+        _global_1.useStore.set({
+            key: 'Accordion-' + accordionID,
+            value: {
+                open: function () {
+                    set_open(true);
+                    params.open = true;
+                },
+                close: function () {
+                    set_open(false);
+                    params.open = false;
+                },
+                toggle: function () {
+                    set_open(!val_open);
+                    params.open = !val_open;
+                }
+            }
+        });
+    }
+    return (_global_1.React.createElement(_atoms_1.Box, { className: [
+            style_module_scss_1.default.Wrap,
+            style_module_scss_1.default['Open_' + val_open]
+        ].join(' '), id: val_wrapID },
+        _global_1.React.createElement(_atoms_1.Box, __assign({ "data-accordion-content-id": val_contentID }, others))));
+};
+var Accordion = Component;
+exports.Accordion = Accordion;
+Accordion.fn = {
+    open: function (id) {
+        var component = _global_1.useStore.get('Accordion-' + id);
+        !component || component.open();
+    },
+    close: function (id) {
+        var component = _global_1.useStore.get('Accordion-' + id);
+        !component || component.close();
+    },
+    toggle: function (id) {
+        var component = _global_1.useStore.get('Accordion-' + id);
+        !component || component.toggle();
+    }
+};

package/dist/@comps/Molecules/LinkifyText/parts.d.ts

@@ -0,0 +1 @@
+export declare const LinkifyText: FNC<amotify.mols.LinkifyTextProps>;

package/dist/@comps/Molecules/LinkifyText/parts.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LinkifyText = void 0;
+var _atoms_1 = require("@atoms");
+var _functions_1 = require("@functions");
+var Anchor = _functions_1.Buttons.Anchor;
+var LinkifyText = function (props) {
+    var text = props.text, placeholder = props.placeholder;
+    var Description = [];
+    if (text) {
+        var urls_1 = [];
+        text = text.replace(/https?:\/\/[^\s|\n|\r]*/ig, function () {
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i] = arguments[_i];
+            }
+            var url = args[0];
+            urls_1.push(url);
+            return '[$_url]';
+        });
+        var parts = text.split('[$_url]');
+        for (var index = 0; index <= parts.length - 1; index++) {
+            var part = parts[index];
+            var url = urls_1[index];
+            Description.push(part);
+            if (index < parts.length - 1) {
+                Description.push(React.createElement(Anchor.Link, { key: 'Link-' + index, href: url, newTab: true },
+                    url,
+                    " ",
+                    React.createElement(_atoms_1.FAIcon, { d: 'arrow-up-right-from-square' })));
+            }
+        }
+    }
+    else if (placeholder) {
+        Description = [placeholder];
+    }
+    return (React.createElement(React.Fragment, null, Description));
+};
+exports.LinkifyText = LinkifyText;

package/dist/@comps/Molecules/List.d.ts

@@ -0,0 +1 @@
+export declare const List: FNC<amotify.mols.List.Params>;

package/dist/@comps/Molecules/List.js

@@ -0,0 +1,35 @@
+"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.List = void 0;
+var _atoms_1 = require("@atoms");
+var List = function (params) {
+    var rows = params.rows, DefaultRowStyles = params.rowStyles, others = __rest(params, ["rows", "rowStyles"]);
+    var rowArray = rows.map(function (row) {
+        var children = row.children, others = __rest(row, ["children"]);
+        return React.createElement(_atoms_1.Flex, __assign({}, DefaultRowStyles, others, { children: children }));
+    });
+    return React.createElement(_atoms_1.Flex, __assign({}, others, { flexType: 'col', children: rowArray }));
+};
+exports.List = List;

package/dist/@comps/Organisms/@export.d.ts

@@ -0,0 +1,2 @@
+import { DisplayStyleInput } from './DisplayStyleInput/_';
+export { DisplayStyleInput };

package/dist/@comps/Organisms/@export.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DisplayStyleInput = void 0;
+var _1 = require("./DisplayStyleInput/_");
+Object.defineProperty(exports, "DisplayStyleInput", { enumerable: true, get: function () { return _1.DisplayStyleInput; } });
+global.amotify.orgs = {
+    DisplayStyleInput: _1.DisplayStyleInput,
+};
+Object.freeze(global.amotify.orgs);

package/dist/@comps/Organisms/DisplayStyleInput/_.d.ts

@@ -0,0 +1 @@
+export declare const DisplayStyleInput: amotify.orgs.DisplayStyleInput.Methods;

package/dist/@comps/Organisms/DisplayStyleInput/_.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DisplayStyleInput = void 0;
+var darkmode_1 = require("./darkmode");
+var themeColor_1 = require("./themeColor");
+exports.DisplayStyleInput = {
+    Darkmode: darkmode_1.Darkmode,
+    ThemeColor: {
+        ALL: themeColor_1.ThemeColorALL,
+        Originals: themeColor_1.ThemeColorOriginal,
+        Brands: themeColor_1.ThemeColorBrands,
+        Basics: themeColor_1.ThemeColorBasic,
+        Keys: themeColor_1.Colors,
+    }
+};

package/dist/@comps/Organisms/DisplayStyleInput/darkmode.d.ts

@@ -0,0 +1 @@
+export declare const Darkmode: (params: amotify.orgs.DisplayStyleInput.DarkmodeInput) => JSX.Element;

package/dist/@comps/Organisms/DisplayStyleInput/darkmode.js

@@ -0,0 +1,77 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Darkmode = void 0;
+var _global_1 = require("@global");
+var _atoms_1 = require("@atoms");
+var _mols_1 = require("@mols");
+var _functions_1 = require("@functions");
+var useState = _global_1.React.useState, useEffect = _global_1.React.useEffect;
+var ColorCell = function (params) {
+    if (params.colorType == 'light') {
+        return _global_1.React.createElement(_atoms_1.Box, { freeCSS: {
+                backgroundColor: '#FFF'
+            }, width: 1, height: 1, isRounded: true });
+    }
+    else if (params.colorType == 'dark') {
+        return _global_1.React.createElement(_atoms_1.Box, { freeCSS: {
+                backgroundColor: '#333'
+            }, width: 1, height: 1, isRounded: true });
+    }
+    else if (params.colorType == 'dim') {
+        return _global_1.React.createElement(_atoms_1.Box, { freeCSS: {
+                backgroundColor: '#666'
+            }, width: 1, height: 1, isRounded: true });
+    }
+    return _global_1.React.createElement(_mols_1.Column, { width: 1, height: 1, isRounded: true, flexChilds: 'even', overflow: 'hidden', gap: '1/6', freeCSS: {
+            transform: 'rotate(-45deg)'
+        } },
+        _global_1.React.createElement(_atoms_1.Box, { freeCSS: {
+                backgroundColor: '#FFF'
+            }, borderRadius: 1 }),
+        _global_1.React.createElement(_atoms_1.Box, { freeCSS: {
+                backgroundColor: '#333'
+            }, borderRadius: 1 }));
+};
+var Darkmode = function (params) {
+    var _a = __read(useState(amotify.config.darkMode || 'light'), 2), val_darkmode = _a[0], set_darkmode = _a[1];
+    var mounted = _global_1.React.useRef(false);
+    useEffect(function () {
+        if (mounted.current) {
+            params.onUpdate(val_darkmode);
+        }
+        else {
+            mounted.current = true;
+        }
+    }, [val_darkmode]);
+    return _global_1.React.createElement(_functions_1.Input.Radio, { icon: false, value: val_darkmode, cellStyles: {
+            padding: '1/3',
+            borderWidth: 2,
+            ssSphere: 4,
+            isRounded: true
+        }, options: [
+            { value: 'light', label: _global_1.React.createElement(ColorCell, { colorType: 'light' }) },
+            { value: 'dark', label: _global_1.React.createElement(ColorCell, { colorType: 'dark' }) },
+            { value: 'dim', label: _global_1.React.createElement(ColorCell, { colorType: 'dim' }) },
+            { value: 'auto', label: _global_1.React.createElement(ColorCell, { colorType: 'auto' }) },
+        ], onUpdateValidValue: function (_a) {
+            var value = _a.value;
+            set_darkmode(value[0]);
+        } });
+};
+exports.Darkmode = Darkmode;

package/dist/@comps/Organisms/DisplayStyleInput/themeColor.d.ts

@@ -0,0 +1,27 @@
+export declare const Colors: {
+    Basics: ({
+        key: string;
+        icon: JSX.Element;
+    } | {
+        key: string;
+        icon: string;
+    })[];
+    Brands: {
+        key: string;
+        icon: JSX.Element;
+        label: string;
+    }[];
+    Originals: ({
+        key: string;
+        icon: string;
+        label?: undefined;
+    } | {
+        key: string;
+        icon: string;
+        label: string;
+    })[];
+};
+export declare const ThemeColorALL: FNC<amotify.orgs.DisplayStyleInput.ThemeColorInput>;
+export declare const ThemeColorBasic: FNC<amotify.orgs.DisplayStyleInput.ThemeColorInput>;
+export declare const ThemeColorOriginal: FNC<amotify.orgs.DisplayStyleInput.ThemeColorInput>;
+export declare const ThemeColorBrands: FNC<amotify.orgs.DisplayStyleInput.ThemeColorInput>;