@stonecrop/atable 0.27.0 → 0.29.0

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": "@stonecrop/atable",
3
- "version": "0.27.0",
3
+ "version": "0.29.0",
4
4
  "description": "Advanced data table component for Stonecrop",
5
5
  "bugs": {
6
6
  "url": "https://github.com/agritheory/stonecrop/issues"
@@ -35,9 +35,9 @@
35
35
  "dependencies": {
36
36
  "@vueuse/components": "^14.2.1",
37
37
  "@vueuse/core": "^14.2.1",
38
- "@stonecrop/schema": "0.27.0",
39
- "@stonecrop/themes": "0.27.0",
40
- "@stonecrop/utilities": "0.27.0"
38
+ "@stonecrop/schema": "0.29.0",
39
+ "@stonecrop/themes": "0.29.0",
40
+ "@stonecrop/utilities": "0.29.0"
41
41
  },
42
42
  "devDependencies": {
43
43
  "@microsoft/api-documenter": "^7.30.5",
@@ -182,7 +182,7 @@ if (addNavigation || isListExpansion) {
182
182
  }
183
183
 
184
184
  .atable-row-clickable:hover > td {
185
- background-color: var(--sc-row-hover-color, #f0f4f8);
185
+ background-color: var(--sc-row-hover-color);
186
186
  }
187
187
 
188
188
  .atable-row:last-child > td {
@@ -276,11 +276,11 @@ const executeAction = (actionType: RowActionType, event?: MouseEvent) => {
276
276
  }
277
277
 
278
278
  .row-action-btn:hover {
279
- background-color: var(--sc-gray-10, #e5e5e5);
279
+ background-color: var(--sc-gray-10);
280
280
  }
281
281
 
282
282
  .row-action-btn:focus {
283
- outline: 2px solid var(--sc-focus-cell-outline, #3b82f6);
283
+ outline: 2px solid var(--sc-focus-cell-outline);
284
284
  outline-offset: 1px;
285
285
  }
286
286
 
@@ -324,11 +324,11 @@ const executeAction = (actionType: RowActionType, event?: MouseEvent) => {
324
324
  }
325
325
 
326
326
  .row-actions-toggle:hover {
327
- background-color: var(--sc-gray-10, #e5e5e5);
327
+ background-color: var(--sc-gray-10);
328
328
  }
329
329
 
330
330
  .row-actions-toggle:focus {
331
- /* outline: 2px solid var(--sc-focus-cell-outline, #3b82f6);
331
+ /* outline: 2px solid var(--sc-focus-cell-outline);
332
332
  outline-offset: 1px; */
333
333
  }
334
334
 
@@ -368,12 +368,12 @@ const executeAction = (actionType: RowActionType, event?: MouseEvent) => {
368
368
  }
369
369
 
370
370
  .row-action-menu-item:hover {
371
- background-color: var(--sc-gray-10, #f5f5f5);
371
+ background-color: var(--sc-gray-10);
372
372
  }
373
373
 
374
374
  .row-action-menu-item:focus {
375
375
  outline: none;
376
- background-color: var(--sc-gray-10, #f5f5f5);
376
+ background-color: var(--sc-gray-10);
377
377
  }
378
378
 
379
379
  .row-action-menu-item:disabled,
@@ -159,7 +159,7 @@ const clearFilter = () => {
159
159
  border: 1px solid var(--sc-form-border);
160
160
  border-radius: 3px;
161
161
  font-size: 0.875rem;
162
- color: var(--sc-text-color);
162
+ color: var(--sc-cell-text-color);
163
163
  width: 100%;
164
164
  box-sizing: border-box;
165
165
  }
@@ -175,7 +175,7 @@ const clearFilter = () => {
175
175
  align-items: center;
176
176
  gap: 0.25rem;
177
177
  font-size: 0.875rem;
178
- color: var(--sc-text-color);
178
+ color: var(--sc-cell-text-color);
179
179
  cursor: pointer;
180
180
  }
181
181
 
@@ -203,7 +203,7 @@ const clearFilter = () => {
203
203
  }
204
204
 
205
205
  .clear-btn {
206
- background: var(--sc-gray-10, #f0f0f0);
206
+ background: var(--sc-gray-10);
207
207
  border: 1px solid var(--sc-form-border);
208
208
  border-radius: 3px;
209
209
  color: var(--sc-gray-70);
@@ -45,14 +45,14 @@ const onNext = () => {
45
45
  <style scoped>
46
46
  .atable-pagination td {
47
47
  padding: 0.75rem 0.5ch;
48
- border-top: 1px solid var(--sc-row-border-color, #e0e0e0);
48
+ border-top: 1px solid var(--sc-row-border-color);
49
49
  }
50
50
 
51
51
  .truncation-note,
52
52
  .completion-note {
53
53
  margin: 0 0 0.5rem;
54
- font-size: var(--sc-table-font-size, 0.875rem);
55
- color: var(--sc-gray-60, #666);
54
+ font-size: var(--sc-table-font-size);
55
+ color: var(--sc-gray-60);
56
56
  }
57
57
 
58
58
  .completion-note {
@@ -69,32 +69,32 @@ const onNext = () => {
69
69
  -webkit-appearance: none;
70
70
  box-sizing: border-box;
71
71
  padding: 0.5rem 1rem;
72
- background: var(--sc-btn-color, #fafafa);
73
- color: var(--sc-btn-label-color, #333333);
74
- border: 1px solid var(--sc-btn-border, #cccccc);
75
- border-radius: var(--sc-border-radius, 0);
72
+ background: var(--sc-btn-color);
73
+ color: var(--sc-btn-label-color);
74
+ border: 1px solid var(--sc-btn-border);
75
+ border-radius: var(--sc-border-radius);
76
76
  cursor: pointer;
77
- font-family: var(--sc-font-family, Arial, sans-serif);
78
- font-size: var(--sc-table-font-size, 0.875rem);
77
+ font-family: var(--sc-font-family);
78
+ font-size: var(--sc-table-font-size);
79
79
  font-weight: 400;
80
80
  line-height: 1.2;
81
81
  transition: background-color 0.15s ease;
82
82
  }
83
83
 
84
84
  .atable-pagination-btn:hover:not(:disabled) {
85
- background: var(--sc-btn-hover, #f2f2f2);
85
+ background: var(--sc-btn-hover);
86
86
  }
87
87
 
88
88
  .atable-pagination-btn:focus-visible {
89
- outline: 2px solid var(--sc-input-active-border-color, #333333);
89
+ outline: 2px solid var(--sc-input-active-border-color);
90
90
  outline-offset: 1px;
91
91
  }
92
92
 
93
93
  .atable-pagination-btn:disabled {
94
94
  cursor: not-allowed;
95
- background: var(--sc-gray-5, #f2f2f2);
96
- color: var(--sc-gray-50, #808080);
97
- border-color: var(--sc-gray-20, #cccccc);
95
+ background: var(--sc-gray-5);
96
+ color: var(--sc-gray-50);
97
+ border-color: var(--sc-gray-20);
98
98
  opacity: 1;
99
99
  }
100
100
  </style>
@@ -1 +0,0 @@
1
- /* old table styles */
@@ -1 +0,0 @@
1
- /* old table styles */