@launchpad-ui/filter 0.6.12 → 0.6.14

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 CHANGED
@@ -8,31 +8,31 @@ 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_1jgtq_14";
12
- const buttonContainer = "_buttonContainer_1jgtq_18";
13
- const button = "_button_1jgtq_18";
14
- const appliedButton = "_appliedButton_1jgtq_37";
15
- const name = "_name_1jgtq_69";
16
- const appliedName = "_appliedName_1jgtq_74";
17
- const description = "_description_1jgtq_78";
18
- const appliedDescription = "_appliedDescription_1jgtq_84";
19
- const clear = "_clear_1jgtq_92";
20
- const isClearable = "_isClearable_1jgtq_97";
21
- const clearTooltip = "_clearTooltip_1jgtq_122";
22
- const filterClearButton = "_filterClearButton_1jgtq_128";
11
+ const appliedButton = "vLReaG_appliedButton_";
12
+ const appliedDescription = "vLReaG_appliedDescription_";
13
+ const appliedName = "vLReaG_appliedName_";
14
+ const button = "vLReaG_button_";
15
+ const buttonContainer = "vLReaG_buttonContainer_";
16
+ const clear = "vLReaG_clear_";
17
+ const clearTooltip = "vLReaG_clearTooltip_";
18
+ const description = "vLReaG_description_";
19
+ const filter = "vLReaG_filter_";
20
+ const filterClearButton = "vLReaG_filterClearButton_";
21
+ const isClearable = "vLReaG_isClearable_";
22
+ const name = "vLReaG_name_";
23
23
  const styles = {
24
- filter,
25
- buttonContainer,
26
- button,
27
24
  appliedButton,
28
- name,
29
- appliedName,
30
- description,
31
25
  appliedDescription,
26
+ appliedName,
27
+ button,
28
+ buttonContainer,
32
29
  clear,
33
- isClearable,
34
30
  clearTooltip,
35
- filterClearButton
31
+ description,
32
+ filter,
33
+ filterClearButton,
34
+ isClearable,
35
+ name
36
36
  };
