Skip to content

Commit 335ff38

Browse files
bryceosterhausbryceosterhaus
committed
fix(drop-down): use dom-align instead of metal-position
1 parent 69246b6 commit 335ff38

File tree

19 files changed

+251
-106
lines changed

19 files changed

+251
-106
lines changed

‎custom-types/dom-align/index.d.ts

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
/**
2+
* © 2019 Liferay, Inc. <https://liferay.com>
3+
*
4+
* SPDX-License-Identifier: BSD-3-Clause
5+
*/
6+
7+
interface IConfig {
8+
points: readonly [string, string];
9+
offset: readonly [number, number];
10+
targetOffset: readonly [string, string];
11+
overflow: {adjustX: boolean; adjustY: boolean};
12+
}
13+
14+
interface IConfigOptional {
15+
points?: readonly [string, string];
16+
offset?: readonly [number, number];
17+
targetOffset?: readonly [string, string];
18+
overflow?: {adjustX: boolean; adjustY: boolean};
19+
}
20+
21+
declare function doAlign(
22+
sourceNode: HTMLElement,
23+
targetNode: HTMLElement,
24+
config?: IConfigOptional
25+
): IConfig;
26+
27+
declare module 'dom-align' {
28+
export = doAlign;
29+
}

‎custom-types/metal-position/index.d.ts

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎packages/clay-breadcrumb/src/__tests__/__snapshots__/index.tsx.snap

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ exports[`ClayBreadcrumb calls callback when an item is clicked 1`] = `
3838
<button
3939
class="dropdown-toggle breadcrumb-link btn btn-unstyled"
4040
data-testid="breadcrumbDropdownTrigger"
41+
style=""
4142
type="button"
4243
>
4344
<svg
@@ -116,6 +117,7 @@ exports[`ClayBreadcrumb renders 1`] = `
116117
<button
117118
class="dropdown-toggle breadcrumb-link btn btn-unstyled"
118119
data-testid="breadcrumbDropdownTrigger"
120+
style=""
119121
type="button"
120122
>
121123
<svg
@@ -195,6 +197,7 @@ exports[`ClayBreadcrumb renders with properties passed by \`ellipsisProps\` 1`]
195197
<button
196198
class="dropdown-toggle breadcrumb-link btn btn-unstyled"
197199
data-testid="breadcrumbDropdownTrigger"
200+
style=""
198201
type="button"
199202
>
200203
<svg

