@para-ui/core 4.0.0-rc.2 → 4.0.0-rc.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AutoTips/index.js +1 -1
- package/Button/index.js +1 -1
- package/Cascader/index.js +2 -2
- package/Checkbox/index.js +1 -1
- package/CheckboxGroup/index.js +3 -1
- package/Collapse/index.js +1 -1
- package/ComboSelect/index.js +2 -2
- package/CopyText/index.js +2 -2
- package/DatePicker/index.js +1 -1
- package/Descriptions/index.d.ts +33 -10
- package/Descriptions/index.js +222 -13
- package/Descriptions/lang/en_US.d.ts +5 -0
- package/Descriptions/lang/index.d.ts +11 -0
- package/Descriptions/lang/zh_CN.d.ts +5 -0
- package/Desktop/index.js +1 -1
- package/DynamicMultiBox/index.js +2 -2
- package/Empty/index.js +1 -1
- package/Form/index.js +2 -2
- package/FormItem/index.d.ts +4 -0
- package/FormItem/index.js +2 -2
- package/FunctionModal/index.js +2 -2
- package/InputNumber/index.js +1 -1
- package/Message/index.js +2 -2
- package/OperateBtn/index.js +1 -1
- package/PageHeader/index.js +1 -1
- package/Pagination/index.js +2 -1
- package/PasswordRules/index.js +1 -1
- package/Querying/index.js +1 -1
- package/Radio/index.js +1 -1
- package/RadioGroup/index.js +3 -1
- package/Select/index.js +8 -13
- package/Selector/index.js +2 -2
- package/SelectorPicker/index.js +2 -2
- package/Table/index.js +10 -4
- package/Tabs/index.d.ts +2 -0
- package/Tabs/index.js +5 -3
- package/Tag/index.js +3 -3
- package/TextField/index.js +1 -1
- package/Title/index.js +1 -1
- package/ToggleButton/index.js +1 -1
- package/Transfer/index.js +9 -6
- package/Tree/index.js +2 -2
- package/_verture/{index-649b450f.js → index-56601c94.js} +3 -2
- package/_verture/{index-692e29c1.js → index-de8f4428.js} +1 -1
- package/index.js +4 -4
- package/locale/en-US.d.ts +4 -0
- package/locale/index.d.ts +8 -0
- package/locale/index.js +8 -0
- package/locale/zh-CN.d.ts +4 -0
- package/package.json +1 -1
- package/umd/AutoTips.js +1 -1
- package/umd/Breadcrumbs.js +1 -1
- package/umd/Button.js +2 -2
- package/umd/ButtonGroup.js +2 -2
- package/umd/Cascader.js +1 -1
- package/umd/Checkbox.js +1 -1
- package/umd/CheckboxGroup.js +5 -5
- package/umd/Collapse.js +1 -1
- package/umd/CollapseBox.js +1 -1
- package/umd/ComboSelect.js +2 -2
- package/umd/CopyText.js +2 -2
- package/umd/DatePicker.js +2 -2
- package/umd/Descriptions.js +42 -1
- package/umd/Desktop.js +2 -2
- package/umd/Drawer.js +2 -2
- package/umd/DynamicMultiBox.js +2 -2
- package/umd/Empty.js +1 -1
- package/umd/Form.js +2 -2
- package/umd/FormItem.js +2 -2
- package/umd/FunctionModal.js +2 -2
- package/umd/InputLang.js +2 -2
- package/umd/InputNumber.js +1 -1
- package/umd/Menu.js +2 -2
- package/umd/Message.js +4 -4
- package/umd/Modal.js +2 -2
- package/umd/MultiBox.js +2 -2
- package/umd/OperateBtn.js +2 -2
- package/umd/PageHeader.js +2 -2
- package/umd/Pagination.js +2 -2
- package/umd/PasswordRules.js +1 -1
- package/umd/PopConfirm.js +2 -2
- package/umd/Querying.js +1 -1
- package/umd/Radio.js +1 -1
- package/umd/RadioGroup.js +2 -2
- package/umd/Search.js +2 -2
- package/umd/Select.js +2 -2
- package/umd/SelectInput.js +2 -2
- package/umd/Selector.js +7 -7
- package/umd/SelectorPicker.js +2 -2
- package/umd/SingleBox.js +2 -2
- package/umd/Stepper.js +1 -1
- package/umd/Table.js +6 -6
- package/umd/Tabs.js +6 -6
- package/umd/Tag.js +4 -4
- package/umd/TextField.js +2 -2
- package/umd/TimePicker.js +2 -2
- package/umd/Title.js +2 -2
- package/umd/ToggleButton.js +2 -2
- package/umd/Transfer.js +3 -3
- package/umd/Tree.js +2 -2
- package/umd/Upload.js +2 -2
- package/umd/locale.js +1 -1
- /package/_verture/{index-50f56891.js → index-f48d5ce6.js} +0 -0
- /package/_verture/{modalContext-11c51a45.js → modalContext-736ff215.js} +0 -0
package/Table/index.js
CHANGED
|
@@ -565,6 +565,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
565
565
|
var json = DeepClone(selectFilterCom);
|
|
566
566
|
delete json[filterHead.name];
|
|
567
567
|
setSelectFilterCom(json);
|
|
568
|
+
changeFilter && changeFilter(Object.assign({}, json));
|
|
569
|
+
setFilterHead({});
|
|
568
570
|
}
|
|
569
571
|
};
|
|
570
572
|
};
|
|
@@ -1457,15 +1459,19 @@ var TableBody = function TableBody(props) {
|
|
|
1457
1459
|
var colSpan = 1;
|
|
1458
1460
|
if (item.render) text = item.render(row, item, row[item.name], index, rowIndex);
|
|
1459
1461
|
if (formatter) text = formatter(row, item, row[item.name], index, rowIndex);
|
|
1462
|
+
var itemStyle = handStyle(item);
|
|
1460
1463
|
// 存在显示列,最后一列占两格
|
|
1461
1464
|
if (showColumns === 'inside' && !operate && index === headData.length - 1) {
|
|
1462
1465
|
colSpan = 2;
|
|
1466
|
+
if (itemStyle.right) {
|
|
1467
|
+
itemStyle.right = '0px';
|
|
1468
|
+
}
|
|
1463
1469
|
}
|
|
1464
1470
|
return jsx(TdElement, Object.assign({
|
|
1465
1471
|
align: item.align || align,
|
|
1466
1472
|
className: handContentClass(item),
|
|
1467
1473
|
colSpan: colSpan,
|
|
1468
|
-
style:
|
|
1474
|
+
style: itemStyle
|
|
1469
1475
|
}, {
|
|
1470
1476
|
children: item.autoTips === undefined || item.autoTips === true ? jsx(AutoTips, Object.assign({
|
|
1471
1477
|
beyondText: item.beyondText === undefined ? beyondText : item.beyondText,
|
|
@@ -1765,7 +1771,7 @@ var TableElement = function TableElement(props) {
|
|
|
1765
1771
|
}));
|
|
1766
1772
|
};
|
|
1767
1773
|
|
|
1768
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-table {\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: white;\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n font-weight: 400;\n position: relative;\n}\n.paraui-v4-table.paraui-v4-table-draggable * {\n user-select: none !important;\n}\n.paraui-v4-table.paraui-v4-table-fixed-table > .table-contain > table {\n table-layout: fixed;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-checkbox {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-radio {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-expandable {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-radio.paraui-v4-table-check .table-radio {\n left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check .table-expandable {\n left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check.paraui-v4-table-radio .table-expandable {\n left: 80px;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table {\n height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table .paraui-v4-empty {\n overflow: hidden;\n}\n.paraui-v4-table.paraui-v4-table-load.paraui-v4-table-no-data > .table-container > table {\n height: auto;\n}\n.paraui-v4-table.paraui-v4-table-pagination > .table-contain {\n height: calc(100% - 60px);\n}\n.paraui-v4-table.paraui-v4-table-pagination.table-load-more > .table-contain {\n height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-load-more.paraui-v4-table-pagination > .table-contain {\n height: 100%;\n}\n.paraui-v4-table > .table-contain {\n height: 100%;\n position: relative;\n}\n.paraui-v4-table > .table-contain > table {\n height: auto;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox > label {\n vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox .table-header-box {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio > label {\n vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table .table-radio .table-header-box {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-expandable > svg {\n vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table > .table-head {\n width: 100%;\n white-space: nowrap;\n}\n.paraui-v4-table > .table-contain > table > .table-head > tr th {\n height: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-scroll tr th {\n max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-serial-number .table-header-box .table-header-title {\n padding-right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box {\n height: 47px;\n line-height: 47px;\n position: relative;\n padding: 0 8px;\n display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title {\n max-width: 100%;\n display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title > .table-header-title-label {\n width: 100%;\n color: rgb(92, 101, 115);\n font-weight: 700;\n font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span {\n width: 20px;\n height: 20px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover {\n background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > svg {\n font-size: 12px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .up-svg {\n position: relative;\n top: 3px;\n transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .down-svg {\n position: relative;\n top: -3px;\n transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n cursor: pointer;\n border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover {\n background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span > svg {\n font-size: 14px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-show > span > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span:after {\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: rgb(244, 66, 66);\n content: \"\";\n right: 3px;\n top: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort > .table-header-title {\n padding-right: 8px;\n max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-filter > .table-header-title {\n padding-right: 8px;\n max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort.table-header-box-filter > .table-header-title {\n max-width: calc(100% - 40px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-asc > .table-sort-svg > span > .up-svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-desc > .table-sort-svg > span > .down-svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums {\n width: 53px;\n cursor: pointer;\n border-left: 1px solid rgb(234, 236, 241);\n right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box > svg {\n font-size: 20px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-no-btn tr th:first-child .table-header-box {\n padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn {\n width: 32px;\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn > .table-header-box {\n width: 32px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child > .table-header-box {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body {\n width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-scroll tr td {\n max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td {\n background-color: white;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate {\n padding-right: 16px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:nth-of-type(2n) td {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:hover td {\n background-color: rgb(240, 245, 255);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg {\n transition: all 0.3s;\n cursor: pointer;\n font-size: 18px;\n color: rgb(92, 101, 115);\n transform: rotate(270deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > .expand {\n transform: rotate(360deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row {\n cursor: pointer;\n position: sticky;\n bottom: 0;\n z-index: 10;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row .more-btn {\n color: rgb(46, 101, 230);\n font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row > .td-element {\n position: relative;\n background: white;\n box-shadow: 4px -4px 8px 0px rgb(234, 236, 241);\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr td:first-child {\n padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr.more-table-row td:first-child {\n padding-left: 8px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn > .table-no-data > td:first-child {\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn {\n width: 32px;\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn:first-child {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data {\n height: calc(100% - 50px);\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data:hover td {\n background-color: white;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data > td {\n padding: 56px 0 0 0;\n}\n.paraui-v4-table > .table-contain > .table-pos-line {\n position: absolute;\n top: 0;\n width: 1px;\n background-color: rgb(46, 101, 230);\n z-index: 1000;\n}\n.paraui-v4-table > .table-pagination {\n width: 100%;\n height: 60px;\n display: flex;\n align-items: flex-end;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right {\n display: flex;\n height: 32px;\n align-items: center;\n color: rgb(29, 33, 38);\n line-height: 32px;\n padding-left: 16px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .all-select {\n margin-left: 12px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .line {\n width: 1px;\n height: 12px;\n background-color: rgb(212, 218, 227);\n margin: 0 10px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .check-number {\n width: 65px;\n display: inline-block;\n}\n.paraui-v4-table > .table-pagination .table-pagination-com {\n flex: 1;\n justify-content: flex-end;\n}\n.paraui-v4-table > .table-pagination .refresh-btn {\n margin-left: 20px;\n}\n\n.paraui-v4-table-show-colums-popover > .component-popover-content {\n min-width: 200px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box {\n padding-top: 4px;\n max-height: 320px;\n overflow-y: auto;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item {\n height: 30px;\n line-height: 30px;\n cursor: pointer;\n display: flex;\n padding: 0 10px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > span {\n padding-left: 8px;\n color: rgb(29, 33, 38);\n font-size: 14px;\n display: inline-block;\n width: calc(100% - 14px);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item:hover {\n background: rgb(247, 248, 250);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-select > span {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled {\n cursor: inherit;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled > span {\n color: rgb(29, 33, 38);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled:hover {\n background: transparent;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer {\n height: 36px;\n border-top: 1px solid rgb(247, 248, 250);\n text-align: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer > button {\n width: 100%;\n height: 100%;\n margin: 0;\n}\n\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box {\n padding-top: 4px;\n max-height: 320px;\n overflow-y: auto;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item {\n height: 30px;\n line-height: 30px;\n cursor: pointer;\n display: flex;\n padding: 0 10px;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > span {\n padding-left: 8px;\n color: rgb(29, 33, 38);\n font-size: 14px;\n display: inline-block;\n width: calc(100% - 14px);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item:hover {\n background: rgb(247, 248, 250);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer {\n height: 36px;\n border-top: 1px solid rgb(247, 248, 250);\n text-align: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer > button {\n width: 50%;\n height: 100%;\n margin: 0;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select.filter-select-none {\n text-align: center;\n padding: 20px 0;\n}\n.paraui-v4-filter-popover.paraui-v4-filter-popover-default > .component-popover-content {\n min-width: 200px;\n}";
|
|
1774
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-table {\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: white;\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n font-weight: 400;\n position: relative;\n}\n.paraui-v4-table.paraui-v4-table-draggable * {\n user-select: none !important;\n}\n.paraui-v4-table.paraui-v4-table-fixed-table > .table-contain > table {\n table-layout: fixed;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-checkbox {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-radio {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn > .table-contain > table .table-expandable {\n left: 0;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-radio.paraui-v4-table-check .table-radio {\n left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check .table-expandable {\n left: 48px;\n}\n.paraui-v4-table.paraui-v4-table-fixed-cloumn.paraui-v4-table-expandable.paraui-v4-table-check.paraui-v4-table-radio .table-expandable {\n left: 80px;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table {\n height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-no-data > .table-container > table .paraui-v4-empty {\n overflow: hidden;\n}\n.paraui-v4-table.paraui-v4-table-load.paraui-v4-table-no-data > .table-container > table {\n height: auto;\n}\n.paraui-v4-table.paraui-v4-table-pagination > .table-contain {\n height: calc(100% - 60px);\n}\n.paraui-v4-table.paraui-v4-table-pagination.table-load-more > .table-contain {\n height: 100%;\n}\n.paraui-v4-table.paraui-v4-table-load-more.paraui-v4-table-pagination > .table-contain {\n height: 100%;\n}\n.paraui-v4-table > .table-contain {\n height: 100%;\n position: relative;\n}\n.paraui-v4-table > .table-contain > table {\n height: auto;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-checkbox .table-header-box {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-radio .table-header-box {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table > .table-contain > table .table-expandable > svg {\n vertical-align: middle;\n}\n.paraui-v4-table > .table-contain > table > .table-head {\n width: 100%;\n white-space: nowrap;\n}\n.paraui-v4-table > .table-contain > table > .table-head > tr th {\n height: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-scroll tr th {\n max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-serial-number .table-header-box .table-header-title {\n padding-right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box {\n height: 47px;\n line-height: 47px;\n position: relative;\n padding: 0 8px;\n display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title {\n max-width: 100%;\n display: flex;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-title > .table-header-title-label {\n width: 100%;\n color: rgb(92, 101, 115);\n font-weight: 700;\n font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span {\n width: 20px;\n height: 20px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover {\n background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > svg {\n font-size: 12px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .up-svg {\n position: relative;\n top: 3px;\n transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-sort-svg > span > .down-svg {\n position: relative;\n top: -3px;\n transform: scale(0.8);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span {\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n cursor: pointer;\n border-radius: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover {\n background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter > span > svg {\n font-size: 14px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-show > span > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box > .table-header-filter.table-header-filter-select > span:after {\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: rgb(244, 66, 66);\n content: \"\";\n right: 3px;\n top: 2px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort > .table-header-title {\n padding-right: 8px;\n max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-filter > .table-header-title {\n padding-right: 8px;\n max-width: calc(100% - 20px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort.table-header-box-filter > .table-header-title {\n max-width: calc(100% - 40px);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-asc > .table-sort-svg > span > .up-svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-header-box.table-header-box-sort-desc > .table-sort-svg > span > .down-svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums {\n width: 53px;\n cursor: pointer;\n border-left: 1px solid rgb(234, 236, 241);\n right: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box > svg {\n font-size: 20px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-table > .table-contain > table > .table-head .show-colums .table-header-box:hover > svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-head.table-head-no-btn tr th:first-child .table-header-box {\n padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn {\n width: 32px;\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn > .table-header-box {\n width: 32px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-head .table-head-btn:first-child > .table-header-box {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body {\n width: 100%;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-scroll tr td {\n max-width: 240px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td {\n background-color: white;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr td.table-operate {\n padding-right: 16px;\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:nth-of-type(2n) td {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr:hover td {\n background-color: rgb(240, 245, 255);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg {\n transition: all 0.3s;\n cursor: pointer;\n font-size: 18px;\n color: rgb(92, 101, 115);\n transform: rotate(270deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > svg:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-table > .table-contain > table > .table-body tr .table-expandable > .expand {\n transform: rotate(360deg);\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row {\n cursor: pointer;\n position: sticky;\n bottom: 0;\n z-index: 10;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row .more-btn {\n color: rgb(46, 101, 230);\n font-size: 14px;\n}\n.paraui-v4-table > .table-contain > table > .table-body .more-table-row > .td-element {\n position: relative;\n background: white;\n box-shadow: 4px -4px 8px 0px rgb(234, 236, 241);\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr td:first-child {\n padding-left: 20px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn tr.more-table-row td:first-child {\n padding-left: 8px;\n}\n.paraui-v4-table > .table-contain > table > .table-body.table-body-no-btn > .table-no-data > td:first-child {\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn {\n width: 32px;\n padding: 0;\n}\n.paraui-v4-table > .table-contain > table > .table-body .table-body-btn:first-child {\n width: 48px;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data {\n height: calc(100% - 50px);\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data:hover td {\n background-color: white;\n}\n.paraui-v4-table > .table-contain > table > .table-body > .table-no-data > td {\n padding: 56px 0 0 0;\n}\n.paraui-v4-table > .table-contain > .table-pos-line {\n position: absolute;\n top: 0;\n width: 1px;\n background-color: rgb(46, 101, 230);\n z-index: 1000;\n}\n.paraui-v4-table > .table-pagination {\n width: 100%;\n height: 60px;\n display: flex;\n align-items: flex-end;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right {\n display: flex;\n height: 32px;\n align-items: center;\n color: rgb(29, 33, 38);\n line-height: 32px;\n padding-left: 16px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .all-select {\n margin-left: 12px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .line {\n width: 1px;\n height: 12px;\n background-color: rgb(212, 218, 227);\n margin: 0 10px;\n}\n.paraui-v4-table > .table-pagination .table-pagination-right .check-number {\n width: 65px;\n display: inline-block;\n}\n.paraui-v4-table > .table-pagination .table-pagination-com {\n flex: 1;\n justify-content: flex-end;\n}\n.paraui-v4-table > .table-pagination .refresh-btn {\n margin-left: 20px;\n}\n\n.paraui-v4-table-show-colums-popover > .component-popover-content {\n min-width: 200px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box {\n padding-top: 4px;\n max-height: 320px;\n overflow-y: auto;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item {\n height: 30px;\n line-height: 30px;\n cursor: pointer;\n display: flex;\n padding: 0 10px;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item > span {\n padding-left: 8px;\n color: rgb(29, 33, 38);\n font-size: 14px;\n display: inline-block;\n width: calc(100% - 14px);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item:hover {\n background: rgb(247, 248, 250);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled {\n cursor: inherit;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled > span {\n color: rgb(29, 33, 38);\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-box > .show-colums-select-item.show-colums-select-item-disabled:hover {\n background: transparent;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer {\n height: 36px;\n border-top: 1px solid rgb(247, 248, 250);\n text-align: center;\n}\n.paraui-v4-table-show-colums-popover > .component-popover-content .show-colums-select > .show-colums-select-footer > button {\n width: 100%;\n height: 100%;\n margin: 0;\n}\n\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box {\n padding-top: 4px;\n max-height: 320px;\n overflow-y: auto;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item {\n height: 30px;\n line-height: 30px;\n cursor: pointer;\n display: flex;\n padding: 0 10px;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > label {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item > span {\n padding-left: 8px;\n color: rgb(29, 33, 38);\n font-size: 14px;\n display: inline-block;\n width: calc(100% - 14px);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-box > .filter-select-item:hover {\n background: rgb(247, 248, 250);\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer {\n height: 36px;\n border-top: 1px solid rgb(247, 248, 250);\n text-align: center;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select > .filter-select-footer > button {\n width: 50%;\n height: 100%;\n margin: 0;\n}\n.paraui-v4-filter-popover > .component-popover-content .filter-select.filter-select-none {\n text-align: center;\n padding: 20px 0;\n}\n.paraui-v4-filter-popover.paraui-v4-filter-popover-default > .component-popover-content {\n min-width: 200px;\n}";
|
|
1769
1775
|
styleInject(css_248z);
|
|
1770
1776
|
|
|
1771
1777
|
var Table = function Table(propsInit) {
|
|
@@ -2565,8 +2571,8 @@ var Table = function Table(propsInit) {
|
|
|
2565
2571
|
var _itemWidth2 = getStringInNumber(_handW2);
|
|
2566
2572
|
_item2.paraui_right_width = rightOps;
|
|
2567
2573
|
rightOps += _itemWidth2;
|
|
2568
|
-
//
|
|
2569
|
-
if (_i2 ===
|
|
2574
|
+
// 第一个
|
|
2575
|
+
if (_i2 === 0) {
|
|
2570
2576
|
_item2.paraui_fixed_right_first = true;
|
|
2571
2577
|
} else {
|
|
2572
2578
|
_item2.paraui_fixed_right_first = false;
|
package/Tabs/index.d.ts
CHANGED
|
@@ -61,6 +61,8 @@ export interface TabsProps extends Omit<RcTabsProps, 'editable'> {
|
|
|
61
61
|
radioValue?: any;
|
|
62
62
|
/** 默认单选值 */
|
|
63
63
|
defaultRadioValue?: any;
|
|
64
|
+
/** 线性选项卡导航栏主轴是否具有间距,开启为20px间距,关闭为0间距,默认开启 */
|
|
65
|
+
navWithPadding?: boolean;
|
|
64
66
|
/** 单选值切换的回调 */
|
|
65
67
|
onRadioChange?: (radioValue: any) => void;
|
|
66
68
|
/** 新增按钮回调 showAdd 为 true 时有效*/
|
package/Tabs/index.js
CHANGED
|
@@ -50,7 +50,7 @@ var localeJson = {
|
|
|
50
50
|
en: en
|
|
51
51
|
};
|
|
52
52
|
|
|
53
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:29\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:39\n* @description\n*/\n.paraui-v4-tabs-small > .component-tabs-nav .component-tabs-tab {\n padding: 8px 0;\n font-size: 14px;\n}\n\n.paraui-v4-tabs-large > .component-tabs-nav .component-tabs-tab {\n padding: 16px 0;\n font-size: 16px;\n}\n\n.paraui-v4-tabs-card.paraui-v4-tabs-small > .component-tabs-nav .component-tabs-tab {\n padding: 6px 16px;\n}\n\n.paraui-v4-tabs-card.paraui-v4-tabs-large > .component-tabs-nav .component-tabs-tab {\n padding: 7px 16px 6px;\n}\n\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:44\n* @description\n*/\n.paraui-v4-tabs.component-tabs-top, .paraui-v4-tabs.component-tabs-bottom {\n flex-direction: column;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav {\n margin: 0 0 16px 0;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav::before {\n position: absolute;\n right: 0;\n left: 0;\n border-bottom: 1px solid rgb(212, 218, 227);\n content: \"\";\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar {\n height: 1px;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar-animated {\n transition: width 0.3s, left 0.3s, right 0.3s;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n top: 0;\n bottom: 0;\n width: 30px;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::before {\n left: 0;\n box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n right: 0;\n box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav::before {\n bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar {\n bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav {\n order: 1;\n margin-top: 16px;\n margin-bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav::before {\n top: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar {\n top: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-content-holder {\n order: 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav {\n flex-direction: column;\n min-width: 50px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-tab {\n padding: 0 12px;\n text-align: center;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin: 8px 0 0 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap {\n flex-direction: column;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n right: 0;\n left: 0;\n height: 30px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::before {\n top: 0;\n box-shadow: inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n bottom: 0;\n box-shadow: inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar {\n width: 1px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar-animated {\n transition: height 0.3s, top 0.3s;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-operations {\n flex: 1 0 auto;\n flex-direction: column;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar {\n right: 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-content-holder {\n margin-left: -1px;\n border-left: 1px solid #f0f0f0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding-left: 24px;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav {\n order: 1;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar {\n left: 0;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-content-holder {\n order: 0;\n margin-right: -1px;\n border-right: 1px solid #f0f0f0;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding-right: 24px;\n}\n\n.component-tabs-dropdown {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n color: rgba(0, 0, 0, 0.85);\n font-size: 14px;\n font-variant: tabular-nums;\n line-height: 1.5715;\n list-style: none;\n font-feature-settings: \"tnum\";\n position: absolute;\n top: -9999px;\n left: -9999px;\n z-index: 1050;\n display: block;\n}\n.component-tabs-dropdown.component-tabs-dropdown-hidden {\n display: none;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu {\n max-height: 200px;\n margin: 0;\n padding: 4px 0;\n overflow-x: hidden;\n overflow-y: auto;\n text-align: left;\n list-style-type: none;\n background-color: rgb(255, 255, 255);\n background-clip: padding-box;\n border-radius: 4px;\n outline: none;\n box-shadow: 0px 2px 8px 0px rgb(234, 236, 241);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item {\n display: flex;\n align-items: center;\n min-width: 140px;\n margin: 0;\n padding: 5px 10px;\n overflow: hidden;\n color: rgb(29, 33, 38);\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n white-space: nowrap;\n text-overflow: ellipsis;\n cursor: pointer;\n transition: all 0.3s;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help {\n display: inline-flex;\n flex-direction: row-reverse;\n align-items: center;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help .paraui-v4-help {\n display: inline-flex;\n margin-left: 4px;\n font-size: 14px;\n color: rgb(161, 168, 179);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help .paraui-v4-help svg {\n color: inherit;\n font-size: inherit;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item > span {\n flex: 1;\n white-space: nowrap;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove {\n flex: none;\n margin-left: 12px;\n margin-top: 2px;\n color: rgb(92, 101, 115);\n background: transparent;\n border: 0;\n cursor: pointer;\n transition: all 0.3s;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove svg {\n color: inherit;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove:hover {\n color: rgb(87, 131, 235);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item:hover {\n background: rgb(247, 248, 250);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-disabled,\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-disabled:hover {\n color: rgb(161, 168, 179);\n background: transparent;\n cursor: not-allowed;\n}\n\n.component-tabs-slide-up-enter,\n.component-tabs-slide-up-appear {\n animation-duration: 0.2s;\n animation-fill-mode: both;\n animation-play-state: paused;\n}\n\n.component-tabs-slide-up-leave {\n animation-duration: 0.2s;\n animation-fill-mode: both;\n animation-play-state: paused;\n}\n\n.component-tabs-slide-up-enter.component-tabs-slide-up-enter-active,\n.component-tabs-slide-up-appear.component-tabs-slide-up-appear-active {\n animation-name: componentTabsSlideUpIn;\n animation-play-state: running;\n}\n\n.component-tabs-slide-up-leave.component-tabs-slide-up-leave-active {\n animation-name: componentTabsSlideUpOut;\n animation-play-state: running;\n pointer-events: none;\n}\n\n.component-tabs-slide-up-enter,\n.component-tabs-slide-up-appear {\n opacity: 0;\n animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\n}\n\n.component-tabs-slide-up-leave {\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n}\n\n@keyframes componentTabsSlideUpIn {\n 0% {\n transform: scaleY(0.8);\n transform-origin: 0% 0%;\n opacity: 0;\n }\n 100% {\n transform: scaleY(1);\n transform-origin: 0% 0%;\n opacity: 1;\n }\n}\n@keyframes componentTabsSlideUpOut {\n 0% {\n transform: scaleY(1);\n transform-origin: 0% 0%;\n opacity: 1;\n }\n 100% {\n transform: scaleY(0.8);\n transform-origin: 0% 0%;\n opacity: 0;\n }\n}\n.paraui-v4-tabs {\n color: rgb(29, 33, 38);\n font-size: 14px;\n line-height: 1.5715;\n display: flex;\n background-color: rgb(255, 255, 255);\n overflow: hidden;\n flex-shrink: 0;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav {\n position: relative;\n display: flex;\n flex: none;\n align-items: center;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap {\n position: relative;\n display: flex;\n flex: auto;\n align-self: stretch;\n overflow: hidden;\n white-space: nowrap;\n transform: translate(0);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n position: absolute;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n content: \"\";\n pointer-events: none;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-list {\n position: relative;\n display: flex;\n flex-shrink: 0;\n transition: transform 0.3s;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-operations {\n display: flex;\n align-self: stretch;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-operations-hidden, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-operations-hidden {\n position: absolute;\n visibility: hidden;\n pointer-events: none;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more {\n position: relative;\n padding: 8px;\n background: transparent;\n border: 0;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more:hover svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more:hover svg {\n color: rgb(46, 101, 230);\n transition: all 0.3s;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more svg {\n font-size: 18px;\n vertical-align: top;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more::after, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more::after {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 5px;\n transform: translateY(100%);\n content: \"\";\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add {\n min-width: 40px;\n margin-left: 2px;\n padding: 0 8px;\n background-color: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n color: rgb(29, 33, 38);\n outline: none;\n cursor: pointer;\n transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add svg {\n color: inherit;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add:hover, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add:hover {\n color: rgb(46, 101, 230);\n border: 1px solid rgb(87, 131, 235);\n}\n.paraui-v4-tabs .component-tabs-extra-content {\n flex: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-centered > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.paraui-v4-tabs-centered > div > .component-tabs-nav .component-tabs-nav-wrap {\n justify-content: center;\n}\n.paraui-v4-tabs .component-tabs-ink-bar {\n position: absolute;\n background: rgb(46, 101, 230);\n pointer-events: none;\n}\n.paraui-v4-tabs .component-tabs-tab {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n height: 40px;\n padding: 0 10px;\n font-size: 14px;\n background: transparent;\n border: 0;\n outline: none;\n cursor: pointer;\n}\n.paraui-v4-tabs .component-tabs-tab:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs .component-tabs-tab-btn {\n outline: none;\n transition: all 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help {\n display: flex;\n align-items: center;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help .paraui-v4-help {\n display: inline-flex;\n margin-left: 4px;\n font-size: 16px;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help .paraui-v4-help svg {\n margin-right: 0;\n color: inherit;\n font-size: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .paraui-v4-radio {\n margin-right: 8px;\n}\n.paraui-v4-tabs .component-tabs-tab-remove {\n display: inline-flex;\n flex: none;\n margin-right: -4px;\n margin-left: 4px;\n color: rgb(92, 101, 115);\n font-size: 14px;\n background: transparent;\n border: none;\n outline: none;\n cursor: pointer;\n transition: all 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tab-remove:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs .component-tabs-tab-remove svg {\n color: inherit;\n font-size: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab-remove span {\n display: inline-flex;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-active {\n color: rgb(46, 101, 230);\n font-weight: 400;\n text-shadow: 0 0 0.25px currentcolor;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-active .component-tabs-tab-btn {\n color: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-disabled {\n color: rgb(161, 168, 179);\n cursor: not-allowed;\n}\n.paraui-v4-tabs .component-tabs-tab .component-tabs-tab-remove svg {\n margin: 0;\n}\n.paraui-v4-tabs .component-tabs-tab svg {\n margin-right: 12px;\n}\n.paraui-v4-tabs .component-tabs-tab + .component-tabs-tab {\n margin: 0;\n}\n.paraui-v4-tabs .component-tabs-content {\n display: flex;\n width: 100%;\n}\n.paraui-v4-tabs .component-tabs-content-holder {\n flex: auto;\n min-width: 0;\n min-height: 0;\n}\n.paraui-v4-tabs .component-tabs-content-animated {\n transition: margin 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tabpane {\n flex: none;\n width: 100%;\n outline: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-line .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.paraui-v4-tabs-card-container .component-tabs-nav .component-tabs-nav-add {\n min-width: initial;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n align-self: center;\n margin-left: 10px;\n padding: 0;\n background-color: rgb(255, 255, 255);\n border-color: rgb(212, 218, 227);\n border-radius: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track {\n display: inline-flex;\n max-width: 100%;\n border-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav {\n height: 32px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-wrap {\n padding: 0 4px;\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-add {\n margin-right: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav:before {\n display: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-ink-bar {\n visibility: hidden;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-tab {\n height: 24px;\n margin: 4px 0;\n padding: 0 10px;\n border-radius: 2px;\n transition: 0.3s;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-tab.component-tabs-tab-active {\n color: rgb(46, 101, 230);\n text-shadow: none;\n background-color: rgb(255, 255, 255);\n font-weight: 400;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-left .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-right .component-tabs-nav {\n max-width: 200px;\n height: auto;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-left .component-tabs-content-holder, .paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-right .component-tabs-content-holder {\n border-left: 0;\n border-right: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-track {\n border-radius: 4px 0 0 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-track .component-tabs-nav {\n border-radius: 4px;\n}\n.paraui-v4-tabs.component-tabs.paraui-v4-tabs-track > .component-tabs-nav .component-tabs-nav-more {\n background-color: rgb(247, 248, 250);\n border-radius: 0 4px 4px 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab {\n margin: 0;\n padding: 0 10px;\n background: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab .component-tabs-tab-remove, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab .component-tabs-tab-remove {\n margin-left: 8px;\n font-size: 14px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab-active {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-ink-bar {\n visibility: hidden;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin-left: 0;\n border-left: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab:first-child {\n border-top-left-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab:nth-last-child(2) {\n border-top-right-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > div > .component-tabs-nav .component-tabs-tab-active {\n border-bottom-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > div > .component-tabs-nav .component-tabs-tab-active {\n border-top-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin-top: 0;\n border-top: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab-active {\n border-right-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > div > .component-tabs-nav .component-tabs-tab-active {\n border-left-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right .component-tabs-nav .component-tabs-nav-add {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left .component-tabs-nav .component-tabs-nav-add {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav:before {\n display: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav .component-tabs-tab {\n border: 0;\n transition: 0.3s;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav .component-tabs-tab.component-tabs-tab-active {\n border-radius: 4px 4px 0 0;\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container .component-tabs-content {\n margin-top: -16px;\n padding: 16px;\n background-color: rgb(247, 248, 250);\n border-radius: 0 0 4px 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-no-child:not(.paraui-v4-tabs-card-container) .component-tabs-nav {\n margin: 0;\n}";
|
|
53
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:29\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:39\n* @description\n*/\n.paraui-v4-tabs-small > .component-tabs-nav .component-tabs-tab {\n padding: 8px 0;\n font-size: 14px;\n}\n\n.paraui-v4-tabs-large > .component-tabs-nav .component-tabs-tab {\n padding: 16px 0;\n font-size: 16px;\n}\n\n.paraui-v4-tabs-card.paraui-v4-tabs-small > .component-tabs-nav .component-tabs-tab {\n padding: 6px 16px;\n}\n\n.paraui-v4-tabs-card.paraui-v4-tabs-large > .component-tabs-nav .component-tabs-tab {\n padding: 7px 16px 6px;\n}\n\n/**\n* @author Hanz\n* @date 2022/5/30 上午10:44\n* @description\n*/\n.paraui-v4-tabs.component-tabs-top, .paraui-v4-tabs.component-tabs-bottom {\n flex-direction: column;\n}\n.paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-top > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-bottom > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-top > div > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-bottom > div > .component-tabs-nav {\n padding: 0 20px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-left > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-right > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-left > div > .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-line.component-nav-padding.component-tabs-right > div > .component-tabs-nav {\n padding: 20px 0;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav {\n margin: 0 0 16px 0;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav::before {\n position: absolute;\n right: 0;\n left: 0;\n border-bottom: 1px solid rgb(212, 218, 227);\n content: \"\";\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar {\n height: 1px;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar-animated {\n transition: width 0.3s, left 0.3s, right 0.3s;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n top: 0;\n bottom: 0;\n width: 30px;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::before {\n left: 0;\n box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n right: 0;\n box-shadow: inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-left::before {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-right::after {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav::before {\n bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-top > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-top > div > .component-tabs-nav .component-tabs-ink-bar {\n bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav {\n order: 1;\n margin-top: 16px;\n margin-bottom: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav::before, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav::before {\n top: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-nav .component-tabs-ink-bar {\n top: 0;\n}\n.paraui-v4-tabs.component-tabs-bottom > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-bottom > div > .component-tabs-content-holder {\n order: 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav {\n flex-direction: column;\n min-width: 50px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-tab {\n padding: 0 12px;\n text-align: center;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin: 8px 0 0 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap {\n flex-direction: column;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n right: 0;\n left: 0;\n height: 30px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::before {\n top: 0;\n box-shadow: inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n bottom: 0;\n box-shadow: inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-top::before {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-wrap.component-tabs-nav-wrap-ping-bottom::after {\n opacity: 1;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar {\n width: 1px;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar-animated, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar-animated {\n transition: height 0.3s, top 0.3s;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-nav-operations {\n flex: 1 0 auto;\n flex-direction: column;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-nav .component-tabs-ink-bar {\n right: 0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-content-holder {\n margin-left: -1px;\n border-left: 1px solid #f0f0f0;\n}\n.paraui-v4-tabs.component-tabs-left > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane, .paraui-v4-tabs.component-tabs-left > div > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding-left: 20px;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-nav, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav {\n order: 1;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-nav .component-tabs-ink-bar {\n left: 0;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-content-holder, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-content-holder {\n order: 0;\n margin-right: -1px;\n border-right: 1px solid #f0f0f0;\n}\n.paraui-v4-tabs.component-tabs-right > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane, .paraui-v4-tabs.component-tabs-right > div > .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding-right: 20px;\n}\n\n.component-tabs-dropdown {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n color: rgba(0, 0, 0, 0.85);\n font-size: 14px;\n font-variant: tabular-nums;\n line-height: 1.5715;\n list-style: none;\n font-feature-settings: \"tnum\";\n position: absolute;\n top: -9999px;\n left: -9999px;\n z-index: 1050;\n display: block;\n}\n.component-tabs-dropdown.component-tabs-dropdown-hidden {\n display: none;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu {\n max-height: 200px;\n margin: 0;\n padding: 4px 0;\n overflow-x: hidden;\n overflow-y: auto;\n text-align: left;\n list-style-type: none;\n background-color: rgb(255, 255, 255);\n background-clip: padding-box;\n border-radius: 4px;\n outline: none;\n box-shadow: 0px 2px 8px 0px rgb(234, 236, 241);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item {\n display: flex;\n align-items: center;\n min-width: 140px;\n margin: 0;\n padding: 5px 10px;\n overflow: hidden;\n color: rgb(29, 33, 38);\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n white-space: nowrap;\n text-overflow: ellipsis;\n cursor: pointer;\n transition: all 0.3s;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help {\n display: inline-flex;\n flex-direction: row-reverse;\n align-items: center;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help .paraui-v4-help {\n display: inline-flex;\n margin-left: 4px;\n font-size: 14px;\n color: rgb(161, 168, 179);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item .component-tabs-tab-help .paraui-v4-help svg {\n color: inherit;\n font-size: inherit;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item > span {\n flex: 1;\n white-space: nowrap;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove {\n flex: none;\n margin-left: 12px;\n margin-top: 2px;\n color: rgb(92, 101, 115);\n background: transparent;\n border: 0;\n cursor: pointer;\n transition: all 0.3s;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove svg {\n color: inherit;\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-remove:hover {\n color: rgb(87, 131, 235);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item:hover {\n background: rgb(247, 248, 250);\n}\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-disabled,\n.component-tabs-dropdown .component-tabs-dropdown-menu-item-disabled:hover {\n color: rgb(161, 168, 179);\n background: transparent;\n cursor: not-allowed;\n}\n\n.component-tabs-slide-up-enter,\n.component-tabs-slide-up-appear {\n animation-duration: 0.2s;\n animation-fill-mode: both;\n animation-play-state: paused;\n}\n\n.component-tabs-slide-up-leave {\n animation-duration: 0.2s;\n animation-fill-mode: both;\n animation-play-state: paused;\n}\n\n.component-tabs-slide-up-enter.component-tabs-slide-up-enter-active,\n.component-tabs-slide-up-appear.component-tabs-slide-up-appear-active {\n animation-name: componentTabsSlideUpIn;\n animation-play-state: running;\n}\n\n.component-tabs-slide-up-leave.component-tabs-slide-up-leave-active {\n animation-name: componentTabsSlideUpOut;\n animation-play-state: running;\n pointer-events: none;\n}\n\n.component-tabs-slide-up-enter,\n.component-tabs-slide-up-appear {\n opacity: 0;\n animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\n}\n\n.component-tabs-slide-up-leave {\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n}\n\n@keyframes componentTabsSlideUpIn {\n 0% {\n transform: scaleY(0.8);\n transform-origin: 0% 0%;\n opacity: 0;\n }\n 100% {\n transform: scaleY(1);\n transform-origin: 0% 0%;\n opacity: 1;\n }\n}\n@keyframes componentTabsSlideUpOut {\n 0% {\n transform: scaleY(1);\n transform-origin: 0% 0%;\n opacity: 1;\n }\n 100% {\n transform: scaleY(0.8);\n transform-origin: 0% 0%;\n opacity: 0;\n }\n}\n.paraui-v4-tabs {\n color: rgb(29, 33, 38);\n font-size: 14px;\n line-height: 1.5715;\n display: flex;\n background-color: rgb(255, 255, 255);\n overflow: hidden;\n flex-shrink: 0;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav {\n position: relative;\n display: flex;\n flex: none;\n align-items: center;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap {\n position: relative;\n display: flex;\n flex: auto;\n align-self: stretch;\n overflow: hidden;\n white-space: nowrap;\n transform: translate(0);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap::before, .paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-wrap::after, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-wrap::after {\n position: absolute;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.3s;\n content: \"\";\n pointer-events: none;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-list, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-list {\n position: relative;\n display: flex;\n flex-shrink: 0;\n transition: transform 0.3s;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-operations, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-operations {\n display: flex;\n align-self: stretch;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-operations-hidden, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-operations-hidden {\n position: absolute;\n visibility: hidden;\n pointer-events: none;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more {\n position: relative;\n padding: 8px;\n background: transparent;\n border: 0;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more:hover svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more:hover svg {\n color: rgb(46, 101, 230);\n transition: all 0.3s;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more svg {\n font-size: 18px;\n vertical-align: top;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-more::after, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-more::after {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 5px;\n transform: translateY(100%);\n content: \"\";\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add {\n min-width: 40px;\n margin-left: 2px;\n padding: 0 8px;\n background-color: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n color: rgb(29, 33, 38);\n outline: none;\n cursor: pointer;\n transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add svg, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add svg {\n color: inherit;\n}\n.paraui-v4-tabs.component-tabs > .component-tabs-nav .component-tabs-nav-add:hover, .paraui-v4-tabs.component-tabs > div > .component-tabs-nav .component-tabs-nav-add:hover {\n color: rgb(46, 101, 230);\n border: 1px solid rgb(87, 131, 235);\n}\n.paraui-v4-tabs .component-tabs-extra-content {\n flex: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-centered > .component-tabs-nav .component-tabs-nav-wrap, .paraui-v4-tabs.paraui-v4-tabs-centered > div > .component-tabs-nav .component-tabs-nav-wrap {\n justify-content: center;\n}\n.paraui-v4-tabs .component-tabs-ink-bar {\n position: absolute;\n background: rgb(46, 101, 230);\n pointer-events: none;\n}\n.paraui-v4-tabs .component-tabs-tab {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n height: 40px;\n padding: 0 10px;\n font-size: 14px;\n background: transparent;\n border: 0;\n outline: none;\n cursor: pointer;\n}\n.paraui-v4-tabs .component-tabs-tab:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs .component-tabs-tab-btn {\n outline: none;\n transition: all 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help {\n display: flex;\n align-items: center;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help .paraui-v4-help {\n display: inline-flex;\n margin-left: 4px;\n font-size: 16px;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .component-tabs-tab-help .paraui-v4-help svg {\n margin-right: 0;\n color: inherit;\n font-size: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab-btn .paraui-v4-radio {\n margin-right: 8px;\n}\n.paraui-v4-tabs .component-tabs-tab-remove {\n display: inline-flex;\n flex: none;\n margin-right: -4px;\n margin-left: 4px;\n color: rgb(92, 101, 115);\n font-size: 14px;\n background: transparent;\n border: none;\n outline: none;\n cursor: pointer;\n transition: all 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tab-remove:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs .component-tabs-tab-remove svg {\n color: inherit;\n font-size: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab-remove span {\n display: inline-flex;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-active {\n color: rgb(46, 101, 230);\n font-weight: 400;\n text-shadow: 0 0 0.25px currentcolor;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-active .component-tabs-tab-btn {\n color: inherit;\n}\n.paraui-v4-tabs .component-tabs-tab.component-tabs-tab-disabled {\n color: rgb(161, 168, 179);\n cursor: not-allowed;\n}\n.paraui-v4-tabs .component-tabs-tab .component-tabs-tab-remove svg {\n margin: 0;\n}\n.paraui-v4-tabs .component-tabs-tab svg {\n margin-right: 12px;\n}\n.paraui-v4-tabs .component-tabs-tab + .component-tabs-tab {\n margin: 0;\n}\n.paraui-v4-tabs .component-tabs-content {\n display: flex;\n width: 100%;\n}\n.paraui-v4-tabs .component-tabs-content-holder {\n flex: auto;\n min-width: 0;\n min-height: 0;\n}\n.paraui-v4-tabs .component-tabs-content-animated {\n transition: margin 0.3s;\n}\n.paraui-v4-tabs .component-tabs-tabpane {\n flex: none;\n width: 100%;\n outline: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-line .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-add, .paraui-v4-tabs.paraui-v4-tabs-card-container .component-tabs-nav .component-tabs-nav-add {\n min-width: initial;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n align-self: center;\n margin-left: 10px;\n padding: 0;\n background-color: rgb(255, 255, 255);\n border-color: rgb(212, 218, 227);\n border-radius: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track {\n display: inline-flex;\n max-width: 100%;\n border-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav {\n height: 32px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-wrap {\n padding: 0 4px;\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-nav-add {\n margin-right: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav:before {\n display: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-ink-bar {\n visibility: hidden;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-tab {\n height: 24px;\n margin: 4px 0;\n padding: 0 10px;\n border-radius: 2px;\n transition: 0.3s;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-nav .component-tabs-tab.component-tabs-tab-active {\n color: rgb(46, 101, 230);\n text-shadow: none;\n background-color: rgb(255, 255, 255);\n font-weight: 400;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-left .component-tabs-nav, .paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-right .component-tabs-nav {\n max-width: 200px;\n height: auto;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-left .component-tabs-content-holder, .paraui-v4-tabs.paraui-v4-tabs-track.component-tabs-right .component-tabs-content-holder {\n border-left: 0;\n border-right: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-track .component-tabs-content-holder > .component-tabs-content > .component-tabs-tabpane {\n padding: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-track {\n border-radius: 4px 0 0 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-editable-track .component-tabs-nav {\n border-radius: 4px;\n}\n.paraui-v4-tabs.component-tabs.paraui-v4-tabs-track > .component-tabs-nav .component-tabs-nav-more {\n background-color: rgb(247, 248, 250);\n border-radius: 0 4px 4px 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab {\n margin: 0;\n padding: 0 10px;\n background: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab .component-tabs-tab-remove, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab .component-tabs-tab-remove {\n margin-left: 8px;\n font-size: 14px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-tab-active {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card > .component-tabs-nav .component-tabs-ink-bar, .paraui-v4-tabs.paraui-v4-tabs-card > div > .component-tabs-nav .component-tabs-ink-bar {\n visibility: hidden;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin-left: 0;\n border-left: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab:first-child {\n border-top-left-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab:nth-last-child(2) {\n border-top-right-radius: 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-top > div > .component-tabs-nav .component-tabs-tab-active {\n border-bottom-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-bottom > div > .component-tabs-nav .component-tabs-tab-active {\n border-top-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > div > .component-tabs-nav .component-tabs-tab + .component-tabs-tab {\n margin-top: 0;\n border-top: 0;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left > div > .component-tabs-nav .component-tabs-tab-active {\n border-right-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > .component-tabs-nav .component-tabs-tab-active, .paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right > div > .component-tabs-nav .component-tabs-tab-active {\n border-left-color: rgb(212, 218, 227);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-right .component-tabs-nav .component-tabs-nav-add {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card.component-tabs-left .component-tabs-nav .component-tabs-nav-add {\n margin-left: 0;\n margin-top: 2px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav:before {\n display: none;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav .component-tabs-tab {\n border: 0;\n transition: 0.3s;\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container > .component-tabs-nav .component-tabs-tab.component-tabs-tab-active {\n border-radius: 4px 4px 0 0;\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-tabs.paraui-v4-tabs-card-container .component-tabs-content {\n margin-top: -16px;\n padding: 16px;\n background-color: rgb(247, 248, 250);\n border-radius: 0 0 4px 4px;\n}\n.paraui-v4-tabs.paraui-v4-tabs-no-child:not(.paraui-v4-tabs-card-container) .component-tabs-nav {\n margin: 0;\n}";
|
|
54
54
|
styleInject(css_248z);
|
|
55
55
|
|
|
56
56
|
//tabs
|
|
@@ -79,8 +79,10 @@ var Tabs = function Tabs(props) {
|
|
|
79
79
|
radio = props.radio,
|
|
80
80
|
radioValue = props.radioValue,
|
|
81
81
|
defaultRadioValue = props.defaultRadioValue,
|
|
82
|
+
_props$navWithPadding = props.navWithPadding,
|
|
83
|
+
navWithPadding = _props$navWithPadding === void 0 ? true : _props$navWithPadding,
|
|
82
84
|
onRadioChange = props.onRadioChange,
|
|
83
|
-
restProps = __rest(props, ["type", "className", "size", "onEdit", "hideAdd", "centered", "addIcon", "moreIcon", "editable", "mode", "showAdd", "showPopConfirm", "popConfirmProps", "data", "onChange", "onAdd", "children", "value", "activeKey", "radio", "radioValue", "defaultRadioValue", "onRadioChange"]);
|
|
85
|
+
restProps = __rest(props, ["type", "className", "size", "onEdit", "hideAdd", "centered", "addIcon", "moreIcon", "editable", "mode", "showAdd", "showPopConfirm", "popConfirmProps", "data", "onChange", "onAdd", "children", "value", "activeKey", "radio", "radioValue", "defaultRadioValue", "navWithPadding", "onRadioChange"]);
|
|
84
86
|
var intl = useFormatMessage('Tabs', localeJson);
|
|
85
87
|
var prefixCls = "".concat($prefixCls, "-tabs");
|
|
86
88
|
var inType = type !== null && type !== void 0 ? type : mode;
|
|
@@ -232,7 +234,7 @@ var Tabs = function Tabs(props) {
|
|
|
232
234
|
activeKey: getActiveKey(),
|
|
233
235
|
moreTransitionName: "".concat($rcPrefixCls, "-tabs-slide-up")
|
|
234
236
|
}, restProps, {
|
|
235
|
-
className: clsx(prefixCls, (_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-").concat(size), size), _defineProperty(_clsx, "".concat(prefixCls, "-
|
|
237
|
+
className: clsx(prefixCls, (_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-").concat(size), size), _defineProperty(_clsx, "".concat(prefixCls, "-line"), !inType || inType === 'line'), _defineProperty(_clsx, "".concat(prefixCls, "-editable-line"), (!inType || inType === 'line') && editable), _defineProperty(_clsx, "".concat(prefixCls, "-card"), ['card', 'editable-card'].includes(inType)), _defineProperty(_clsx, "".concat(prefixCls, "-editable-card"), inType === 'editable-card'), _defineProperty(_clsx, "".concat(prefixCls, "-track"), inType === 'track'), _defineProperty(_clsx, "".concat(prefixCls, "-editable-track"), inType === 'track' && editable), _defineProperty(_clsx, "".concat(prefixCls, "-card-container ").concat(prefixCls, "-card"), inType === 'card-container'), _defineProperty(_clsx, "".concat(prefixCls, "-centered"), centered), _defineProperty(_clsx, "".concat(prefixCls, "-no-child"), hasChildNode()), _defineProperty(_clsx, "".concat($rcPrefixCls, "-nav-padding"), navWithPadding), _clsx), className),
|
|
236
238
|
editable: inEditable,
|
|
237
239
|
moreIcon: moreIcon,
|
|
238
240
|
prefixCls: "".concat($rcPrefixCls, "-tabs"),
|
package/Tag/index.js
CHANGED
|
@@ -20,7 +20,7 @@ import 'rc-tooltip/lib/placements';
|
|
|
20
20
|
import '@para-ui/icons/Forbid';
|
|
21
21
|
import '@paraview/lib';
|
|
22
22
|
|
|
23
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/1/12 上午9:43\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-tag-outline.paraui-v4-tag {\n border: 0.5px solid rgb(92, 101, 115);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-blue {\n border: 0.5px solid rgb(46, 101, 230);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-green {\n border: 0.5px solid rgb(19, 191, 76);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-yellow {\n border: 0.5px solid rgb(255, 147, 38);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-red {\n border: 0.5px solid rgb(244, 66, 66);\n}\n\n.paraui-v4-tag-edit-input {\n height: 24px;\n align-self: flex-start;\n margin: 0 8px 8px 0;\n font-size: 14px;\n color: rgb(29, 33, 38);\n text-indent: 8px;\n border: 1px solid rgb(46, 101, 230);\n border-radius: 4px;\n}\n\n.paraui-v4-tag {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n max-width: 100%;\n height: 24px;\n margin: 0 8px 8px 0;\n padding: 0 10px;\n font-size: 14px;\n color: rgb(29, 33, 38);\n white-space: nowrap;\n background: rgb(234, 236, 241);\n border-radius:
|
|
23
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/1/12 上午9:43\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-tag-outline.paraui-v4-tag {\n border: 0.5px solid rgb(92, 101, 115);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-blue {\n border: 0.5px solid rgb(46, 101, 230);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-green {\n border: 0.5px solid rgb(19, 191, 76);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-yellow {\n border: 0.5px solid rgb(255, 147, 38);\n}\n.paraui-v4-tag-outline.paraui-v4-tag-red {\n border: 0.5px solid rgb(244, 66, 66);\n}\n\n.paraui-v4-tag-edit-input {\n height: 24px;\n align-self: flex-start;\n margin: 0 8px 8px 0;\n font-size: 14px;\n color: rgb(29, 33, 38);\n text-indent: 8px;\n border: 1px solid rgb(46, 101, 230);\n border-radius: 4px;\n}\n\n.paraui-v4-tag {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n max-width: 100%;\n height: 24px;\n margin: 0 8px 8px 0;\n padding: 0 10px;\n font-size: 14px;\n color: rgb(29, 33, 38);\n white-space: nowrap;\n background: rgb(234, 236, 241);\n border-radius: 2px;\n line-height: 18px;\n}\n.paraui-v4-tag .tag-custom-icon:hover {\n background: none !important;\n cursor: default;\n}\n.paraui-v4-tag .tag-close-icon:hover {\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-tag .tag-edit-icon {\n display: flex;\n}\n.paraui-v4-tag.paraui-v4-tag-small {\n height: 20px;\n font-size: 12px;\n padding: 0 6px;\n}\n.paraui-v4-tag.paraui-v4-tag-small > svg {\n font-size: 12px;\n}\n.paraui-v4-tag.paraui-v4-tag-small > svg + .paraui-v4-auto-tips {\n margin-left: 2px;\n}\n.paraui-v4-tag.paraui-v4-tag-small .tag-close-icon {\n margin-left: 2px;\n}\n.paraui-v4-tag.paraui-v4-tag-small .tag-edit-icon {\n font-size: 12px;\n}\n.paraui-v4-tag > svg {\n color: inherit;\n font-size: 16px;\n}\n.paraui-v4-tag .tag-edit-icon {\n color: inherit;\n font-size: 16px;\n cursor: pointer;\n}\n.paraui-v4-tag .tag-edit-icon > svg {\n color: rgb(29, 33, 38);\n}\n.paraui-v4-tag .tag-close-icon {\n margin-left: 4px;\n color: inherit;\n font-size: 16px;\n cursor: pointer;\n}\n.paraui-v4-tag .tag-close-icon:hover {\n color: inherit;\n}\n.paraui-v4-tag > svg + .paraui-v4-auto-tips {\n margin-left: 4px;\n}\n.paraui-v4-tag.paraui-v4-tag-has-color, .paraui-v4-tag.paraui-v4-tag-has-color svg, .paraui-v4-tag.paraui-v4-tag-has-color svg:hover {\n color: inherit;\n}\n.paraui-v4-tag.paraui-v4-tag-blue {\n color: rgb(46, 101, 230);\n background-color: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-tag.paraui-v4-tag-green {\n color: rgb(19, 191, 76);\n background-color: rgba(19, 191, 76, 0.1);\n}\n.paraui-v4-tag.paraui-v4-tag-yellow {\n color: rgb(255, 147, 38);\n background-color: rgba(255, 147, 38, 0.1);\n}\n.paraui-v4-tag.paraui-v4-tag-red {\n color: rgb(244, 66, 66);\n background-color: rgba(244, 66, 66, 0.1);\n}\n.paraui-v4-tag.paraui-v4-tag-hidden {\n display: none;\n}\n\n.paraui-v4-tag-small svg {\n font-size: 12px;\n}\n\n.paraui-v4-tag-group {\n display: flex;\n align-items: center;\n flex-flow: row wrap;\n}\n.paraui-v4-tag-group .tag-group-input {\n height: 24px;\n align-self: flex-start;\n font-size: 14px;\n color: rgb(29, 33, 38);\n text-indent: 8px;\n border: 1px solid rgb(46, 101, 230);\n border-radius: 4px;\n}\n.paraui-v4-tag-group .tag-group-input .tag-group-input-large {\n height: 28px;\n}\n.paraui-v4-tag-group .tag-group-new .tag-group-new-icon {\n padding: 0 5px;\n}\n.paraui-v4-tag-group .tag-group-add-btn {\n border: 1px dashed rgb(212, 218, 227);\n}\n.paraui-v4-tag-group .tag-group-add-btn .tag-edit-icon {\n background: none !important;\n}\n.paraui-v4-tag-group .tag-group-add-btn:hover {\n cursor: pointer;\n}\n.paraui-v4-tag-group .tag-group-add-btn:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-tag-group .tag-group-add-btn:hover .tag-text {\n color: rgb(46, 101, 230);\n}";
|
|
24
24
|
styleInject(css_248z);
|
|
25
25
|
|
|
26
26
|
//tag group
|
|
@@ -287,7 +287,7 @@ var InternalTag = function InternalTag(props) {
|
|
|
287
287
|
//tag editIcon style
|
|
288
288
|
var editIconStyle = {
|
|
289
289
|
backgroundColor: editIconEnter ? tinycolor(color).setAlpha(0.1).toRgbString() : undefined,
|
|
290
|
-
marginRight: children ? '4px' : undefined,
|
|
290
|
+
marginRight: children ? size === 'small' ? '2px' : '4px' : undefined,
|
|
291
291
|
borderRadius: '2px'
|
|
292
292
|
};
|
|
293
293
|
//tag cls
|
|
@@ -348,7 +348,7 @@ var InternalTag = function InternalTag(props) {
|
|
|
348
348
|
// 渲染前缀icon
|
|
349
349
|
var renderPrefixIcon = function renderPrefixIcon() {
|
|
350
350
|
return (editable || icon) && jsx("span", Object.assign({
|
|
351
|
-
className: "tag-edit-icon",
|
|
351
|
+
className: "tag-edit-icon ".concat(icon ? "tag-custom-icon" : ''),
|
|
352
352
|
style: editIconStyle,
|
|
353
353
|
onMouseEnter: handleEditEnter,
|
|
354
354
|
onMouseLeave: handleEditLeave
|
package/TextField/index.js
CHANGED
|
@@ -29,7 +29,7 @@ import 'rc-dropdown';
|
|
|
29
29
|
import '../_verture/usePopupContainer-87febeb9.js';
|
|
30
30
|
import 'dayjs';
|
|
31
31
|
|
|
32
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-text-field {\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n font-weight: 400;\n display: inline-block;\n width: 100%;\n}\n.paraui-v4-text-field > .text-field-content {\n border: 1px solid;\n border-radius: 4px;\n border-color: rgb(212, 218, 227);\n display: flex;\n width: 100%;\n position: relative;\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-text-field > .text-field-content:hover {\n border-color: rgb(87, 131, 235);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before {\n color: rgb(92, 101, 115);\n padding: 0 10px;\n border-bottom-left-radius: 4px;\n border-top-left-radius: 4px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before:after {\n position: absolute;\n content: \"\";\n right: 0;\n width: 1px;\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before svg {\n font-size: 18px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within {\n position: relative;\n display: flex;\n flex-grow: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within:hover > .clean-up-icon {\n display: flex;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon {\n height: 100%;\n align-items: center;\n margin-right: 10px;\n cursor: pointer;\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon svg {\n color: rgb(161, 168, 179);\n font-size: 16px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon {\n display: flex;\n height: 100%;\n align-items: center;\n margin-right: 10px;\n cursor: pointer;\n color: rgb(29, 33, 38);\n position: relative;\n z-index: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon.right-icon-password:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon svg {\n color: rgb(92, 101, 115);\n font-size: 18px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .length-limit {\n display: flex;\n height: 100%;\n align-items: center;\n margin-right: 10px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n width: 100%;\n line-height: 0;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-outer-spin-button,\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input[type=number] {\n -moz-appearance: textfield;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n width: 100%;\n height: 100%;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n width: 100% !important;\n padding: 10px;\n resize: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n font-size: 14px;\n color: rgb(29, 33, 38);\n border: 0;\n border-radius: 4px;\n background: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-clear, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-clear {\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-reveal, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-reveal {\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input:disabled, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea:disabled {\n background-color: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n width: 100%;\n position: absolute;\n left: 0;\n top: 0;\n height: 100%;\n padding: 0 10px;\n color: rgb(161, 168, 179);\n cursor: text;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-align: left;\n pointer-events: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder > .text-field-required {\n margin-left: 2px;\n color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after {\n color: rgb(92, 101, 115);\n padding: 0 10px;\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after:after {\n position: absolute;\n content: \"\";\n left: 0;\n width: 1px;\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after svg {\n font-size: 18px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .clean-up-icon {\n display: none;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n position: absolute;\n height: 22px;\n bottom: 0;\n border-radius: 4px;\n width: calc(100% - 10px);\n background: white;\n justify-content: flex-end;\n padding-bottom: 2px;\n margin-right: 0;\n left: 0;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n padding-top: 10px;\n line-height: 1;\n height: calc(100% - 24px);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content:hover {\n border-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-before {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n cursor: not-allowed;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n cursor: not-allowed;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-after {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content:hover {\n border-color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content:hover {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit-length > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n padding-bottom: 25px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-focus > .text-field-content {\n border-color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content {\n height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content {\n height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content {\n height: 32px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before:after {\n top: 7px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after:after {\n top: 7px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-resize > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n resize: both;\n}\n\n.paraui-v4-text-field-select.component-dropdown {\n /*// 小\n &.paraui-v4-text-field-select-small {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 28px;\n }\n }\n }\n\n // 中\n &.paraui-v4-text-field-select-medium {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 32px;\n }\n }\n }\n\n // 大\n &.paraui-v4-text-field-select-large {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 36px;\n }\n }\n }*/\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content {\n max-height: 320px;\n overflow: auto;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item {\n display: flex;\n cursor: pointer;\n color: rgb(29, 33, 38);\n padding: 0 10px;\n line-height: 30px;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item.text-field-select-content-item-keydown {\n background-color: rgb(247, 248, 250);\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content.text-field-select-content-loading {\n height: 100px;\n position: relative;\n overflow: hidden;\n}\n.paraui-v4-text-field-select.paraui-v4-text-field-select-data.component-tooltip {\n padding: 8px 0;\n}";
|
|
32
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-text-field {\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n font-size: 14px;\n font-weight: 400;\n display: inline-block;\n width: 100%;\n}\n.paraui-v4-text-field > .text-field-content {\n border: 1px solid;\n border-radius: 4px;\n border-color: rgb(212, 218, 227);\n display: flex;\n width: 100%;\n position: relative;\n background-color: rgb(255, 255, 255);\n}\n.paraui-v4-text-field > .text-field-content:hover {\n border-color: rgb(87, 131, 235);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before {\n color: rgb(92, 101, 115);\n padding: 0 10px;\n border-bottom-left-radius: 4px;\n border-top-left-radius: 4px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before:after {\n position: absolute;\n content: \"\";\n right: 0;\n width: 1px;\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-before svg {\n font-size: 18px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within {\n position: relative;\n display: flex;\n flex-grow: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within:hover > .clean-up-icon {\n display: flex;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon {\n height: 100%;\n align-items: center;\n margin-right: 10px;\n cursor: pointer;\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon svg {\n color: rgb(161, 168, 179);\n font-size: 16px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .clean-up-icon:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon {\n display: flex;\n height: 100%;\n align-items: center;\n margin-right: 10px;\n cursor: pointer;\n color: rgb(29, 33, 38);\n position: relative;\n z-index: 1;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon.right-icon-password:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .right-icon svg {\n color: rgb(92, 101, 115);\n font-size: 18px;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .length-limit {\n display: flex;\n height: 100%;\n align-items: center;\n margin-right: 10px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n width: 100%;\n line-height: 0;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-outer-spin-button,\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input input[type=number] {\n -moz-appearance: textfield;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n width: 100%;\n height: 100%;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n width: 100% !important;\n padding: 10px;\n resize: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n font-size: 14px;\n color: rgb(29, 33, 38);\n border: 0;\n border-radius: 4px;\n background: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-clear, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-clear {\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input::-ms-reveal, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea::-ms-reveal {\n display: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > input:disabled, .paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea:disabled {\n background-color: transparent;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n width: 100%;\n position: absolute;\n left: 0;\n top: 0;\n height: 100%;\n padding: 0 10px;\n color: rgb(161, 168, 179);\n cursor: text;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-align: left;\n pointer-events: none;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder > .text-field-required {\n margin-left: 2px;\n color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after {\n color: rgb(92, 101, 115);\n padding: 0 10px;\n border-bottom-right-radius: 4px;\n border-top-right-radius: 4px;\n white-space: nowrap;\n display: flex;\n align-items: center;\n position: relative;\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after:after {\n position: absolute;\n content: \"\";\n left: 0;\n width: 1px;\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field > .text-field-content > .text-field-content-after svg {\n font-size: 18px;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .clean-up-icon {\n display: none;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n position: absolute;\n height: 22px;\n bottom: 0;\n border-radius: 4px;\n width: calc(100% - 10px);\n background: white;\n justify-content: flex-end;\n padding-bottom: 2px;\n margin-right: 0;\n left: 0;\n}\n.paraui-v4-text-field.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n padding-top: 10px;\n line-height: 1;\n height: calc(100% - 24px);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content:hover {\n border-color: rgb(212, 218, 227);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-before {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n cursor: not-allowed;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > input, .paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n cursor: not-allowed;\n color: rgb(92, 101, 115);\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled > .text-field-content > .text-field-content-after {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-disabled.paraui-v4-text-field-multiline > .text-field-content .text-field-content-within > .length-limit {\n background-color: transparent;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-error > .text-field-content:hover {\n border-color: rgb(244, 66, 66);\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit > .text-field-content:hover {\n border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-text-field.paraui-v4-text-field-limit-length > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n padding-bottom: 25px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-focus > .text-field-content {\n border-color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content {\n height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-before:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-small > .text-field-content .text-field-content-after:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content {\n height: 28px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-before:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after {\n line-height: 26px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-medium > .text-field-content .text-field-content-after:after {\n top: 5px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content {\n height: 32px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-before:after {\n top: 7px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input {\n height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > input {\n padding: 6px 10px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content > .text-field-content-within > .text-field-content-within-input > .text-field-label-placeholder {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after {\n line-height: 30px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-large > .text-field-content .text-field-content-after:after {\n top: 7px;\n height: 16px;\n}\n.paraui-v4-text-field.paraui-v4-text-field-resize > .text-field-content > .text-field-content-within > .text-field-content-within-input > textarea {\n resize: both;\n}\n\n.paraui-v4-text-field-select.component-dropdown {\n /*// 小\n &.paraui-v4-text-field-select-small {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 28px;\n }\n }\n }\n\n // 中\n &.paraui-v4-text-field-select-medium {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 32px;\n }\n }\n }\n\n // 大\n &.paraui-v4-text-field-select-large {\n & > .text-field-select-content {\n & > .text-field-select-content-item {\n line-height: 36px;\n }\n }\n }*/\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content {\n max-height: 320px;\n overflow: auto;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item {\n display: flex;\n cursor: pointer;\n color: rgb(29, 33, 38);\n padding: 0 10px;\n line-height: 30px;\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content > .text-field-select-content-item.text-field-select-content-item-keydown {\n background-color: rgb(247, 248, 250);\n color: rgb(46, 101, 230);\n}\n.paraui-v4-text-field-select.component-dropdown > .text-field-select-content.text-field-select-content-loading {\n height: 100px;\n position: relative;\n overflow: hidden;\n}\n.paraui-v4-text-field-select.paraui-v4-text-field-select-data.component-tooltip {\n padding: 8px 0;\n}";
|
|
33
33
|
styleInject(css_248z);
|
|
34
34
|
|
|
35
35
|
// true:数值型的,false:非数值型
|
package/Title/index.js
CHANGED
|
@@ -18,7 +18,7 @@ import '@para-ui/icons/Help';
|
|
|
18
18
|
import 'rc-collapse';
|
|
19
19
|
import '@para-ui/icons/Right';
|
|
20
20
|
|
|
21
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/8/11 2:55 PM\n* @description 标题\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-title-collapse {\n border-bottom: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item {\n border-top: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header {\n flex-direction: row-reverse;\n justify-content: space-between;\n padding: 0;\n padding-right: 16px;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .paraui-v4-title-content {\n max-width: calc(100% - 32px);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .collapse-svg-box {\n color: rgb(
|
|
21
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/8/11 2:55 PM\n* @description 标题\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-title-collapse {\n border-bottom: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item {\n border-top: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header {\n flex-direction: row-reverse;\n justify-content: space-between;\n padding: 0;\n padding-right: 16px;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .paraui-v4-title-content {\n max-width: calc(100% - 32px);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .collapse-svg-box {\n color: rgb(92, 101, 115);\n margin-right: 0;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover {\n position: relative;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover > div {\n z-index: 1;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover > .collapse-svg-box:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover .title-link:hover {\n color: rgb(87, 131, 235);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover::after {\n position: absolute;\n background-color: rgb(247, 248, 250);\n content: \"\";\n width: 100%;\n height: calc(100% + 4px);\n left: -10px;\n border-radius: 4px;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-content > .component-collapse-content-box {\n padding-left: 0px;\n padding-right: 0px;\n padding-bottom: 0;\n}\n\n.paraui-v4-title .paraui-v4-title-content {\n display: flex;\n align-items: center;\n line-height: 20px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-ink {\n width: 4px;\n height: 14px;\n background-color: rgb(46, 101, 230);\n border-radius: 2px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-icon {\n display: inline-flex;\n}\n.paraui-v4-title .paraui-v4-title-content .title-text {\n margin-left: 8px;\n font-size: 14px;\n font-weight: 700;\n color: rgb(29, 33, 38);\n display: flex;\n align-items: center;\n white-space: nowrap;\n}\n.paraui-v4-title .paraui-v4-title-content .title-text .paraui-v4-help {\n line-height: 11px;\n font-size: 14px;\n margin-left: 4px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-subtext {\n margin-left: 10px;\n font-size: 14px;\n font-weight: 400;\n color: rgb(161, 168, 179);\n}\n.paraui-v4-title .paraui-v4-title-content .title-link {\n margin-left: 10px;\n text-decoration: none;\n outline: none;\n font-size: 14px;\n font-weight: 400;\n white-space: nowrap;\n color: rgb(46, 101, 230);\n}\n.paraui-v4-title .paraui-v4-title-content .title-link:hover {\n color: rgb(87, 131, 235);\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-large .title-icon svg {\n font-size: 30px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-large .title-text {\n font-size: 18px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-medium .title-icon svg {\n font-size: 24px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-medium .title-text {\n font-size: 16px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-small .title-icon svg {\n font-size: 20px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-small .title-text {\n margin-left: 4px;\n}";
|
|
22
22
|
styleInject(css_248z);
|
|
23
23
|
|
|
24
24
|
var Panel = Collapse.Panel;
|
package/ToggleButton/index.js
CHANGED
|
@@ -24,7 +24,7 @@ import 'dayjs';
|
|
|
24
24
|
import '../_verture/useFormatMessage-703f8b20.js';
|
|
25
25
|
import '@para-ui/core/GlobalContext';
|
|
26
26
|
|
|
27
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/23 上午9:50\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-toggle-button.paraui-v4-button-text {\n color: rgb(29, 33, 38);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover[disabled] {\n color: rgb(
|
|
27
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/23 上午9:50\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-toggle-button.paraui-v4-button-text {\n color: rgb(29, 33, 38);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover[disabled] {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button-wrap {\n display: inline-block;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio.paraui-v4-toggle-button-selected {\n border-color: rgb(46, 101, 230);\n color: rgb(255, 255, 255);\n background-color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio.paraui-v4-toggle-button-selected:hover {\n border-color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio:hover {\n border-color: rgb(87, 131, 235);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled] {\n color: rgb(161, 168, 179);\n background-color: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled]:hover {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled].paraui-v4-toggle-button-selected {\n color: rgb(92, 101, 115);\n background-color: rgb(247, 248, 250);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check::before {\n content: \" \";\n position: absolute;\n bottom: 0;\n right: 0;\n border: 8px solid rgb(212, 218, 227);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check::after {\n content: \" \";\n width: 8px;\n height: 8px;\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAM5JREFUOE/NkQENwjAURFcFIAEHgIM5YCgAHCABFBAUAA5wABI2CTgABeUd+V06BqFkCeEnl6X9d7d/vy7rWK6jPvu9gfe+z9QnsHDOlV9NgHhk4gpxrvjJBogL+DtwATkG12QDxEvIG3AzcRmW/5gAgsaR+1S54peht+c8s7vxc7+OAFHCIVhBWkfLUm6VliazRsUGAzoy6YEz0LaDeItYMVrVWCJ/nVuUmHhArPuX1XoFTI4wJ8au+NYb/ziBCJZdJqoiPFfyBO+I/2twBz0qQBFvrubpAAAAAElFTkSuQmCC\");\n background-size: 8px 8px;\n background-repeat: no-repeat;\n position: absolute;\n bottom: 1px;\n right: 1px;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check:hover {\n border-color: rgb(87, 131, 235);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check:hover::before {\n border-color: rgb(87, 131, 235);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check.paraui-v4-toggle-button-selected {\n border-color: rgb(46, 101, 230);\n color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check.paraui-v4-toggle-button-selected::before {\n border-color: rgb(46, 101, 230);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled] {\n color: rgb(161, 168, 179);\n background-color: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]::before {\n border-color: rgb(212, 218, 227);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]:hover {\n color: rgb(161, 168, 179);\n background-color: rgb(255, 255, 255);\n border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]:hover::before {\n border-color: rgb(212, 218, 227);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled].paraui-v4-toggle-button-selected {\n color: rgb(92, 101, 115);\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-toggle-button .toggle-button-text {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.paraui-v4-toggle-button-disabled.paraui-v4-toggle-button {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button-disabled.paraui-v4-toggle-button:hover {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button .toggle-button-badge {\n position: absolute;\n right: 0;\n bottom: 16px;\n}\n.paraui-v4-toggle-button .toggle-button-badge > div {\n position: absolute;\n top: 0;\n right: 0;\n border: 8px solid rgb(46, 101, 230);\n border-top-color: transparent;\n border-left-color: transparent;\n}\n.paraui-v4-toggle-button .toggle-button-badge > svg {\n position: absolute;\n top: 7px;\n right: 1px;\n color: #fff;\n font-weight: 600;\n width: 8px;\n height: 8px;\n}\n\n.paraui-v4-togglebutton-group {\n display: flex;\n flex-flow: row wrap;\n}\n.paraui-v4-togglebutton-group .toggle-button-item {\n margin: 0 10px;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button {\n margin: 0;\n padding: 0 16px;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button[disabled] {\n color: rgb(161, 168, 179);\n background-color: transparent;\n border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button[disabled]:hover {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button ~ .paraui-v4-toggle-button::before {\n position: absolute;\n left: 0;\n top: 50%;\n transform: translateY(-50%);\n content: \"\";\n width: 1px;\n height: 14px;\n background-color: rgb(212, 218, 227);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected {\n color: rgb(46, 101, 230);\n border: 0;\n font-weight: 700;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:hover {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected[disabled] {\n color: rgb(92, 101, 115);\n background-color: transparent;\n border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected[disabled]:hover {\n background-color: transparent;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:first-child:before {\n display: none;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:not(:first-child)::before {\n position: absolute;\n left: 0;\n top: 50%;\n transform: translateY(-50%);\n content: \"\";\n width: 1px;\n height: 14px;\n background-color: rgb(212, 218, 227);\n border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected::after {\n display: none;\n}";
|
|
28
28
|
styleInject(css_248z);
|
|
29
29
|
|
|
30
30
|
//切换按钮组
|
package/Transfer/index.js
CHANGED
|
@@ -138,7 +138,8 @@ var Box = function Box(props) {
|
|
|
138
138
|
new Sortable(ref.current, {
|
|
139
139
|
animation: 180,
|
|
140
140
|
ghostClass: 'blue-background-class',
|
|
141
|
-
|
|
141
|
+
dragClass: 'drag-item',
|
|
142
|
+
easing: 'step-start',
|
|
142
143
|
onEnd: function onEnd(evt) {
|
|
143
144
|
onEndSort === null || onEndSort === void 0 ? void 0 : onEndSort(evt.oldIndex, evt.newIndex);
|
|
144
145
|
}
|
|
@@ -213,16 +214,18 @@ var Box = function Box(props) {
|
|
|
213
214
|
className: "right-icon"
|
|
214
215
|
}, {
|
|
215
216
|
children: rightIcon(item)
|
|
216
|
-
})) : null, direction === 'right' ?
|
|
217
|
+
})) : null, direction === 'right' ? jsxs("div", Object.assign({
|
|
217
218
|
className: "handle"
|
|
218
219
|
}, {
|
|
219
|
-
children: jsx(
|
|
220
|
+
children: [rightIcon ? jsx("span", {
|
|
221
|
+
className: 'handle-line'
|
|
222
|
+
}) : null, jsx(Drag, {
|
|
220
223
|
size: "medium"
|
|
221
|
-
})
|
|
224
|
+
})]
|
|
222
225
|
})) : null]
|
|
223
226
|
}), item[item[customKey]] || item.name);
|
|
224
227
|
})
|
|
225
|
-
})), jsxs("div", Object.assign({
|
|
228
|
+
})), multiple && jsxs("div", Object.assign({
|
|
226
229
|
className: "footer"
|
|
227
230
|
}, {
|
|
228
231
|
children: [jsxs("div", {
|
|
@@ -258,7 +261,7 @@ var Box = function Box(props) {
|
|
|
258
261
|
};
|
|
259
262
|
var Sortablejs = Sortable;
|
|
260
263
|
|
|
261
|
-
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-transfer {\n display: flex;\n font-size: 14px;\n user-select: none;\n}\n.paraui-v4-transfer .blue-background-class {\n background-color: rgb(240, 245, 255);\n}\n.paraui-v4-transfer .box {\n border-radius: 4px;\n border: 1px solid rgb(212, 218, 227);\n overflow: hidden;\n}\n.paraui-v4-transfer .box .box-header {\n background: rgb(247, 248, 250);\n color: rgb(29, 33, 38);\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-left: 10px;\n height: 36px;\n border-bottom: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-transfer .box .count {\n color: rgb(29, 33, 38);\n letter-spacing: 1px;\n}\n.paraui-v4-transfer .box .context {\n height: 400px;\n overflow: auto;\n scrollbar-base-color: red;\n margin-top: 4px;\n}\n.paraui-v4-transfer .box .context .item-fluctuation {\n animation: flucturation 0.4s forwards;\n}\n.paraui-v4-transfer .box .context .item-fluctuationOrther {\n animation: flucturationOrther 0.5s forwards;\n}\n.paraui-v4-transfer .box .context .item {\n padding: 0px 10px;\n height: 30px;\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.paraui-v4-transfer .box .context .item.item-checked:hover {\n background-color: rgb(247, 248, 250) !important;\n}\n.paraui-v4-transfer .box .context .item.item-checked > .item-label {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .context .item > .item-label {\n flex: 1;\n overflow: hidden;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-transfer .box .context .item:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-transfer .box .context .item.item-disabled:hover {\n background: inherit;\n cursor: no-drop;\n}\n.paraui-v4-transfer .box .context .item.item-disabled > .item-label {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .context .item .handle {\n margin-left: 12px;\n display: flex;\n align-content: center;\n}\n.paraui-v4-transfer .box .context .item .handle svg {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-transfer .box .context .item .handle:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .context .item-border {\n padding-left: 6px;\n}\n.paraui-v4-transfer .box .text-field-content {\n border: none;\n border-radius: 0;\n border-bottom: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-transfer .box .footer {\n display: flex;\n align-items: center;\n border-top: 1px solid rgb(212, 218, 227);\n height: 36px;\n justify-content: space-between;\n padding: 0 10px;\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) button {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) button:hover {\n color: rgb(87, 131, 235);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) .btn-off {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) .btn-off:hover {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) > button {\n padding: 0;\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) > button:nth-child(2) {\n margin-left: 16px;\n}\n.paraui-v4-transfer ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background: rgba(255, 255, 255, 0.5);\n}\n.paraui-v4-transfer .moveBtn {\n display: flex;\n height: 500px;\n flex-direction: column;\n justify-content: center;\n margin: 0 20px;\n}\n.paraui-v4-transfer .moveBtn > button {\n background-color: rgb(46, 101, 230);\n color: rgb(255, 255, 255);\n}\n.paraui-v4-transfer .moveBtn .btn-left {\n margin-top: 16px;\n}\n\n@keyframes flucturation {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(36px);\n }\n}\n@keyframes flucturationOrther {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(-36px);\n }\n}";
|
|
264
|
+
var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-transfer {\n display: flex;\n font-size: 14px;\n user-select: none;\n}\n.paraui-v4-transfer .blue-background-class {\n background-color: rgb(240, 245, 255);\n}\n.paraui-v4-transfer .drag-item {\n background: rgb(255, 255, 255) !important;\n box-shadow: rgba(212, 218, 227, 0.4);\n}\n.paraui-v4-transfer .box {\n border-radius: 4px;\n border: 1px solid rgb(212, 218, 227);\n overflow: hidden;\n}\n.paraui-v4-transfer .box .box-header {\n background: rgb(247, 248, 250);\n color: rgb(29, 33, 38);\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-left: 10px;\n height: 36px;\n border-bottom: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-transfer .box .count {\n color: rgb(29, 33, 38);\n letter-spacing: 1px;\n}\n.paraui-v4-transfer .box .context {\n height: 400px;\n overflow: auto;\n scrollbar-base-color: red;\n margin-top: 4px;\n}\n.paraui-v4-transfer .box .context .item-fluctuation {\n animation: flucturation 0.4s forwards;\n}\n.paraui-v4-transfer .box .context .item-fluctuationOrther {\n animation: flucturationOrther 0.5s forwards;\n}\n.paraui-v4-transfer .box .context .item {\n padding: 0px 10px;\n height: 30px;\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.paraui-v4-transfer .box .context .item.item-checked:hover {\n background-color: rgb(247, 248, 250) !important;\n}\n.paraui-v4-transfer .box .context .item.item-checked > .item-label {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .context .item > .item-label {\n flex: 1;\n overflow: hidden;\n color: rgb(29, 33, 38);\n}\n.paraui-v4-transfer .box .context .item:hover {\n background-color: rgb(247, 248, 250);\n}\n.paraui-v4-transfer .box .context .item.item-disabled:hover {\n background: inherit;\n cursor: no-drop;\n}\n.paraui-v4-transfer .box .context .item.item-disabled > .item-label {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .context .item .handle {\n margin-left: 12px;\n display: flex;\n align-content: center;\n}\n.paraui-v4-transfer .box .context .item .handle .handle-line {\n height: 12px;\n border-left: 1px solid rgb(212, 218, 227);\n margin: auto 10px auto 0;\n}\n.paraui-v4-transfer .box .context .item .handle svg {\n color: rgb(92, 101, 115);\n}\n.paraui-v4-transfer .box .context .item .handle:hover svg {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .context .item-border {\n padding-left: 6px;\n}\n.paraui-v4-transfer .box .text-field-content {\n border: none;\n border-radius: 0;\n border-bottom: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-transfer .box .footer {\n display: flex;\n align-items: center;\n border-top: 1px solid rgb(212, 218, 227);\n height: 36px;\n justify-content: space-between;\n padding: 0 10px;\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) button {\n color: rgb(46, 101, 230);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) button:hover {\n color: rgb(87, 131, 235);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) .btn-off {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) .btn-off:hover {\n color: rgb(161, 168, 179);\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) > button {\n padding: 0;\n}\n.paraui-v4-transfer .box .footer > div:nth-child(1) > button:nth-child(2) {\n margin-left: 16px;\n}\n.paraui-v4-transfer ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background: rgba(255, 255, 255, 0.5);\n}\n.paraui-v4-transfer .moveBtn {\n display: flex;\n height: 500px;\n flex-direction: column;\n justify-content: center;\n margin: 0 20px;\n}\n.paraui-v4-transfer .moveBtn > button {\n background-color: rgb(46, 101, 230);\n color: rgb(255, 255, 255);\n}\n.paraui-v4-transfer .moveBtn .btn-left {\n margin-top: 16px;\n}\n\n@keyframes flucturation {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(36px);\n }\n}\n@keyframes flucturationOrther {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(-36px);\n }\n}";
|
|
262
265
|
styleInject(css_248z);
|
|
263
266
|
|
|
264
267
|
var Transfer = function Transfer(props) {
|
package/Tree/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { T as Tree } from '../_verture/index-
|
|
2
|
-
export { T as default } from '../_verture/index-
|
|
1
|
+
import { T as Tree } from '../_verture/index-de8f4428.js';
|
|
2
|
+
export { T as default } from '../_verture/index-de8f4428.js';
|
|
3
3
|
import '../_verture/toConsumableArray-8f4c9589.js';
|
|
4
4
|
import '../_verture/unsupportedIterableToArray-cb478f24.js';
|
|
5
5
|
import '../_verture/defineProperty-1d116156.js';
|
|
@@ -420,7 +420,8 @@ var ItemType = function ItemType(props) {
|
|
|
420
420
|
setError = props.setError,
|
|
421
421
|
backData = props.backData,
|
|
422
422
|
disabled = props.disabled,
|
|
423
|
-
change = props.change
|
|
423
|
+
change = props.change,
|
|
424
|
+
isComponent = props.isComponent;
|
|
424
425
|
var intl = useFormatMessage('FormItem', localeJson);
|
|
425
426
|
var tipsStr = placeholder || "".concat(label);
|
|
426
427
|
/**
|
|
@@ -472,7 +473,7 @@ var ItemType = function ItemType(props) {
|
|
|
472
473
|
* 判断显示那个
|
|
473
474
|
*/
|
|
474
475
|
var selectType = function selectType() {
|
|
475
|
-
if (itemType && typeof itemType !== 'string' && (!itemType.name || itemType.name === 'InputType')) {
|
|
476
|
+
if (!isComponent && itemType && typeof itemType !== 'string' && (!itemType.name || itemType.name === 'InputType')) {
|
|
476
477
|
var item = Object.assign(Object.assign({}, props), {
|
|
477
478
|
setErrorMsg: setErrorMsg,
|
|
478
479
|
setAndValidateValue: setAndValidateValue
|