react-ui-basics 0.0.137 → 0.0.138

package/Table.js

@@ -107,14 +107,19 @@ var Table = function (_Component) {
   _createClass(Table, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _this2 = this;
+      var _columns$find,
+          _this2 = this;
       var _this$props = this.props,
           sortBy = _this$props.sortBy,
           _this$props$sortOrder = _this$props.sortOrder,
-          sortOrder = _this$props$sortOrder === void 0 ? SORT_ASC : _this$props$sortOrder;
+          sortOrder = _this$props$sortOrder === void 0 ? SORT_ASC : _this$props$sortOrder,
+          columns = _this$props.columns;
       this.setState({
         sortBy: sortBy,
-        sortOrder: sortOrder
+        sortOrder: sortOrder,
+        comparator: (_columns$find = columns.find(function (it) {
+          return it.field === sortBy;
+        })) == null ? void 0 : _columns$find.comparator
       }, function () {
         return _this2.setData(_this2.props.data);
       });

package/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../src/react-ui-basics/Table.js"],"sourcesContent":["import React, {Component} from 'react';\nimport ReactCreateElement from './ReactCreateElement';\nimport './Table.css'\nimport PropTypes from \"prop-types\";\nimport TextField from \"./TextField\";\nimport AutocompleteSelect, {MODE_DEFAULT, MODE_MULTIPLE_MINI} from \"./AutocompleteSelect\";\nimport Switch from \"./Switch\";\nimport {Comparators, NOOP, classNames, preventDefault, stopPropagation, isFunction, isString, orNoop} from \"./Tools\";\nimport MaterialIcon from \"./MaterialIcon\";\n\nexport const SORT_ASC = Comparators.SORT_ASC;\nexport const SORT_DESC = Comparators.SORT_DESC;\n\nconst getId = item => item.id;\n\n\nclass Table extends Component {\n\n    constructor(props) {\n        super(props);\n        this.state = {};\n    }\n\n    componentDidMount() {\n        const {sortBy, sortOrder = SORT_ASC} = this.props;\n        this.setState({sortBy, sortOrder}, () => this.setData(this.props.data));\n\n        this.updateHeaders();\n        this.updateHeadersInterval = setInterval(this.updateHeaders, 1000)\n    };\n\n    setData = (data) => {\n        const {sortBy, sortOrder, comparator} = this.state;\n        if (sortBy) {\n            let c = comparator\n            if(c && sortOrder === SORT_DESC)\n                c = Comparators.inverse(c)\n\n            data.sort(c || Comparators.of(sortBy, sortOrder, data));\n            this.setState({data}, () => {\n                orNoop(this.props.onSortChange)(sortBy, sortOrder)\n            })\n        }\n    };\n\n    componentDidUpdate(prevProps, prevState, snapshot) {\n        if (this.props.data !== prevProps.data) {\n            this.setData(this.props.data)\n        }\n        this.updateHeaders();\n    };\n\n    render() {\n        const {columns = [], onRowClick = NOOP, disabled, className, rowClassName, toKey = getId} = this.props;\n        const {sortBy, sortOrder, data = [], editing} = this.state;\n        return (\n            <table className={classNames(`Table`, className)}>\n                <thead>\n                <tr ref={headers => this.headers = headers}>\n                    {columns.filter(it => !!it).map((column, i) => {\n                        const sortable = column.sortable || column.sortable == null;\n                        return (\n                            <th key={i} onClick={e => sortable && this.sort(e, column.field, column.comparator)}>\n                                <div className={classNames('hidden', sortable && 'sortable', sortBy === column.field && 'active')}>\n                                    {column.header}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_ASC && (<MaterialIcon icon={'keyboard_arrow_up'}/>)}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_DESC && (<MaterialIcon icon={'keyboard_arrow_down'}/>)}\n                                </div>\n                                <div className={classNames('fixed', sortable && 'sortable', sortBy === column.field && 'active')}>\n                                    {column.header}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_ASC && (<MaterialIcon icon={'keyboard_arrow_up'}/>)}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_DESC && (<MaterialIcon icon={'keyboard_arrow_down'}/>)}\n                                </div>\n                            </th>\n                        );\n                    })}\n                </tr>\n                </thead>\n                <tbody>\n                {data.map(item => (<Row key={toKey(item)}\n                                        item={item}\n                                        disabled={disabled}\n                                        editing={editing && editing.id === item.id ? editing : null}\n                                        onClick={onRowClick}\n                                        className={rowClassName}\n                                        columns={columns}\n                                        editingContext={this}\n                    />\n                ))}\n                </tbody>\n            </table>\n        );\n    };\n\n    componentWillUnmount() {\n        clearInterval(this.updateHeadersInterval)\n    };\n\n    updateHeaders = () => {\n        const headers = this.headers;\n\n        const hidden = headers.querySelectorAll('.hidden');\n        const fixed = headers.querySelectorAll('.fixed');\n        for (let i = 0; i < hidden.length; i++) {\n            fixed[i].style.width = hidden[i].offsetWidth + 'px'\n        }\n    };\n\n    cancelEditing = () => this.setState({editing: false});\n\n    setEditing = (item, columnIndex, field) => this.setState({editing: this.prepareEditing(item, field, columnIndex)});\n\n    prepareEditing = (item, field, columnIndex) => ({id: item.id, value: item[field], columnIndex, item, field});\n\n    handleInputChange = (event) => {\n        const value = this.extractValue(event);\n        this.setState({editing: {...this.state.editing, value}});\n    };\n\n    extractValue = (event) => {\n        const target = event.target;\n        return target.type === 'checkbox' ? target.checked : target.value;\n    };\n\n    selectNewValue = (value) => {\n        this.setState({editing: {...this.state.editing, value}}, this.onFinishEditing);\n    };\n\n    onFinishEditing = (e) => {\n        const editing = this.state.editing;\n        if (editing.value === null)\n            return;\n\n        let value = editing.value;\n        if (isString(value))\n            value = value.trim();\n\n        if (value === editing.item[editing.field])\n            return this.cancelEditing();\n\n        let updated = {\n            ...editing.item,\n            [editing.field]: value\n        };\n        this.props.onChange(updated, this.cancelEditing)\n    };\n\n    sort = (e, sortBy, comparator) => {\n        preventDefault(e);\n        this.setState({\n            sortOrder: this.state.sortBy === sortBy && this.state.sortOrder === SORT_ASC ? SORT_DESC : SORT_ASC,\n            comparator,\n            sortBy\n        }, () => this.setData(this.state.data));\n    }\n}\n\nconst formatValue = (item, column) => {\n    const value = (column.value !== undefined) ? column.value : item[column.field];\n    if (column.formatter) {\n        return column.formatter(value, item, column.format)\n    } else {\n        return '' + value\n    }\n};\n\nconst Row = React.memo(({item, disabled, editing, onClick, className, columns, editingContext}) => {\n    return <tr onClick={e => onClick(item)}\n               className={classNames(disabled && disabled(item) && 'disabled', className && (isFunction(className) ? className(item) : className))}>\n        {columns.filter(it => !!it).map((column, i) => {\n            const isEditing = editing && editing.id === item.id && editing.columnIndex === i;\n            const editable = isFunction(column.editable) ? column.editable(item) : !!column.editable;\n            return (\n                <td key={i}\n                    className={classNames(editable ? 'editable' : 'ro', isEditing && 'editing', column.className)}\n                    onClick={!isEditing && editable ? () => editingContext.setEditing(item, i, column.field) : NOOP}>\n                    {(isEditing || column.displayEditor) && !column.editor && (\n                        <TextField\n                            value={column.preEditor ? column.preEditor(editing.value) : editing.value}\n                            focused={true}\n                            onBlur={editingContext.cancelEditing}\n                            onChange={editingContext.handleInputChange}\n                            onKeyDown={e => {\n                                if (e.keyCode === 27/*escape*/) {\n                                    preventDefault(e);\n                                    editingContext.cancelEditing();\n                                }\n                                if (e.keyCode === 13/*enter*/) {\n                                    preventDefault(e);\n                                    editingContext.onFinishEditing();\n                                }\n                            }}\n                        />\n                    )}\n                    {(isEditing || column.displayEditor) && column.editor === 'Select' && (\n                        <AutocompleteSelect\n                            value={column.preEditor ? column.preEditor(editing.value) : editing.value}\n                            data={column.editorData}\n                            focused={true}\n                            withArrow={false}\n                            withFilter={false}\n                            selectedMode={'inline'}\n                            selectedComponent={column.editorSelectedComponent}\n                            mode={column.multiSelect ? MODE_MULTIPLE_MINI : MODE_DEFAULT}\n                            onChange={column.multiSelect && (column.onSelect ? (value => editingContext.selectNewValue(column.onSelect(value))) : editingContext.selectNewValue)}\n                            onSelect={!column.multiSelect && (column.onSelect ? (value => editingContext.selectNewValue(column.onSelect(value))) : editingContext.selectNewValue)}\n                            childComponent={column.editorChildCompononRowClickent}\n                            onCancel={editingContext.cancelEditing}\n                            prefilter={column.prefilter}\n                        />\n                    )}\n                    {(isEditing || column.displayEditor) && column.editor === 'Switch' && (\n                        <Switch onClick={e => {\n                            stopPropagation(e);\n                            preventDefault(e);\n                            editingContext.setState({\n                                editing: {\n                                    ...editingContext.prepareEditing(item, column.field, i),\n                                    value: !item[column.field]\n                                }\n                            }, editingContext.onFinishEditing);\n                        }} value={item[column.field]}/>\n                    )}\n                    {(isEditing || column.displayEditor) && isFunction(column.editor) && column.editor(item, editingContext.cancelEditing, isEditing)}\n                    {!isEditing && !column.displayEditor && formatValue(item, column)}\n                </td>\n            );\n        })}\n    </tr>\n    }\n)\n\nTable.defaultProps = {\n    columns: [],\n    onRowClick: NOOP,\n    toKey: getId,\n};\n\nif (window.isNotProductionEnvironment) {\n    Table.propTypes = {\n        className: PropTypes.string,\n        rowClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n        columns: PropTypes.arrayOf(PropTypes.shape({\n            header: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n            className: PropTypes.string,\n            sortable: PropTypes.bool,\n            field: PropTypes.string,\n            formatter: PropTypes.func,\n            comparator: PropTypes.func,\n            editable: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n            editor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n            displayEditor: PropTypes.bool,\n            preEditor: PropTypes.func,\n        })),\n        data: PropTypes.array,\n        disabled: PropTypes.func,\n        onRowClick: PropTypes.func,\n        onSortChange: PropTypes.func,\n        onChange: PropTypes.func,\n        toKey: PropTypes.func,\n    };\n}\n\n\nexport default Table;"],"names":["SORT_ASC","Comparators","SORT_DESC","getId","item","id","Table","props","setData","data","state","sortBy","sortOrder","comparator","c","inverse","sort","of","setState","orNoop","onSortChange","updateHeaders","headers","hidden","querySelectorAll","fixed","i","length","style","width","offsetWidth","cancelEditing","editing","setEditing","columnIndex","field","prepareEditing","value","handleInputChange","event","extractValue","target","type","checked","selectNewValue","onFinishEditing","e","isString","trim","updated","onChange","preventDefault","updateHeadersInterval","setInterval","prevProps","prevState","snapshot","columns","onRowClick","NOOP","disabled","className","rowClassName","toKey","classNames","filter","it","map","column","sortable","header","clearInterval","Component","formatValue","undefined","formatter","format","Row","React","memo","onClick","editingContext","isFunction","isEditing","editable","displayEditor","editor","preEditor","keyCode","editorData","editorSelectedComponent","multiSelect","MODE_MULTIPLE_MINI","MODE_DEFAULT","onSelect","editorChildCompononRowClickent","prefilter","stopPropagation","defaultProps","window","isNotProductionEnvironment","propTypes","PropTypes","string","oneOfType","func","arrayOf","shape","element","bool","array"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../src/react-ui-basics/Table.js"],"sourcesContent":["import React, {Component} from 'react';\nimport ReactCreateElement from './ReactCreateElement';\nimport './Table.css'\nimport PropTypes from \"prop-types\";\nimport TextField from \"./TextField\";\nimport AutocompleteSelect, {MODE_DEFAULT, MODE_MULTIPLE_MINI} from \"./AutocompleteSelect\";\nimport Switch from \"./Switch\";\nimport {Comparators, NOOP, classNames, preventDefault, stopPropagation, isFunction, isString, orNoop} from \"./Tools\";\nimport MaterialIcon from \"./MaterialIcon\";\n\nexport const SORT_ASC = Comparators.SORT_ASC;\nexport const SORT_DESC = Comparators.SORT_DESC;\n\nconst getId = item => item.id;\n\n\nclass Table extends Component {\n\n    constructor(props) {\n        super(props);\n        this.state = {};\n    }\n\n    componentDidMount() {\n        const {sortBy, sortOrder = SORT_ASC, columns} = this.props;\n        this.setState({\n            sortBy,\n            sortOrder,\n            comparator: columns.find(it => it.field === sortBy)?.comparator\n        }, () => this.setData(this.props.data));\n\n        this.updateHeaders();\n        this.updateHeadersInterval = setInterval(this.updateHeaders, 1000)\n    };\n\n    setData = (data) => {\n        const {sortBy, sortOrder, comparator} = this.state;\n        if (sortBy) {\n            let c = comparator\n            if(c && sortOrder === SORT_DESC)\n                c = Comparators.inverse(c)\n\n            data.sort(c || Comparators.of(sortBy, sortOrder, data));\n            this.setState({data}, () => {\n                orNoop(this.props.onSortChange)(sortBy, sortOrder)\n            })\n        }\n    };\n\n    componentDidUpdate(prevProps, prevState, snapshot) {\n        if (this.props.data !== prevProps.data) {\n            this.setData(this.props.data)\n        }\n        this.updateHeaders();\n    };\n\n    render() {\n        const {columns = [], onRowClick = NOOP, disabled, className, rowClassName, toKey = getId} = this.props;\n        const {sortBy, sortOrder, data = [], editing} = this.state;\n        return (\n            <table className={classNames(`Table`, className)}>\n                <thead>\n                <tr ref={headers => this.headers = headers}>\n                    {columns.filter(it => !!it).map((column, i) => {\n                        const sortable = column.sortable || column.sortable == null;\n                        return (\n                            <th key={i} onClick={e => sortable && this.sort(e, column.field, column.comparator)}>\n                                <div className={classNames('hidden', sortable && 'sortable', sortBy === column.field && 'active')}>\n                                    {column.header}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_ASC && (<MaterialIcon icon={'keyboard_arrow_up'}/>)}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_DESC && (<MaterialIcon icon={'keyboard_arrow_down'}/>)}\n                                </div>\n                                <div className={classNames('fixed', sortable && 'sortable', sortBy === column.field && 'active')}>\n                                    {column.header}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_ASC && (<MaterialIcon icon={'keyboard_arrow_up'}/>)}\n                                    {column.header && sortBy === column.field && sortOrder === SORT_DESC && (<MaterialIcon icon={'keyboard_arrow_down'}/>)}\n                                </div>\n                            </th>\n                        );\n                    })}\n                </tr>\n                </thead>\n                <tbody>\n                {data.map(item => (<Row key={toKey(item)}\n                                        item={item}\n                                        disabled={disabled}\n                                        editing={editing && editing.id === item.id ? editing : null}\n                                        onClick={onRowClick}\n                                        className={rowClassName}\n                                        columns={columns}\n                                        editingContext={this}\n                    />\n                ))}\n                </tbody>\n            </table>\n        );\n    };\n\n    componentWillUnmount() {\n        clearInterval(this.updateHeadersInterval)\n    };\n\n    updateHeaders = () => {\n        const headers = this.headers;\n\n        const hidden = headers.querySelectorAll('.hidden');\n        const fixed = headers.querySelectorAll('.fixed');\n        for (let i = 0; i < hidden.length; i++) {\n            fixed[i].style.width = hidden[i].offsetWidth + 'px'\n        }\n    };\n\n    cancelEditing = () => this.setState({editing: false});\n\n    setEditing = (item, columnIndex, field) => this.setState({editing: this.prepareEditing(item, field, columnIndex)});\n\n    prepareEditing = (item, field, columnIndex) => ({id: item.id, value: item[field], columnIndex, item, field});\n\n    handleInputChange = (event) => {\n        const value = this.extractValue(event);\n        this.setState({editing: {...this.state.editing, value}});\n    };\n\n    extractValue = (event) => {\n        const target = event.target;\n        return target.type === 'checkbox' ? target.checked : target.value;\n    };\n\n    selectNewValue = (value) => {\n        this.setState({editing: {...this.state.editing, value}}, this.onFinishEditing);\n    };\n\n    onFinishEditing = (e) => {\n        const editing = this.state.editing;\n        if (editing.value === null)\n            return;\n\n        let value = editing.value;\n        if (isString(value))\n            value = value.trim();\n\n        if (value === editing.item[editing.field])\n            return this.cancelEditing();\n\n        let updated = {\n            ...editing.item,\n            [editing.field]: value\n        };\n        this.props.onChange(updated, this.cancelEditing)\n    };\n\n    sort = (e, sortBy, comparator) => {\n        preventDefault(e);\n        this.setState({\n            sortOrder: this.state.sortBy === sortBy && this.state.sortOrder === SORT_ASC ? SORT_DESC : SORT_ASC,\n            comparator,\n            sortBy\n        }, () => this.setData(this.state.data));\n    }\n}\n\nconst formatValue = (item, column) => {\n    const value = (column.value !== undefined) ? column.value : item[column.field];\n    if (column.formatter) {\n        return column.formatter(value, item, column.format)\n    } else {\n        return '' + value\n    }\n};\n\nconst Row = React.memo(({item, disabled, editing, onClick, className, columns, editingContext}) => {\n    return <tr onClick={e => onClick(item)}\n               className={classNames(disabled && disabled(item) && 'disabled', className && (isFunction(className) ? className(item) : className))}>\n        {columns.filter(it => !!it).map((column, i) => {\n            const isEditing = editing && editing.id === item.id && editing.columnIndex === i;\n            const editable = isFunction(column.editable) ? column.editable(item) : !!column.editable;\n            return (\n                <td key={i}\n                    className={classNames(editable ? 'editable' : 'ro', isEditing && 'editing', column.className)}\n                    onClick={!isEditing && editable ? () => editingContext.setEditing(item, i, column.field) : NOOP}>\n                    {(isEditing || column.displayEditor) && !column.editor && (\n                        <TextField\n                            value={column.preEditor ? column.preEditor(editing.value) : editing.value}\n                            focused={true}\n                            onBlur={editingContext.cancelEditing}\n                            onChange={editingContext.handleInputChange}\n                            onKeyDown={e => {\n                                if (e.keyCode === 27/*escape*/) {\n                                    preventDefault(e);\n                                    editingContext.cancelEditing();\n                                }\n                                if (e.keyCode === 13/*enter*/) {\n                                    preventDefault(e);\n                                    editingContext.onFinishEditing();\n                                }\n                            }}\n                        />\n                    )}\n                    {(isEditing || column.displayEditor) && column.editor === 'Select' && (\n                        <AutocompleteSelect\n                            value={column.preEditor ? column.preEditor(editing.value) : editing.value}\n                            data={column.editorData}\n                            focused={true}\n                            withArrow={false}\n                            withFilter={false}\n                            selectedMode={'inline'}\n                            selectedComponent={column.editorSelectedComponent}\n                            mode={column.multiSelect ? MODE_MULTIPLE_MINI : MODE_DEFAULT}\n                            onChange={column.multiSelect && (column.onSelect ? (value => editingContext.selectNewValue(column.onSelect(value))) : editingContext.selectNewValue)}\n                            onSelect={!column.multiSelect && (column.onSelect ? (value => editingContext.selectNewValue(column.onSelect(value))) : editingContext.selectNewValue)}\n                            childComponent={column.editorChildCompononRowClickent}\n                            onCancel={editingContext.cancelEditing}\n                            prefilter={column.prefilter}\n                        />\n                    )}\n                    {(isEditing || column.displayEditor) && column.editor === 'Switch' && (\n                        <Switch onClick={e => {\n                            stopPropagation(e);\n                            preventDefault(e);\n                            editingContext.setState({\n                                editing: {\n                                    ...editingContext.prepareEditing(item, column.field, i),\n                                    value: !item[column.field]\n                                }\n                            }, editingContext.onFinishEditing);\n                        }} value={item[column.field]}/>\n                    )}\n                    {(isEditing || column.displayEditor) && isFunction(column.editor) && column.editor(item, editingContext.cancelEditing, isEditing)}\n                    {!isEditing && !column.displayEditor && formatValue(item, column)}\n                </td>\n            );\n        })}\n    </tr>\n    }\n)\n\nTable.defaultProps = {\n    columns: [],\n    onRowClick: NOOP,\n    toKey: getId,\n};\n\nif (window.isNotProductionEnvironment) {\n    Table.propTypes = {\n        className: PropTypes.string,\n        rowClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n        columns: PropTypes.arrayOf(PropTypes.shape({\n            header: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n            className: PropTypes.string,\n            sortable: PropTypes.bool,\n            field: PropTypes.string,\n            formatter: PropTypes.func,\n            comparator: PropTypes.func,\n            editable: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\n            editor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n            displayEditor: PropTypes.bool,\n            preEditor: PropTypes.func,\n        })),\n        data: PropTypes.array,\n        disabled: PropTypes.func,\n        onRowClick: PropTypes.func,\n        onSortChange: PropTypes.func,\n        onChange: PropTypes.func,\n        toKey: PropTypes.func,\n    };\n}\n\n\nexport default Table;"],"names":["SORT_ASC","Comparators","SORT_DESC","getId","item","id","Table","props","setData","data","state","sortBy","sortOrder","comparator","c","inverse","sort","of","setState","orNoop","onSortChange","updateHeaders","headers","hidden","querySelectorAll","fixed","i","length","style","width","offsetWidth","cancelEditing","editing","setEditing","columnIndex","field","prepareEditing","value","handleInputChange","event","extractValue","target","type","checked","selectNewValue","onFinishEditing","e","isString","trim","updated","onChange","preventDefault","columns","find","it","updateHeadersInterval","setInterval","prevProps","prevState","snapshot","onRowClick","NOOP","disabled","className","rowClassName","toKey","classNames","filter","map","column","sortable","header","clearInterval","Component","formatValue","undefined","formatter","format","Row","React","memo","onClick","editingContext","isFunction","isEditing","editable","displayEditor","editor","preEditor","keyCode","editorData","editorSelectedComponent","multiSelect","MODE_MULTIPLE_MINI","MODE_DEFAULT","onSelect","editorChildCompononRowClickent","prefilter","stopPropagation","defaultProps","window","isNotProductionEnvironment","propTypes","PropTypes","string","oneOfType","func","arrayOf","shape","element","bool","array"],"mappings":";;;;;;;;;;IAUaA,QAAQ,GAAGC,WAAW,CAACD;IACvBE,SAAS,GAAGD,WAAW,CAACC;AAErC,IAAMC,KAAK,GAAG,SAARA,KAAQ,CAAAC,IAAI;AAAA,SAAIA,IAAI,CAACC,EAAT;AAAA,CAAlB;IAGMC;;;AAEF,iBAAYC,KAAZ,EAAmB;AAAA;AAAA;AACf,8BAAMA,KAAN;AADe,UAiBnBC,OAjBmB,GAiBT,UAACC,IAAD,EAAU;AAChB,wBAAwC,MAAKC,KAA7C;AAAA,UAAOC,MAAP,eAAOA,MAAP;AAAA,UAAeC,SAAf,eAAeA,SAAf;AAAA,UAA0BC,UAA1B,eAA0BA,UAA1B;AACA,UAAIF,MAAJ,EAAY;AACR,YAAIG,CAAC,GAAGD,UAAR;AACA,YAAGC,CAAC,IAAIF,SAAS,KAAKV,SAAtB,EACIY,CAAC,GAAGb,WAAW,CAACc,OAAZ,CAAoBD,CAApB,CAAJ;AAEJL,QAAAA,IAAI,CAACO,IAAL,CAAUF,CAAC,IAAIb,WAAW,CAACgB,EAAZ,CAAeN,MAAf,EAAuBC,SAAvB,EAAkCH,IAAlC,CAAf;AACA,cAAKS,QAAL,CAAc;AAACT,UAAAA,IAAI,EAAJA;AAAD,SAAd,EAAsB,YAAM;AACxBU,UAAAA,MAAM,CAAC,MAAKZ,KAAL,CAAWa,YAAZ,CAAN,CAAgCT,MAAhC,EAAwCC,SAAxC;AACH,SAFD;AAGH;AACJ,KA7BkB;AAAA,UAoFnBS,aApFmB,GAoFH,YAAM;AAClB,UAAMC,OAAO,GAAG,MAAKA,OAArB;AAEA,UAAMC,MAAM,GAAGD,OAAO,CAACE,gBAAR,CAAyB,SAAzB,CAAf;AACA,UAAMC,KAAK,GAAGH,OAAO,CAACE,gBAAR,CAAyB,QAAzB,CAAd;AACA,WAAK,IAAIE,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGH,MAAM,CAACI,MAA3B,EAAmCD,CAAC,EAApC,EAAwC;AACpCD,QAAAA,KAAK,CAACC,CAAD,CAAL,CAASE,KAAT,CAAeC,KAAf,GAAuBN,MAAM,CAACG,CAAD,CAAN,CAAUI,WAAV,GAAwB,IAA/C;AACH;AACJ,KA5FkB;AAAA,UA8FnBC,aA9FmB,GA8FH;AAAA,aAAM,MAAKb,QAAL,CAAc;AAACc,QAAAA,OAAO,EAAE;AAAV,OAAd,CAAN;AAAA,KA9FG;AAAA,UAgGnBC,UAhGmB,GAgGN,UAAC7B,IAAD,EAAO8B,WAAP,EAAoBC,KAApB;AAAA,aAA8B,MAAKjB,QAAL,CAAc;AAACc,QAAAA,OAAO,EAAE,MAAKI,cAAL,CAAoBhC,IAApB,EAA0B+B,KAA1B,EAAiCD,WAAjC;AAAV,OAAd,CAA9B;AAAA,KAhGM;AAAA,UAkGnBE,cAlGmB,GAkGF,UAAChC,IAAD,EAAO+B,KAAP,EAAcD,WAAd;AAAA,aAA+B;AAAC7B,QAAAA,EAAE,EAAED,IAAI,CAACC,EAAV;AAAcgC,QAAAA,KAAK,EAAEjC,IAAI,CAAC+B,KAAD,CAAzB;AAAkCD,QAAAA,WAAW,EAAXA,WAAlC;AAA+C9B,QAAAA,IAAI,EAAJA,IAA/C;AAAqD+B,QAAAA,KAAK,EAALA;AAArD,OAA/B;AAAA,KAlGE;AAAA,UAoGnBG,iBApGmB,GAoGC,UAACC,KAAD,EAAW;AAC3B,UAAMF,KAAK,GAAG,MAAKG,YAAL,CAAkBD,KAAlB,CAAd;AACA,YAAKrB,QAAL,CAAc;AAACc,QAAAA,OAAO,oCAAM,MAAKtB,KAAL,CAAWsB,OAAjB;AAA0BK,UAAAA,KAAK,EAALA;AAA1B;AAAR,OAAd;AACH,KAvGkB;AAAA,UAyGnBG,YAzGmB,GAyGJ,UAACD,KAAD,EAAW;AACtB,UAAME,MAAM,GAAGF,KAAK,CAACE,MAArB;AACA,aAAOA,MAAM,CAACC,IAAP,KAAgB,UAAhB,GAA6BD,MAAM,CAACE,OAApC,GAA8CF,MAAM,CAACJ,KAA5D;AACH,KA5GkB;AAAA,UA8GnBO,cA9GmB,GA8GF,UAACP,KAAD,EAAW;AACxB,YAAKnB,QAAL,CAAc;AAACc,QAAAA,OAAO,oCAAM,MAAKtB,KAAL,CAAWsB,OAAjB;AAA0BK,UAAAA,KAAK,EAALA;AAA1B;AAAR,OAAd,EAAyD,MAAKQ,eAA9D;AACH,KAhHkB;AAAA,UAkHnBA,eAlHmB,GAkHD,UAACC,CAAD,EAAO;AACrB,UAAMd,OAAO,GAAG,MAAKtB,KAAL,CAAWsB,OAA3B;AACA,UAAIA,OAAO,CAACK,KAAR,KAAkB,IAAtB,EACI;AAEJ,UAAIA,KAAK,GAAGL,OAAO,CAACK,KAApB;AACA,UAAIU,QAAQ,CAACV,KAAD,CAAZ,EACIA,KAAK,GAAGA,KAAK,CAACW,IAAN,EAAR;AAEJ,UAAIX,KAAK,KAAKL,OAAO,CAAC5B,IAAR,CAAa4B,OAAO,CAACG,KAArB,CAAd,EACI,OAAO,MAAKJ,aAAL,EAAP;AAEJ,UAAIkB,OAAO,qCACJjB,OAAO,CAAC5B,IADJ,2BAEN4B,OAAO,CAACG,KAFF,EAEUE,KAFV,EAAX;AAIA,YAAK9B,KAAL,CAAW2C,QAAX,CAAoBD,OAApB,EAA6B,MAAKlB,aAAlC;AACH,KAnIkB;AAAA,UAqInBf,IArImB,GAqIZ,UAAC8B,CAAD,EAAInC,MAAJ,EAAYE,UAAZ,EAA2B;AAC9BsC,MAAAA,cAAc,CAACL,CAAD,CAAd;AACA,YAAK5B,QAAL,CAAc;AACVN,QAAAA,SAAS,EAAE,MAAKF,KAAL,CAAWC,MAAX,KAAsBA,MAAtB,IAAgC,MAAKD,KAAL,CAAWE,SAAX,KAAyBZ,QAAzD,GAAoEE,SAApE,GAAgFF,QADjF;AAEVa,QAAAA,UAAU,EAAVA,UAFU;AAGVF,QAAAA,MAAM,EAANA;AAHU,OAAd,EAIG;AAAA,eAAM,MAAKH,OAAL,CAAa,MAAKE,KAAL,CAAWD,IAAxB,CAAN;AAAA,OAJH;AAKH,KA5IkB;AAEf,UAAKC,KAAL,GAAa,EAAb;AAFe;AAGlB;;;WAED,6BAAoB;AAAA;AAAA;AAChB,wBAAgD,KAAKH,KAArD;AAAA,UAAOI,MAAP,eAAOA,MAAP;AAAA,8CAAeC,SAAf;AAAA,UAAeA,SAAf,sCAA2BZ,QAA3B;AAAA,UAAqCoD,OAArC,eAAqCA,OAArC;AACA,WAAKlC,QAAL,CAAc;AACVP,QAAAA,MAAM,EAANA,MADU;AAEVC,QAAAA,SAAS,EAATA,SAFU;AAGVC,QAAAA,UAAU,mBAAEuC,OAAO,CAACC,IAAR,CAAa,UAAAC,EAAE;AAAA,iBAAIA,EAAE,CAACnB,KAAH,KAAaxB,MAAjB;AAAA,SAAf,CAAF,qBAAE,cAAyCE;AAH3C,OAAd,EAIG;AAAA,eAAM,MAAI,CAACL,OAAL,CAAa,MAAI,CAACD,KAAL,CAAWE,IAAxB,CAAN;AAAA,OAJH;AAMA,WAAKY,aAAL;AACA,WAAKkC,qBAAL,GAA6BC,WAAW,CAAC,KAAKnC,aAAN,EAAqB,IAArB,CAAxC;AACH;;;WAgBD,4BAAmBoC,SAAnB,EAA8BC,SAA9B,EAAyCC,QAAzC,EAAmD;AAC/C,UAAI,KAAKpD,KAAL,CAAWE,IAAX,KAAoBgD,SAAS,CAAChD,IAAlC,EAAwC;AACpC,aAAKD,OAAL,CAAa,KAAKD,KAAL,CAAWE,IAAxB;AACH;AACD,WAAKY,aAAL;AACH;;;WAED,kBAAS;AAAA;AACL,yBAA4F,KAAKd,KAAjG;AAAA,8CAAO6C,OAAP;AAAA,UAAOA,OAAP,qCAAiB,EAAjB;AAAA,+CAAqBQ,UAArB;AAAA,UAAqBA,UAArB,sCAAkCC,IAAlC;AAAA,UAAwCC,QAAxC,gBAAwCA,QAAxC;AAAA,UAAkDC,SAAlD,gBAAkDA,SAAlD;AAAA,UAA6DC,YAA7D,gBAA6DA,YAA7D;AAAA,4CAA2EC,KAA3E;AAAA,UAA2EA,KAA3E,mCAAmF9D,KAAnF;AACA,yBAAgD,KAAKO,KAArD;AAAA,UAAOC,MAAP,gBAAOA,MAAP;AAAA,UAAeC,SAAf,gBAAeA,SAAf;AAAA,2CAA0BH,IAA1B;AAAA,UAA0BA,IAA1B,kCAAiC,EAAjC;AAAA,UAAqCuB,OAArC,gBAAqCA,OAArC;AACA,aACI;AAAO,QAAA,SAAS,EAAEkC,UAAU,UAAUH,SAAV;AAA5B,SACI,kCACA;AAAI,QAAA,GAAG,EAAE,aAAAzC,OAAO;AAAA,iBAAI,MAAI,CAACA,OAAL,GAAeA,OAAnB;AAAA;AAAhB,SACK8B,OAAO,CAACe,MAAR,CAAe,UAAAb,EAAE;AAAA,eAAI,CAAC,CAACA,EAAN;AAAA,OAAjB,EAA2Bc,GAA3B,CAA+B,UAACC,MAAD,EAAS3C,CAAT,EAAe;AAC3C,YAAM4C,QAAQ,GAAGD,MAAM,CAACC,QAAP,IAAmBD,MAAM,CAACC,QAAP,IAAmB,IAAvD;AACA,eACI;AAAI,UAAA,GAAG,EAAE5C,CAAT;AAAY,UAAA,OAAO,EAAE,iBAAAoB,CAAC;AAAA,mBAAIwB,QAAQ,IAAI,MAAI,CAACtD,IAAL,CAAU8B,CAAV,EAAauB,MAAM,CAAClC,KAApB,EAA2BkC,MAAM,CAACxD,UAAlC,CAAhB;AAAA;AAAtB,WACI;AAAK,UAAA,SAAS,EAAEqD,UAAU,CAAC,QAAD,EAAWI,QAAQ,IAAI,UAAvB,EAAmC3D,MAAM,KAAK0D,MAAM,CAAClC,KAAlB,IAA2B,QAA9D;AAA1B,WACKkC,MAAM,CAACE,MADZ,EAEKF,MAAM,CAACE,MAAP,IAAiB5D,MAAM,KAAK0D,MAAM,CAAClC,KAAnC,IAA4CvB,SAAS,KAAKZ,QAA1D,IAAuE,mBAAC,YAAD;AAAc,UAAA,IAAI,EAAE;AAApB,UAF5E,EAGKqE,MAAM,CAACE,MAAP,IAAiB5D,MAAM,KAAK0D,MAAM,CAAClC,KAAnC,IAA4CvB,SAAS,KAAKV,SAA1D,IAAwE,mBAAC,YAAD;AAAc,UAAA,IAAI,EAAE;AAApB,UAH7E,CADJ,EAMI;AAAK,UAAA,SAAS,EAAEgE,UAAU,CAAC,OAAD,EAAUI,QAAQ,IAAI,UAAtB,EAAkC3D,MAAM,KAAK0D,MAAM,CAAClC,KAAlB,IAA2B,QAA7D;AAA1B,WACKkC,MAAM,CAACE,MADZ,EAEKF,MAAM,CAACE,MAAP,IAAiB5D,MAAM,KAAK0D,MAAM,CAAClC,KAAnC,IAA4CvB,SAAS,KAAKZ,QAA1D,IAAuE,mBAAC,YAAD;AAAc,UAAA,IAAI,EAAE;AAApB,UAF5E,EAGKqE,MAAM,CAACE,MAAP,IAAiB5D,MAAM,KAAK0D,MAAM,CAAClC,KAAnC,IAA4CvB,SAAS,KAAKV,SAA1D,IAAwE,mBAAC,YAAD;AAAc,UAAA,IAAI,EAAE;AAApB,UAH7E,CANJ,CADJ;AAcH,OAhBA,CADL,CADA,CADJ,EAsBI,kCACCO,IAAI,CAAC2D,GAAL,CAAS,UAAAhE,IAAI;AAAA,eAAK,mBAAC,GAAD;AAAK,UAAA,GAAG,EAAE6D,KAAK,CAAC7D,IAAD,CAAf;AACK,UAAA,IAAI,EAAEA,IADX;AAEK,UAAA,QAAQ,EAAE0D,QAFf;AAGK,UAAA,OAAO,EAAE9B,OAAO,IAAIA,OAAO,CAAC3B,EAAR,KAAeD,IAAI,CAACC,EAA/B,GAAoC2B,OAApC,GAA8C,IAH5D;AAIK,UAAA,OAAO,EAAE4B,UAJd;AAKK,UAAA,SAAS,EAAEI,YALhB;AAMK,UAAA,OAAO,EAAEZ,OANd;AAOK,UAAA,cAAc,EAAE;AAPrB,UAAL;AAAA,OAAb,CADD,CAtBJ,CADJ;AAqCH;;;WAED,gCAAuB;AACnBoB,MAAAA,aAAa,CAAC,KAAKjB,qBAAN,CAAb;AACH;;;EApFekB;AAiJpB,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACtE,IAAD,EAAOiE,MAAP,EAAkB;AAClC,MAAMhC,KAAK,GAAIgC,MAAM,CAAChC,KAAP,KAAiBsC,SAAlB,GAA+BN,MAAM,CAAChC,KAAtC,GAA8CjC,IAAI,CAACiE,MAAM,CAAClC,KAAR,CAAhE;AACA,MAAIkC,MAAM,CAACO,SAAX,EAAsB;AAClB,WAAOP,MAAM,CAACO,SAAP,CAAiBvC,KAAjB,EAAwBjC,IAAxB,EAA8BiE,MAAM,CAACQ,MAArC,CAAP;AACH,GAFD,MAEO;AACH,WAAO,KAAKxC,KAAZ;AACH;AACJ,CAPD;AASA,IAAMyC,GAAG,GAAGC,KAAK,CAACC,IAAN,CAAW,gBAA4E;AAAA,MAA1E5E,IAA0E,QAA1EA,IAA0E;AAAA,MAApE0D,QAAoE,QAApEA,QAAoE;AAAA,MAA1D9B,OAA0D,QAA1DA,OAA0D;AAAA,MAAjDiD,QAAiD,QAAjDA,OAAiD;AAAA,MAAxClB,SAAwC,QAAxCA,SAAwC;AAAA,MAA7BX,OAA6B,QAA7BA,OAA6B;AAAA,MAApB8B,cAAoB,QAApBA,cAAoB;AAC/F,SAAO;AAAI,IAAA,OAAO,EAAE,iBAAApC,CAAC;AAAA,aAAImC,QAAO,CAAC7E,IAAD,CAAX;AAAA,KAAd;AACI,IAAA,SAAS,EAAE8D,UAAU,CAACJ,QAAQ,IAAIA,QAAQ,CAAC1D,IAAD,CAApB,IAA8B,UAA/B,EAA2C2D,SAAS,KAAKoB,UAAU,CAACpB,SAAD,CAAV,GAAwBA,SAAS,CAAC3D,IAAD,CAAjC,GAA0C2D,SAA/C,CAApD;AADzB,KAEFX,OAAO,CAACe,MAAR,CAAe,UAAAb,EAAE;AAAA,WAAI,CAAC,CAACA,EAAN;AAAA,GAAjB,EAA2Bc,GAA3B,CAA+B,UAACC,MAAD,EAAS3C,CAAT,EAAe;AAC3C,QAAM0D,SAAS,GAAGpD,OAAO,IAAIA,OAAO,CAAC3B,EAAR,KAAeD,IAAI,CAACC,EAA/B,IAAqC2B,OAAO,CAACE,WAAR,KAAwBR,CAA/E;AACA,QAAM2D,QAAQ,GAAGF,UAAU,CAACd,MAAM,CAACgB,QAAR,CAAV,GAA8BhB,MAAM,CAACgB,QAAP,CAAgBjF,IAAhB,CAA9B,GAAsD,CAAC,CAACiE,MAAM,CAACgB,QAAhF;AACA,WACI;AAAI,MAAA,GAAG,EAAE3D,CAAT;AACI,MAAA,SAAS,EAAEwC,UAAU,CAACmB,QAAQ,GAAG,UAAH,GAAgB,IAAzB,EAA+BD,SAAS,IAAI,SAA5C,EAAuDf,MAAM,CAACN,SAA9D,CADzB;AAEI,MAAA,OAAO,EAAE,CAACqB,SAAD,IAAcC,QAAd,GAAyB;AAAA,eAAMH,cAAc,CAACjD,UAAf,CAA0B7B,IAA1B,EAAgCsB,CAAhC,EAAmC2C,MAAM,CAAClC,KAA1C,CAAN;AAAA,OAAzB,GAAkF0B;AAF/F,OAGK,CAACuB,SAAS,IAAIf,MAAM,CAACiB,aAArB,KAAuC,CAACjB,MAAM,CAACkB,MAA/C,IACG,mBAAC,SAAD;AACI,MAAA,KAAK,EAAElB,MAAM,CAACmB,SAAP,GAAmBnB,MAAM,CAACmB,SAAP,CAAiBxD,OAAO,CAACK,KAAzB,CAAnB,GAAqDL,OAAO,CAACK,KADxE;AAEI,MAAA,OAAO,EAAE,IAFb;AAGI,MAAA,MAAM,EAAE6C,cAAc,CAACnD,aAH3B;AAII,MAAA,QAAQ,EAAEmD,cAAc,CAAC5C,iBAJ7B;AAKI,MAAA,SAAS,EAAE,mBAAAQ,CAAC,EAAI;AACZ,YAAIA,CAAC,CAAC2C,OAAF,KAAc;AAAlB,UAAgC;AAC5BtC,UAAAA,cAAc,CAACL,CAAD,CAAd;AACAoC,UAAAA,cAAc,CAACnD,aAAf;AACH;AACD,YAAIe,CAAC,CAAC2C,OAAF,KAAc;AAAlB,UAA+B;AAC3BtC,UAAAA,cAAc,CAACL,CAAD,CAAd;AACAoC,UAAAA,cAAc,CAACrC,eAAf;AACH;AACJ;AAdL,MAJR,EAqBK,CAACuC,SAAS,IAAIf,MAAM,CAACiB,aAArB,KAAuCjB,MAAM,CAACkB,MAAP,KAAkB,QAAzD,IACG,mBAAC,kBAAD;AACI,MAAA,KAAK,EAAElB,MAAM,CAACmB,SAAP,GAAmBnB,MAAM,CAACmB,SAAP,CAAiBxD,OAAO,CAACK,KAAzB,CAAnB,GAAqDL,OAAO,CAACK,KADxE;AAEI,MAAA,IAAI,EAAEgC,MAAM,CAACqB,UAFjB;AAGI,MAAA,OAAO,EAAE,IAHb;AAII,MAAA,SAAS,EAAE,KAJf;AAKI,MAAA,UAAU,EAAE,KALhB;AAMI,MAAA,YAAY,EAAE,QANlB;AAOI,MAAA,iBAAiB,EAAErB,MAAM,CAACsB,uBAP9B;AAQI,MAAA,IAAI,EAAEtB,MAAM,CAACuB,WAAP,GAAqBC,kBAArB,GAA0CC,YARpD;AASI,MAAA,QAAQ,EAAEzB,MAAM,CAACuB,WAAP,KAAuBvB,MAAM,CAAC0B,QAAP,GAAmB,UAAA1D,KAAK;AAAA,eAAI6C,cAAc,CAACtC,cAAf,CAA8ByB,MAAM,CAAC0B,QAAP,CAAgB1D,KAAhB,CAA9B,CAAJ;AAAA,OAAxB,GAAqF6C,cAAc,CAACtC,cAA3H,CATd;AAUI,MAAA,QAAQ,EAAE,CAACyB,MAAM,CAACuB,WAAR,KAAwBvB,MAAM,CAAC0B,QAAP,GAAmB,UAAA1D,KAAK;AAAA,eAAI6C,cAAc,CAACtC,cAAf,CAA8ByB,MAAM,CAAC0B,QAAP,CAAgB1D,KAAhB,CAA9B,CAAJ;AAAA,OAAxB,GAAqF6C,cAAc,CAACtC,cAA5H,CAVd;AAWI,MAAA,cAAc,EAAEyB,MAAM,CAAC2B,8BAX3B;AAYI,MAAA,QAAQ,EAAEd,cAAc,CAACnD,aAZ7B;AAaI,MAAA,SAAS,EAAEsC,MAAM,CAAC4B;AAbtB,MAtBR,EAsCK,CAACb,SAAS,IAAIf,MAAM,CAACiB,aAArB,KAAuCjB,MAAM,CAACkB,MAAP,KAAkB,QAAzD,IACG,mBAAC,MAAD;AAAQ,MAAA,OAAO,EAAE,iBAAAzC,CAAC,EAAI;AAClBoD,QAAAA,eAAe,CAACpD,CAAD,CAAf;AACAK,QAAAA,cAAc,CAACL,CAAD,CAAd;AACAoC,QAAAA,cAAc,CAAChE,QAAf,CAAwB;AACpBc,UAAAA,OAAO,oCACAkD,cAAc,CAAC9C,cAAf,CAA8BhC,IAA9B,EAAoCiE,MAAM,CAAClC,KAA3C,EAAkDT,CAAlD,CADA;AAEHW,YAAAA,KAAK,EAAE,CAACjC,IAAI,CAACiE,MAAM,CAAClC,KAAR;AAFT;AADa,SAAxB,EAKG+C,cAAc,CAACrC,eALlB;AAMH,OATD;AASG,MAAA,KAAK,EAAEzC,IAAI,CAACiE,MAAM,CAAClC,KAAR;AATd,MAvCR,EAkDK,CAACiD,SAAS,IAAIf,MAAM,CAACiB,aAArB,KAAuCH,UAAU,CAACd,MAAM,CAACkB,MAAR,CAAjD,IAAoElB,MAAM,CAACkB,MAAP,CAAcnF,IAAd,EAAoB8E,cAAc,CAACnD,aAAnC,EAAkDqD,SAAlD,CAlDzE,EAmDK,CAACA,SAAD,IAAc,CAACf,MAAM,CAACiB,aAAtB,IAAuCZ,WAAW,CAACtE,IAAD,EAAOiE,MAAP,CAnDvD,CADJ;AAuDH,GA1DA,CAFE,CAAP;AA8DC,CA/DO,CAAZ;AAkEA/D,KAAK,CAAC6F,YAAN,GAAqB;AACjB/C,EAAAA,OAAO,EAAE,EADQ;AAEjBQ,EAAAA,UAAU,EAAEC,IAFK;AAGjBI,EAAAA,KAAK,EAAE9D;AAHU,CAArB;AAMA,IAAIiG,MAAM,CAACC,0BAAX,EAAuC;AACnC/F,EAAAA,KAAK,CAACgG,SAAN,GAAkB;AACdvC,IAAAA,SAAS,EAAEwC,SAAS,CAACC,MADP;AAEdxC,IAAAA,YAAY,EAAEuC,SAAS,CAACE,SAAV,CAAoB,CAACF,SAAS,CAACC,MAAX,EAAmBD,SAAS,CAACG,IAA7B,CAApB,CAFA;AAGdtD,IAAAA,OAAO,EAAEmD,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,KAAV,CAAgB;AACvCrC,MAAAA,MAAM,EAAEgC,SAAS,CAACE,SAAV,CAAoB,CAACF,SAAS,CAACC,MAAX,EAAmBD,SAAS,CAACM,OAA7B,CAApB,CAD+B;AAEvC9C,MAAAA,SAAS,EAAEwC,SAAS,CAACC,MAFkB;AAGvClC,MAAAA,QAAQ,EAAEiC,SAAS,CAACO,IAHmB;AAIvC3E,MAAAA,KAAK,EAAEoE,SAAS,CAACC,MAJsB;AAKvC5B,MAAAA,SAAS,EAAE2B,SAAS,CAACG,IALkB;AAMvC7F,MAAAA,UAAU,EAAE0F,SAAS,CAACG,IANiB;AAOvCrB,MAAAA,QAAQ,EAAEkB,SAAS,CAACE,SAAV,CAAoB,CAACF,SAAS,CAACO,IAAX,EAAiBP,SAAS,CAACG,IAA3B,CAApB,CAP6B;AAQvCnB,MAAAA,MAAM,EAAEgB,SAAS,CAACE,SAAV,CAAoB,CAACF,SAAS,CAACC,MAAX,EAAmBD,SAAS,CAACG,IAA7B,CAApB,CAR+B;AASvCpB,MAAAA,aAAa,EAAEiB,SAAS,CAACO,IATc;AAUvCtB,MAAAA,SAAS,EAAEe,SAAS,CAACG;AAVkB,KAAhB,CAAlB,CAHK;AAedjG,IAAAA,IAAI,EAAE8F,SAAS,CAACQ,KAfF;AAgBdjD,IAAAA,QAAQ,EAAEyC,SAAS,CAACG,IAhBN;AAiBd9C,IAAAA,UAAU,EAAE2C,SAAS,CAACG,IAjBR;AAkBdtF,IAAAA,YAAY,EAAEmF,SAAS,CAACG,IAlBV;AAmBdxD,IAAAA,QAAQ,EAAEqD,SAAS,CAACG,IAnBN;AAoBdzC,IAAAA,KAAK,EAAEsC,SAAS,CAACG;AApBH,GAAlB;AAsBH;AAGD,cAAepG,KAAf;;;;"}