‎packages/clay-color-picker/src/__tests__/__snapshots__/index.tsx.snap

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ exports[`Interactions opens custom color picker drop down when clicked 1`] = `
1616
</label>
1717
<div
1818
class="input-group clay-color"
19+
style=""
1920
>
2021
<div
2122
class="input-group-item input-group-item-shrink input-group-prepend"

‎packages/clay-date-picker/src/__tests__/__snapshots__/BasicRendering.tsx.snap

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ exports[`BasicRendering renders by default 1`] = `
88
>
99
<div
1010
class="input-group"
11+
style=""
1112
>
1213
<div
1314
class="input-group-item"
@@ -50,7 +51,7 @@ exports[`BasicRendering renders by default 1`] = `
5051
<div
5152
class="dropdown-menu date-picker-dropdown-menu"
5253
data-testid="dropdown"
53-
style="top: 0px; left: 0px;"
54+
style="left: -999px; top: -995px;"
5455
>
5556
<div
5657
class="date-picker-calendar"
@@ -536,6 +537,7 @@ exports[`BasicRendering renders date picker with dropdown open 1`] = `
536537
>
537538
<div
538539
class="input-group"
540+
style=""
539541
>
540542
<div
541543
class="input-group-item"
@@ -578,7 +580,7 @@ exports[`BasicRendering renders date picker with dropdown open 1`] = `
578580
<div
579581
class="dropdown-menu date-picker-dropdown-menu show"
580582
data-testid="dropdown"
581-
style="top: 0px; left: 0px;"
583+
style="left: -999px; top: -995px;"
582584
>
583585
<div
584586
class="date-picker-calendar"
@@ -1094,6 +1096,7 @@ exports[`BasicRendering renders date picker with time 1`] = `
10941096
>
10951097
<div
10961098
class="input-group"
1099+
style=""
10971100
>
10981101
<div
10991102
class="input-group-item"
@@ -1136,7 +1139,7 @@ exports[`BasicRendering renders date picker with time 1`] = `
11361139
<div
11371140
class="dropdown-menu date-picker-dropdown-menu show"
11381141
data-testid="dropdown"
1139-
style="top: 0px; left: 0px;"
1142+
style="left: -999px; top: -995px;"
11401143
>
11411144
<div
11421145
class="date-picker-calendar"
@@ -1762,6 +1765,7 @@ exports[`BasicRendering renders the date picker with years range 1`] = `
17621765
>
17631766
<div
17641767
class="input-group"
1768+
style=""
17651769
>
17661770
<div
17671771
class="input-group-item"
@@ -1804,7 +1808,7 @@ exports[`BasicRendering renders the date picker with years range 1`] = `
18041808
<div
18051809
class="dropdown-menu date-picker-dropdown-menu show"
18061810
data-testid="dropdown"
1807-
style="top: 0px; left: 0px;"
1811+
style="left: -999px; top: -995px;"
18081812
>
18091813
<div
18101814
class="date-picker-calendar"

‎packages/clay-date-picker/src/__tests__/__snapshots__/IncrementalInteractions.tsx.snap

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ exports[`IncrementalInteractions clicking a month on the selector should change
88
>
99
<div
1010
class="input-group"
11+
style=""
1112
>
1213
<div
1314
class="input-group-item"
@@ -51,7 +52,7 @@ exports[`IncrementalInteractions clicking a month on the selector should change
5152
<div
5253
class="dropdown-menu date-picker-dropdown-menu show"
5354
data-testid="dropdown"
54-
style="top: 0px; left: 0px;"
55+
style="left: -999px; top: -995px;"
5556
>
5657
<div
5758
class="date-picker-calendar"
@@ -536,6 +537,7 @@ exports[`IncrementalInteractions clicking on the date icon should close the drop
536537
>
537538
<div
538539
class="input-group"
540+
style=""
539541
>
540542
<div
541543
class="input-group-item"
@@ -579,7 +581,7 @@ exports[`IncrementalInteractions clicking on the date icon should close the drop
579581
<div
580582
class="dropdown-menu date-picker-dropdown-menu"
581583
data-testid="dropdown"
582-
style="top: 0px; left: 0px;"
584+
style="left: -999px; top: -995px;"
583585
>
584586
<div
585587
class="date-picker-calendar"
@@ -1065,6 +1067,7 @@ exports[`IncrementalInteractions clicking on the date icon should open the dropd
10651067
>
10661068
<div
10671069
class="input-group"
1070+
style=""
10681071
>
10691072
<div
10701073
class="input-group-item"
@@ -1108,7 +1111,7 @@ exports[`IncrementalInteractions clicking on the date icon should open the dropd
11081111
<div
11091112
class="dropdown-menu date-picker-dropdown-menu show"
11101113
data-testid="dropdown"
1111-
style="top: 0px; left: 0px;"
1114+
style="left: -999px; top: -995px;"
11121115
>
11131116
<div
11141117
class="date-picker-calendar"
@@ -1594,6 +1597,7 @@ exports[`IncrementalInteractions clicking on the dot button should select curren
15941597
>
15951598
<div
15961599
class="input-group"
1600+
style=""
15971601
>
15981602
<div
15991603
class="input-group-item"
@@ -1637,7 +1641,7 @@ exports[`IncrementalInteractions clicking on the dot button should select curren
16371641
<div
16381642
class="dropdown-menu date-picker-dropdown-menu show"
16391643
data-testid="dropdown"
1640-
style="top: 0px; left: 0px;"
1644+
style="left: -999px; top: -995px;"
16411645
>
16421646
<div
16431647
class="date-picker-calendar"
@@ -2123,6 +2127,7 @@ exports[`IncrementalInteractions clicking on the year selector should switch to
21232127
>
21242128
<div
21252129
class="input-group"
2130+
style=""
21262131
>
21272132
<div
21282133
class="input-group-item"
@@ -2166,7 +2171,7 @@ exports[`IncrementalInteractions clicking on the year selector should switch to
21662171
<div
21672172
class="dropdown-menu date-picker-dropdown-menu show"
21682173
data-testid="dropdown"
2169-
style="top: 0px; left: 0px;"
2174+
style="left: -999px; top: -995px;"
21702175
>
21712176
<div
21722177
class="date-picker-calendar"
@@ -2667,6 +2672,7 @@ exports[`IncrementalInteractions clicking outside the dropdown should close the
26672672
>
26682673
<div
26692674
class="input-group"
2675+
style=""
26702676
>
26712677
<div
26722678
class="input-group-item"
@@ -2715,7 +2721,7 @@ exports[`IncrementalInteractions clicking outside the dropdown should close the
27152721
<div
27162722
class="dropdown-menu date-picker-dropdown-menu"
27172723
data-testid="dropdown"
2718-
style="top: 0px; left: 0px;"
2724+
style="left: -999px; top: -995px;"
27192725
>
27202726
<div
27212727
class="date-picker-calendar"
@@ -3201,6 +3207,7 @@ exports[`IncrementalInteractions date entered in the input element should reflec
32013207
>
32023208
<div
32033209
class="input-group"
3210+
style=""
32043211
>
32053212
<div
32063213
class="input-group-item"
@@ -3244,7 +3251,7 @@ exports[`IncrementalInteractions date entered in the input element should reflec
32443251
<div
32453252
class="dropdown-menu date-picker-dropdown-menu show"
32463253
data-testid="dropdown"
3247-
style="top: 0px; left: 0px;"
3254+
style="left: -999px; top: -995px;"
32483255
>
32493256
<div
32503257
class="date-picker-calendar"

0 commit comments

Comments
 (0)