@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.
Files changed (4) hide show
  1. package/dist/index.es.js +13 -13
  2. package/dist/index.js +13 -13
  3. package/dist/style.css +48 -52
  4. 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 = "_filter_8q50m_1";
12
- const buttonContainer = "_buttonContainer_8q50m_5";
13
- const button = "_button_8q50m_5";
14
- const appliedButton = "_appliedButton_8q50m_24";
15
- const name = "_name_8q50m_55";
16
- const appliedName = "_appliedName_8q50m_60";
17
- const description = "_description_8q50m_64";
18
- const appliedDescription = "_appliedDescription_8q50m_70";
19
- const clear = "_clear_8q50m_78";
20
- const isClearable = "_isClearable_8q50m_87";
21
- const clearTooltip = "_clearTooltip_8q50m_119";
22
- const filterClearButton = "_filterClearButton_8q50m_125";
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-visible_8q50m_1",
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 = "_filter_8q50m_1";
14
- const buttonContainer = "_buttonContainer_8q50m_5";
15
- const button = "_button_8q50m_5";
16
- const appliedButton = "_appliedButton_8q50m_24";
17
- const name = "_name_8q50m_55";
18
- const appliedName = "_appliedName_8q50m_60";
19
- const description = "_description_8q50m_64";
20
- const appliedDescription = "_appliedDescription_8q50m_70";
21
- const clear = "_clear_8q50m_78";
22
- const isClearable = "_isClearable_8q50m_87";
23
- const clearTooltip = "_clearTooltip_8q50m_119";
24
- const filterClearButton = "_filterClearButton_8q50m_125";
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-visible_8q50m_1",
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
- ._filter_8q50m_1 {
1
+ ._filter_1rh9a_1 {
2
2
  font-family: var(--lp-font-family-base);
3
3
  }
4
4
 
5
- ._buttonContainer_8q50m_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
- ._button_8q50m_5 {
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
- ._appliedButton_8q50m_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
- ._button_8q50m_5,
34
- ._appliedButton_8q50m_24 {
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
- ._button_8q50m_5:hover, ._appliedButton_8q50m_24:hover {
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
- ._button_8q50m_5._focus-visible_8q50m_1, ._appliedButton_8q50m_24._focus-visible_8q50m_1 {
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
- ._button_8q50m_5:focus-visible, ._appliedButton_8q50m_24:focus-visible {
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
- ._name_8q50m_55 {
62
+ ._name_1rh9a_55 {
63
63
  margin-right: 0.5rem;
64
64
  font-weight: var(--lp-font-weight-medium);
65
65
  }
66
66
 
67
- ._appliedName_8q50m_60 {
67
+ ._appliedName_1rh9a_60 {
68
68
  margin-right: 0.3rem;
69
69
  }
70
70
 
71
- ._description_8q50m_64 {
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
- ._description_8q50m_64,
77
- ._appliedDescription_8q50m_70 {
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
- ._clear_8q50m_78 {
85
+ ._clear_1rh9a_78 {
86
86
  cursor: pointer;
87
87
  padding: 0.3rem;
88
88
  }
89
89
 
90
- .Filter-target--usage {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus,
100
- ._button_8q50m_5._isClearable_8q50m_87:hover,
101
- ._button_8q50m_5._isClearable_8q50m_87:active {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(:focus-visible) {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1):hover {
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
- ._button_8q50m_5._isClearable_8q50m_87:focus:not(:focus-visible):hover {
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
- ._button_8q50m_5:hover:not(._isClearable_8q50m_87),
134
- ._button_8q50m_5:focus:not(._isClearable_8q50m_87),
135
- [data-state='open'] ._button_8q50m_5:not(._isClearable_8q50m_87) {
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
- ._button_8q50m_5:focus:not(._focus-visible_8q50m_1):not(._isClearable_8q50m_87):hover {
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
- ._button_8q50m_5:focus:not(:focus-visible):not(._isClearable_8q50m_87):hover {
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
- ._clearTooltip_8q50m_119 {
144
+ ._clearTooltip_1rh9a_115 {
149
145
  line-height: 1;
150
146
  position: absolute;
151
147
  right: 0.7rem;
152
148
  }
153
149
 
154
- ._filterClearButton_8q50m_125 {
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
- ._filterClearButton_8q50m_125:active,
165
- ._filterClearButton_8q50m_125:focus,
166
- ._filterClearButton_8q50m_125:hover {
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
- ._filterClearButton_8q50m_125:active {
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
- ._filterClearButton_8q50m_125:focus {
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
- ._filterClearButton_8q50m_125:hover {
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'] ._button_8q50m_5._isClearable_8q50m_87 {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus,
197
- :root[data-theme='dark'] ._button_8q50m_5._isClearable_8q50m_87:hover,
198
- :root[data-theme='dark'] ._button_8q50m_5._isClearable_8q50m_87:active {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1) {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(:focus-visible) {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(._focus-visible_8q50m_1):hover {
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'] ._button_8q50m_5._isClearable_8q50m_87:focus:not(:focus-visible):hover {
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.36",
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.15",
32
- "@launchpad-ui/dropdown": "~0.6.11",
33
- "@launchpad-ui/icons": "~0.6.8",
34
- "@launchpad-ui/menu": "~0.6.35",
35
- "@launchpad-ui/tokens": "~0.4.2",
36
- "@launchpad-ui/tooltip": "~0.6.27"
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",