@swr-data-lab/components 2.31.2 → 2.31.4

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.
@@ -46,6 +46,7 @@ const rules = [
46
46
  --color-logoFill: var(--logoFill-light);
47
47
  --color-pageFill: var(--pageFill-light);
48
48
  --color-surfaceFill: var(--surfaceFill-light);
49
+ --color-surfaceHover: var(--surfaceHover-light);
49
50
  --color-surfaceBorder: var(--surfaceBorder-light);
50
51
  --color-dropShadow: var(--dropShadow-light);
51
52
  }
@@ -54,6 +55,7 @@ const rules = [
54
55
  --color-pageFill: var(--pageFill-dark);
55
56
  --color-surfaceFill: var(--surfaceFill-dark);
56
57
  --color-surfaceBorder: var(--surfaceBorder-dark);
58
+ --color-surfaceHover: var(--surfaceHover-dark);
57
59
  --color-textPrimary: var(--textPrimary-dark);
58
60
  --color-textSecondary: var(--textSecondary-dark);
59
61
  --color-textSecondaryHover: var(--textSecondaryHover-dark);
@@ -164,6 +164,10 @@ const semantics = {
164
164
  dark: '#222325',
165
165
  light: '#ffffff'
166
166
  },
167
+ surfaceHover: {
168
+ dark: '#0d0d0e',
169
+ light: '#ebebeb'
170
+ },
167
171
  raisedSurfaceFill: {
168
172
  dark: '#393a3b',
169
173
  light: '#ffffff'
@@ -19,6 +19,7 @@ export {};
19
19
 
20
20
  <style>
21
21
  .container {
22
+ color: var(--color-textPrimary);
22
23
  font-family: var(--swr-text);
23
24
  font-size: var(--fs-small-1);
24
25
  font-weight: 400;
@@ -28,12 +28,15 @@ const groupByFn = groupBy || ((item) => item.group);
28
28
  </Select>
29
29
  </div>
30
30
 
31
- <style>.item {
31
+ <style>.container {
32
32
  font-family: var(--swr-sans);
33
- color: var(--violet-dark-5);
34
- }
35
-
36
- .selection {
37
- font-family: var(--swr-sans);
38
- color: var(--violet-dark-5);
33
+ --background: var(--color-surfaceFill);
34
+ --list-background: var(--color-surfaceFill);
35
+ --selection-background: var(--color-surfaceFill);
36
+ --item-is-active-bg: var(--color-surfaceBorder);
37
+ --item-is-active-color: var(--color-textPrimary);
38
+ --item-hover-bg: var(--color-surfaceBorder);
39
+ --item-color: var(--color-textPrimary);
40
+ --item-hover-color: var(--color-textPrimary);
41
+ --selected-item-color: var(--color-textPrimary);
39
42
  }</style>
@@ -50,9 +50,6 @@ ul {
50
50
  flex-flow: row;
51
51
  }
52
52
  }
53
- ul:focus-within, ul:active {
54
- outline: 2px solid var(--blue-light-2);
55
- }
56
53
 
57
54
  li {
58
55
  display: contents;
@@ -69,7 +66,7 @@ input {
69
66
 
70
67
  .small label {
71
68
  font-size: var(--fs-small-1);
72
- height: 2.25em;
69
+ height: 2em;
73
70
  padding: 0 0.65em;
74
71
  }
75
72
 
@@ -85,7 +82,8 @@ label {
85
82
  color: currentColor;
86
83
  position: relative;
87
84
  transition: var(--fast);
88
- text-underline-offset: 0.2em;
85
+ text-underline-offset: 0.1em;
86
+ border-right: 1px solid var(--color-textSecondary);
89
87
  height: 2.25em;
90
88
  }
91
89
  @media (min-width: 425px) {
@@ -104,8 +102,9 @@ label {
104
102
  }
105
103
  label:hover, label:focus-visible {
106
104
  text-decoration: underline;
105
+ text-decoration-color: var(--color-textSecondary);
107
106
  }
108
107
  .is-selected label {
109
- background: var(--color-textSecondary);
108
+ background: var(--color-surfaceHover);
110
109
  font-weight: 700;
111
110
  }</style>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@swr-data-lab/components",
3
3
  "description": "SWR Data Lab component library",
4
- "version": "2.31.2",
4
+ "version": "2.31.4",
5
5
  "author": "SWR Data Lab",
6
6
  "license": "UNLICENSED",
7
7
  "type": "module",