@stack-spot/citric-react 0.40.2 → 0.41.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/citric.css +134 -67
- package/dist/components/Overlay/index.d.ts +2 -6
- package/dist/components/Overlay/index.d.ts.map +1 -1
- package/dist/components/Overlay/index.js +20 -12
- package/dist/components/Overlay/index.js.map +1 -1
- package/dist/components/Overlay/types.d.ts +15 -10
- package/dist/components/Overlay/types.d.ts.map +1 -1
- package/dist/components/SmartTable.d.ts +0 -2
- package/dist/components/SmartTable.d.ts.map +1 -1
- package/dist/components/SmartTable.js +2 -2
- package/dist/components/SmartTable.js.map +1 -1
- package/dist/components/Tabs/index.d.ts +1 -1
- package/dist/components/Tabs/index.d.ts.map +1 -1
- package/dist/components/Tabs/index.js +5 -4
- package/dist/components/Tabs/index.js.map +1 -1
- package/dist/components/Tabs/types.d.ts +13 -0
- package/dist/components/Tabs/types.d.ts.map +1 -1
- package/dist/components/Tooltip.d.ts +11 -1
- package/dist/components/Tooltip.d.ts.map +1 -1
- package/dist/components/Tooltip.js +2 -2
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/overlay.d.ts.map +1 -1
- package/dist/overlay.js +3 -1
- package/dist/overlay.js.map +1 -1
- package/dist/utils/time.d.ts +2 -0
- package/dist/utils/time.d.ts.map +1 -0
- package/dist/utils/time.js +6 -0
- package/dist/utils/time.js.map +1 -0
- package/package.json +1 -1
- package/src/components/Overlay/index.tsx +21 -11
- package/src/components/Overlay/types.ts +15 -10
- package/src/components/SmartTable.tsx +2 -4
- package/src/components/Tabs/index.tsx +36 -17
- package/src/components/Tabs/types.ts +13 -0
- package/src/components/Tooltip.tsx +15 -4
- package/src/overlay.ts +3 -1
- package/src/utils/time.ts +5 -0
package/dist/citric.css
CHANGED
|
@@ -503,86 +503,153 @@
|
|
|
503
503
|
flex: 1;
|
|
504
504
|
overflow: hidden;
|
|
505
505
|
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
margin: 0;
|
|
513
|
-
padding: 8px 32px;
|
|
514
|
-
position: relative;
|
|
506
|
+
/**
|
|
507
|
+
* Appearance: tabs (default) and stepper
|
|
508
|
+
*/
|
|
509
|
+
|
|
510
|
+
&:not(.toggles) {
|
|
511
|
+
nav.tab-selector {
|
|
515
512
|
display: flex;
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
border: none;
|
|
520
|
-
outline: none;
|
|
521
|
-
cursor: pointer;
|
|
522
|
-
&:has(input[type="radio"]:disabled) {
|
|
523
|
-
cursor: auto;
|
|
524
|
-
}
|
|
525
|
-
input[type="radio"] {
|
|
513
|
+
position: relative;
|
|
514
|
+
border-bottom: 1px solid var(--light-600);
|
|
515
|
+
> label {
|
|
526
516
|
appearance: none;
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
background-color:
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
517
|
+
margin: 0;
|
|
518
|
+
padding: 8px 32px;
|
|
519
|
+
position: relative;
|
|
520
|
+
display: flex;
|
|
521
|
+
align-items: center;
|
|
522
|
+
gap: 4px;
|
|
523
|
+
background-color: transparent;
|
|
524
|
+
border: none;
|
|
525
|
+
outline: none;
|
|
526
|
+
cursor: pointer;
|
|
527
|
+
&:has(input[type="radio"]:disabled) {
|
|
528
|
+
cursor: auto;
|
|
529
|
+
}
|
|
530
|
+
input[type="radio"] {
|
|
531
|
+
appearance: none;
|
|
532
|
+
position: absolute;
|
|
533
|
+
bottom: -1px;
|
|
534
|
+
left: 0;
|
|
535
|
+
right: 0;
|
|
536
|
+
display: block;
|
|
537
|
+
height: 2px;
|
|
538
|
+
background-color: var(--scheme-500, var(--palette-500, var(--primary-500)));
|
|
539
|
+
transform: scaleX(0);
|
|
540
|
+
transition: transform 0.2s ease-out;
|
|
541
|
+
&:checked {
|
|
542
|
+
transform: scaleX(1);
|
|
543
|
+
}
|
|
538
544
|
}
|
|
539
545
|
}
|
|
540
546
|
}
|
|
541
|
-
}
|
|
542
547
|
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
548
|
+
&.equally-sized nav.tab-selector > label {
|
|
549
|
+
padding: 8px 0;
|
|
550
|
+
flex: 1;
|
|
551
|
+
justify-content: center;
|
|
552
|
+
text-align: center;
|
|
553
|
+
}
|
|
549
554
|
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
+
> section.tab-content {
|
|
556
|
+
display: flex;
|
|
557
|
+
flex-direction: column;
|
|
558
|
+
flex: 1;
|
|
559
|
+
overflow: auto;
|
|
560
|
+
}
|
|
561
|
+
|
|
562
|
+
&.stepper {
|
|
563
|
+
nav.tab-selector {
|
|
564
|
+
border: none;
|
|
565
|
+
gap: 16px;
|
|
566
|
+
font-weight: 500;
|
|
567
|
+
> label {
|
|
568
|
+
flex: 1;
|
|
569
|
+
padding: 20px 0 0 0;
|
|
570
|
+
color: var(--light-700);
|
|
571
|
+
&:has(input[type="radio"]:checked) {
|
|
572
|
+
color: var(--light-contrastText);
|
|
573
|
+
& ~ label input[type="radio"] {
|
|
574
|
+
background-color: var(--light-600);
|
|
575
|
+
}
|
|
576
|
+
}
|
|
577
|
+
input[type="radio"] {
|
|
578
|
+
top: 0;
|
|
579
|
+
bottom: auto;
|
|
580
|
+
height: 4px;
|
|
581
|
+
background-color: var(--success-500);
|
|
582
|
+
transform: none;
|
|
583
|
+
transition: background-color 0.3s;
|
|
584
|
+
margin: 0;
|
|
585
|
+
&:checked {
|
|
586
|
+
background-color: var(--scheme-500, var(--palette-500, var(--primary-500)));
|
|
587
|
+
}
|
|
588
|
+
}
|
|
589
|
+
}
|
|
590
|
+
}
|
|
591
|
+
}
|
|
555
592
|
}
|
|
556
593
|
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
594
|
+
/**
|
|
595
|
+
* Appearance: toggles
|
|
596
|
+
*/
|
|
597
|
+
|
|
598
|
+
&.toggles {
|
|
599
|
+
nav.tab-selector {
|
|
600
|
+
display: flex;
|
|
601
|
+
border: 1px solid var(--scheme-500, var(--palette-300, var(--light-300)));
|
|
602
|
+
border-radius: 4px;
|
|
603
|
+
padding: 3px;
|
|
604
|
+
gap: 4px;
|
|
605
|
+
width: fit-content;
|
|
562
606
|
> label {
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
607
|
+
appearance: none;
|
|
608
|
+
margin: 0;
|
|
609
|
+
padding: 8px 32px;
|
|
610
|
+
display: flex;
|
|
611
|
+
align-items: center;
|
|
612
|
+
gap: 4px;
|
|
613
|
+
background-color: transparent;
|
|
614
|
+
border: none;
|
|
615
|
+
border-radius: 2px;
|
|
616
|
+
outline: none;
|
|
617
|
+
cursor: pointer;
|
|
618
|
+
opacity: 70%;
|
|
619
|
+
transition: background-color 0.4s;
|
|
620
|
+
&:has(input[type="radio"]:disabled) {
|
|
621
|
+
cursor: auto;
|
|
622
|
+
background-color: transparent;
|
|
623
|
+
}
|
|
566
624
|
&:has(input[type="radio"]:checked) {
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
625
|
+
opacity: 1;
|
|
626
|
+
background-color: var(--scheme-500, var(--palette-500, var(--light-500)));
|
|
627
|
+
}
|
|
628
|
+
&:hover {
|
|
629
|
+
background-color: var(--scheme-500, var(--palette-500, var(--light-500)));
|
|
571
630
|
}
|
|
572
631
|
input[type="radio"] {
|
|
573
|
-
|
|
574
|
-
bottom: auto;
|
|
575
|
-
height: 4px;
|
|
576
|
-
background-color: var(--success-500);
|
|
577
|
-
transform: none;
|
|
578
|
-
transition: background-color 0.3s;
|
|
579
|
-
margin: 0;
|
|
580
|
-
&:checked {
|
|
581
|
-
background-color: var(--scheme-500, var(--palette-500, var(--primary-500)));
|
|
582
|
-
}
|
|
632
|
+
display: none;
|
|
583
633
|
}
|
|
584
634
|
}
|
|
585
635
|
}
|
|
636
|
+
|
|
637
|
+
&.equally-sized nav.tab-selector {
|
|
638
|
+
width: auto;
|
|
639
|
+
> label {
|
|
640
|
+
padding: 8px 0;
|
|
641
|
+
flex: 1;
|
|
642
|
+
justify-content: center;
|
|
643
|
+
text-align: center;
|
|
644
|
+
}
|
|
645
|
+
}
|
|
646
|
+
|
|
647
|
+
> section.tab-content {
|
|
648
|
+
display: flex;
|
|
649
|
+
flex-direction: column;
|
|
650
|
+
flex: 1;
|
|
651
|
+
overflow: auto;
|
|
652
|
+
}
|
|
586
653
|
}
|
|
587
654
|
}
|
|
588
655
|
|
|
@@ -2127,8 +2194,8 @@ input[type="reset"][data-citric="icon-box"], .apply-citric input[type="reset"].c
|
|
|
2127
2194
|
|
|
2128
2195
|
|
|
2129
2196
|
input[data-citric="favorite"][type="checkbox"] {
|
|
2130
|
-
--icon: var(--citric-icon-outline-
|
|
2131
|
-
--icon-fill: var(--citric-icon-fill-
|
|
2197
|
+
--icon: var(--citric-icon-outline-Bookmark);
|
|
2198
|
+
--icon-fill: var(--citric-icon-fill-Bookmark);
|
|
2132
2199
|
--height: 42px;
|
|
2133
2200
|
display: flex;
|
|
2134
2201
|
align-items: center;
|
|
@@ -2146,7 +2213,7 @@ input[data-citric="favorite"][type="checkbox"] {
|
|
|
2146
2213
|
|
|
2147
2214
|
&:checked:before {
|
|
2148
2215
|
font-family: 'CitricIconsFill';
|
|
2149
|
-
color: var(--
|
|
2216
|
+
color: var(--light-contrastText);
|
|
2150
2217
|
content: var(--icon-fill);
|
|
2151
2218
|
}
|
|
2152
2219
|
|
|
@@ -6,11 +6,7 @@ export { useOverlayController } from './context.js';
|
|
|
6
6
|
*
|
|
7
7
|
* TODO: update position when the size changes. Currently, the top position seems out of place whenever the height changes. The same is
|
|
8
8
|
* probably true for the left position if the width changes.
|
|
9
|
-
* TODO:
|
|
10
|
-
* TODO: reposition the overlay when it's under a scrollable element other then the body and this element is scrolled.
|
|
11
|
-
* TODO: close the overlay when it's under a scrollable element other then the body and the element that triggered the tooltip becomes
|
|
12
|
-
* hidden by the scroll.
|
|
13
|
-
* TODO: use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
9
|
+
* TODO (minor): use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
14
10
|
*/
|
|
15
11
|
/**
|
|
16
12
|
* Creates an overlay for the child component. The overlay can be any React element. The overlay can be triggered by "click" or "hover"
|
|
@@ -30,5 +26,5 @@ export { useOverlayController } from './context.js';
|
|
|
30
26
|
* )
|
|
31
27
|
* ```
|
|
32
28
|
*/
|
|
33
|
-
export declare function Overlay<T extends keyof HTMLTag>({ tag, children, content, position, triggerOn, alignment, attributes, onRenderChild, autoFocusBehavior, ...props }: OverlayProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
export declare function Overlay<T extends keyof HTMLTag>({ tag, children, content, position, triggerOn, alignment, attributes, onRenderChild, autoFocusBehavior, openDelayMS, closeDelayMS, ...props }: OverlayProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
34
30
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAIrC,OAAO,EAAqB,YAAY,EAAE,MAAM,SAAS,CAAA;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAOhD;;;;;;GAMG;AAEH;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,OAAO,EAAE,EAC/C,GAAG,EACH,QAAQ,EACR,OAAO,EACP,QAAgB,EAChB,SAAmB,EACnB,SAAoB,EACpB,UAAU,EACV,aAAa,EACb,iBAA8B,EAC9B,WAAW,EACX,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,YAAY,CAAC,CAAC,CAAC,2CA2HjB"}
|
|
@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useEffect, useRef } from 'react';
|
|
3
3
|
import { showOverlay } from '../../overlay.js';
|
|
4
4
|
import { focusFirstChild } from '../../utils/acessibility.js';
|
|
5
|
+
import { delay } from '../../utils/time.js';
|
|
5
6
|
import { OverlayProvider } from './context.js';
|
|
6
7
|
export { useOverlayController } from './context.js';
|
|
7
8
|
/**
|
|
@@ -13,11 +14,7 @@ const arbitraryRenderTime = 20;
|
|
|
13
14
|
*
|
|
14
15
|
* TODO: update position when the size changes. Currently, the top position seems out of place whenever the height changes. The same is
|
|
15
16
|
* probably true for the left position if the width changes.
|
|
16
|
-
* TODO:
|
|
17
|
-
* TODO: reposition the overlay when it's under a scrollable element other then the body and this element is scrolled.
|
|
18
|
-
* TODO: close the overlay when it's under a scrollable element other then the body and the element that triggered the tooltip becomes
|
|
19
|
-
* hidden by the scroll.
|
|
20
|
-
* TODO: use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
17
|
+
* TODO (minor): use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
21
18
|
*/
|
|
22
19
|
/**
|
|
23
20
|
* Creates an overlay for the child component. The overlay can be any React element. The overlay can be triggered by "click" or "hover"
|
|
@@ -37,7 +34,7 @@ const arbitraryRenderTime = 20;
|
|
|
37
34
|
* )
|
|
38
35
|
* ```
|
|
39
36
|
*/
|
|
40
|
-
export function Overlay({ tag, children, content, position = 'top', triggerOn = 'hover', alignment = 'center', attributes, onRenderChild, autoFocusBehavior = 'keyboard', ...props }) {
|
|
37
|
+
export function Overlay({ tag, children, content, position = 'top', triggerOn = 'hover', alignment = 'center', attributes, onRenderChild, autoFocusBehavior = 'keyboard', openDelayMS, closeDelayMS, ...props }) {
|
|
41
38
|
const controller = useRef({ close: () => Promise.resolve() });
|
|
42
39
|
const wrapper = useRef(null);
|
|
43
40
|
// props that don't require removing and reattaching the event listeners
|
|
@@ -63,8 +60,13 @@ export function Overlay({ tag, children, content, position = 'top', triggerOn =
|
|
|
63
60
|
async function show(event) {
|
|
64
61
|
if (visible)
|
|
65
62
|
return;
|
|
66
|
-
visible = true;
|
|
67
63
|
const target = getTarget();
|
|
64
|
+
if (openDelayMS && triggerOn === 'hover') {
|
|
65
|
+
await delay(openDelayMS);
|
|
66
|
+
if (!target?.matches(':hover'))
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
visible = true;
|
|
68
70
|
if (!target)
|
|
69
71
|
return;
|
|
70
72
|
const { overlay, hide: hideFn } = showOverlay({
|
|
@@ -110,7 +112,10 @@ export function Overlay({ tag, children, content, position = 'top', triggerOn =
|
|
|
110
112
|
setTimeout(() => focusFirstChild(overlay), arbitraryRenderTime);
|
|
111
113
|
}
|
|
112
114
|
}
|
|
113
|
-
controller.current.close = async () => {
|
|
115
|
+
controller.current.close = async (immediately = false) => {
|
|
116
|
+
if (!immediately && typeof closeDelayMS === 'number') {
|
|
117
|
+
await delay(closeDelayMS);
|
|
118
|
+
}
|
|
114
119
|
visible = false;
|
|
115
120
|
if (hideOnClickOutside)
|
|
116
121
|
document.removeEventListener('click', hideOnClickOutside);
|
|
@@ -121,14 +126,14 @@ export function Overlay({ tag, children, content, position = 'top', triggerOn =
|
|
|
121
126
|
};
|
|
122
127
|
if (triggerOn === 'hover') {
|
|
123
128
|
getTarget()?.addEventListener('mouseenter', show);
|
|
124
|
-
getTarget()?.addEventListener('mouseleave', controller.current.close);
|
|
129
|
+
getTarget()?.addEventListener('mouseleave', () => controller.current.close());
|
|
125
130
|
getTarget()?.addEventListener('focus', show);
|
|
126
|
-
getTarget()?.addEventListener('blur', controller.current.close);
|
|
131
|
+
getTarget()?.addEventListener('blur', () => controller.current.close());
|
|
127
132
|
return () => {
|
|
128
133
|
getTarget()?.removeEventListener('mouseenter', show);
|
|
129
|
-
getTarget()?.removeEventListener('mouseleave', controller.current.close);
|
|
134
|
+
getTarget()?.removeEventListener('mouseleave', () => controller.current.close());
|
|
130
135
|
getTarget()?.removeEventListener('focus', show);
|
|
131
|
-
getTarget()?.removeEventListener('blur', controller.current.close);
|
|
136
|
+
getTarget()?.removeEventListener('blur', () => controller.current.close());
|
|
132
137
|
};
|
|
133
138
|
}
|
|
134
139
|
if (triggerOn === 'click') {
|
|
@@ -141,6 +146,9 @@ export function Overlay({ tag, children, content, position = 'top', triggerOn =
|
|
|
141
146
|
};
|
|
142
147
|
}
|
|
143
148
|
}, [wrapper.current, triggerOn]);
|
|
149
|
+
useEffect(() => () => {
|
|
150
|
+
controller.current?.close(true);
|
|
151
|
+
}, []);
|
|
144
152
|
return _jsx("div", { ref: wrapper, ...props, children: children });
|
|
145
153
|
}
|
|
146
154
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAE3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAEhD;;GAEG;AACH,MAAM,mBAAmB,GAAG,EAAE,CAAA;AAE9B
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -13,21 +13,21 @@ export interface BaseOverlayProps<T extends keyof HTMLTag> extends Omit<OverlayO
|
|
|
13
13
|
*/
|
|
14
14
|
triggerOn?: TriggerOn;
|
|
15
15
|
/**
|
|
16
|
-
* TODO: not implemented yet.
|
|
17
|
-
*
|
|
18
16
|
* Only valid if `triggerOn` is "hover".
|
|
19
17
|
*
|
|
20
|
-
*
|
|
21
|
-
* tooltip. This sets a delay for the overlay to disappear, giving it time for the user to hover the overlay or gocus one of its children,
|
|
22
|
-
* which will prevent it from closing.
|
|
18
|
+
* Waits the given amount of milliseconds before closing the overlay.
|
|
23
19
|
*
|
|
24
|
-
*
|
|
20
|
+
* @default 0
|
|
21
|
+
*/
|
|
22
|
+
closeDelayMS?: number;
|
|
23
|
+
/**
|
|
24
|
+
* Only valid if `triggerOn` is "hover".
|
|
25
25
|
*
|
|
26
|
-
*
|
|
26
|
+
* Waits the given amount of milliseconds before opening the overlay.
|
|
27
27
|
*
|
|
28
|
-
* @default
|
|
28
|
+
* @default 0
|
|
29
29
|
*/
|
|
30
|
-
|
|
30
|
+
openDelayMS?: number;
|
|
31
31
|
/**
|
|
32
32
|
* TODO: not implemented yet.
|
|
33
33
|
*
|
|
@@ -62,6 +62,11 @@ export interface BaseOverlayProps<T extends keyof HTMLTag> extends Omit<OverlayO
|
|
|
62
62
|
}
|
|
63
63
|
export type OverlayProps<T extends keyof HTMLTag> = Omit<React.JSX.IntrinsicElements['div'], 'content'> & BaseOverlayProps<T>;
|
|
64
64
|
export interface OverlayController {
|
|
65
|
-
|
|
65
|
+
/**
|
|
66
|
+
* Closes the tooltip.
|
|
67
|
+
* @param immediately when true, ignores the closeDelayMS parameter.
|
|
68
|
+
* @returns a promise that resolves when the overlay is removed from the DOM.
|
|
69
|
+
*/
|
|
70
|
+
close: (immediately?: boolean) => Promise<void>;
|
|
66
71
|
}
|
|
67
72
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAErC,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,OAAO,CAAA;AAEzC,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,OAAO,CAAE,SAAQ,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC;IAClG;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAErC,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,OAAO,CAAA;AAEzC,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,OAAO,CAAE,SAAQ,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC;IAClG;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;;;;;;;;;;;;OAkBG;IACH,iBAAiB,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAAC;IACpD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAC7B;;;;;OAKG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;CAChD;AAED,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,MAAM,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAA;AAE7H,MAAM,WAAW,iBAAiB;IAChC;;;;OAIG;IACH,KAAK,EAAE,CAAC,WAAW,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACjD"}
|
|
@@ -61,8 +61,6 @@ interface ExtraSmartTableProps<T extends Record<string, any>> {
|
|
|
61
61
|
*
|
|
62
62
|
* The extra row is, effectively, an accordion. The content of this accordion is defined by whatever this function returns.
|
|
63
63
|
*
|
|
64
|
-
* Attention: this function is treated as a React Component, i.e. you can use React hooks inside of it.
|
|
65
|
-
*
|
|
66
64
|
* @param item the current item.
|
|
67
65
|
* @returns the React Node to render.
|
|
68
66
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SmartTable.d.ts","sourceRoot":"","sources":["../../src/components/SmartTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAS,UAAU,EAAU,MAAM,SAAS,CAAA;AAErF,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI;IAC3B;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IACtC;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,GAAG,SAAS,KAAK,IAAI,CAAC;IACvD;;;;OAIG;IACH,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B;;OAEG;IACH,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;IACnD;;OAEG;IACH,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;CACpD,CAAA;AAED,UAAU,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC1D;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,GAAG,CAAC;IAChC;;;;OAIG;IACH,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1B
|
|
1
|
+
{"version":3,"file":"SmartTable.d.ts","sourceRoot":"","sources":["../../src/components/SmartTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAS,UAAU,EAAU,MAAM,SAAS,CAAA;AAErF,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI;IAC3B;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IACtC;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,GAAG,SAAS,KAAK,IAAI,CAAC;IACvD;;;;OAIG;IACH,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B;;OAEG;IACH,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;IACnD;;OAEG;IACH,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC;CACpD,CAAA;AAED,UAAU,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC1D;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,GAAG,CAAC;IAChC;;;;OAIG;IACH,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1B;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/C;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IACpC;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;;;;;;;;;OAkBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,cAAc,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAA;AAEzG,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAA;AAanH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,UAAU,GACD,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,6HAE9C,eAAe,CAAC,CAAC,CAAC,4CA4DtB,CAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { createElement as _createElement } from "react";
|
|
3
|
-
import {
|
|
3
|
+
import { useMemo } from 'react';
|
|
4
4
|
import { withRef } from '../utils/react.js';
|
|
5
5
|
import { Table, Th, Tr } from './Table.js';
|
|
6
6
|
function createRowClickListener(elementQuerySelector) {
|
|
@@ -54,7 +54,7 @@ export const SmartTable = withRef(function SmartTable({ data, keygen, columns, r
|
|
|
54
54
|
const headers = useMemo(() => headless ? [] : columns.map((c) => (_createElement(Th, { ...c.th, key: c.key, onSort: c.onSort, direction: c.direction, tabIndex: c.onSort ? 0 : undefined }, c.label ?? c.key))), [columns, headless]);
|
|
55
55
|
const rows = useMemo(() => data.map((item, index) => {
|
|
56
56
|
const key = keygen ? keygen(item) : index;
|
|
57
|
-
const accordionContent = renderAccordion
|
|
57
|
+
const accordionContent = renderAccordion?.(item);
|
|
58
58
|
const row = (_jsxs(Tr, { accordionTrigger: accordionContent ? accordionTrigger : undefined, onClick: rowClickElement ? createRowClickListener(rowClickElement) : undefined, children: [columns.map(c => _createElement("td", { ...c.td, key: c.key }, c.render ? c.render(item) : (item[c.key] || ''))), renderAccordion && (_jsx("td", { children: accordionContent && (_jsx("input", { type: "checkbox", "aria-controls": `${id}-${key}`, onKeyDown: e => e.key === 'Enter' && e.target instanceof HTMLElement && e.target.click() })) }))] }, key));
|
|
59
59
|
return renderAccordion ? (_jsxs("tbody", { children: [row, _jsx(Tr, { id: `${id}-${key}`, accordion: true, accordionMaxHeight: accordionMaxHeight, children: _jsx("td", { colSpan: columns.length + 1, children: _jsx("div", { children: accordionContent }) }) })] }, `${key}-group`)) : row;
|
|
60
60
|
}), [columns, data, !!renderAccordion, accordionTrigger]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SmartTable.js","sourceRoot":"","sources":["../../src/components/SmartTable.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"SmartTable.js","sourceRoot":"","sources":["../../src/components/SmartTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -15,7 +15,7 @@ import { TabsProps } from './types.js';
|
|
|
15
15
|
* return <Tabs tabs={tabs} />
|
|
16
16
|
* ```
|
|
17
17
|
*/
|
|
18
|
-
export declare const Tabs: <Key extends string>({ tabs, value, equallySized, onChange, controller: ctrl, className, ...props }: TabsProps<Key>) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export declare const Tabs: <Key extends string>({ tabs, value, equallySized, onChange, controller: ctrl, appearance, customRenderer, className, ...props }: TabsProps<Key>) => import("react/jsx-runtime").JSX.Element;
|
|
19
19
|
/**
|
|
20
20
|
* Request the tab controller of the current context. Use this to control the tabs in the parent components. This returns undefined when
|
|
21
21
|
* no tab context is found.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAKnC;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,IAAI,GACD,GAAG,SAAS,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAKnC;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,IAAI,GACD,GAAG,SAAS,MAAM,8GAC8E,SAAS,CAAC,GAAG,CAAC,4CAyD7H,CAAA;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,KAAK,aAAa,CAAC,GAAG,CAAC,GAAG,SAAS,CAE9F"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { listToClass } from '@stack-spot/portal-theme';
|
|
3
3
|
import { useTranslate } from '@stack-spot/portal-translate';
|
|
4
4
|
import { createContext, Suspense, useContext, useEffect, useMemo, useState } from 'react';
|
|
@@ -25,7 +25,7 @@ const ctx = createContext(undefined);
|
|
|
25
25
|
* return <Tabs tabs={tabs} />
|
|
26
26
|
* ```
|
|
27
27
|
*/
|
|
28
|
-
export const Tabs = withRef(function Tabs({ tabs, value, equallySized, onChange, controller: ctrl, className, ...props }) {
|
|
28
|
+
export const Tabs = withRef(function Tabs({ tabs, value, equallySized, onChange, controller: ctrl, appearance, customRenderer, className, ...props }) {
|
|
29
29
|
const controller = useMemo(() => ctrl ?? new TabController(tabs.map(t => t.key), value || tabs[0]?.key), []);
|
|
30
30
|
const t = useTranslate(dictionary);
|
|
31
31
|
const [selectedIndex, setSelectedIndex] = useState(findSelectedIndex(tabs, controller.getValue()));
|
|
@@ -37,8 +37,9 @@ export const Tabs = withRef(function Tabs({ tabs, value, equallySized, onChange,
|
|
|
37
37
|
setSelectedIndex(findSelectedIndex(tabs, v));
|
|
38
38
|
onChange?.(v);
|
|
39
39
|
}), [tabs]);
|
|
40
|
-
const
|
|
41
|
-
|
|
40
|
+
const tabSelector = useMemo(() => (_jsx("nav", { className: "tab-selector", children: tabs.map(({ key, label, disabled }, index) => (_jsxs("label", { children: [_jsx("input", { type: "radio", role: "tab", checked: index === selectedIndex, onChange: () => controller.setValue(key), disabled: disabled }), label || key] }, key))) })), [tabs, selectedIndex]);
|
|
41
|
+
const content = useMemo(() => (_jsx("section", { className: "tab-content", children: _jsx(ErrorBoundary, { message: t.error, children: _jsx(Suspense, { fallback: _jsx(Center, { style: { padding: '20px' }, children: _jsx(ProgressCircular, {}) }), children: selectedIndex === -1 ? null : tabs[selectedIndex]?.content }) }, selectedIndex) })), [selectedIndex, t]);
|
|
42
|
+
return (_jsx(ctx.Provider, { value: controller, children: _jsx(CitricComponent, { tag: "div", component: "tabs", className: listToClass([className, equallySized && 'equally-sized', appearance]), ...props, children: customRenderer ? customRenderer(tabSelector, content) : _jsxs(_Fragment, { children: [tabSelector, content] }) }) }));
|
|
42
43
|
});
|
|
43
44
|
/**
|
|
44
45
|
* Request the tab controller of the current context. Use this to control the tabs in the parent components. This returns undefined when
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tabs/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzF,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAE3C,MAAM,GAAG,GAAG,aAAa,CAAiC,SAAS,CAAC,CAAA;AAEpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,OAAO,CACzB,SAAS,IAAI,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tabs/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzF,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAE3C,MAAM,GAAG,GAAG,aAAa,CAAiC,SAAS,CAAC,CAAA;AAEpE;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,OAAO,CACzB,SAAS,IAAI,CACX,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB;IAE1H,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,IAAI,IAAI,aAAa,CAAM,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,CAAA;IACjH,MAAM,CAAC,GAAG,YAAY,CAAC,UAAU,CAAC,CAAA;IAClC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC,IAAI,EAAE,UAAU,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAA;IAElG,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK;YAAE,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IACvC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,SAAS,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE;QACxC,gBAAgB,CAAC,iBAAiB,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;QAC5C,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAA;IACf,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEX,MAAM,WAAW,GAAG,OAAO,CACzB,GAAG,EAAE,CAAC,CACJ,cAAK,SAAS,EAAC,cAAc,YAC1B,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7C,4BACE,gBACE,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,KAAK,EACV,OAAO,EAAE,KAAK,KAAK,aAAa,EAChC,QAAQ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,GAC5D,EACD,KAAK,IAAI,GAAG,KAPH,GAAG,CAQP,CACT,CAAC,GACE,CACP,EACD,CAAC,IAAI,EAAE,aAAa,CAAC,CACtB,CAAA;IAED,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAC5B,kBAAS,SAAS,EAAC,aAAa,YAC9B,KAAC,aAAa,IAAqB,OAAO,EAAE,CAAC,CAAC,KAAK,YACjD,KAAC,QAAQ,IAAC,QAAQ,EAAE,KAAC,MAAM,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,YAAE,KAAC,gBAAgB,KAAG,GAAS,YAClF,aAAa,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,GAClD,IAHO,aAAa,CAIjB,GACR,CACX,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,CAAA;IAEtB,OAAO,CACL,KAAC,GAAG,CAAC,QAAQ,IAAC,KAAK,EAAE,UAAU,YAC7B,KAAC,eAAe,IACd,GAAG,EAAC,KAAK,EACT,SAAS,EAAC,MAAM,EAChB,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,YAAY,IAAI,eAAe,EAAE,UAAU,CAAC,CAAC,KAC5E,KAAK,YAER,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,8BAAG,WAAW,EAAE,OAAO,IAAI,GACpE,GACL,CAChB,CAAA;AACH,CAAC,CACF,CAAA;AAED;;;GAGG;AACH,MAAM,UAAU,gBAAgB;IAC9B,OAAO,UAAU,CAAC,GAAG,CAAC,CAAA;AACxB,CAAC;AAED,MAAM,UAAU,GAAG;IACjB,EAAE,EAAE;QACF,KAAK,EAAE,8BAA8B;KACtC;IACD,EAAE,EAAE;QACF,KAAK,EAAE,oCAAoC;KAC5C;CACmB,CAAA"}
|
|
@@ -47,6 +47,19 @@ export interface BaseTabsProps<Key extends string> extends WithColorScheme, With
|
|
|
47
47
|
* @default false
|
|
48
48
|
*/
|
|
49
49
|
equallySized?: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* The appearance of Tabs.
|
|
52
|
+
*
|
|
53
|
+
* @default 'tabs'
|
|
54
|
+
*/
|
|
55
|
+
appearance?: 'tabs' | 'toggles';
|
|
56
|
+
/**
|
|
57
|
+
* Allows the use of the tabs component with other elements in the middle of its UI.
|
|
58
|
+
* @param tabSelector the UI for changing the current tab.
|
|
59
|
+
* @param content the content of the selected tab.
|
|
60
|
+
* @returns the customized UI.
|
|
61
|
+
*/
|
|
62
|
+
customRenderer?: (tabSelector: React.ReactElement, content: React.ReactElement) => React.ReactNode;
|
|
50
63
|
}
|
|
51
64
|
export type TabsProps<Key extends string> = Omit<React.JSX.IntrinsicElements['div'], 'onChange' | 'children'> & BaseTabsProps<Key>;
|
|
52
65
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,MAAM,WAAW,GAAG,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM;IAC9C;;OAEG;IACH,GAAG,EAAE,GAAG,CAAC;IACT;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,aAAa,CAAC,GAAG,SAAS,MAAM,CAAE,SAAQ,eAAe,EAAE,gBAAgB;IAC1F;;OAEG;IACH,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IAChC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,MAAM,WAAW,GAAG,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM;IAC9C;;OAEG;IACH,GAAG,EAAE,GAAG,CAAC;IACT;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,aAAa,CAAC,GAAG,SAAS,MAAM,CAAE,SAAQ,eAAe,EAAE,gBAAgB;IAC1F;;OAEG;IACH,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,GAAG,CAAC,CAAC;IAChC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC;;;;;OAKG;IACH,cAAc,CAAC,EAAE,CAAC,WAAW,EAAE,KAAK,CAAC,YAAY,EAAE,OAAO,EAAE,KAAK,CAAC,YAAY,KAAK,KAAK,CAAC,SAAS,CAAC;CACpG;AAED,MAAM,MAAM,SAAS,CAAC,GAAG,SAAS,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,GAAG,aAAa,CAAC,GAAG,CAAC,CAAA"}
|
|
@@ -19,6 +19,16 @@ export interface BaseTooltipProps extends Omit<BaseOverlayProps<'div'>, 'tag' |
|
|
|
19
19
|
* @default true
|
|
20
20
|
*/
|
|
21
21
|
compact?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* The max-width of the tooltip. Defaults to 250px.
|
|
24
|
+
*/
|
|
25
|
+
maxWidth?: string;
|
|
26
|
+
/**
|
|
27
|
+
* A space between the tooltip and the element who triggered it.
|
|
28
|
+
*
|
|
29
|
+
* @default '6px'
|
|
30
|
+
*/
|
|
31
|
+
margin?: string;
|
|
22
32
|
/**
|
|
23
33
|
* Whether or not to disable the tooltip, i.e. not show it.
|
|
24
34
|
*
|
|
@@ -40,5 +50,5 @@ export type TooltipProps = Omit<React.JSX.IntrinsicElements['div'], 'content'> &
|
|
|
40
50
|
* </Tooltip>
|
|
41
51
|
* ```
|
|
42
52
|
*/
|
|
43
|
-
export declare const Tooltip: ({ tooltipId, children, showArrow, compact, attributes, colorScheme, colorPalette, disabled, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
|
|
53
|
+
export declare const Tooltip: ({ tooltipId, children, showArrow, compact, attributes, colorScheme, colorPalette, disabled, maxWidth, margin, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
|
|
44
54
|
//# sourceMappingURL=Tooltip.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,MAAM,WAAW,gBAAiB,SAChC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,WAAW,CAAC,EAAE,gBAAgB,EAAE,eAAe;IACvG;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,gBAAgB,CAAA;AAEjG;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,MAAM,WAAW,gBAAiB,SAChC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,WAAW,CAAC,EAAE,gBAAgB,EAAE,eAAe;IACvG;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,gBAAgB,CAAA;AAEjG;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,OAAO,GAAI,0HAGrB,YAAY,4CAoBd,CAAA"}
|
|
@@ -15,11 +15,11 @@ import { Overlay } from './Overlay/index.js';
|
|
|
15
15
|
* </Tooltip>
|
|
16
16
|
* ```
|
|
17
17
|
*/
|
|
18
|
-
export const Tooltip = ({ tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, disabled, ...props }) => {
|
|
18
|
+
export const Tooltip = ({ tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, disabled, maxWidth = '250px', margin = '6px', ...props }) => {
|
|
19
19
|
const id = useRef(tooltipId || `${Math.random()}`);
|
|
20
20
|
return disabled ? children : (_jsx(Overlay, { attributes: {
|
|
21
21
|
className: listToClass([attributes?.className, showArrow && 'with-arrow', compact && 'compact']),
|
|
22
|
-
style: { margin: '
|
|
22
|
+
style: { margin, maxWidth, lineHeight: typeof props.content === 'string' ? 'normal' : undefined, ...attributes?.style },
|
|
23
23
|
role: 'tooltip',
|
|
24
24
|
id: id.current,
|
|
25
25
|
'data-citric': 'tooltip',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AA2CnC;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,SAAS,EAAE,QAAQ,EAAE,SAAS,GAAG,IAAI,EAAE,OAAO,GAAG,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,GAAG,OAAO,EAC1H,MAAM,GAAG,KAAK,EAAE,GAAG,KAAK,EACX,EAAE,EAAE;IACjB,MAAM,EAAE,GAAG,MAAM,CAAC,SAAS,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA;IAClD,OAAO,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC3B,KAAC,OAAO,IACN,UAAU,EAAE;YACV,SAAS,EAAE,WAAW,CAAC,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,IAAI,YAAY,EAAE,OAAO,IAAI,SAAS,CAAC,CAAC;YAChG,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAAE,GAAG,UAAU,EAAE,KAAK,EAAE;YACvH,IAAI,EAAE,SAAS;YACf,EAAE,EAAE,EAAE,CAAC,OAAO;YACd,aAAa,EAAE,SAAS;YACxB,mBAAmB,EAAE,WAAW;YAChC,oBAAoB,EAAE,YAAY;YAClC,GAAG,UAAU;SACd,EACD,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,kBAAkB,EAAE,EAAE,CAAC,OAAO,CAAC,KAC9D,KAAK,YAER,QAAQ,GACD,CACX,CAAA;AACH,CAAC,CAAA"}
|
package/dist/overlay.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGrD,MAAM,MAAM,gBAAgB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAElE,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,MAAM,OAAO;IACrD;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;;OAKG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,MAAM,EAAE,KAAK,GAAG,WAAW,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAChC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrD;;OAEG;IACH,UAAU,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG,kBAAkB,GAAG;QAAE,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;CAClF;
|
|
1
|
+
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGrD,MAAM,MAAM,gBAAgB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAElE,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,MAAM,OAAO;IACrD;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;;OAKG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;;OAIG;IACH,MAAM,EAAE,KAAK,GAAG,WAAW,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAChC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrD;;OAEG;IACH,UAAU,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG,kBAAkB,GAAG;QAAE,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;CAClF;AAiND;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,OAAO,GAAG,KAAK,EACzD,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,SAAqB,EAAE,QAAgB,EAAE,SAAoB,EAAE,UAAU,EAAE,EAAE,cAAc,CAAC,CAAC,CAAC;IA+CpH;;OAEG;;IAEH;;;OAGG;;IAEH;;OAEG;;EAKN"}
|
package/dist/overlay.js
CHANGED
|
@@ -151,7 +151,9 @@ function setElementAttributes(element, attributes, ignore = []) {
|
|
|
151
151
|
function getClosestScrollable(element, limit = document.body) {
|
|
152
152
|
if (element === limit)
|
|
153
153
|
return;
|
|
154
|
-
|
|
154
|
+
const hasScrollableContent = element.scrollHeight > element.clientHeight;
|
|
155
|
+
const scrollable = hasScrollableContent && ['auto', 'scroll'].includes(getComputedStyle(element).overflowY);
|
|
156
|
+
return scrollable ? element : getClosestScrollable(element.parentElement, limit);
|
|
155
157
|
}
|
|
156
158
|
function isElementVisible(element, scrollable) {
|
|
157
159
|
const elementRect = element.getBoundingClientRect();
|
package/dist/overlay.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay.js","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"overlay.js","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"time.d.ts","sourceRoot":"","sources":["../../src/utils/time.ts"],"names":[],"mappings":"AAAA,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,iBAI/B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"time.js","sourceRoot":"","sources":["../../src/utils/time.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,KAAK,CAAC,EAAU;IAC9B,OAAO,IAAI,OAAO,CAAO,OAAO,CAAC,EAAE;QACjC,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAA;IACzB,CAAC,CAAC,CAAA;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -2,6 +2,7 @@ import { useEffect, useRef } from 'react'
|
|
|
2
2
|
import { showOverlay } from '../../overlay'
|
|
3
3
|
import { HTMLTag } from '../../types'
|
|
4
4
|
import { focusFirstChild } from '../../utils/acessibility'
|
|
5
|
+
import { delay } from '../../utils/time'
|
|
5
6
|
import { OverlayProvider } from './context'
|
|
6
7
|
import { OverlayController, OverlayProps } from './types'
|
|
7
8
|
export { useOverlayController } from './context'
|
|
@@ -16,11 +17,7 @@ const arbitraryRenderTime = 20
|
|
|
16
17
|
*
|
|
17
18
|
* TODO: update position when the size changes. Currently, the top position seems out of place whenever the height changes. The same is
|
|
18
19
|
* probably true for the left position if the width changes.
|
|
19
|
-
* TODO:
|
|
20
|
-
* TODO: reposition the overlay when it's under a scrollable element other then the body and this element is scrolled.
|
|
21
|
-
* TODO: close the overlay when it's under a scrollable element other then the body and the element that triggered the tooltip becomes
|
|
22
|
-
* hidden by the scroll.
|
|
23
|
-
* TODO: use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
20
|
+
* TODO (minor): use React Portal to implement overlays. The current implementation will lose every React context in the tree.
|
|
24
21
|
*/
|
|
25
22
|
|
|
26
23
|
/**
|
|
@@ -51,6 +48,8 @@ export function Overlay<T extends keyof HTMLTag>({
|
|
|
51
48
|
attributes,
|
|
52
49
|
onRenderChild,
|
|
53
50
|
autoFocusBehavior = 'keyboard',
|
|
51
|
+
openDelayMS,
|
|
52
|
+
closeDelayMS,
|
|
54
53
|
...props
|
|
55
54
|
}: OverlayProps<T>,
|
|
56
55
|
) {
|
|
@@ -82,8 +81,12 @@ export function Overlay<T extends keyof HTMLTag>({
|
|
|
82
81
|
|
|
83
82
|
async function show(event: Event) {
|
|
84
83
|
if (visible) return
|
|
85
|
-
visible = true
|
|
86
84
|
const target = getTarget()
|
|
85
|
+
if (openDelayMS && triggerOn === 'hover') {
|
|
86
|
+
await delay(openDelayMS)
|
|
87
|
+
if (!target?.matches(':hover')) return
|
|
88
|
+
}
|
|
89
|
+
visible = true
|
|
87
90
|
if (!target) return
|
|
88
91
|
const { overlay, hide: hideFn } = showOverlay({
|
|
89
92
|
tag: dynamic.current.tag,
|
|
@@ -132,7 +135,10 @@ export function Overlay<T extends keyof HTMLTag>({
|
|
|
132
135
|
}
|
|
133
136
|
}
|
|
134
137
|
|
|
135
|
-
controller.current.close = async () => {
|
|
138
|
+
controller.current.close = async (immediately = false) => {
|
|
139
|
+
if (!immediately && typeof closeDelayMS === 'number') {
|
|
140
|
+
await delay(closeDelayMS)
|
|
141
|
+
}
|
|
136
142
|
visible = false
|
|
137
143
|
if (hideOnClickOutside) document.removeEventListener('click', hideOnClickOutside)
|
|
138
144
|
if (hideOnEsc) document.removeEventListener('keydown', hideOnEsc)
|
|
@@ -142,14 +148,14 @@ export function Overlay<T extends keyof HTMLTag>({
|
|
|
142
148
|
|
|
143
149
|
if (triggerOn === 'hover') {
|
|
144
150
|
getTarget()?.addEventListener('mouseenter', show)
|
|
145
|
-
getTarget()?.addEventListener('mouseleave', controller.current.close)
|
|
151
|
+
getTarget()?.addEventListener('mouseleave', () => controller.current.close())
|
|
146
152
|
getTarget()?.addEventListener('focus', show)
|
|
147
|
-
getTarget()?.addEventListener('blur', controller.current.close)
|
|
153
|
+
getTarget()?.addEventListener('blur', () => controller.current.close())
|
|
148
154
|
return () => {
|
|
149
155
|
getTarget()?.removeEventListener('mouseenter', show)
|
|
150
|
-
getTarget()?.removeEventListener('mouseleave', controller.current.close)
|
|
156
|
+
getTarget()?.removeEventListener('mouseleave', () => controller.current.close())
|
|
151
157
|
getTarget()?.removeEventListener('focus', show)
|
|
152
|
-
getTarget()?.removeEventListener('blur', controller.current.close)
|
|
158
|
+
getTarget()?.removeEventListener('blur', () => controller.current.close())
|
|
153
159
|
}
|
|
154
160
|
}
|
|
155
161
|
|
|
@@ -163,5 +169,9 @@ export function Overlay<T extends keyof HTMLTag>({
|
|
|
163
169
|
}
|
|
164
170
|
}, [wrapper.current, triggerOn])
|
|
165
171
|
|
|
172
|
+
useEffect(() => () => {
|
|
173
|
+
controller.current?.close(true)
|
|
174
|
+
}, [])
|
|
175
|
+
|
|
166
176
|
return <div ref={wrapper} {...props}>{children}</div>
|
|
167
177
|
}
|
|
@@ -15,21 +15,21 @@ export interface BaseOverlayProps<T extends keyof HTMLTag> extends Omit<OverlayO
|
|
|
15
15
|
*/
|
|
16
16
|
triggerOn?: TriggerOn,
|
|
17
17
|
/**
|
|
18
|
-
* TODO: not implemented yet.
|
|
19
|
-
*
|
|
20
18
|
* Only valid if `triggerOn` is "hover".
|
|
21
19
|
*
|
|
22
|
-
*
|
|
23
|
-
* tooltip. This sets a delay for the overlay to disappear, giving it time for the user to hover the overlay or gocus one of its children,
|
|
24
|
-
* which will prevent it from closing.
|
|
20
|
+
* Waits the given amount of milliseconds before closing the overlay.
|
|
25
21
|
*
|
|
26
|
-
*
|
|
22
|
+
* @default 0
|
|
23
|
+
*/
|
|
24
|
+
closeDelayMS?: number,
|
|
25
|
+
/**
|
|
26
|
+
* Only valid if `triggerOn` is "hover".
|
|
27
27
|
*
|
|
28
|
-
*
|
|
28
|
+
* Waits the given amount of milliseconds before opening the overlay.
|
|
29
29
|
*
|
|
30
|
-
* @default
|
|
30
|
+
* @default 0
|
|
31
31
|
*/
|
|
32
|
-
|
|
32
|
+
openDelayMS?: number,
|
|
33
33
|
/**
|
|
34
34
|
* TODO: not implemented yet.
|
|
35
35
|
*
|
|
@@ -66,5 +66,10 @@ export interface BaseOverlayProps<T extends keyof HTMLTag> extends Omit<OverlayO
|
|
|
66
66
|
export type OverlayProps<T extends keyof HTMLTag> = Omit<React.JSX.IntrinsicElements['div'], 'content'> & BaseOverlayProps<T>
|
|
67
67
|
|
|
68
68
|
export interface OverlayController {
|
|
69
|
-
|
|
69
|
+
/**
|
|
70
|
+
* Closes the tooltip.
|
|
71
|
+
* @param immediately when true, ignores the closeDelayMS parameter.
|
|
72
|
+
* @returns a promise that resolves when the overlay is removed from the DOM.
|
|
73
|
+
*/
|
|
74
|
+
close: (immediately?: boolean) => Promise<void>,
|
|
70
75
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useMemo } from 'react'
|
|
2
2
|
import { withRef } from '../utils/react'
|
|
3
3
|
import { BaseTableProps, SortingDirection, Table, TableProps, Th, Tr } from './Table'
|
|
4
4
|
|
|
@@ -65,8 +65,6 @@ interface ExtraSmartTableProps<T extends Record<string, any>> {
|
|
|
65
65
|
*
|
|
66
66
|
* The extra row is, effectively, an accordion. The content of this accordion is defined by whatever this function returns.
|
|
67
67
|
*
|
|
68
|
-
* Attention: this function is treated as a React Component, i.e. you can use React hooks inside of it.
|
|
69
|
-
*
|
|
70
68
|
* @param item the current item.
|
|
71
69
|
* @returns the React Node to render.
|
|
72
70
|
*/
|
|
@@ -181,7 +179,7 @@ export const SmartTable = withRef(
|
|
|
181
179
|
const rows = useMemo(
|
|
182
180
|
() => data.map((item, index) => {
|
|
183
181
|
const key = keygen ? keygen(item) : index
|
|
184
|
-
const accordionContent = renderAccordion
|
|
182
|
+
const accordionContent = renderAccordion?.(item)
|
|
185
183
|
const row = (
|
|
186
184
|
<Tr
|
|
187
185
|
key={key}
|
|
@@ -28,7 +28,9 @@ const ctx = createContext<TabController<any> | undefined>(undefined)
|
|
|
28
28
|
* ```
|
|
29
29
|
*/
|
|
30
30
|
export const Tabs = withRef(
|
|
31
|
-
function Tabs<Key extends string>(
|
|
31
|
+
function Tabs<Key extends string>(
|
|
32
|
+
{ tabs, value, equallySized, onChange, controller: ctrl, appearance, customRenderer, className, ...props }: TabsProps<Key>,
|
|
33
|
+
) {
|
|
32
34
|
const controller = useMemo(() => ctrl ?? new TabController<Key>(tabs.map(t => t.key), value || tabs[0]?.key), [])
|
|
33
35
|
const t = useTranslate(dictionary)
|
|
34
36
|
const [selectedIndex, setSelectedIndex] = useState(findSelectedIndex(tabs, controller.getValue()))
|
|
@@ -42,27 +44,44 @@ export const Tabs = withRef(
|
|
|
42
44
|
onChange?.(v)
|
|
43
45
|
}), [tabs])
|
|
44
46
|
|
|
45
|
-
const
|
|
46
|
-
() =>
|
|
47
|
-
<
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
47
|
+
const tabSelector = useMemo(
|
|
48
|
+
() => (
|
|
49
|
+
<nav className="tab-selector">
|
|
50
|
+
{tabs.map(({ key, label, disabled }, index) => (
|
|
51
|
+
<label key={key}>
|
|
52
|
+
<input
|
|
53
|
+
type="radio"
|
|
54
|
+
role="tab"
|
|
55
|
+
checked={index === selectedIndex}
|
|
56
|
+
onChange={() => controller.setValue(key)} disabled={disabled}
|
|
57
|
+
/>
|
|
58
|
+
{label || key}
|
|
59
|
+
</label>
|
|
60
|
+
))}
|
|
61
|
+
</nav>
|
|
62
|
+
),
|
|
52
63
|
[tabs, selectedIndex],
|
|
53
64
|
)
|
|
54
65
|
|
|
66
|
+
const content = useMemo(() => (
|
|
67
|
+
<section className="tab-content">
|
|
68
|
+
<ErrorBoundary key={selectedIndex} message={t.error}>
|
|
69
|
+
<Suspense fallback={<Center style={{ padding: '20px' }}><ProgressCircular /></Center>}>
|
|
70
|
+
{selectedIndex === -1 ? null : tabs[selectedIndex]?.content}
|
|
71
|
+
</Suspense>
|
|
72
|
+
</ErrorBoundary>
|
|
73
|
+
</section>
|
|
74
|
+
), [selectedIndex, t])
|
|
75
|
+
|
|
55
76
|
return (
|
|
56
77
|
<ctx.Provider value={controller}>
|
|
57
|
-
<CitricComponent
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
</ErrorBoundary>
|
|
65
|
-
</section>
|
|
78
|
+
<CitricComponent
|
|
79
|
+
tag="div"
|
|
80
|
+
component="tabs"
|
|
81
|
+
className={listToClass([className, equallySized && 'equally-sized', appearance])}
|
|
82
|
+
{...props}
|
|
83
|
+
>
|
|
84
|
+
{customRenderer ? customRenderer(tabSelector, content) : <>{tabSelector}{content}</>}
|
|
66
85
|
</CitricComponent>
|
|
67
86
|
</ctx.Provider>
|
|
68
87
|
)
|
|
@@ -49,6 +49,19 @@ export interface BaseTabsProps<Key extends string> extends WithColorScheme, With
|
|
|
49
49
|
* @default false
|
|
50
50
|
*/
|
|
51
51
|
equallySized?: boolean,
|
|
52
|
+
/**
|
|
53
|
+
* The appearance of Tabs.
|
|
54
|
+
*
|
|
55
|
+
* @default 'tabs'
|
|
56
|
+
*/
|
|
57
|
+
appearance?: 'tabs' | 'toggles',
|
|
58
|
+
/**
|
|
59
|
+
* Allows the use of the tabs component with other elements in the middle of its UI.
|
|
60
|
+
* @param tabSelector the UI for changing the current tab.
|
|
61
|
+
* @param content the content of the selected tab.
|
|
62
|
+
* @returns the customized UI.
|
|
63
|
+
*/
|
|
64
|
+
customRenderer?: (tabSelector: React.ReactElement, content: React.ReactElement) => React.ReactNode,
|
|
52
65
|
}
|
|
53
66
|
|
|
54
67
|
export type TabsProps<Key extends string> = Omit<React.JSX.IntrinsicElements['div'], 'onChange' | 'children'> & BaseTabsProps<Key>
|
|
@@ -24,6 +24,16 @@ export interface BaseTooltipProps extends
|
|
|
24
24
|
* @default true
|
|
25
25
|
*/
|
|
26
26
|
compact?: boolean,
|
|
27
|
+
/**
|
|
28
|
+
* The max-width of the tooltip. Defaults to 250px.
|
|
29
|
+
*/
|
|
30
|
+
maxWidth?: string,
|
|
31
|
+
/**
|
|
32
|
+
* A space between the tooltip and the element who triggered it.
|
|
33
|
+
*
|
|
34
|
+
* @default '6px'
|
|
35
|
+
*/
|
|
36
|
+
margin?: string,
|
|
27
37
|
/**
|
|
28
38
|
* Whether or not to disable the tooltip, i.e. not show it.
|
|
29
39
|
*
|
|
@@ -47,15 +57,16 @@ export type TooltipProps = Omit<React.JSX.IntrinsicElements['div'], 'content'> &
|
|
|
47
57
|
* </Tooltip>
|
|
48
58
|
* ```
|
|
49
59
|
*/
|
|
50
|
-
export const Tooltip = (
|
|
51
|
-
|
|
52
|
-
|
|
60
|
+
export const Tooltip = ({
|
|
61
|
+
tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, disabled, maxWidth = '250px',
|
|
62
|
+
margin = '6px', ...props
|
|
63
|
+
}: TooltipProps) => {
|
|
53
64
|
const id = useRef(tooltipId || `${Math.random()}`)
|
|
54
65
|
return disabled ? children : (
|
|
55
66
|
<Overlay
|
|
56
67
|
attributes={{
|
|
57
68
|
className: listToClass([attributes?.className, showArrow && 'with-arrow', compact && 'compact']),
|
|
58
|
-
style: { margin: '
|
|
69
|
+
style: { margin, maxWidth, lineHeight: typeof props.content === 'string' ? 'normal' : undefined, ...attributes?.style },
|
|
59
70
|
role: 'tooltip',
|
|
60
71
|
id: id.current,
|
|
61
72
|
'data-citric': 'tooltip',
|
package/src/overlay.ts
CHANGED
|
@@ -227,7 +227,9 @@ function setElementAttributes(element: HTMLElement, attributes: Record<string, a
|
|
|
227
227
|
|
|
228
228
|
function getClosestScrollable(element: HTMLElement, limit: HTMLElement = document.body): HTMLElement | null | undefined {
|
|
229
229
|
if (element === limit) return
|
|
230
|
-
|
|
230
|
+
const hasScrollableContent = element.scrollHeight > element.clientHeight
|
|
231
|
+
const scrollable = hasScrollableContent && ['auto', 'scroll'].includes(getComputedStyle(element).overflowY)
|
|
232
|
+
return scrollable ? element : getClosestScrollable(element.parentElement!, limit)
|
|
231
233
|
}
|
|
232
234
|
|
|
233
235
|
function isElementVisible(element: HTMLElement, scrollable: HTMLElement) {
|