37
37
  const AppliedFilterButton = /* @__PURE__ */ forwardRef((props, ref) => {
38
38
  const {
package/dist/index.js CHANGED
@@ -10,31 +10,31 @@ 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_1jgtq_14";
14
- const buttonContainer = "_buttonContainer_1jgtq_18";
15
- const button = "_button_1jgtq_18";
16
- const appliedButton = "_appliedButton_1jgtq_37";
17
- const name = "_name_1jgtq_69";
18
- const appliedName = "_appliedName_1jgtq_74";
19
- const description = "_description_1jgtq_78";
20
- const appliedDescription = "_appliedDescription_1jgtq_84";
21
- const clear = "_clear_1jgtq_92";
22
- const isClearable = "_isClearable_1jgtq_97";
23
- const clearTooltip = "_clearTooltip_1jgtq_122";
24
- const filterClearButton = "_filterClearButton_1jgtq_128";
13
+ const appliedButton = "vLReaG_appliedButton_";
14
+ const appliedDescription = "vLReaG_appliedDescription_";
15
+ const appliedName = "vLReaG_appliedName_";
16
+ const button = "vLReaG_button_";
17
+ const buttonContainer = "vLReaG_buttonContainer_";
18
+ const clear = "vLReaG_clear_";
19
+ const clearTooltip = "vLReaG_clearTooltip_";
20
+ const description = "vLReaG_description_";
21
+ const filter = "vLReaG_filter_";
22
+ const filterClearButton = "vLReaG_filterClearButton_";
23
+ const isClearable = "vLReaG_isClearable_";
24
+ const name = "vLReaG_name_";
25
25
  const styles = {
26
- filter,
27
- buttonContainer,
28
- button,
29
26
  appliedButton,
30
- name,
31
- appliedName,
32
- description,
33
27
  appliedDescription,
28
+ appliedName,
29
+ button,
30
+ buttonContainer,
34
31
  clear,
35
- isClearable,
36
32
  clearTooltip,
37
- filterClearButton
33
+ description,
34
+ filter,
35
+ filterClearButton,
36
+ isClearable,
37
+ name
38
38
  };
39
39
  const AppliedFilterButton = /* @__PURE__ */ react.forwardRef((props, ref) => {
40
40
  const {
package/dist/style.css CHANGED
@@ -1,162 +1 @@
1
- :root,
2
- [data-theme='default'] {
3
- --lp-component-filter-color-bg-clearable: rgba(0, 0, 0, 0.15);
4
- --lp-component-filter-color-bg-clearable-focus: rgba(0, 0, 0, 0.2);
5
- --lp-component-filter-color-border-clearable-focus: var(--lp-color-gray-800);
6
- }
7
-
8
- [data-theme='dark'] {
9
- --lp-component-filter-color-bg-clearable: rgba(248, 248, 248, 0.15);
10
- --lp-component-filter-color-bg-clearable-focus: rgba(248, 248, 248, 0.2);
11
- --lp-component-filter-color-border-clearable-focus: var(--lp-color-gray-500);
12
- }
13
-
14
- ._filter_1jgtq_14 {
15
- font-family: var(--lp-font-family-base);
16
- }
17
-
18
- ._buttonContainer_1jgtq_18 {
19
- cursor: pointer;
20
- display: inline-flex;
21
- align-items: center;
22
- position: relative;
23
- }
24
-
25
- ._button_1jgtq_18 {
26
- border-radius: var(--lp-border-radius-medium);
27
- padding-top: 0;
28
- padding-bottom: 0;
29
- line-height: 2rem;
30
- display: flex;
31
- align-items: center;
32
- margin: 0;
33
- color: var(--lp-color-text-ui-primary-base);
34
- background-color: var(--lp-color-bg-interactive-secondary-base);
35
- }
36
-
37
- ._appliedButton_1jgtq_37 {
38
- color: var(--lp-color-text-ui-primary-base);
39
- height: 1.25rem;
40
- background-color: var(--lp-color-bg-interactive-secondary-hover);
41
- padding: 0.125rem 0.375rem;
42
- border-radius: 0.125rem;
43
- display: flex;
44
- }
45
-
46
- ._button_1jgtq_18,
47
- ._appliedButton_1jgtq_37 {
48
- font-family: inherit;
49
- font-size: 0.8125rem;
50
- cursor: pointer;
51
- border-width: var(--lp-border-width-200);
52
- border-style: solid;
53
- border-color: transparent;
54
- }
55
-
56
- ._button_1jgtq_18:hover, ._appliedButton_1jgtq_37:hover {
57
- background-color: var(--lp-color-bg-interactive-secondary-hover);
58
- border-color: var(--lp-color-border-interactive-secondary-hover);
59
- }
60
-
61
- ._button_1jgtq_18:focus-visible, ._appliedButton_1jgtq_37:focus-visible {
62
- outline: none;
63
- border-color: var(--lp-color-border-interactive-secondary-focus);
64
- box-shadow:
65
- 0 0 0 2px var(--lp-color-bg-ui-primary),
66
- 0 0 0 4px var(--lp-color-shadow-interactive-focus);
67
- }
68
-
69
- ._name_1jgtq_69 {
70
- margin-right: 0.3125rem;
71
- font-weight: var(--lp-font-weight-medium);
72
- }
73
-
74
- ._appliedName_1jgtq_74 {
75
- margin-right: 0.1875rem;
76
- }
77
-
78
- ._description_1jgtq_78 {
79
- color: var(--lp-color-text-ui-primary-base);
80
- font-weight: var(--lp-font-weight-medium);
81
- }
82
-
83
- ._description_1jgtq_78,
84
- ._appliedDescription_1jgtq_84 {
85
- margin-right: 0.3125rem;
86
- max-width: 10rem;
87
- overflow: hidden;
88
- text-overflow: ellipsis;
89
- white-space: nowrap;
90
- }
91
-
92
- ._clear_1jgtq_92 {
93
- cursor: pointer;
94
- padding: 0.1875rem;
95
- }
96
-
97
- ._button_1jgtq_18._isClearable_1jgtq_97 {
98
- padding-right: 1.9375rem;
99
- background-color: rgba(0, 0, 0, 0.15);
100
- background-color: var(--lp-component-filter-color-bg-clearable);
101
- }
102
-
103
- ._button_1jgtq_18._isClearable_1jgtq_97:focus,
104
- ._button_1jgtq_18._isClearable_1jgtq_97:hover,
105
- ._button_1jgtq_18._isClearable_1jgtq_97:active {
106
- background-color: rgba(0, 0, 0, 0.2);
107
- background-color: var(--lp-component-filter-color-bg-clearable-focus);
108
- border-color: var(--lp-color-gray-800);
109
- border-color: var(--lp-component-filter-color-border-clearable-focus);
110
- }
111
-
112
- ._button_1jgtq_18:hover:not(._isClearable_1jgtq_97),
113
- ._button_1jgtq_18:focus:not(._isClearable_1jgtq_97),
114
- [data-state='open'] ._button_1jgtq_18:not(._isClearable_1jgtq_97) {
115
- background-color: var(--lp-color-bg-interactive-secondary-hover);
116
- border-color: var(--lp-color-border-interactive-secondary-hover);
117
- }
118
-
119
- ._button_1jgtq_18:focus:not(:focus-visible):not(._isClearable_1jgtq_97):hover {
120
- background-color: var(--lp-color-bg-interactive-secondary-hover);
121
- }
122
-
123
- ._clearTooltip_1jgtq_122 {
124
- line-height: 1;
125
- position: absolute;
126
- right: 0.4375rem;
127
- }
128
-
129
- ._filterClearButton_1jgtq_128 {
130
- -webkit-text-decoration: none;
131
- text-decoration: none;
132
- color: var(--lp-color-text-interactive-destructive);
133
- font-size: 0.8125rem;
134
- font-weight: var(--lp-font-weight-medium);
135
- padding: 0.625rem;
136
- width: 100%;
137
- border-bottom: 1px solid var(--lp-color-border-interactive-secondary-base);
138
- }
139
-
140
- ._filterClearButton_1jgtq_128:active,
141
- ._filterClearButton_1jgtq_128:focus,
142
- ._filterClearButton_1jgtq_128:hover {
143
- outline: none;
144
- box-shadow: none;
145
- box-shadow: initial;
146
- color: var(--lp-color-text-interactive-destructive);
147
- }
148
-
149
- ._filterClearButton_1jgtq_128:active {
150
- border-bottom-color: var(--lp-color-border-interactive-secondary-active);
151
- background-color: var(--lp-color-bg-interactive-secondary-active);
152
- }
153
-
154
- ._filterClearButton_1jgtq_128:focus {
155
- border-bottom-color: var(--lp-color-border-interactive-secondary-focus);
156
- background-color: var(--lp-color-bg-interactive-secondary-focus);
157
- }
158
-
159
- ._filterClearButton_1jgtq_128:hover {
160
- border-bottom-color: var(--lp-color-border-interactive-secondary-hover);
161
- background-color: var(--lp-color-bg-interactive-secondary-hover);
162
- }
1
+ :root,[data-theme=default]{--lp-component-filter-color-bg-clearable:#00000026;--lp-component-filter-color-bg-clearable-focus:#0003;--lp-component-filter-color-border-clearable-focus:var(--lp-color-gray-800)}[data-theme=dark]{--lp-component-filter-color-bg-clearable:#f8f8f826;--lp-component-filter-color-bg-clearable-focus:#f8f8f833;--lp-component-filter-color-border-clearable-focus:var(--lp-color-gray-500)}.vLReaG_filter_{font-family:var(--lp-font-family-base)}.vLReaG_buttonContainer_{cursor:pointer;align-items:center;display:inline-flex;position:relative}.vLReaG_button_{border-radius:var(--lp-border-radius-medium);color:var(--lp-color-text-ui-primary-base);background-color:var(--lp-color-bg-interactive-secondary-base);align-items:center;margin:0;padding-top:0;padding-bottom:0;line-height:2rem;display:flex}.vLReaG_appliedButton_{color:var(--lp-color-text-ui-primary-base);background-color:var(--lp-color-bg-interactive-secondary-hover);border-radius:.125rem;height:1.25rem;padding:.125rem .375rem;display:flex}.vLReaG_button_,.vLReaG_appliedButton_{cursor:pointer;border-width:var(--lp-border-width-200);border-style:solid;border-color:#0000;font-family:inherit;font-size:.8125rem}:-webkit-any(.vLReaG_button_,.vLReaG_appliedButton_):hover{background-color:var(--lp-color-bg-interactive-secondary-hover);border-color:var(--lp-color-border-interactive-secondary-hover)}:-moz-any(.vLReaG_button_,.vLReaG_appliedButton_):hover{background-color:var(--lp-color-bg-interactive-secondary-hover);border-color:var(--lp-color-border-interactive-secondary-hover)}:is(.vLReaG_button_,.vLReaG_appliedButton_):hover{background-color:var(--lp-color-bg-interactive-secondary-hover);border-color:var(--lp-color-border-interactive-secondary-hover)}:-webkit-any(.vLReaG_button_,.vLReaG_appliedButton_):focus-visible{border-color:var(--lp-color-border-interactive-secondary-focus);box-shadow:0 0 0 2px var(--lp-color-bg-ui-primary),0 0 0 4px var(--lp-color-shadow-interactive-focus);outline:none}:-moz-any(.vLReaG_button_,.vLReaG_appliedButton_):focus-visible{border-color:var(--lp-color-border-interactive-secondary-focus);box-shadow:0 0 0 2px var(--lp-color-bg-ui-primary),0 0 0 4px var(--lp-color-shadow-interactive-focus);outline:none}:is(.vLReaG_button_,.vLReaG_appliedButton_):focus-visible{border-color:var(--lp-color-border-interactive-secondary-focus);box-shadow:0 0 0 2px var(--lp-color-bg-ui-primary),0 0 0 4px var(--lp-color-shadow-interactive-focus);outline:none}.vLReaG_name_{font-weight:var(--lp-font-weight-medium);margin-right:.3125rem}.vLReaG_appliedName_{margin-right:.1875rem}.vLReaG_description_{color:var(--lp-color-text-ui-primary-base);font-weight:var(--lp-font-weight-medium)}.vLReaG_description_,.vLReaG_appliedDescription_{text-overflow:ellipsis;white-space:nowrap;max-width:10rem;margin-right:.3125rem;overflow:hidden}.vLReaG_clear_{cursor:pointer;padding:.1875rem}.vLReaG_button_.vLReaG_isClearable_{background-color:var(--lp-component-filter-color-bg-clearable);padding-right:1.9375rem}.vLReaG_button_.vLReaG_isClearable_:focus,.vLReaG_button_.vLReaG_isClearable_:hover,.vLReaG_button_.vLReaG_isClearable_:active{background-color:var(--lp-component-filter-color-bg-clearable-focus);border-color:var(--lp-component-filter-color-border-clearable-focus)}.vLReaG_button_:hover:not(.vLReaG_isClearable_),.vLReaG_button_:focus:not(.vLReaG_isClearable_),[data-state=open] .vLReaG_button_:not(.vLReaG_isClearable_){background-color:var(--lp-color-bg-interactive-secondary-hover);border-color:var(--lp-color-border-interactive-secondary-hover)}.vLReaG_button_:focus:not(:focus-visible):not(.vLReaG_isClearable_):hover{background-color:var(--lp-color-bg-interactive-secondary-hover)}.vLReaG_clearTooltip_{line-height:1;position:absolute;right:.4375rem}.vLReaG_filterClearButton_{color:var(--lp-color-text-interactive-destructive);font-size:.8125rem;font-weight:var(--lp-font-weight-medium);border-bottom:1px solid var(--lp-color-border-interactive-secondary-base);width:100%;padding:.625rem;text-decoration:none}.vLReaG_filterClearButton_:active,.vLReaG_filterClearButton_:focus,.vLReaG_filterClearButton_:hover{box-shadow:unset;color:var(--lp-color-text-interactive-destructive);outline:none}.vLReaG_filterClearButton_:active{border-bottom-color:var(--lp-color-border-interactive-secondary-active);background-color:var(--lp-color-bg-interactive-secondary-active)}.vLReaG_filterClearButton_:focus{border-bottom-color:var(--lp-color-border-interactive-secondary-focus);background-color:var(--lp-color-bg-interactive-secondary-focus)}.vLReaG_filterClearButton_:hover{border-bottom-color:var(--lp-color-border-interactive-secondary-hover);background-color:var(--lp-color-bg-interactive-secondary-hover)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@launchpad-ui/filter",
3
- "version": "0.6.12",
3
+ "version": "0.6.14",
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.8.8",
30
30
  "classix": "2.1.17",
31
- "@launchpad-ui/button": "~0.11.10",
32
- "@launchpad-ui/dropdown": "~0.6.86",
33
- "@launchpad-ui/icons": "~0.14.10",
34
- "@launchpad-ui/menu": "~0.12.12",
35
- "@launchpad-ui/tokens": "~0.9.3",
36
- "@launchpad-ui/tooltip": "~0.8.9"
31
+ "@launchpad-ui/button": "~0.11.12",
32
+ "@launchpad-ui/dropdown": "~0.6.88",
33
+ "@launchpad-ui/icons": "~0.15.1",
34
+ "@launchpad-ui/menu": "~0.12.14",
35
+ "@launchpad-ui/tokens": "~0.9.4",
36
+ "@launchpad-ui/tooltip": "~0.8.11"
37
37
  },
38
38
  "peerDependencies": {
39
39
  "react": "18.2.0",