@appscode/design-system 1.0.43-alpha.113 → 1.0.43-alpha.116

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/base/utilities/_default.scss +6 -3
  2. package/package.json +1 -1
  3. package/vue-components/v2/table/Table.vue +33 -8
  4. package/vue-components/v3/table/Table.vue +17 -5
package/base/utilities/_default.scss CHANGED
@@ -564,7 +564,12 @@ button {
564
564
 
565
565
  &.is-warning {
566
566
  background-color: $ac-warning;
567
- color: $ac-white !important;
567
+ color: $ac-white;
568
+
569
+ &.is-light {
570
+ background-color: #ffd58b42;
571
+ color: #c88b21;
572
+ }
568
573
  }
569
574
 
570
575
  &.is-danger {
@@ -950,8 +955,6 @@ $border_color_4: transparent transparent #585d6e transparent;
950
955
  // Status css
951
956
  // ac-footer sticky end
952
957
 
953
-
954
-
955
958
  // terminal scss end
956
959
  .is-dark-theme {
957
960
  a {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@appscode/design-system",
3
- "version": "1.0.43-alpha.113",
3
+ "version": "1.0.43-alpha.116",
4
4
  "description": "A design system for Appscode websites and dashboards made using Bulma",
5
5
  "main": "main.scss",
6
6
  "scripts": {
package/vue-components/v2/table/Table.vue CHANGED
@@ -23,10 +23,28 @@
23
23
  :key="idx"
24
24
  :class="{
25
25
  sorting: headerSortables[idx] && headerSortables[idx].enabled,
26
- 'sorting-desc': headerSortables[idx] && headerSortables[idx].mode === 'desc',
27
- 'sorting-asc': headerSortables[idx] && headerSortables[idx].mode === 'asc',
26
+ 'sorting-desc':
27
+ headerSortables[idx] && headerSortables[idx].mode === 'desc',
28
+ 'sorting-asc':
29
+ headerSortables[idx] && headerSortables[idx].mode === 'asc',
30
+ 'has-text-centered':
31
+ typeof tableHeader === 'string'
32
+ ? false
33
+ : tableHeader.textAlign === 'center',
34
+ 'has-text-left':
35
+ typeof tableHeader === 'string'
36
+ ? false
37
+ : tableHeader.textAlign === 'left',
38
+ 'has-text-right':
39
+ typeof tableHeader === 'string'
40
+ ? false
41
+ : tableHeader.textAlign === 'right',
28
42
  }"
29
- @click.prevent="headerSortables[idx] && headerSortables[idx].enabled && emitSortEvent(idx)"
43
+ @click.prevent="
44
+ headerSortables[idx] &&
45
+ headerSortables[idx].enabled &&
46
+ emitSortEvent(idx)
47
+ "
30
48
  >
31
49
  {{ headerLabels[idx] }}
32
50
  </th>
@@ -146,7 +164,7 @@ export default {
146
164
  },
147
165
  headerLabels() {
148
166
  return this.tableHeaders.map((th) =>
149
- typeof th === "string" ? th : th.label || "Label"
167
+ typeof th === "string" ? th : th.name || "Label"
150
168
  );
151
169
  },
152
170
  },
@@ -157,8 +175,15 @@ export default {
157
175
  handler(n) {
158
176
  if (this.headerSortables.length === n.length) {
159
177
  n.forEach((th, idx) => {
160
- if (this.headerSortables[idx].enabled !== !!th.sortable) {
161
- this.headerSortables[idx].enabled = !!th.sortable;
178
+ if (
179
+ this.headerSortables[idx].enabled !==
180
+ !!(th && th.sort && th.sort.enable)
181
+ ) {
182
+ this.headerSortables[idx].enabled = !!(
183
+ th &&
184
+ th.sort &&
185
+ th.sort.enable
186
+ );
162
187
  this.headerSortables[idx].mode = "";
163
188
  }
164
189
  });
@@ -171,7 +196,7 @@ export default {
171
196
  };
172
197
  } else {
173
198
  return {
174
- enabled: !!th.sortable,
199
+ enabled: !!(th && th.sort && th.sort.enable),
175
200
  mode: "",
176
201
  };
177
202
  }
@@ -198,7 +223,7 @@ export default {
198
223
  emitSortEvent(index) {
199
224
  const emitValue = {
200
225
  index,
201
- label: this.tableHeaders[index].label,
226
+ label: this.tableHeaders[index].name,
202
227
  mode: "",
203
228
  };
204
229
 
package/vue-components/v3/table/Table.vue CHANGED
@@ -25,6 +25,18 @@
25
25
  sorting: headerSortables[idx].enabled,
26
26
  'sorting-desc': headerSortables[idx].mode === 'desc',
27
27
  'sorting-asc': headerSortables[idx].mode === 'asc',
28
+ 'has-text-centered':
29
+ typeof tableHeader === 'string'
30
+ ? false
31
+ : tableHeader.textAlign === 'center',
32
+ 'has-text-left':
33
+ typeof tableHeader === 'string'
34
+ ? false
35
+ : tableHeader.textAlign === 'left',
36
+ 'has-text-right':
37
+ typeof tableHeader === 'string'
38
+ ? false
39
+ : tableHeader.textAlign === 'right',
28
40
  }"
29
41
  @click.prevent="headerSortables[idx].enabled && emitSortEvent(idx)"
30
42
  >
@@ -165,7 +177,7 @@ export default defineComponent({
165
177
  },
166
178
  headerLabels() {
167
179
  return this.tableHeaders.map((th) =>
168
- typeof th === "string" ? th : th?.label || "Label"
180
+ typeof th === "string" ? th : th?.name || "Label"
169
181
  );
170
182
  },
171
183
  },
@@ -176,8 +188,8 @@ export default defineComponent({
176
188
  handler(n) {
177
189
  if (this.headerSortables.length === n.length) {
178
190
  n.forEach((th, idx) => {
179
- if (this.headerSortables[idx].enabled !== !!th?.sortable) {
180
- this.headerSortables[idx].enabled = !!th?.sortable;
191
+ if (this.headerSortables[idx].enabled !== !!th?.sort?.enable) {
192
+ this.headerSortables[idx].enabled = !!th?.sort?.enable;
181
193
  this.headerSortables[idx].mode = "";
182
194
  }
183
195
  });
@@ -190,7 +202,7 @@ export default defineComponent({
190
202
  };
191
203
  } else {
192
204
  return {
193
- enabled: !!th?.sortable,
205
+ enabled: !!th?.sort?.enable,
194
206
  mode: "",
195
207
  };
196
208
  }
@@ -217,7 +229,7 @@ export default defineComponent({
217
229
  emitSortEvent(index) {
218
230
  const emitValue = {
219
231
  index,
220
- label: this.tableHeaders[index].label,
232
+ label: this.tableHeaders[index].name,
221
233
  mode: "",
222
234
  };
223
235