@launchpad-ui/filter 0.4.44 → 0.4.46
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/index.es.js +13 -13
- package/dist/index.js +13 -13
- package/dist/style.css +49 -108
- package/package.json +7 -7
package/dist/index.es.js
CHANGED
@@ -8,24 +8,24 @@ import { Button, IconButton } from "@launchpad-ui/button";
|
|
8
8
|
import { Menu, MenuSearch, MenuDivider, MenuItem } from "@launchpad-ui/menu";
|
9
9
|
import { Tooltip } from "@launchpad-ui/tooltip";
|
10
10
|
import { VisuallyHidden } from "@react-aria/visually-hidden";
|
11
|
-
const filter = "
|
12
|
-
const buttonContainer = "
|
13
|
-
const button = "
|
14
|
-
const appliedButton = "
|
15
|
-
const name = "
|
16
|
-
const appliedName = "
|
17
|
-
const description = "
|
18
|
-
const appliedDescription = "
|
19
|
-
const clear = "
|
20
|
-
const isClearable = "
|
21
|
-
const clearTooltip = "
|
22
|
-
const filterClearButton = "
|
11
|
+
const filter = "_filter_1f7xm_1";
|
12
|
+
const buttonContainer = "_buttonContainer_1f7xm_5";
|
13
|
+
const button = "_button_1f7xm_5";
|
14
|
+
const appliedButton = "_appliedButton_1f7xm_24";
|
15
|
+
const name = "_name_1f7xm_55";
|
16
|
+
const appliedName = "_appliedName_1f7xm_60";
|
17
|
+
const description = "_description_1f7xm_64";
|
18
|
+
const appliedDescription = "_appliedDescription_1f7xm_70";
|
19
|
+
const clear = "_clear_1f7xm_78";
|
20
|
+
const isClearable = "_isClearable_1f7xm_83";
|
21
|
+
const clearTooltip = "_clearTooltip_1f7xm_119";
|
22
|
+
const filterClearButton = "_filterClearButton_1f7xm_125";
|
23
23
|
const styles = {
|
24
24
|
filter,
|
25
25
|
buttonContainer,
|
26
26
|
button,
|
27
27
|
appliedButton,
|
28
|
-
"focus-visible": "_focus-
|
28
|
+
"focus-visible": "_focus-visible_1f7xm_1",
|
29
29
|
name,
|
30
30
|
appliedName,
|
31
31
|
description,
|
package/dist/index.js
CHANGED
@@ -10,24 +10,24 @@ const button$1 = require("@launchpad-ui/button");
|
|
10
10
|
const menu = require("@launchpad-ui/menu");
|
11
11
|
const tooltip = require("@launchpad-ui/tooltip");
|
12
12
|
const visuallyHidden = require("@react-aria/visually-hidden");
|
13
|
-
const filter = "
|
14
|
-
const buttonContainer = "
|
15
|
-
const button = "
|
16
|
-
const appliedButton = "
|
17
|
-
const name = "
|
18
|
-
const appliedName = "
|
19
|
-
const description = "
|
20
|
-
const appliedDescription = "
|
21
|
-
const clear = "
|
22
|
-
const isClearable = "
|
23
|
-
const clearTooltip = "
|
24
|
-
const filterClearButton = "
|
13
|
+
const filter = "_filter_1f7xm_1";
|
14
|
+
const buttonContainer = "_buttonContainer_1f7xm_5";
|
15
|
+
const button = "_button_1f7xm_5";
|
16
|
+
const appliedButton = "_appliedButton_1f7xm_24";
|
17
|
+
const name = "_name_1f7xm_55";
|
18
|
+
const appliedName = "_appliedName_1f7xm_60";
|
19
|
+
const description = "_description_1f7xm_64";
|
20
|
+
const appliedDescription = "_appliedDescription_1f7xm_70";
|
21
|
+
const clear = "_clear_1f7xm_78";
|
22
|
+
const isClearable = "_isClearable_1f7xm_83";
|
23
|
+
const clearTooltip = "_clearTooltip_1f7xm_119";
|
24
|
+
const filterClearButton = "_filterClearButton_1f7xm_125";
|
25
25
|
const styles = {
|
26
26
|
filter,
|
27
27
|
buttonContainer,
|
28
28
|
button,
|
29
29
|
appliedButton,
|
30
|
-
"focus-visible": "_focus-
|
30
|
+
"focus-visible": "_focus-visible_1f7xm_1",
|
31
31
|
name,
|
32
32
|
appliedName,
|
33
33
|
description,
|
package/dist/style.css
CHANGED
@@ -1,15 +1,15 @@
|
|
1
|
-
.
|
1
|
+
._filter_1f7xm_1 {
|
2
2
|
font-family: var(--lp-font-family-base);
|
3
3
|
}
|
4
4
|
|
5
|
-
.
|
5
|
+
._buttonContainer_1f7xm_5 {
|
6
6
|
cursor: pointer;
|
7
7
|
display: inline-flex;
|
8
8
|
align-items: center;
|
9
9
|
position: relative;
|
10
10
|
}
|
11
11
|
|
12
|
-
.
|
12
|
+
._button_1f7xm_5 {
|
13
13
|
border-radius: var(--lp-border-radius-medium);
|
14
14
|
padding-top: 0;
|
15
15
|
padding-bottom: 0;
|
@@ -21,7 +21,7 @@
|
|
21
21
|
background-color: var(--lp-color-bg-interactive-secondary);
|
22
22
|
}
|
23
23
|
|
24
|
-
.
|
24
|
+
._appliedButton_1f7xm_24 {
|
25
25
|
color: var(--lp-color-text-ui-primary);
|
26
26
|
height: 2rem;
|
27
27
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
@@ -30,8 +30,8 @@
|
|
30
30
|
display: flex;
|
31
31
|
}
|
32
32
|
|
33
|
-
.
|
34
|
-
.
|
33
|
+
._button_1f7xm_5,
|
34
|
+
._appliedButton_1f7xm_24 {
|
35
35
|
font-family: inherit;
|
36
36
|
font-size: 1.3rem;
|
37
37
|
cursor: pointer;
|
@@ -40,41 +40,41 @@
|
|
40
40
|
border-color: transparent;
|
41
41
|
}
|
42
42
|
|
43
|
-
.
|
43
|
+
._button_1f7xm_5:hover, ._appliedButton_1f7xm_24:hover {
|
44
44
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
45
45
|
border-color: var(--lp-color-border-interactive-secondary-hover);
|
46
46
|
}
|
47
47
|
|
48
|
-
.
|
49
|
-
box-shadow: 0 0 0 2px var(--lp-color-shadow-interactive-primary),
|
50
|
-
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
51
|
-
border-color: var(--lp-color-border-interactive-secondary-focus);
|
48
|
+
._button_1f7xm_5._focus-visible_1f7xm_1, ._appliedButton_1f7xm_24._focus-visible_1f7xm_1 {
|
52
49
|
outline: none;
|
50
|
+
border-color: var(--lp-color-border-interactive-secondary-focus);
|
51
|
+
box-shadow: 0 0 0 2px var(--lp-color-bg-ui-primary),
|
52
|
+
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
53
53
|
}
|
54
54
|
|
55
|
-
.
|
56
|
-
box-shadow: 0 0 0 2px var(--lp-color-shadow-interactive-primary),
|
57
|
-
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
58
|
-
border-color: var(--lp-color-border-interactive-secondary-focus);
|
55
|
+
._button_1f7xm_5:focus-visible, ._appliedButton_1f7xm_24:focus-visible {
|
59
56
|
outline: none;
|
57
|
+
border-color: var(--lp-color-border-interactive-secondary-focus);
|
58
|
+
box-shadow: 0 0 0 2px var(--lp-color-bg-ui-primary),
|
59
|
+
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
60
60
|
}
|
61
61
|
|
62
|
-
.
|
62
|
+
._name_1f7xm_55 {
|
63
63
|
margin-right: 0.5rem;
|
64
64
|
font-weight: var(--lp-font-weight-medium);
|
65
65
|
}
|
66
66
|
|
67
|
-
.
|
67
|
+
._appliedName_1f7xm_60 {
|
68
68
|
margin-right: 0.3rem;
|
69
69
|
}
|
70
70
|
|
71
|
-
.
|
71
|
+
._description_1f7xm_64 {
|
72
72
|
color: var(--lp-color-text-ui-primary);
|
73
73
|
font-weight: var(--lp-font-weight-medium);
|
74
74
|
}
|
75
75
|
|
76
|
-
.
|
77
|
-
.
|
76
|
+
._description_1f7xm_64,
|
77
|
+
._appliedDescription_1f7xm_70 {
|
78
78
|
margin-right: 0.5rem;
|
79
79
|
max-width: 16rem;
|
80
80
|
overflow: hidden;
|
@@ -82,72 +82,56 @@
|
|
82
82
|
white-space: nowrap;
|
83
83
|
}
|
84
84
|
|
85
|
-
.
|
85
|
+
._clear_1f7xm_78 {
|
86
86
|
cursor: pointer;
|
87
87
|
padding: 0.3rem;
|
88
88
|
}
|
89
89
|
|
90
|
-
.
|
91
|
-
background-color:
|
90
|
+
._button_1f7xm_5._isClearable_1f7xm_83 {
|
91
|
+
background-color: rgba(0, 0, 0, 0.15);
|
92
92
|
padding-right: 3.1rem;
|
93
93
|
}
|
94
94
|
|
95
|
-
.
|
96
|
-
.
|
97
|
-
.
|
98
|
-
background-color:
|
95
|
+
._button_1f7xm_5._isClearable_1f7xm_83:focus,
|
96
|
+
._button_1f7xm_5._isClearable_1f7xm_83:hover,
|
97
|
+
._button_1f7xm_5._isClearable_1f7xm_83:active {
|
98
|
+
background-color: rgba(0, 0, 0, 0.2);
|
99
|
+
border-color: var(--lp-color-gray-800);
|
99
100
|
}
|
100
101
|
|
101
|
-
|
102
|
-
|
103
|
-
background-color: initial;
|
104
|
-
}
|
105
|
-
|
106
|
-
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
107
|
-
background-color: transparent;
|
108
|
-
background-color: initial;
|
109
|
-
}
|
110
|
-
|
111
|
-
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
112
|
-
background-color: transparent;
|
113
|
-
background-color: initial;
|
114
|
-
}
|
115
|
-
|
116
|
-
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible) {
|
117
|
-
background-color: transparent;
|
118
|
-
background-color: initial;
|
119
|
-
}
|
120
|
-
|
121
|
-
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1):hover {
|
122
|
-
background-color: var(--lp-color-blue-300);
|
102
|
+
:root[data-theme='dark'] ._button_1f7xm_5._isClearable_1f7xm_83 {
|
103
|
+
background-color: rgba(248, 248, 248, 0.15);
|
123
104
|
}
|
124
105
|
|
125
|
-
.
|
126
|
-
|
127
|
-
|
106
|
+
:root[data-theme='dark'] ._button_1f7xm_5._isClearable_1f7xm_83:focus,
|
107
|
+
:root[data-theme='dark'] ._button_1f7xm_5._isClearable_1f7xm_83:hover,
|
108
|
+
:root[data-theme='dark'] ._button_1f7xm_5._isClearable_1f7xm_83:active {
|
109
|
+
background-color: rgba(248, 248, 248, 0.2);
|
110
|
+
border-color: var(--lp-color-gray-500);
|
111
|
+
}
|
128
112
|
|
129
|
-
.
|
130
|
-
.
|
131
|
-
[data-state='open'] .
|
113
|
+
._button_1f7xm_5:hover:not(._isClearable_1f7xm_83),
|
114
|
+
._button_1f7xm_5:focus:not(._isClearable_1f7xm_83),
|
115
|
+
[data-state='open'] ._button_1f7xm_5:not(._isClearable_1f7xm_83) {
|
132
116
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
133
117
|
border-color: var(--lp-color-border-interactive-secondary-hover);
|
134
118
|
}
|
135
119
|
|
136
|
-
.
|
120
|
+
._button_1f7xm_5:focus:not(._focus-visible_1f7xm_1):not(._isClearable_1f7xm_83):hover {
|
137
121
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
138
122
|
}
|
139
123
|
|
140
|
-
.
|
124
|
+
._button_1f7xm_5:focus:not(:focus-visible):not(._isClearable_1f7xm_83):hover {
|
141
125
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
142
126
|
}
|
143
127
|
|
144
|
-
.
|
128
|
+
._clearTooltip_1f7xm_119 {
|
145
129
|
line-height: 1;
|
146
130
|
position: absolute;
|
147
131
|
right: 0.7rem;
|
148
132
|
}
|
149
133
|
|
150
|
-
.
|
134
|
+
._filterClearButton_1f7xm_125 {
|
151
135
|
text-decoration: none;
|
152
136
|
color: var(--lp-color-text-interactive-destructive);
|
153
137
|
font-size: 1.3rem;
|
@@ -157,69 +141,26 @@
|
|
157
141
|
border-bottom: 1px solid var(--lp-color-border-interactive-secondary);
|
158
142
|
}
|
159
143
|
|
160
|
-
.
|
161
|
-
.
|
162
|
-
.
|
144
|
+
._filterClearButton_1f7xm_125:active,
|
145
|
+
._filterClearButton_1f7xm_125:focus,
|
146
|
+
._filterClearButton_1f7xm_125:hover {
|
163
147
|
outline: none;
|
164
148
|
box-shadow: none;
|
165
149
|
box-shadow: initial;
|
166
150
|
color: var(--lp-color-text-interactive-destructive);
|
167
151
|
}
|
168
152
|
|
169
|
-
.
|
153
|
+
._filterClearButton_1f7xm_125:active {
|
170
154
|
border-bottom-color: var(--lp-color-border-interactive-secondary-active);
|
171
155
|
background-color: var(--lp-color-bg-interactive-secondary-active);
|
172
156
|
}
|
173
157
|
|
174
|
-
.
|
158
|
+
._filterClearButton_1f7xm_125:focus {
|
175
159
|
border-bottom-color: var(--lp-color-border-interactive-secondary-focus);
|
176
160
|
background-color: var(--lp-color-bg-interactive-secondary-focus);
|
177
161
|
}
|
178
162
|
|
179
|
-
.
|
163
|
+
._filterClearButton_1f7xm_125:hover {
|
180
164
|
border-bottom-color: var(--lp-color-border-interactive-secondary-hover);
|
181
165
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
182
166
|
}
|
183
|
-
|
184
|
-
/* stylelint-disable-next-line no-descending-specificity */
|
185
|
-
|
186
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83 {
|
187
|
-
background-color: var(--lp-color-cyan-900);
|
188
|
-
border-color: var(--lp-color-cyan-900);
|
189
|
-
padding-right: 3.1rem;
|
190
|
-
}
|
191
|
-
|
192
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus,
|
193
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:hover,
|
194
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:active {
|
195
|
-
background-color: var(--lp-color-cyan-800);
|
196
|
-
border-color: var(--lp-color-cyan-800);
|
197
|
-
}
|
198
|
-
|
199
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
200
|
-
background-color: transparent;
|
201
|
-
background-color: initial;
|
202
|
-
}
|
203
|
-
|
204
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
205
|
-
background-color: transparent;
|
206
|
-
background-color: initial;
|
207
|
-
}
|
208
|
-
|
209
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
210
|
-
background-color: transparent;
|
211
|
-
background-color: initial;
|
212
|
-
}
|
213
|
-
|
214
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible) {
|
215
|
-
background-color: transparent;
|
216
|
-
background-color: initial;
|
217
|
-
}
|
218
|
-
|
219
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1):hover {
|
220
|
-
background-color: var(--lp-color-cyan-900);
|
221
|
-
}
|
222
|
-
|
223
|
-
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible):hover {
|
224
|
-
background-color: var(--lp-color-cyan-900);
|
225
|
-
}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@launchpad-ui/filter",
|
3
|
-
"version": "0.4.
|
3
|
+
"version": "0.4.46",
|
4
4
|
"status": "beta",
|
5
5
|
"publishConfig": {
|
6
6
|
"access": "public"
|
@@ -28,12 +28,12 @@
|
|
28
28
|
"dependencies": {
|
29
29
|
"@react-aria/visually-hidden": "3.6.0",
|
30
30
|
"classix": "2.1.17",
|
31
|
-
"@launchpad-ui/button": "~0.7.
|
32
|
-
"@launchpad-ui/dropdown": "~0.6.
|
33
|
-
"@launchpad-ui/icons": "~0.6.
|
34
|
-
"@launchpad-ui/menu": "~0.6.
|
35
|
-
"@launchpad-ui/tokens": "~0.4.
|
36
|
-
"@launchpad-ui/tooltip": "~0.6.
|
31
|
+
"@launchpad-ui/button": "~0.7.23",
|
32
|
+
"@launchpad-ui/dropdown": "~0.6.20",
|
33
|
+
"@launchpad-ui/icons": "~0.6.15",
|
34
|
+
"@launchpad-ui/menu": "~0.6.43",
|
35
|
+
"@launchpad-ui/tokens": "~0.4.8",
|
36
|
+
"@launchpad-ui/tooltip": "~0.6.35"
|
37
37
|
},
|
38
38
|
"peerDependencies": {
|
39
39
|
"react": "18.2.0",
|