@oliasoft-open-source/react-ui-library 4.13.0 → 4.13.1
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/dist/global.css +51 -50
- package/dist/index.d.ts +1 -0
- package/dist/index.js +44 -33
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/global.css
CHANGED
|
@@ -1411,17 +1411,17 @@ html[data-theme='dark'] {
|
|
|
1411
1411
|
._actionComponentContainer_1t7vd_14._active_1t7vd_36 {
|
|
1412
1412
|
color: var(--color-text-primary-active);
|
|
1413
1413
|
}
|
|
1414
|
-
.
|
|
1414
|
+
._wrapper_8cxhw_1 {
|
|
1415
1415
|
display: inline-flex;
|
|
1416
1416
|
max-width: 100%;
|
|
1417
1417
|
}
|
|
1418
|
-
.
|
|
1418
|
+
._layer_8cxhw_5 ._wrapper_8cxhw_1 {
|
|
1419
1419
|
width: 100%;
|
|
1420
1420
|
}
|
|
1421
|
-
.
|
|
1421
|
+
._layerContainer_8cxhw_8 {
|
|
1422
1422
|
z-index: var(--zindex-dropdown);
|
|
1423
1423
|
}
|
|
1424
|
-
.
|
|
1424
|
+
._layer_8cxhw_5 {
|
|
1425
1425
|
border: 1px solid var(--color-border);
|
|
1426
1426
|
border-radius: var(--border-radius);
|
|
1427
1427
|
overflow: hidden;
|
|
@@ -1434,97 +1434,98 @@ html[data-theme='dark'] {
|
|
|
1434
1434
|
overflow-y: auto;
|
|
1435
1435
|
max-height: 40vh;
|
|
1436
1436
|
}
|
|
1437
|
-
.
|
|
1437
|
+
._layer_8cxhw_5._nested_8cxhw_24 {
|
|
1438
1438
|
margin: -1px 2px;
|
|
1439
1439
|
}
|
|
1440
|
-
.
|
|
1440
|
+
._layer_8cxhw_5 ul {
|
|
1441
1441
|
margin: 0;
|
|
1442
1442
|
padding: 0;
|
|
1443
1443
|
list-style-type: none;
|
|
1444
1444
|
}
|
|
1445
|
-
.
|
|
1445
|
+
._layer_8cxhw_5 ul li {
|
|
1446
1446
|
list-style: none;
|
|
1447
1447
|
display: block;
|
|
1448
1448
|
}
|
|
1449
|
-
.
|
|
1449
|
+
._fileInput_8cxhw_36 {
|
|
1450
1450
|
opacity: 0;
|
|
1451
1451
|
position: absolute;
|
|
1452
1452
|
inset: 0;
|
|
1453
1453
|
}
|
|
1454
|
-
.
|
|
1454
|
+
._trigger_8cxhw_41 {
|
|
1455
1455
|
display: inline-flex;
|
|
1456
1456
|
align-items: center;
|
|
1457
1457
|
cursor: pointer;
|
|
1458
1458
|
max-width: 100%;
|
|
1459
1459
|
}
|
|
1460
|
-
.
|
|
1460
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41 {
|
|
1461
1461
|
width: 100%;
|
|
1462
1462
|
}
|
|
1463
|
-
.
|
|
1463
|
+
._middleAlignedInline_8cxhw_50 {
|
|
1464
1464
|
display: flex;
|
|
1465
1465
|
align-items: center;
|
|
1466
1466
|
overflow: hidden;
|
|
1467
1467
|
width: 100%;
|
|
1468
1468
|
}
|
|
1469
|
-
.
|
|
1469
|
+
._heading_8cxhw_56 {
|
|
1470
1470
|
color: var(--color-text-muted);
|
|
1471
1471
|
letter-spacing: var(--letter-spacing-wide);
|
|
1472
1472
|
text-transform: uppercase;
|
|
1473
1473
|
font-weight: bold;
|
|
1474
1474
|
}
|
|
1475
|
-
.
|
|
1475
|
+
._heading_8cxhw_56 ._headingIcon_8cxhw_62 {
|
|
1476
1476
|
float: right;
|
|
1477
1477
|
}
|
|
1478
|
-
.
|
|
1478
|
+
._heading_8cxhw_56 ._headingIcon_8cxhw_62 svg {
|
|
1479
1479
|
color: var(--color-text-faint);
|
|
1480
1480
|
}
|
|
1481
|
-
.
|
|
1481
|
+
._heading_8cxhw_56 ._headingIcon_8cxhw_62:hover {
|
|
1482
1482
|
cursor: pointer;
|
|
1483
1483
|
}
|
|
1484
|
-
.
|
|
1484
|
+
._heading_8cxhw_56 ._headingIcon_8cxhw_62:hover svg {
|
|
1485
1485
|
color: var(--color-text-primary-hover);
|
|
1486
1486
|
}
|
|
1487
|
-
.
|
|
1487
|
+
._option_8cxhw_74 {
|
|
1488
1488
|
color: inherit;
|
|
1489
1489
|
display: block;
|
|
1490
1490
|
position: relative;
|
|
1491
1491
|
}
|
|
1492
|
-
.
|
|
1493
|
-
.
|
|
1494
|
-
.
|
|
1492
|
+
._heading_8cxhw_56,
|
|
1493
|
+
._option_8cxhw_74,
|
|
1494
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41 {
|
|
1495
1495
|
padding: var(--padding-input);
|
|
1496
1496
|
border: 1px solid transparent;
|
|
1497
1497
|
}
|
|
1498
|
-
.
|
|
1499
|
-
.
|
|
1498
|
+
._option_8cxhw_74,
|
|
1499
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41 {
|
|
1500
1500
|
line-height: var(--line-height);
|
|
1501
1501
|
display: flex;
|
|
1502
1502
|
align-items: flex-start;
|
|
1503
1503
|
}
|
|
1504
|
-
.
|
|
1505
|
-
.
|
|
1506
|
-
.
|
|
1507
|
-
.
|
|
1504
|
+
._option_8cxhw_74:hover,
|
|
1505
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41:hover,
|
|
1506
|
+
._option_8cxhw_74._active_8cxhw_93,
|
|
1507
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41._active_8cxhw_93 {
|
|
1508
1508
|
background-color: var(--color-background-listitem-hover);
|
|
1509
1509
|
cursor: pointer;
|
|
1510
1510
|
}
|
|
1511
|
-
.
|
|
1511
|
+
._option_8cxhw_74._selected_8cxhw_98,
|
|
1512
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41._selected_8cxhw_98 {
|
|
1512
1513
|
background-color: var(--color-background-listitem-active);
|
|
1513
1514
|
}
|
|
1514
|
-
.
|
|
1515
|
+
._layer_8cxhw_5 ._trigger_8cxhw_41 {
|
|
1515
1516
|
align-items: center;
|
|
1516
1517
|
}
|
|
1517
|
-
.
|
|
1518
|
+
._optionContent_8cxhw_105 {
|
|
1518
1519
|
flex-wrap: wrap;
|
|
1519
1520
|
margin-right: auto;
|
|
1520
1521
|
}
|
|
1521
|
-
.
|
|
1522
|
+
._inline_8cxhw_109 ._optionContent_8cxhw_105 {
|
|
1522
1523
|
display: flex;
|
|
1523
1524
|
justify-content: space-between;
|
|
1524
1525
|
flex-grow: 1;
|
|
1525
1526
|
}
|
|
1526
|
-
.
|
|
1527
|
-
.
|
|
1527
|
+
._icon_8cxhw_114,
|
|
1528
|
+
._check_8cxhw_115 {
|
|
1528
1529
|
display: flex;
|
|
1529
1530
|
flex-shrink: 1;
|
|
1530
1531
|
width: var(--size-xs);
|
|
@@ -1532,83 +1533,83 @@ html[data-theme='dark'] {
|
|
|
1532
1533
|
justify-content: center;
|
|
1533
1534
|
align-items: center;
|
|
1534
1535
|
}
|
|
1535
|
-
.
|
|
1536
|
+
._icon_8cxhw_114 {
|
|
1536
1537
|
margin-right: var(--padding-xs);
|
|
1537
1538
|
color: var(--color-text-primary);
|
|
1538
1539
|
font-size: var(--size-xs);
|
|
1539
1540
|
}
|
|
1540
|
-
.
|
|
1541
|
+
._icon_8cxhw_114:empty {
|
|
1541
1542
|
display: none;
|
|
1542
1543
|
}
|
|
1543
|
-
.
|
|
1544
|
+
._icon_8cxhw_114 img {
|
|
1544
1545
|
max-height: 16px;
|
|
1545
1546
|
max-width: 16px;
|
|
1546
1547
|
width: auto;
|
|
1547
1548
|
height: auto;
|
|
1548
1549
|
}
|
|
1549
|
-
.
|
|
1550
|
+
._check_8cxhw_115 {
|
|
1550
1551
|
margin-left: var(--padding-xs);
|
|
1551
1552
|
color: var(--color-text-primary);
|
|
1552
1553
|
}
|
|
1553
|
-
.
|
|
1554
|
+
._text_8cxhw_141 {
|
|
1554
1555
|
display: inline-flex;
|
|
1555
1556
|
align-items: center;
|
|
1556
1557
|
cursor: pointer;
|
|
1557
1558
|
}
|
|
1558
|
-
.
|
|
1559
|
+
._label_8cxhw_146 {
|
|
1559
1560
|
margin-right: auto;
|
|
1560
1561
|
}
|
|
1561
|
-
.
|
|
1562
|
-
.
|
|
1562
|
+
._label_8cxhw_146,
|
|
1563
|
+
._heading_8cxhw_56 {
|
|
1563
1564
|
max-width: 100%;
|
|
1564
1565
|
display: block;
|
|
1565
1566
|
overflow: hidden;
|
|
1566
1567
|
text-overflow: ellipsis;
|
|
1567
1568
|
white-space: nowrap;
|
|
1568
1569
|
}
|
|
1569
|
-
.
|
|
1570
|
+
._description_8cxhw_157 {
|
|
1570
1571
|
color: #999;
|
|
1571
1572
|
display: block;
|
|
1572
1573
|
}
|
|
1573
|
-
.
|
|
1574
|
+
._arrow_8cxhw_161 {
|
|
1574
1575
|
margin-left: var(--padding-xxs);
|
|
1575
1576
|
display: flex;
|
|
1576
1577
|
}
|
|
1577
|
-
.
|
|
1578
|
+
._divider_8cxhw_165 {
|
|
1578
1579
|
border: 0;
|
|
1579
1580
|
border-top: 1px solid var(--color-border);
|
|
1580
1581
|
}
|
|
1581
|
-
.
|
|
1582
|
+
._deprecatedSemanticIcon_8cxhw_169 {
|
|
1582
1583
|
color: var(--color-text-primary) !important;
|
|
1583
1584
|
margin: -5px 0 0 !important;
|
|
1584
1585
|
}
|
|
1585
|
-
.
|
|
1586
|
+
._disabled_8cxhw_173 {
|
|
1586
1587
|
opacity: 0.2;
|
|
1587
1588
|
pointer-events: none;
|
|
1588
1589
|
cursor: not-allowed !important;
|
|
1589
1590
|
}
|
|
1590
|
-
.
|
|
1591
|
+
._buttonLabel_8cxhw_178 {
|
|
1591
1592
|
overflow: hidden;
|
|
1592
1593
|
text-overflow: ellipsis;
|
|
1593
1594
|
display: block;
|
|
1594
1595
|
margin-right: auto;
|
|
1595
1596
|
}
|
|
1596
|
-
.
|
|
1597
|
+
._buttonCaret_8cxhw_184 {
|
|
1597
1598
|
display: flex;
|
|
1598
1599
|
margin-left: var(--padding-xxs);
|
|
1599
1600
|
}
|
|
1600
|
-
.
|
|
1601
|
+
._component_8cxhw_188 {
|
|
1601
1602
|
display: inline-flex;
|
|
1602
1603
|
align-items: center;
|
|
1603
1604
|
justify-content: center;
|
|
1604
1605
|
cursor: pointer;
|
|
1605
1606
|
}
|
|
1606
|
-
.
|
|
1607
|
+
._right_8cxhw_194 {
|
|
1607
1608
|
margin-left: auto;
|
|
1608
1609
|
display: flex;
|
|
1609
1610
|
align-items: center;
|
|
1610
1611
|
}
|
|
1611
|
-
.
|
|
1612
|
+
._actions_8cxhw_199 {
|
|
1612
1613
|
margin-left: var(--padding-xs);
|
|
1613
1614
|
display: flex;
|
|
1614
1615
|
align-items: center;
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -4181,34 +4181,34 @@ const styles$M = {
|
|
|
4181
4181
|
actionComponentContainer,
|
|
4182
4182
|
active: active$7
|
|
4183
4183
|
};
|
|
4184
|
-
const wrapper$4 = "
|
|
4185
|
-
const layer$1 = "
|
|
4186
|
-
const layerContainer$1 = "
|
|
4187
|
-
const nested = "
|
|
4188
|
-
const fileInput$1 = "
|
|
4189
|
-
const trigger$2 = "
|
|
4190
|
-
const middleAlignedInline = "
|
|
4191
|
-
const heading$5 = "
|
|
4192
|
-
const headingIcon = "
|
|
4193
|
-
const option$1 = "
|
|
4194
|
-
const active$6 = "
|
|
4195
|
-
const selected$1 = "
|
|
4196
|
-
const optionContent$1 = "
|
|
4197
|
-
const inline$4 = "
|
|
4198
|
-
const icon$4 = "
|
|
4199
|
-
const check$1 = "
|
|
4200
|
-
const text$3 = "
|
|
4201
|
-
const label$a = "
|
|
4202
|
-
const description = "
|
|
4203
|
-
const arrow$1 = "
|
|
4204
|
-
const divider$1 = "
|
|
4205
|
-
const deprecatedSemanticIcon = "
|
|
4206
|
-
const disabled$8 = "
|
|
4207
|
-
const buttonLabel = "
|
|
4208
|
-
const buttonCaret = "
|
|
4209
|
-
const component = "
|
|
4210
|
-
const right$7 = "
|
|
4211
|
-
const actions$1 = "
|
|
4184
|
+
const wrapper$4 = "_wrapper_8cxhw_1";
|
|
4185
|
+
const layer$1 = "_layer_8cxhw_5";
|
|
4186
|
+
const layerContainer$1 = "_layerContainer_8cxhw_8";
|
|
4187
|
+
const nested = "_nested_8cxhw_24";
|
|
4188
|
+
const fileInput$1 = "_fileInput_8cxhw_36";
|
|
4189
|
+
const trigger$2 = "_trigger_8cxhw_41";
|
|
4190
|
+
const middleAlignedInline = "_middleAlignedInline_8cxhw_50";
|
|
4191
|
+
const heading$5 = "_heading_8cxhw_56";
|
|
4192
|
+
const headingIcon = "_headingIcon_8cxhw_62";
|
|
4193
|
+
const option$1 = "_option_8cxhw_74";
|
|
4194
|
+
const active$6 = "_active_8cxhw_93";
|
|
4195
|
+
const selected$1 = "_selected_8cxhw_98";
|
|
4196
|
+
const optionContent$1 = "_optionContent_8cxhw_105";
|
|
4197
|
+
const inline$4 = "_inline_8cxhw_109";
|
|
4198
|
+
const icon$4 = "_icon_8cxhw_114";
|
|
4199
|
+
const check$1 = "_check_8cxhw_115";
|
|
4200
|
+
const text$3 = "_text_8cxhw_141";
|
|
4201
|
+
const label$a = "_label_8cxhw_146";
|
|
4202
|
+
const description = "_description_8cxhw_157";
|
|
4203
|
+
const arrow$1 = "_arrow_8cxhw_161";
|
|
4204
|
+
const divider$1 = "_divider_8cxhw_165";
|
|
4205
|
+
const deprecatedSemanticIcon = "_deprecatedSemanticIcon_8cxhw_169";
|
|
4206
|
+
const disabled$8 = "_disabled_8cxhw_173";
|
|
4207
|
+
const buttonLabel = "_buttonLabel_8cxhw_178";
|
|
4208
|
+
const buttonCaret = "_buttonCaret_8cxhw_184";
|
|
4209
|
+
const component = "_component_8cxhw_188";
|
|
4210
|
+
const right$7 = "_right_8cxhw_194";
|
|
4211
|
+
const actions$1 = "_actions_8cxhw_199";
|
|
4212
4212
|
const styles$L = {
|
|
4213
4213
|
wrapper: wrapper$4,
|
|
4214
4214
|
layer: layer$1,
|
|
@@ -4354,6 +4354,7 @@ const Section$1 = ({
|
|
|
4354
4354
|
path,
|
|
4355
4355
|
maxHeight
|
|
4356
4356
|
}) => {
|
|
4357
|
+
var _a2, _b;
|
|
4357
4358
|
const disabledContext = useContext(DisabledContext);
|
|
4358
4359
|
switch (section2.type) {
|
|
4359
4360
|
case MenuType.HEADING:
|
|
@@ -4391,10 +4392,14 @@ const Section$1 = ({
|
|
|
4391
4392
|
}
|
|
4392
4393
|
);
|
|
4393
4394
|
case MenuType.MENU:
|
|
4395
|
+
const selected2 = !!((_b = (_a2 = section2 == null ? void 0 : section2.menu) == null ? void 0 : _a2.sections) == null ? void 0 : _b.find(
|
|
4396
|
+
(s) => s.selected
|
|
4397
|
+
));
|
|
4394
4398
|
return /* @__PURE__ */ jsx(
|
|
4395
4399
|
DropDownMenu,
|
|
4396
4400
|
{
|
|
4397
4401
|
menu: section2.menu,
|
|
4402
|
+
selected: selected2,
|
|
4398
4403
|
title: section2.title,
|
|
4399
4404
|
closeOnOptionClick,
|
|
4400
4405
|
isNested: true,
|
|
@@ -4597,7 +4602,8 @@ const Text$1 = ({
|
|
|
4597
4602
|
title: title2,
|
|
4598
4603
|
carat,
|
|
4599
4604
|
disabled: disabled2,
|
|
4600
|
-
isOpen: isOpen2
|
|
4605
|
+
isOpen: isOpen2,
|
|
4606
|
+
selected: selected2
|
|
4601
4607
|
}) => {
|
|
4602
4608
|
let titleText;
|
|
4603
4609
|
if (title2) {
|
|
@@ -4611,7 +4617,8 @@ const Text$1 = ({
|
|
|
4611
4617
|
className: cx$2(
|
|
4612
4618
|
styles$L.trigger,
|
|
4613
4619
|
disabled2 ? styles$L.disabled : null,
|
|
4614
|
-
isOpen2 ? styles$L.active : null
|
|
4620
|
+
isOpen2 ? styles$L.active : null,
|
|
4621
|
+
selected2 ? styles$L.selected : null
|
|
4615
4622
|
),
|
|
4616
4623
|
children: [
|
|
4617
4624
|
/* @__PURE__ */ jsx("span", { className: styles$L.label, title: titleText, children: label2 }),
|
|
@@ -4677,6 +4684,7 @@ const Trigger$1 = React__default.forwardRef(
|
|
|
4677
4684
|
warning: warning2,
|
|
4678
4685
|
tooltip: tooltip2,
|
|
4679
4686
|
testId,
|
|
4687
|
+
selected: selected2,
|
|
4680
4688
|
...restProps
|
|
4681
4689
|
}, ref2) => {
|
|
4682
4690
|
const triggerElement = trigger2 === TriggerType.BUTTON || trigger2 === TriggerType.DROP_DOWN_BUTTON ? /* @__PURE__ */ jsx(
|
|
@@ -4701,7 +4709,8 @@ const Trigger$1 = React__default.forwardRef(
|
|
|
4701
4709
|
title: title2,
|
|
4702
4710
|
disabled: isDisabled,
|
|
4703
4711
|
carat: !contextMenu ? isNested ? MenuCarat.RIGHT : MenuCarat.DOWN : void 0,
|
|
4704
|
-
isOpen: isOpen2
|
|
4712
|
+
isOpen: isOpen2,
|
|
4713
|
+
selected: selected2
|
|
4705
4714
|
}
|
|
4706
4715
|
) : trigger2 === TriggerType.COMPONENT ? /* @__PURE__ */ jsx(Component, { component: component2, disabled: isDisabled }) : null;
|
|
4707
4716
|
const wrappedTrigger = !isNested && (badgeTitle || badgeDot) ? /* @__PURE__ */ jsx(Badge, { title: badgeTitle, dot: badgeDot, small: !badgeDot, children: triggerElement }) : triggerElement;
|
|
@@ -4856,7 +4865,8 @@ const DropDownMenu = ({
|
|
|
4856
4865
|
setOpen: setOpenProp,
|
|
4857
4866
|
tooltip: tooltip2,
|
|
4858
4867
|
error: error2,
|
|
4859
|
-
warning: warning2
|
|
4868
|
+
warning: warning2,
|
|
4869
|
+
selected: selected2
|
|
4860
4870
|
}) => {
|
|
4861
4871
|
const disabledContext = useContext(DisabledContext);
|
|
4862
4872
|
const {
|
|
@@ -4925,7 +4935,8 @@ const DropDownMenu = ({
|
|
|
4925
4935
|
tooltip: tooltip2,
|
|
4926
4936
|
error: error2,
|
|
4927
4937
|
warning: warning2,
|
|
4928
|
-
testId
|
|
4938
|
+
testId,
|
|
4939
|
+
selected: selected2
|
|
4929
4940
|
}
|
|
4930
4941
|
),
|
|
4931
4942
|
isOpen2 && renderLayer(
|