@rocket.chat/fuselage 0.94.0 → 0.95.0
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/components/ButtonGroup/ButtonGroup.d.ts +3 -18
- package/dist/components/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/components/SplitButton/SplitButton.d.ts +19 -0
- package/dist/components/SplitButton/SplitButton.d.ts.map +1 -0
- package/dist/components/SplitButton/SplitButtonTrigger.d.ts +9 -0
- package/dist/components/SplitButton/SplitButtonTrigger.d.ts.map +1 -0
- package/dist/components/SplitButton/index.d.ts +3 -0
- package/dist/components/SplitButton/index.d.ts.map +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/fuselage.css +1 -1
- package/dist/fuselage.development.css +125 -65
- package/dist/fuselage.development.js +38 -5
- package/dist/fuselage.development.js.map +1 -1
- package/dist/fuselage.production.js +2 -2
- package/package.json +2 -2
|
@@ -1436,11 +1436,10 @@ a:where(:active):where(:not(.rcx-button)), .rcx-tag--clickable:where(:active), .
|
|
|
1436
1436
|
justify-content: center;
|
|
1437
1437
|
align-items: center;
|
|
1438
1438
|
height: 1.75rem;
|
|
1439
|
-
padding-inline: 0.
|
|
1440
|
-
padding-inline-end: 1rem;
|
|
1439
|
+
padding-inline: 0.5rem;
|
|
1441
1440
|
border-radius: var(--rcx-border-radius-extra-large, 1.25rem);
|
|
1442
|
-
-moz-column-gap: 0.
|
|
1443
|
-
column-gap: 0.
|
|
1441
|
+
-moz-column-gap: 0.25rem;
|
|
1442
|
+
column-gap: 0.25rem;
|
|
1444
1443
|
overflow: hidden;
|
|
1445
1444
|
text-overflow: ellipsis;
|
|
1446
1445
|
white-space: nowrap;
|
|
@@ -1450,8 +1449,8 @@ a:where(:active):where(:not(.rcx-button)), .rcx-tag--clickable:where(:active), .
|
|
|
1450
1449
|
text-overflow: ellipsis;
|
|
1451
1450
|
white-space: nowrap;
|
|
1452
1451
|
}
|
|
1453
|
-
.rcx-bubble:not(.rcx-bubble__group) .rcx-bubble__item {
|
|
1454
|
-
padding-inline: 0.
|
|
1452
|
+
.rcx-bubble:not(.rcx-bubble__group) .rcx-bubble__button:has(> .rcx-icon), .rcx-bubble:not(.rcx-bubble__group) .rcx-bubble__item:has(> .rcx-icon) {
|
|
1453
|
+
padding-inline-end: 0.75rem;
|
|
1455
1454
|
}
|
|
1456
1455
|
.rcx-bubble--small .rcx-bubble__button, .rcx-bubble--small .rcx-bubble__item {
|
|
1457
1456
|
letter-spacing: 0rem;
|
|
@@ -2343,65 +2342,6 @@ a:where(:active):where(:not(.rcx-button)), .rcx-tag--clickable:where(:active), .
|
|
|
2343
2342
|
.rcx-button-group--align-end {
|
|
2344
2343
|
justify-content: flex-end;
|
|
2345
2344
|
}
|
|
2346
|
-
.rcx-button-group--joined {
|
|
2347
|
-
overflow: hidden;
|
|
2348
|
-
width: -moz-fit-content;
|
|
2349
|
-
width: fit-content;
|
|
2350
|
-
border-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
2351
|
-
}
|
|
2352
|
-
.rcx-button-group--joined.rcx-button-group--stretch {
|
|
2353
|
-
width: auto;
|
|
2354
|
-
}
|
|
2355
|
-
.rcx-button-group--joined.rcx-button-group--align-center {
|
|
2356
|
-
margin-inline: auto;
|
|
2357
|
-
}
|
|
2358
|
-
.rcx-button-group--joined.rcx-button-group--align-end {
|
|
2359
|
-
margin-inline-start: auto;
|
|
2360
|
-
}
|
|
2361
|
-
.rcx-button-group--joined.rcx-button-group--vertical {
|
|
2362
|
-
align-items: stretch;
|
|
2363
|
-
}
|
|
2364
|
-
.rcx-button-group--joined {
|
|
2365
|
-
background-color: var(--rcx-button-group-joined-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-default, #e4e7ea) 60%, transparent));
|
|
2366
|
-
gap: 0;
|
|
2367
|
-
}
|
|
2368
|
-
.rcx-button-group--joined .rcx-button {
|
|
2369
|
-
border-radius: 0;
|
|
2370
|
-
}
|
|
2371
|
-
.rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child {
|
|
2372
|
-
color: var(--rcx-color-button-font-on-secondary, #1f2329);
|
|
2373
|
-
border-color: transparent;
|
|
2374
|
-
background-color: transparent;
|
|
2375
|
-
}
|
|
2376
|
-
.rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child:focus-visible, .rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child.focus.focus-visible {
|
|
2377
|
-
border-color: transparent;
|
|
2378
|
-
background-color: var(--rcx-button-ghost-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-focus, #e4e7ea) 60%, transparent));
|
|
2379
|
-
}
|
|
2380
|
-
.rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child:hover, .rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child.hover, .rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child.is-hovered {
|
|
2381
|
-
border-color: transparent;
|
|
2382
|
-
background-color: var(--rcx-button-ghost-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-hover, #cbced1) 60%, transparent));
|
|
2383
|
-
}
|
|
2384
|
-
.rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child:active, .rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child.active, .rcx-button-group--joined.rcx-button-group--ghost-start > .rcx-button:first-child.is-active {
|
|
2385
|
-
border-color: transparent;
|
|
2386
|
-
background-color: var(--rcx-button-ghost-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-press, #9ea2a8) 60%, transparent));
|
|
2387
|
-
}
|
|
2388
|
-
.rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child {
|
|
2389
|
-
color: var(--rcx-color-button-font-on-secondary, #1f2329);
|
|
2390
|
-
border-color: transparent;
|
|
2391
|
-
background-color: transparent;
|
|
2392
|
-
}
|
|
2393
|
-
.rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child:focus-visible, .rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child.focus.focus-visible {
|
|
2394
|
-
border-color: transparent;
|
|
2395
|
-
background-color: var(--rcx-button-ghost-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-focus, #e4e7ea) 60%, transparent));
|
|
2396
|
-
}
|
|
2397
|
-
.rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child:hover, .rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child.hover, .rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child.is-hovered {
|
|
2398
|
-
border-color: transparent;
|
|
2399
|
-
background-color: var(--rcx-button-ghost-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-hover, #cbced1) 60%, transparent));
|
|
2400
|
-
}
|
|
2401
|
-
.rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child:active, .rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child.active, .rcx-button-group--joined.rcx-button-group--ghost-end > .rcx-button:last-child.is-active {
|
|
2402
|
-
border-color: transparent;
|
|
2403
|
-
background-color: var(--rcx-button-ghost-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-press, #9ea2a8) 60%, transparent));
|
|
2404
|
-
}
|
|
2405
2345
|
|
|
2406
2346
|
.rcx-callout {
|
|
2407
2347
|
display: flex;
|
|
@@ -5716,6 +5656,126 @@ a:where(:active):where(:not(.rcx-button)), .rcx-tag--clickable:where(:active), .
|
|
|
5716
5656
|
background-position: 100vw 0;
|
|
5717
5657
|
}
|
|
5718
5658
|
}
|
|
5659
|
+
.rcx-split-button {
|
|
5660
|
+
display: inline-flex;
|
|
5661
|
+
flex-flow: row nowrap;
|
|
5662
|
+
align-items: stretch;
|
|
5663
|
+
border-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
5664
|
+
background-color: var(--rcx-split-button-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-default, #e4e7ea) 70%, transparent));
|
|
5665
|
+
}
|
|
5666
|
+
.rcx-split-button > .rcx-button {
|
|
5667
|
+
border-radius: 0;
|
|
5668
|
+
}
|
|
5669
|
+
.rcx-split-button > .rcx-button:first-child {
|
|
5670
|
+
border-end-start-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
5671
|
+
border-start-start-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
5672
|
+
}
|
|
5673
|
+
.rcx-split-button > .rcx-button:last-child {
|
|
5674
|
+
border-end-end-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
5675
|
+
border-start-end-radius: var(--rcx-button-border-radius, var(--rcx-border-radius-medium, 0.25rem));
|
|
5676
|
+
}
|
|
5677
|
+
.rcx-split-button > .rcx-button:focus-visible, .rcx-split-button > .rcx-button.focus.focus-visible {
|
|
5678
|
+
position: relative;
|
|
5679
|
+
z-index: 1;
|
|
5680
|
+
}
|
|
5681
|
+
.rcx-split-button > .rcx-button.rcx-split-button__trigger {
|
|
5682
|
+
color: var(--rcx-color-button-font-on-secondary, #1f2329);
|
|
5683
|
+
border-color: transparent;
|
|
5684
|
+
background-color: transparent;
|
|
5685
|
+
}
|
|
5686
|
+
.rcx-split-button > .rcx-button.rcx-split-button__trigger:focus-visible, .rcx-split-button > .rcx-button.rcx-split-button__trigger.focus.focus-visible {
|
|
5687
|
+
border-color: transparent;
|
|
5688
|
+
background-color: var(--rcx-button-ghost-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-focus, #e4e7ea) 70%, transparent));
|
|
5689
|
+
}
|
|
5690
|
+
.rcx-split-button > .rcx-button.rcx-split-button__trigger:hover, .rcx-split-button > .rcx-button.rcx-split-button__trigger.hover, .rcx-split-button > .rcx-button.rcx-split-button__trigger.is-hovered {
|
|
5691
|
+
border-color: transparent;
|
|
5692
|
+
background-color: var(--rcx-button-ghost-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-hover, #cbced1) 70%, transparent));
|
|
5693
|
+
}
|
|
5694
|
+
.rcx-split-button > .rcx-button.rcx-split-button__trigger:active, .rcx-split-button > .rcx-button.rcx-split-button__trigger.active, .rcx-split-button > .rcx-button.rcx-split-button__trigger.is-active {
|
|
5695
|
+
border-color: transparent;
|
|
5696
|
+
background-color: var(--rcx-button-ghost-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-secondary-press, #9ea2a8) 70%, transparent));
|
|
5697
|
+
}
|
|
5698
|
+
.rcx-split-button--danger {
|
|
5699
|
+
background-color: var(--rcx-split-button-danger-background-color, color-mix(in srgb, var(--rcx-color-button-background-danger-default, #ec0d2a) 70%, transparent));
|
|
5700
|
+
}
|
|
5701
|
+
.rcx-split-button--danger > .rcx-button.rcx-split-button__trigger {
|
|
5702
|
+
color: var(--rcx-split-button-danger-color, var(--rcx-color-button-font-on-danger, #ffffff));
|
|
5703
|
+
border-color: transparent;
|
|
5704
|
+
background-color: transparent;
|
|
5705
|
+
}
|
|
5706
|
+
.rcx-split-button--danger > .rcx-button.rcx-split-button__trigger:focus-visible, .rcx-split-button--danger > .rcx-button.rcx-split-button__trigger.focus.focus-visible {
|
|
5707
|
+
border-color: transparent;
|
|
5708
|
+
background-color: var(--rcx-button-ghost-danger-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-danger-focus, #ec0d2a) 70%, transparent));
|
|
5709
|
+
}
|
|
5710
|
+
.rcx-split-button--danger > .rcx-button.rcx-split-button__trigger:hover, .rcx-split-button--danger > .rcx-button.rcx-split-button__trigger.hover, .rcx-split-button--danger > .rcx-button.rcx-split-button__trigger.is-hovered {
|
|
5711
|
+
border-color: transparent;
|
|
5712
|
+
background-color: var(--rcx-button-ghost-danger-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-danger-hover, #d40c26) 70%, transparent));
|
|
5713
|
+
}
|
|
5714
|
+
.rcx-split-button--danger > .rcx-button.rcx-split-button__trigger:active, .rcx-split-button--danger > .rcx-button.rcx-split-button__trigger.active, .rcx-split-button--danger > .rcx-button.rcx-split-button__trigger.is-active {
|
|
5715
|
+
border-color: transparent;
|
|
5716
|
+
background-color: var(--rcx-button-ghost-danger-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-danger-press, #bb0b21) 70%, transparent));
|
|
5717
|
+
}
|
|
5718
|
+
.rcx-split-button--warning {
|
|
5719
|
+
background-color: var(--rcx-split-button-warning-background-color, color-mix(in srgb, var(--rcx-color-button-background-warning-default, #ffd95a) 70%, transparent));
|
|
5720
|
+
}
|
|
5721
|
+
.rcx-split-button--warning > .rcx-button.rcx-split-button__trigger {
|
|
5722
|
+
color: var(--rcx-split-button-warning-color, var(--rcx-color-button-font-on-warning, #1f2329));
|
|
5723
|
+
border-color: transparent;
|
|
5724
|
+
background-color: transparent;
|
|
5725
|
+
}
|
|
5726
|
+
.rcx-split-button--warning > .rcx-button.rcx-split-button__trigger:focus-visible, .rcx-split-button--warning > .rcx-button.rcx-split-button__trigger.focus.focus-visible {
|
|
5727
|
+
border-color: transparent;
|
|
5728
|
+
background-color: var(--rcx-button-ghost-warning-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-warning-focus, #ffd95a) 70%, transparent));
|
|
5729
|
+
}
|
|
5730
|
+
.rcx-split-button--warning > .rcx-button.rcx-split-button__trigger:hover, .rcx-split-button--warning > .rcx-button.rcx-split-button__trigger.hover, .rcx-split-button--warning > .rcx-button.rcx-split-button__trigger.is-hovered {
|
|
5731
|
+
border-color: transparent;
|
|
5732
|
+
background-color: var(--rcx-button-ghost-warning-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-warning-hover, #ffd031) 70%, transparent));
|
|
5733
|
+
}
|
|
5734
|
+
.rcx-split-button--warning > .rcx-button.rcx-split-button__trigger:active, .rcx-split-button--warning > .rcx-button.rcx-split-button__trigger.active, .rcx-split-button--warning > .rcx-button.rcx-split-button__trigger.is-active {
|
|
5735
|
+
border-color: transparent;
|
|
5736
|
+
background-color: var(--rcx-button-ghost-warning-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-warning-press, #f3be08) 70%, transparent));
|
|
5737
|
+
}
|
|
5738
|
+
.rcx-split-button--success {
|
|
5739
|
+
background-color: var(--rcx-split-button-success-background-color, color-mix(in srgb, var(--rcx-color-button-background-success-default, #148660) 70%, transparent));
|
|
5740
|
+
}
|
|
5741
|
+
.rcx-split-button--success > .rcx-button.rcx-split-button__trigger {
|
|
5742
|
+
color: var(--rcx-split-button-success-color, var(--rcx-color-button-font-on-success, #ffffff));
|
|
5743
|
+
border-color: transparent;
|
|
5744
|
+
background-color: transparent;
|
|
5745
|
+
}
|
|
5746
|
+
.rcx-split-button--success > .rcx-button.rcx-split-button__trigger:focus-visible, .rcx-split-button--success > .rcx-button.rcx-split-button__trigger.focus.focus-visible {
|
|
5747
|
+
border-color: transparent;
|
|
5748
|
+
background-color: var(--rcx-button-ghost-success-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-success-focus, #148660) 70%, transparent));
|
|
5749
|
+
}
|
|
5750
|
+
.rcx-split-button--success > .rcx-button.rcx-split-button__trigger:hover, .rcx-split-button--success > .rcx-button.rcx-split-button__trigger.hover, .rcx-split-button--success > .rcx-button.rcx-split-button__trigger.is-hovered {
|
|
5751
|
+
border-color: transparent;
|
|
5752
|
+
background-color: var(--rcx-button-ghost-success-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-success-hover, #106d4f) 70%, transparent));
|
|
5753
|
+
}
|
|
5754
|
+
.rcx-split-button--success > .rcx-button.rcx-split-button__trigger:active, .rcx-split-button--success > .rcx-button.rcx-split-button__trigger.active, .rcx-split-button--success > .rcx-button.rcx-split-button__trigger.is-active {
|
|
5755
|
+
border-color: transparent;
|
|
5756
|
+
background-color: var(--rcx-button-ghost-success-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-success-press, #0d5940) 70%, transparent));
|
|
5757
|
+
}
|
|
5758
|
+
.rcx-split-button--primary {
|
|
5759
|
+
background-color: var(--rcx-split-button-primary-background-color, color-mix(in srgb, var(--rcx-color-button-background-primary-default, #156ff5) 70%, transparent));
|
|
5760
|
+
}
|
|
5761
|
+
.rcx-split-button--primary > .rcx-button.rcx-split-button__trigger {
|
|
5762
|
+
color: var(--rcx-split-button-primary-color, var(--rcx-color-button-font-on-primary, #ffffff));
|
|
5763
|
+
border-color: transparent;
|
|
5764
|
+
background-color: transparent;
|
|
5765
|
+
}
|
|
5766
|
+
.rcx-split-button--primary > .rcx-button.rcx-split-button__trigger:focus-visible, .rcx-split-button--primary > .rcx-button.rcx-split-button__trigger.focus.focus-visible {
|
|
5767
|
+
border-color: transparent;
|
|
5768
|
+
background-color: var(--rcx-button-ghost-primary-focus-background-color, color-mix(in srgb, var(--rcx-color-button-background-primary-focus, #156ff5) 70%, transparent));
|
|
5769
|
+
}
|
|
5770
|
+
.rcx-split-button--primary > .rcx-button.rcx-split-button__trigger:hover, .rcx-split-button--primary > .rcx-button.rcx-split-button__trigger.hover, .rcx-split-button--primary > .rcx-button.rcx-split-button__trigger.is-hovered {
|
|
5771
|
+
border-color: transparent;
|
|
5772
|
+
background-color: var(--rcx-button-ghost-primary-hover-background-color, color-mix(in srgb, var(--rcx-color-button-background-primary-hover, #095ad2) 70%, transparent));
|
|
5773
|
+
}
|
|
5774
|
+
.rcx-split-button--primary > .rcx-button.rcx-split-button__trigger:active, .rcx-split-button--primary > .rcx-button.rcx-split-button__trigger.active, .rcx-split-button--primary > .rcx-button.rcx-split-button__trigger.is-active {
|
|
5775
|
+
border-color: transparent;
|
|
5776
|
+
background-color: var(--rcx-button-ghost-primary-active-background-color, color-mix(in srgb, var(--rcx-color-button-background-primary-press, #10529e) 70%, transparent));
|
|
5777
|
+
}
|
|
5778
|
+
|
|
5719
5779
|
.rcx-states {
|
|
5720
5780
|
display: flex;
|
|
5721
5781
|
flex-direction: column;
|
|
@@ -2520,18 +2520,16 @@ if (process.env.NODE_ENV !== "production") (function() {
|
|
|
2520
2520
|
/**
|
|
2521
2521
|
* A container for grouping buttons that semantically share a common action context.
|
|
2522
2522
|
*/
|
|
2523
|
-
function ButtonGroup({ align = "start", children, stretch, vertical, wrap, small, large,
|
|
2523
|
+
function ButtonGroup({ align = "start", children, stretch, vertical, wrap, small, large, className, ...props }) {
|
|
2524
2524
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
2525
2525
|
className: [
|
|
2526
2526
|
"rcx-button-group",
|
|
2527
2527
|
stretch && "rcx-button-group--stretch",
|
|
2528
2528
|
vertical && "rcx-button-group--vertical",
|
|
2529
2529
|
align && `rcx-button-group--align-${align}`,
|
|
2530
|
-
|
|
2531
|
-
|
|
2530
|
+
small && "rcx-button-group--small",
|
|
2531
|
+
large && "rcx-button-group--large",
|
|
2532
2532
|
wrap && "rcx-button-group--wrap",
|
|
2533
|
-
joined && "rcx-button-group--joined",
|
|
2534
|
-
joined && ghostPosition && `rcx-button-group--ghost-${ghostPosition}`,
|
|
2535
2533
|
className
|
|
2536
2534
|
].filter(Boolean).join(" "),
|
|
2537
2535
|
role: "group",
|
|
@@ -6653,6 +6651,39 @@ if (process.env.NODE_ENV !== "production") (function() {
|
|
|
6653
6651
|
});
|
|
6654
6652
|
}
|
|
6655
6653
|
//#endregion
|
|
6654
|
+
//#region src/components/SplitButton/SplitButton.tsx
|
|
6655
|
+
/**
|
|
6656
|
+
* Fuses a menu trigger and its primary action into a single control, e.g. an
|
|
6657
|
+
* audio device menu next to a microphone toggle. The menu trigger is a
|
|
6658
|
+
* `SplitButtonTrigger`, rendered as a ghost segment wherever it sits.
|
|
6659
|
+
*/
|
|
6660
|
+
function SplitButton({ className, danger, warning, success, primary, ...props }) {
|
|
6661
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6662
|
+
role: "group",
|
|
6663
|
+
className: [
|
|
6664
|
+
"rcx-split-button",
|
|
6665
|
+
danger && "rcx-split-button--danger",
|
|
6666
|
+
warning && "rcx-split-button--warning",
|
|
6667
|
+
success && "rcx-split-button--success",
|
|
6668
|
+
primary && "rcx-split-button--primary",
|
|
6669
|
+
className
|
|
6670
|
+
].filter(Boolean).join(" "),
|
|
6671
|
+
...props
|
|
6672
|
+
});
|
|
6673
|
+
}
|
|
6674
|
+
//#endregion
|
|
6675
|
+
//#region src/components/SplitButton/SplitButtonTrigger.tsx
|
|
6676
|
+
/**
|
|
6677
|
+
* The ghost segment of a `SplitButton`: the menu trigger fused next to the
|
|
6678
|
+
* primary action. Pass it as a `Menu`'s `button`.
|
|
6679
|
+
*/
|
|
6680
|
+
function SplitButtonTrigger(props) {
|
|
6681
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconButton, {
|
|
6682
|
+
"rcx-split-button__trigger": true,
|
|
6683
|
+
...props
|
|
6684
|
+
});
|
|
6685
|
+
}
|
|
6686
|
+
//#endregion
|
|
6656
6687
|
//#region src/components/Table/Table.tsx
|
|
6657
6688
|
var Table = ({ striped, sticky, fixed = false, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Box_default, {
|
|
6658
6689
|
"rcx-table__wrapper": true,
|
|
@@ -7186,6 +7217,8 @@ if (process.env.NODE_ENV !== "production") (function() {
|
|
|
7186
7217
|
exports.SidepanelSectionAction = SidepanelSectionAction;
|
|
7187
7218
|
exports.Skeleton = Skeleton;
|
|
7188
7219
|
exports.Slider = Slider;
|
|
7220
|
+
exports.SplitButton = SplitButton;
|
|
7221
|
+
exports.SplitButtonTrigger = SplitButtonTrigger;
|
|
7189
7222
|
exports.States = States;
|
|
7190
7223
|
exports.StatesAction = StatesAction;
|
|
7191
7224
|
exports.StatesActions = StatesActions;
|