@moises.ai/design-system 4.17.8 → 4.17.10

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moises.ai/design-system",
3
- "version": "4.17.8",
3
+ "version": "4.17.10",
4
4
  "description": "Design System package based on @radix-ui/themes with custom defaults",
5
5
  "private": false,
6
6
  "type": "module",
@@ -73,7 +73,8 @@
73
73
 
74
74
  /* hover (native + forced via data-state='hover' for documentation/Storybook) */
75
75
  .card[data-state='default']:hover,
76
- .card[data-state='hover'] {
76
+ .card[data-state='hover'],
77
+ .card[data-state='disabled']:hover {
77
78
  border-color: var(--neutral-alpha-6, rgba(214, 235, 253, 0.19));
78
79
  background: var(--neutral-alpha-2, rgba(216, 244, 246, 0.04));
79
80
  }
@@ -86,14 +87,22 @@
86
87
 
87
88
  /* disabled / locked — same border/background as default; text + lock are muted, icon stays */
88
89
  .card[data-state='disabled'] {
89
- cursor: default;
90
+ cursor: pointer;
90
91
  }
91
92
 
92
- .card[data-state='disabled'] .cardText,
93
+
93
94
  .card[data-state='disabled'] .lockIcon {
94
95
  color: var(--neutral-alpha-5);
95
96
  }
96
97
 
98
+ .card[data-state='disabled'] .cardText {
99
+ color: var(--neutral-alpha-12);
100
+ }
101
+
102
+ .card[data-state='disabled'] .cardIcon {
103
+ color: var(--neutral-alpha-7);
104
+ }
105
+
97
106
  .card[data-state='disabled-checked'] {
98
107
  border-color: rgba(0, 220, 253, 0.20);
99
108
  background: var(--neutral-alpha-2, rgba(216, 244, 246, 0.04));
@@ -23,8 +23,18 @@ export const NumberPicker = ({
23
23
  onChange(value - 1)
24
24
  }, [min, onChange, value])
25
25
 
26
+ const stopClickPropagation = useCallback((e) => {
27
+ e.stopPropagation()
28
+ }, [])
29
+
26
30
  return (
27
- <Flex direction="row" gap="1" align="center" justify="center">
31
+ <Flex
32
+ direction="row"
33
+ gap="1"
34
+ align="center"
35
+ justify="center"
36
+ onClick={stopClickPropagation}
37
+ >
28
38
  {label && (
29
39
  <Text size="2" weight="medium">
30
40
  {label}
@@ -46,11 +56,13 @@ export const NumberPicker = ({
46
56
  <Flex
47
57
  align="center"
48
58
  justify="center"
59
+ onClick={stopClickPropagation}
49
60
  style={{
50
61
  height: '24px',
51
62
  minWidth: '42px',
52
63
  borderRadius: 'var(--radius-2)',
53
64
  backgroundColor: 'var(--neutral-alpha-3 )',
65
+ cursor: 'default',
54
66
  }}
55
67
  >
56
68
  <Text size="2">{value > 0 ? `+${value}` : value}</Text>
@@ -36,9 +36,13 @@ export const Default = {
36
36
  onInsertAllTracks={args.onInsertAllTracks}
37
37
  onProjectClick={args.onProjectClick}
38
38
  >
39
- {(tracks) =>
39
+ {({ projectId, tracks }) =>
40
40
  tracks.map((track) => (
41
- <ProjectsList.Track key={track.id} {...track} />
41
+ <ProjectsList.Track
42
+ projectId={projectId}
43
+ key={track.id}
44
+ {...track}
45
+ />
42
46
  ))
43
47
  }
44
48
  </ProjectsList>
@@ -84,9 +88,13 @@ export const WithEmptyProjects = {
84
88
  onInsertAllTracks={args.onInsertAllTracks}
85
89
  onProjectClick={args.onProjectClick}
86
90
  >
87
- {(tracks) =>
91
+ {({ projectId, tracks }) =>
88
92
  tracks.map((track) => (
89
- <ProjectsList.Track key={track.id} {...track} />
93
+ <ProjectsList.Track
94
+ projectId={projectId}
95
+ key={track.id}
96
+ {...track}
97
+ />
90
98
  ))
91
99
  }
92
100
  </ProjectsList>
@@ -133,9 +141,13 @@ export const WithProjectLoading = {
133
141
  onInsertAllTracks={args.onInsertAllTracks}
134
142
  onProjectClick={args.onProjectClick}
135
143
  >
136
- {(tracks) =>
144
+ {({ projectId, tracks }) =>
137
145
  tracks.map((track) => (
138
- <ProjectsList.Track key={track.id} {...track} />
146
+ <ProjectsList.Track
147
+ projectId={projectId}
148
+ key={track.id}
149
+ {...track}
150
+ />
139
151
  ))
140
152
  }
141
153
  </ProjectsList>
@@ -182,9 +194,13 @@ export const WithProjectFailed = {
182
194
  onInsertAllTracks={args.onInsertAllTracks}
183
195
  onProjectClick={args.onProjectClick}
184
196
  >
185
- {(tracks) =>
197
+ {({ projectId, tracks }) =>
186
198
  tracks.map((track) => (
187
- <ProjectsList.Track key={track.id} {...track} />
199
+ <ProjectsList.Track
200
+ projectId={projectId}
201
+ key={track.id}
202
+ {...track}
203
+ />
188
204
  ))
189
205
  }
190
206
  </ProjectsList>