Skip to content

Commit f13e5b4

Browse files
jfox-boxjfox-box
committed
fix: Additional fixes
1 parent 8ae591b commit f13e5b4

File tree

9 files changed

+59
-24
lines changed

9 files changed

+59
-24
lines changed

‎src/components/button-group/ButtonGroup.scss‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,8 @@
4343

4444
&,
4545
& > .bdl-targeted-click-through {
46-
> .btn {
46+
> .btn,
47+
> * > .btn {
4748
margin: 5px 0 5px -1px;
4849
border-radius: 0;
4950

@@ -64,25 +65,29 @@
6465
}
6566
}
6667

67-
> .btn:first-child {
68+
> .btn:first-child,
69+
> *:first-child > .btn {
6870
border-top-left-radius: $bdl-border-radius-size-med;
6971
border-bottom-left-radius: $bdl-border-radius-size-med;
7072
}
7173

72-
> .btn:last-child {
74+
> .btn:last-child,
75+
> *:last-child > .btn {
7376
border-top-right-radius: $bdl-border-radius-size-med;
7477
border-bottom-right-radius: $bdl-border-radius-size-med;
7578
}
7679

77-
> .btn.is-selected {
80+
> .btn.is-selected,
81+
> * > .btn.is-selected {
7882
z-index: 2; /* place on top of siblings */
7983
color: $bdl-gray-80;
8084
background-color: $bdl-gray-10;
8185
border-color: $bdl-gray-65;
8286
box-shadow: none;
8387
}
8488

85-
> .btn:focus {
89+
> .btn:focus,
90+
> * > .btn:focus {
8691
z-index: 3; /* place on top of all other buttons for accessibility */
8792
}
8893
}
@@ -98,7 +103,7 @@
98103
border: 1px solid $bdl-gray-30;
99104
box-shadow: none;
100105
cursor: default;
101-
opacity: .4;
106+
opacity: 0.4;
102107
}
103108

104109
> .btn-primary {

‎src/components/checkbox/Checkbox.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,8 +75,10 @@
7575
.checkbox-tooltip-wrapper {
7676
display: inline-flex;
7777
vertical-align: text-bottom;
78+
line-height: 0.1; // This keeps the tooltip wrapper height consistent with the child element
7879

79-
> .info-tooltip {
80+
> .info-tooltip,
81+
> * > .info-tooltip {
8082
position: relative;
8183
display: inline-block;
8284
flex: none;

‎src/components/dropdown-menu/DropdownMenu.js‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -264,17 +264,28 @@ class DropdownMenu extends React.Component<Props, State> {
264264
return (
265265
<TetherComponent
266266
attachment={tetherAttachment || attachment}
267-
bodyElement={bodyEl}
268267
className={classNames({ 'bdl-DropdownMenu--responsive': isResponsive }, className)}
269268
classPrefix="dropdown-menu"
270269
constraints={constraints}
271270
enabled={isOpen}
271+
renderElementTo={bodyEl}
272272
targetAttachment={tetherTargetAttachment || targetAttachment}
273-
renderTarget={(ref: HTMLDivElement) => (
274-
<span ref={ref}>{React.cloneElement(menuButton, menuButtonProps)}</span>
273+
renderTarget={ref => (
274+
<span
275+
ref={node => {
276+
if (!node) {
277+
ref.current = null;
278+
return;
279+
}
280+
const first = node.querySelector('*') || node.firstElementChild;
281+
ref.current = first;
282+
}}
283+
>
284+
{React.cloneElement(menuButton, menuButtonProps)}
285+
</span>
275286
)}
276-
renderElement={(ref: HTMLDivElement) => {
277-
return isOpen ? <span ref={ref}>{isOpen && React.cloneElement(menu, menuProps)}</span> : null;
287+
renderElement={ref => {
288+
return isOpen ? <span ref={ref}>{React.cloneElement(menu, menuProps)}</span> : null;
278289
}}
279290
/>
280291
);

‎src/components/dropdown-menu/__tests__/DropdownMenu.test.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ describe('components/dropdown-menu/DropdownMenu', () => {
140140
const tetherComponent = findTetherComponent(wrapper);
141141
expect(tetherComponent.length).toBe(1);
142142
expect(tetherComponent.prop('attachment')).toEqual('top left');
143-
expect(tetherComponent.prop('bodyElement')).toEqual(document.body);
143+
expect(tetherComponent.prop('renderElementTo')).toEqual(document.body);
144144
expect(tetherComponent.prop('classPrefix')).toEqual('dropdown-menu');
145145
expect(tetherComponent.prop('targetAttachment')).toEqual('bottom left');
146146
expect(tetherComponent.prop('constraints')).toEqual([]);
@@ -153,7 +153,7 @@ describe('components/dropdown-menu/DropdownMenu', () => {
153153
const tetherComponent = findTetherComponent(wrapper);
154154
expect(tetherComponent.length).toBe(1);
155155
expect(tetherComponent.prop('attachment')).toEqual('top left');
156-
expect(tetherComponent.prop('bodyElement')).toEqual(document.body);
156+
expect(tetherComponent.prop('renderElementTo')).toEqual(document.body);
157157
expect(tetherComponent.prop('classPrefix')).toEqual('dropdown-menu');
158158
expect(tetherComponent.prop('targetAttachment')).toEqual('bottom left');
159159
expect(tetherComponent.prop('constraints')).toEqual([]);
@@ -176,7 +176,7 @@ describe('components/dropdown-menu/DropdownMenu', () => {
176176
const tetherComponent = findTetherComponent(wrapper);
177177
expect(tetherComponent.length).toBe(1);
178178
expect(tetherComponent.prop('attachment')).toEqual('top left');
179-
expect(tetherComponent.prop('bodyElement')).toEqual(bodyEl);
179+
expect(tetherComponent.prop('renderElementTo')).toEqual(bodyEl);
180180
expect(tetherComponent.prop('classPrefix')).toEqual('dropdown-menu');
181181
expect(tetherComponent.prop('targetAttachment')).toEqual('bottom left');
182182
expect(tetherComponent.prop('constraints')).toEqual([]);

‎src/components/flyout/Flyout.js‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -490,7 +490,20 @@ class Flyout extends React.Component<Props, State> {
490490
return (
491491
<TetherComponent
492492
{...tetherProps}
493-
renderTarget={ref => <span ref={ref}>{React.cloneElement(overlayButton, overlayButtonProps)}</span>}
493+
renderTarget={ref => (
494+
<span
495+
ref={node => {
496+
if (!node) {
497+
ref.current = null;
498+
return;
499+
}
500+
const first = node.querySelector('*') || node.firstElementChild;
501+
ref.current = first;
502+
}}
503+
>
504+
{React.cloneElement(overlayButton, overlayButtonProps)}
505+
</span>
506+
)}
494507
renderElement={ref => {
495508
return isVisible ? (
496509
<span ref={ref}>

‎src/components/radar/RadarAnimation.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ const positions = {
5959

6060
export interface RadarAnimationProps {
6161
/** A React element to put the radar on */
62-
children: React.ReactNode;
62+
children: React.ReactElement;
6363
/** A CSS class for the radar */
6464
className?: string;
6565
/** Whether to constrain the radar to the element's scroll parent. Defaults to `false` */

‎src/elements/content-sidebar/activity-feed/task-new/Task.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -326,7 +326,7 @@ class Task extends React.Component<Props, State> {
326326
</span>
327327
)}
328328
renderElement={ref => {
329-
isConfirmingDelete ? (
329+
return isConfirmingDelete ? (
330330
<span ref={ref}>
331331
<DeleteConfirmation
332332
data-resin-component={ACTIVITY_TARGETS.TASK_OPTIONS}

‎src/features/pagination/__tests__/__snapshots__/OffsetBasedPagination.test.js.snap‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
3737
>
3838
<d
3939
attachment="top right"
40-
bodyElement={<body />}
4140
className="bdl-Pagination-dropdown"
4241
classPrefix="dropdown-menu"
4342
constraints={
@@ -50,6 +49,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
5049
}
5150
enabled={false}
5251
renderElement={[Function]}
52+
renderElementTo={<body />}
5353
renderTarget={[Function]}
5454
targetAttachment="bottom right"
5555
>
@@ -307,7 +307,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
307307
>
308308
<d
309309
attachment="top right"
310-
bodyElement={<body />}
311310
className="bdl-Pagination-dropdown"
312311
classPrefix="dropdown-menu"
313312
constraints={
@@ -320,6 +319,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
320319
}
321320
enabled={false}
322321
renderElement={[Function]}
322+
renderElementTo={<body />}
323323
renderTarget={[Function]}
324324
targetAttachment="bottom right"
325325
>
@@ -577,7 +577,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
577577
>
578578
<d
579579
attachment="top right"
580-
bodyElement={<body />}
581580
className="bdl-Pagination-dropdown"
582581
classPrefix="dropdown-menu"
583582
constraints={
@@ -590,6 +589,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
590589
}
591590
enabled={false}
592591
renderElement={[Function]}
592+
renderElementTo={<body />}
593593
renderTarget={[Function]}
594594
targetAttachment="bottom right"
595595
>
@@ -847,7 +847,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
847847
>
848848
<d
849849
attachment="top right"
850-
bodyElement={<body />}
851850
className="bdl-Pagination-dropdown"
852851
classPrefix="dropdown-menu"
853852
constraints={
@@ -860,6 +859,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
860859
}
861860
enabled={false}
862861
renderElement={[Function]}
862+
renderElementTo={<body />}
863863
renderTarget={[Function]}
864864
targetAttachment="bottom right"
865865
>
@@ -1159,7 +1159,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
11591159
>
11601160
<d
11611161
attachment="top right"
1162-
bodyElement={<body />}
11631162
className="bdl-Pagination-dropdown"
11641163
classPrefix="dropdown-menu"
11651164
constraints={
@@ -1172,6 +1171,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
11721171
}
11731172
enabled={false}
11741173
renderElement={[Function]}
1174+
renderElementTo={<body />}
11751175
renderTarget={[Function]}
11761176
targetAttachment="bottom right"
11771177
>
@@ -1471,7 +1471,6 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
14711471
>
14721472
<d
14731473
attachment="top right"
1474-
bodyElement={<body />}
14751474
className="bdl-Pagination-dropdown"
14761475
classPrefix="dropdown-menu"
14771476
constraints={
@@ -1484,6 +1483,7 @@ exports[`elements/Pagination/OffsetBasedPagination should render properly with o
14841483
}
14851484
enabled={false}
14861485
renderElement={[Function]}
1486+
renderElementTo={<body />}
14871487
renderTarget={[Function]}
14881488
targetAttachment="bottom right"
14891489
>

‎src/features/unified-share-modal/UnifiedShareModal.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -201,6 +201,10 @@
201201
white-space: nowrap;
202202
}
203203
}
204+
205+
> span {
206+
width: 100%; // This fixes a width issue with Tooltip wrapper
207+
}
204208
}
205209

206210
.shared-link-field-row {

0 commit comments

Comments
 (0)