@launchpad-ui/filter 0.4.36 → 0.4.38
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 +48 -52
- 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_1rh9a_1";
|
12
|
+
const buttonContainer = "_buttonContainer_1rh9a_5";
|
13
|
+
const button = "_button_1rh9a_5";
|
14
|
+
const appliedButton = "_appliedButton_1rh9a_24";
|
15
|
+
const name = "_name_1rh9a_55";
|
16
|
+
const appliedName = "_appliedName_1rh9a_60";
|
17
|
+
const description = "_description_1rh9a_64";
|
18
|
+
const appliedDescription = "_appliedDescription_1rh9a_70";
|
19
|
+
const clear = "_clear_1rh9a_78";
|
20
|
+
const isClearable = "_isClearable_1rh9a_83";
|
21
|
+
const clearTooltip = "_clearTooltip_1rh9a_115";
|
22
|
+
const filterClearButton = "_filterClearButton_1rh9a_121";
|
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_1rh9a_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_1rh9a_1";
|
14
|
+
const buttonContainer = "_buttonContainer_1rh9a_5";
|
15
|
+
const button = "_button_1rh9a_5";
|
16
|
+
const appliedButton = "_appliedButton_1rh9a_24";
|
17
|
+
const name = "_name_1rh9a_55";
|
18
|
+
const appliedName = "_appliedName_1rh9a_60";
|
19
|
+
const description = "_description_1rh9a_64";
|
20
|
+
const appliedDescription = "_appliedDescription_1rh9a_70";
|
21
|
+
const clear = "_clear_1rh9a_78";
|
22
|
+
const isClearable = "_isClearable_1rh9a_83";
|
23
|
+
const clearTooltip = "_clearTooltip_1rh9a_115";
|
24
|
+
const filterClearButton = "_filterClearButton_1rh9a_121";
|
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_1rh9a_1",
|
31
31
|
name,
|
32
32
|
appliedName,
|
33
33
|
description,
|
package/dist/style.css
CHANGED
@@ -1,15 +1,15 @@
|
|
1
|
-
.
|
1
|
+
._filter_1rh9a_1 {
|
2
2
|
font-family: var(--lp-font-family-base);
|
3
3
|
}
|
4
4
|
|
5
|
-
.
|
5
|
+
._buttonContainer_1rh9a_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_1rh9a_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_1rh9a_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_1rh9a_5,
|
34
|
+
._appliedButton_1rh9a_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_1rh9a_5:hover, ._appliedButton_1rh9a_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
|
-
.
|
48
|
+
._button_1rh9a_5._focus-visible_1rh9a_1, ._appliedButton_1rh9a_24._focus-visible_1rh9a_1 {
|
49
49
|
box-shadow: 0 0 0 2px var(--lp-color-shadow-interactive-primary),
|
50
50
|
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
51
51
|
border-color: var(--lp-color-border-interactive-secondary-focus);
|
52
52
|
outline: none;
|
53
53
|
}
|
54
54
|
|
55
|
-
.
|
55
|
+
._button_1rh9a_5:focus-visible, ._appliedButton_1rh9a_24:focus-visible {
|
56
56
|
box-shadow: 0 0 0 2px var(--lp-color-shadow-interactive-primary),
|
57
57
|
0 0 0 4px var(--lp-color-shadow-interactive-focus);
|
58
58
|
border-color: var(--lp-color-border-interactive-secondary-focus);
|
59
59
|
outline: none;
|
60
60
|
}
|
61
61
|
|
62
|
-
.
|
62
|
+
._name_1rh9a_55 {
|
63
63
|
margin-right: 0.5rem;
|
64
64
|
font-weight: var(--lp-font-weight-medium);
|
65
65
|
}
|
66
66
|
|
67
|
-
.
|
67
|
+
._appliedName_1rh9a_60 {
|
68
68
|
margin-right: 0.3rem;
|
69
69
|
}
|
70
70
|
|
71
|
-
.
|
71
|
+
._description_1rh9a_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_1rh9a_64,
|
77
|
+
._appliedDescription_1rh9a_70 {
|
78
78
|
margin-right: 0.5rem;
|
79
79
|
max-width: 16rem;
|
80
80
|
overflow: hidden;
|
@@ -82,76 +82,72 @@
|
|
82
82
|
white-space: nowrap;
|
83
83
|
}
|
84
84
|
|
85
|
-
.
|
85
|
+
._clear_1rh9a_78 {
|
86
86
|
cursor: pointer;
|
87
87
|
padding: 0.3rem;
|
88
88
|
}
|
89
89
|
|
90
|
-
.
|
91
|
-
border: 1px solid var(--lp-color-gray-600);
|
92
|
-
}
|
93
|
-
|
94
|
-
._button_8q50m_5._isClearable_8q50m_87 {
|
90
|
+
._button_1rh9a_5._isClearable_1rh9a_83 {
|
95
91
|
background-color: var(--lp-color-blue-200);
|
96
92
|
padding-right: 3.1rem;
|
97
93
|
}
|
98
94
|
|
99
|
-
.
|
100
|
-
.
|
101
|
-
.
|
95
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus,
|
96
|
+
._button_1rh9a_5._isClearable_1rh9a_83:hover,
|
97
|
+
._button_1rh9a_5._isClearable_1rh9a_83:active {
|
102
98
|
background-color: var(--lp-color-blue-300);
|
103
99
|
}
|
104
100
|
|
105
|
-
.
|
101
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
106
102
|
background-color: transparent;
|
107
103
|
background-color: initial;
|
108
104
|
}
|
109
105
|
|
110
|
-
.
|
106
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
111
107
|
background-color: transparent;
|
112
108
|
background-color: initial;
|
113
109
|
}
|
114
110
|
|
115
|
-
.
|
111
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
116
112
|
background-color: transparent;
|
117
113
|
background-color: initial;
|
118
114
|
}
|
119
115
|
|
120
|
-
.
|
116
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible) {
|
121
117
|
background-color: transparent;
|
122
118
|
background-color: initial;
|
123
119
|
}
|
124
120
|
|
125
|
-
.
|
121
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1):hover {
|
126
122
|
background-color: var(--lp-color-blue-300);
|
127
123
|
}
|
128
124
|
|
129
|
-
.
|
125
|
+
._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible):hover {
|
130
126
|
background-color: var(--lp-color-blue-300);
|
131
127
|
}
|
132
128
|
|
133
|
-
.
|
134
|
-
.
|
135
|
-
[data-state='open'] .
|
129
|
+
._button_1rh9a_5:hover:not(._isClearable_1rh9a_83),
|
130
|
+
._button_1rh9a_5:focus:not(._isClearable_1rh9a_83),
|
131
|
+
[data-state='open'] ._button_1rh9a_5:not(._isClearable_1rh9a_83) {
|
136
132
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
137
133
|
border-color: var(--lp-color-border-interactive-secondary-hover);
|
138
134
|
}
|
139
135
|
|
140
|
-
.
|
136
|
+
._button_1rh9a_5:focus:not(._focus-visible_1rh9a_1):not(._isClearable_1rh9a_83):hover {
|
141
137
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
142
138
|
}
|
143
139
|
|
144
|
-
.
|
140
|
+
._button_1rh9a_5:focus:not(:focus-visible):not(._isClearable_1rh9a_83):hover {
|
145
141
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
146
142
|
}
|
147
143
|
|
148
|
-
.
|
144
|
+
._clearTooltip_1rh9a_115 {
|
149
145
|
line-height: 1;
|
150
146
|
position: absolute;
|
151
147
|
right: 0.7rem;
|
152
148
|
}
|
153
149
|
|
154
|
-
.
|
150
|
+
._filterClearButton_1rh9a_121 {
|
155
151
|
text-decoration: none;
|
156
152
|
color: var(--lp-color-text-interactive-destructive);
|
157
153
|
font-size: 1.3rem;
|
@@ -161,69 +157,69 @@
|
|
161
157
|
border-bottom: 1px solid var(--lp-color-border-interactive-secondary);
|
162
158
|
}
|
163
159
|
|
164
|
-
.
|
165
|
-
.
|
166
|
-
.
|
160
|
+
._filterClearButton_1rh9a_121:active,
|
161
|
+
._filterClearButton_1rh9a_121:focus,
|
162
|
+
._filterClearButton_1rh9a_121:hover {
|
167
163
|
outline: none;
|
168
164
|
box-shadow: none;
|
169
165
|
box-shadow: initial;
|
170
166
|
color: var(--lp-color-text-interactive-destructive);
|
171
167
|
}
|
172
168
|
|
173
|
-
.
|
169
|
+
._filterClearButton_1rh9a_121:active {
|
174
170
|
border-bottom-color: var(--lp-color-border-interactive-secondary-active);
|
175
171
|
background-color: var(--lp-color-bg-interactive-secondary-active);
|
176
172
|
}
|
177
173
|
|
178
|
-
.
|
174
|
+
._filterClearButton_1rh9a_121:focus {
|
179
175
|
border-bottom-color: var(--lp-color-border-interactive-secondary-focus);
|
180
176
|
background-color: var(--lp-color-bg-interactive-secondary-focus);
|
181
177
|
}
|
182
178
|
|
183
|
-
.
|
179
|
+
._filterClearButton_1rh9a_121:hover {
|
184
180
|
border-bottom-color: var(--lp-color-border-interactive-secondary-hover);
|
185
181
|
background-color: var(--lp-color-bg-interactive-secondary-hover);
|
186
182
|
}
|
187
183
|
|
188
184
|
/* stylelint-disable-next-line no-descending-specificity */
|
189
185
|
|
190
|
-
:root[data-theme='dark'] .
|
186
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83 {
|
191
187
|
background-color: var(--lp-color-cyan-900);
|
192
188
|
border-color: var(--lp-color-cyan-900);
|
193
189
|
padding-right: 3.1rem;
|
194
190
|
}
|
195
191
|
|
196
|
-
:root[data-theme='dark'] .
|
197
|
-
:root[data-theme='dark'] .
|
198
|
-
:root[data-theme='dark'] .
|
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 {
|
199
195
|
background-color: var(--lp-color-cyan-800);
|
200
196
|
border-color: var(--lp-color-cyan-800);
|
201
197
|
}
|
202
198
|
|
203
|
-
:root[data-theme='dark'] .
|
199
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
204
200
|
background-color: transparent;
|
205
201
|
background-color: initial;
|
206
202
|
}
|
207
203
|
|
208
|
-
:root[data-theme='dark'] .
|
204
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
209
205
|
background-color: transparent;
|
210
206
|
background-color: initial;
|
211
207
|
}
|
212
208
|
|
213
|
-
:root[data-theme='dark'] .
|
209
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1) {
|
214
210
|
background-color: transparent;
|
215
211
|
background-color: initial;
|
216
212
|
}
|
217
213
|
|
218
|
-
:root[data-theme='dark'] .
|
214
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible) {
|
219
215
|
background-color: transparent;
|
220
216
|
background-color: initial;
|
221
217
|
}
|
222
218
|
|
223
|
-
:root[data-theme='dark'] .
|
219
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(._focus-visible_1rh9a_1):hover {
|
224
220
|
background-color: var(--lp-color-cyan-900);
|
225
221
|
}
|
226
222
|
|
227
|
-
:root[data-theme='dark'] .
|
223
|
+
:root[data-theme='dark'] ._button_1rh9a_5._isClearable_1rh9a_83:focus:not(:focus-visible):hover {
|
228
224
|
background-color: var(--lp-color-cyan-900);
|
229
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.38",
|
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.13",
|
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/
|
36
|
-
"@launchpad-ui/
|
31
|
+
"@launchpad-ui/button": "~0.7.16",
|
32
|
+
"@launchpad-ui/dropdown": "~0.6.12",
|
33
|
+
"@launchpad-ui/icons": "~0.6.9",
|
34
|
+
"@launchpad-ui/menu": "~0.6.36",
|
35
|
+
"@launchpad-ui/tooltip": "~0.6.28",
|
36
|
+
"@launchpad-ui/tokens": "~0.4.3"
|
37
37
|
},
|
38
38
|
"peerDependencies": {
|
39
39
|
"react": "^18.0.0",
|