package/bundle.css

@@ -1,68 +1,10 @@
-.Checkbox {
-  position: relative;
-  white-space: pre;
-}
-
-.Checkbox *, .Checkbox *:before, .Checkbox *:after {
-  box-sizing: border-box;
-}
-
-.Checkbox label {
-  font-family: Roboto, sans-serif;
-  font-size: 14px;
-  color: #1e252d;
-  cursor: pointer;
-}
-
-.Checkbox label:before, .Checkbox label:after {
-  content: "";
-  position: absolute;
-  left: 0;
-  top: 0;
-}
-
-.Checkbox label:before {
-  width: 20px;
-  height: 20px;
-  background: #fff;
-  border: 2px solid #252525;
-  border-radius: 2px;
-  cursor: pointer;
-  transition: background 0.3s;
-}
-
-.Checkbox input[type=checkbox] {
-  outline: 0;
-  margin-right: 10px;
-  visibility: hidden;
-}
-
-.Checkbox input[type=checkbox]:checked + label:before {
-  background: #4AC263;
-  border: none;
-}
-
-.Checkbox input[type=checkbox]:checked + label:after {
-  transform: rotate(-45deg);
-  top: 6px;
-  left: 4px;
-  width: 12px;
-  height: 6px;
-  border: 2px solid #fff;
-  border-top-style: none;
-  border-right-style: none;
-}
-
-.Checkbox input[type=checkbox]:disabled + label {
-  color: gray;
-}
-
-.Checkbox input[type=checkbox]:disabled + label:before {
-  border-color: rgba(0, 0, 0, 0.26);
+.animated {
+  transition: opacity 250ms ease;
+  opacity: 0;
 }
 
-.Checkbox input[type=checkbox]:disabled:checked + label:before {
-  background: rgba(0, 0, 0, 0.26);
+.animated.mounting, .animated.mounted {
+  opacity: 1;
 }
 
 .Button {
@@ -230,6 +172,160 @@
   border: 0;
 }
 
+.Checkbox {
+  position: relative;
+  white-space: pre;
+}
+
+.Checkbox *, .Checkbox *:before, .Checkbox *:after {
+  box-sizing: border-box;
+}
+
+.Checkbox label {
+  font-family: Roboto, sans-serif;
+  font-size: 14px;
+  color: #1e252d;
+  cursor: pointer;
+}
+
+.Checkbox label:before, .Checkbox label:after {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+.Checkbox label:before {
+  width: 20px;
+  height: 20px;
+  background: #fff;
+  border: 2px solid #252525;
+  border-radius: 2px;
+  cursor: pointer;
+  transition: background 0.3s;
+}
+
+.Checkbox input[type=checkbox] {
+  outline: 0;
+  margin-right: 10px;
+  visibility: hidden;
+}
+
+.Checkbox input[type=checkbox]:checked + label:before {
+  background: #4AC263;
+  border: none;
+}
+
+.Checkbox input[type=checkbox]:checked + label:after {
+  transform: rotate(-45deg);
+  top: 6px;
+  left: 4px;
+  width: 12px;
+  height: 6px;
+  border: 2px solid #fff;
+  border-top-style: none;
+  border-right-style: none;
+}
+
+.Checkbox input[type=checkbox]:disabled + label {
+  color: gray;
+}
+
+.Checkbox input[type=checkbox]:disabled + label:before {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.Checkbox input[type=checkbox]:disabled:checked + label:before {
+  background: rgba(0, 0, 0, 0.26);
+}
+
+.CircleProgress {
+  width: 48px;
+  height: 48px;
+}
+
+.CircleProgress .line {
+  stroke-width: 2px;
+  stroke: black;
+  stroke-linecap: square;
+  fill: none;
+  transition: stroke-dashoffset 0.2s ease;
+}
+
+.DialogModal {
+  overflow: hidden;
+}
+
+.DialogModal .content {
+  top: 20vh;
+}
+
+.Dialog {
+  background-color: white;
+  min-width: 460px;
+  max-width: 40vw;
+  padding: 15px;
+}
+
+.Dialog .title {
+  margin-bottom: 15px;
+  padding: 20px 50px 0px 30px;
+  font-size: 1.25rem;
+  line-height: 2rem;
+  font-weight: 400;
+  letter-spacing: 0.0125em;
+}
+
+.Dialog .description {
+  color: rgba(0, 0, 0, 0.54);
+  font-size: 1rem;
+  line-height: 1.5rem;
+  font-weight: 400;
+  letter-spacing: 0.03125em;
+  margin-top: 20px;
+  padding: 0 24px 24px;
+}
+
+.Dialog > div.row {
+  margin-bottom: 15px;
+}
+
+.Dialog > div.row:last-child {
+  margin-bottom: 0;
+}
+
+.DNDContainer {
+  position: relative;
+}
+
+.DNDContainer .Draggable[draggable=true], .DNDContainer .Draggable [draggable=true] {
+  cursor: pointer;
+}
+
+.DNDContainer .Draggable.placeholder {
+  opacity: 0.2;
+}
+
+.DNDContainer .Draggable.copy {
+  position: absolute;
+  box-sizing: border-box;
+  will-change: transform;
+  opacity: 0;
+}
+
+.DNDContainer .Draggable.dragged {
+  z-index: 10;
+}
+
+.DNDContainer .overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+}
+
 .AutocompleteSelect {
   display: inline-flex;
   flex-flow: column;
@@ -525,60 +621,6 @@
   position: absolute;
 }
 
-.animated {
-  transition: opacity 250ms ease;
-  opacity: 0;
-}
-
-.animated.mounting, .animated.mounted {
-  opacity: 1;
-}
-
-.CircleProgress {
-  width: 48px;
-  height: 48px;
-}
-
-.CircleProgress .line {
-  stroke-width: 2px;
-  stroke: black;
-  stroke-linecap: square;
-  fill: none;
-  transition: stroke-dashoffset 0.2s ease;
-}
-
-.DNDContainer {
-  position: relative;
-}
-
-.DNDContainer .Draggable[draggable=true], .DNDContainer .Draggable [draggable=true] {
-  cursor: pointer;
-}
-
-.DNDContainer .Draggable.placeholder {
-  opacity: 0.2;
-}
-
-.DNDContainer .Draggable.copy {
-  position: absolute;
-  box-sizing: border-box;
-  will-change: transform;
-  opacity: 0;
-}
-
-.DNDContainer .Draggable.dragged {
-  z-index: 10;
-}
-
-.DNDContainer .overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  pointer-events: none;
-}
-
 .DropFileInput {
   flex-grow: 1;
 }
@@ -666,70 +708,85 @@
   z-index: 1;
 }
 
-.DialogModal {
-  overflow: hidden;
+.FilteredList {
+  max-height: 250px;
+  position: relative;
 }
 
-.DialogModal .content {
-  top: 20vh;
+.FilteredList.popup {
+  padding: 0;
+  visibility: hidden;
+  position: absolute;
+  background: white;
+  z-index: 4;
+  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+  transition: all 0.2s ease-out;
+  top: calc(100% + 4px);
+  opacity: 0;
+  border-radius: 2px;
 }
 
-.Dialog {
-  background-color: white;
-  min-width: 460px;
-  max-width: 40vw;
-  padding: 15px;
+.FilteredList.popup.visible {
+  opacity: 1;
+  visibility: visible;
 }
 
-.Dialog .title {
-  margin-bottom: 15px;
-  padding: 20px 50px 0px 30px;
-  font-size: 1.25rem;
-  line-height: 2rem;
-  font-weight: 400;
-  letter-spacing: 0.0125em;
+.FilteredList.inline {
+  max-height: 225px;
+  margin-top: 5px;
 }
 
-.Dialog .description {
-  color: rgba(0, 0, 0, 0.54);
-  font-size: 1rem;
-  line-height: 1.5rem;
-  font-weight: 400;
-  letter-spacing: 0.03125em;
-  margin-top: 20px;
-  padding: 0 24px 24px;
+.FilteredList .child {
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  white-space: nowrap;
+  font-size: 14px;
+  color: #222222;
+  height: 30px;
+  padding: 5px 10px;
+  padding-right: 15px;
+  cursor: pointer;
+  overflow: hidden;
+  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  border-left: 5px solid #4AC263;
+  padding-left: 15px;
+  margin-left: -5px;
 }
 
-.Dialog > div.row {
-  margin-bottom: 15px;
+.FilteredList .child.hidden {
+  height: 0 !important;
+  padding: 0 !important;
 }
 
-.Dialog > div.row:last-child {
-  margin-bottom: 0;
+.FilteredList .child.selected {
+  background-color: #F0F0F0;
+  padding-left: 10px;
+  margin-left: 0px;
 }
 
-.Button.FloatingActionButton {
-  position: absolute;
-  right: 16px;
-  bottom: 16px;
-  width: 56px;
-  height: 56px;
-  padding: 16px;
-  transition: bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+.FilteredList .child.active {
+  background-color: #eeeeee;
 }
 
-.Button.FloatingActionButton.raised {
-  transition: bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s ease-out, background-color 0.2s ease-out, box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
+.FilteredList .child {
+  margin-top: 8px;
 }
 
-.Button.FloatingActionButton.mini {
-  width: 40px;
-  height: 40px;
-  padding: 8px;
+.FilteredList .child.hidden {
+  margin-top: 0;
 }
 
-.Button.FloatingActionButton.hidden {
-  bottom: -100px;
+.FilteredList .child:not(.hidden) ~ .child {
+  margin-top: 0;
+}
+
+.FilteredList .child:not(.hidden) ~ .child:last-child {
+  margin-bottom: 8px;
+}
+
+.FilteredList .child:not(.hidden):last-child {
+  margin-bottom: 8px;
 }
 
 .FormUploadProgress {
@@ -783,103 +840,46 @@
   position: relative;
 }
 
-.FormUploadProgress .wrapper > .progress > .value {
-  display: inline-block;
-  margin-top: 5px;
-  font-weight: bold;
-  line-height: 16px;
-  font-size: 13px;
-  text-align: center;
-  color: #818181;
-}
-
-.FormUploadProgress .wrapper .cancel {
-  min-width: 107px;
-  margin-top: 20px;
-  background-color: white;
-  color: #F96B5C;
-  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
-}
-
-.FilteredList {
-  max-height: 250px;
-  position: relative;
-}
-
-.FilteredList.popup {
-  padding: 0;
-  visibility: hidden;
-  position: absolute;
-  background: white;
-  z-index: 4;
-  box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
-  transition: all 0.2s ease-out;
-  top: calc(100% + 4px);
-  opacity: 0;
-  border-radius: 2px;
-}
-
-.FilteredList.popup.visible {
-  opacity: 1;
-  visibility: visible;
-}
-
-.FilteredList.inline {
-  max-height: 225px;
-  margin-top: 5px;
-}
-
-.FilteredList .child {
-  display: flex;
-  flex-flow: row nowrap;
-  align-items: center;
-  white-space: nowrap;
-  font-size: 14px;
-  color: #222222;
-  height: 30px;
-  padding: 5px 10px;
-  padding-right: 15px;
-  cursor: pointer;
-  overflow: hidden;
-  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
-  border-left: 5px solid #4AC263;
-  padding-left: 15px;
-  margin-left: -5px;
-}
-
-.FilteredList .child.hidden {
-  height: 0 !important;
-  padding: 0 !important;
-}
-
-.FilteredList .child.selected {
-  background-color: #F0F0F0;
-  padding-left: 10px;
-  margin-left: 0px;
-}
-
-.FilteredList .child.active {
-  background-color: #eeeeee;
+.FormUploadProgress .wrapper > .progress > .value {
+  display: inline-block;
+  margin-top: 5px;
+  font-weight: bold;
+  line-height: 16px;
+  font-size: 13px;
+  text-align: center;
+  color: #818181;
 }
 
-.FilteredList .child {
-  margin-top: 8px;
+.FormUploadProgress .wrapper .cancel {
+  min-width: 107px;
+  margin-top: 20px;
+  background-color: white;
+  color: #F96B5C;
+  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
 }
 
-.FilteredList .child.hidden {
-  margin-top: 0;
+.Button.FloatingActionButton {
+  position: absolute;
+  right: 16px;
+  bottom: 16px;
+  width: 56px;
+  height: 56px;
+  padding: 16px;
+  transition: bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-.FilteredList .child:not(.hidden) ~ .child {
-  margin-top: 0;
+.Button.FloatingActionButton.raised {
+  transition: bottom 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s ease-out, background-color 0.2s ease-out, box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
 }
 
-.FilteredList .child:not(.hidden) ~ .child:last-child {
-  margin-bottom: 8px;
+.Button.FloatingActionButton.mini {
+  width: 40px;
+  height: 40px;
+  padding: 8px;
 }
 
-.FilteredList .child:not(.hidden):last-child {
-  margin-bottom: 8px;
+.Button.FloatingActionButton.hidden {
+  bottom: -100px;
 }
 
 .Modal {
@@ -1319,6 +1319,104 @@
   will-change: left;
 }
 
+.Snackbar {
+  transform: translateX(-50%);
+  overflow: hidden;
+  background-color: #323232;
+  padding: 14px 24px 14px 24px;
+  color: #fff;
+  min-width: 288px;
+  max-width: 568px;
+  position: fixed;
+  bottom: -50px;
+  left: 50%;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  opacity: 0;
+  transition: bottom 0.25s ease, opacity 0.2s ease;
+  border-radius: 4px;
+  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+}
+
+.Snackbar.shown {
+  bottom: 15px;
+  opacity: 1;
+}
+
+.Snackbar .message {
+  overflow: hidden;
+  line-height: 1.2em;
+  min-height: 1.2em;
+  max-height: 2.4em;
+  flex: 1;
+}
+
+.Snackbar .action {
+  text-transform: uppercase;
+  font-weight: bold;
+  margin-left: 48px;
+  color: #bf3727;
+}
+
+.Snackbar .action a {
+  text-decoration: none;
+  color: #bf3727;
+}
+
+.SpinningProgress {
+  width: 48px;
+  height: 48px;
+  position: relative;
+  margin: 0 auto;
+}
+
+.SpinningProgress:before {
+  content: "";
+  display: block;
+  padding-top: 100%;
+}
+
+.SpinningProgress .circular {
+  animation: rotate 2s linear infinite;
+  height: 100%;
+  transform-origin: center center;
+  width: 100%;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  margin: auto;
+}
+
+.SpinningProgress .line {
+  stroke: black;
+  stroke-width: 2px;
+  stroke-dasharray: 1, 96;
+  stroke-dashoffset: 0;
+  animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
+}
+
+@keyframes rotate {
+  100% {
+    transform: rotate(360deg);
+  }
+}
+@keyframes dash {
+  0% {
+    stroke-dasharray: 1, 96;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    stroke-dasharray: 43, 96;
+    stroke-dashoffset: -17px;
+  }
+  100% {
+    stroke-dasharray: 43, 96;
+    stroke-dashoffset: -53px;
+  }
+}
 .Switch {
   display: inline-flex;
   padding-top: 5px;
@@ -1401,51 +1499,6 @@
   display: none;
 }
 
-.Snackbar {
-  transform: translateX(-50%);
-  overflow: hidden;
-  background-color: #323232;
-  padding: 14px 24px 14px 24px;
-  color: #fff;
-  min-width: 288px;
-  max-width: 568px;
-  position: fixed;
-  bottom: -50px;
-  left: 50%;
-  display: flex;
-  flex-wrap: nowrap;
-  align-items: center;
-  opacity: 0;
-  transition: bottom 0.25s ease, opacity 0.2s ease;
-  border-radius: 4px;
-  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-}
-
-.Snackbar.shown {
-  bottom: 15px;
-  opacity: 1;
-}
-
-.Snackbar .message {
-  overflow: hidden;
-  line-height: 1.2em;
-  min-height: 1.2em;
-  max-height: 2.4em;
-  flex: 1;
-}
-
-.Snackbar .action {
-  text-transform: uppercase;
-  font-weight: bold;
-  margin-left: 48px;
-  color: #bf3727;
-}
-
-.Snackbar .action a {
-  text-decoration: none;
-  color: #bf3727;
-}
-
 .TextField {
   position: relative;
   width: 100%;
@@ -1589,59 +1642,24 @@
   animation-name: shake;
 }
 
-.SpinningProgress {
-  width: 48px;
-  height: 48px;
-  position: relative;
-  margin: 0 auto;
+.DNDContainer .DroppableList .Draggable {
+  transform: unset;
+  transition: unset;
+  opacity: 1;
 }
 
-.SpinningProgress:before {
-  content: "";
-  display: block;
-  padding-top: 100%;
+.DNDContainer .DroppableList .Draggable.dragged {
+  transition: unset !important;
 }
 
-.SpinningProgress .circular {
-  animation: rotate 2s linear infinite;
-  height: 100%;
-  transform-origin: center center;
-  width: 100%;
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  margin: auto;
+.DNDContainer .DroppableList.hover .Draggable {
+  transition: transform 0.2s ease-in;
 }
 
-.SpinningProgress .line {
-  stroke: black;
-  stroke-width: 2px;
-  stroke-dasharray: 1, 96;
-  stroke-dashoffset: 0;
-  animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
+.DNDContainer .DroppableList.resetting .Draggable {
+  transition: transform 0.1s ease-in;
 }
 
-@keyframes rotate {
-  100% {
-    transform: rotate(360deg);
-  }
-}
-@keyframes dash {
-  0% {
-    stroke-dasharray: 1, 96;
-    stroke-dashoffset: 0;
-  }
-  50% {
-    stroke-dasharray: 43, 96;
-    stroke-dashoffset: -17px;
-  }
-  100% {
-    stroke-dasharray: 43, 96;
-    stroke-dashoffset: -53px;
-  }
-}
 .Table {
   font-family: Roboto, sans-serif;
   font-size: 14px;
@@ -1762,22 +1780,4 @@
 
 .ScrollableTable .Table {
   position: static;
-}
-
-.DNDContainer .DroppableList .Draggable {
-  transform: unset;
-  transition: unset;
-  opacity: 1;
-}
-
-.DNDContainer .DroppableList .Draggable.dragged {
-  transition: unset !important;
-}
-
-.DNDContainer .DroppableList.hover .Draggable {
-  transition: transform 0.2s ease-in;
-}
-
-.DNDContainer .DroppableList.resetting .Draggable {
-  transition: transform 0.1s ease-in;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-ui-basics",
-  "version": "0.0.137",
+  "version": "0.0.138",
   "description": "",
   "module": "index.js",
   "_main": "index.cjs.js",