@redseed/redseed-ui-vue3 3.0.1 → 3.0.3

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 (3) hide show
  1. package/package.json +1 -1
  2. package/src/components/ColumnLayout/TwoColumnLayout.vue +7 -7
  3. package/src/components/List/List.vue +17 -22
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redseed/redseed-ui-vue3",
3
- "version": "3.0.1",
3
+ "version": "3.0.3",
4
4
  "description": "RedSeed UI Vue 3 components",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/components/ColumnLayout/TwoColumnLayout.vue CHANGED
@@ -14,24 +14,24 @@ const props = defineProps({
14
14
  <div class="rsui-two-column-layout__main">
15
15
  <slot name="main"></slot>
16
16
  </div>
17
- <div class="rsui-two-column-layout__aside">
17
+ <div v-if="$slots.aside"
18
+ class="rsui-two-column-layout__aside"
19
+ >
18
20
  <slot name="aside"></slot>
19
21
  </div>
20
22
  </div>
21
23
  </template>
22
24
  <style lang="scss">
23
25
  .rsui-two-column-layout {
24
- @apply flex flex-col space-y-6;
25
- @apply lg:flex-row lg:space-y-0 lg:space-x-8;
26
+ @apply flex flex-col lg:flex-row gap-6 lg:gap-8;
26
27
  &--left-aside {
27
- @apply flex-col-reverse space-y-reverse;
28
- @apply lg:flex-row-reverse lg:space-x-reverse;
28
+ @apply flex-col-reverse lg:flex-row-reverse;
29
29
  }
30
30
  &__main{
31
- @apply space-y-6 lg:space-y-4 flex-1;
31
+ @apply flex-1;
32
32
  }
33
33
  &__aside{
34
- @apply space-y-6 lg:w-72 xl:w-100;
34
+ @apply lg:w-72 xl:w-100;
35
35
  }
36
36
  }
37
37
  </style>
package/src/components/List/List.vue CHANGED
@@ -82,29 +82,24 @@ function controlChanged(event) {
82
82
  <slot></slot>
83
83
  </div>
84
84
 
85
- <slot name="control"
86
- :showControl="showControl"
87
- :totalItems="totalItems"
88
- :controlChanged="controlChanged"
85
+ <div v-if="showControl"
86
+ class="rsui-list__control-bottom"
89
87
  >
90
- <ListControl
91
- v-if="showControl"
92
- v-bind="$attrs"
93
- class="rsui-list___control"
88
+ <slot name="control-bottom"
89
+ :showControl="showControl"
94
90
  :totalItems="totalItems"
95
- :searchable="false"
96
- :sortable="false"
97
- :filters="[]"
98
- @change="controlChanged"
91
+ :controlChanged="controlChanged"
99
92
  >
100
- <template #sort-asc-label v-if="$slots['sort-asc-label']">
101
- <slot name="sort-asc-label"></slot>
102
- </template>
103
- <template #sort-desc-label v-if="$slots['sort-desc-label']">
104
- <slot name="sort-desc-label"></slot>
105
- </template>
106
- </ListControl>
107
- </slot>
93
+ <ListControl
94
+ v-bind="$attrs"
95
+ :searchable="false"
96
+ :sortable="false"
97
+ :filters="[]"
98
+ :totalItems="totalItems"
99
+ @change="controlChanged"
100
+ ></ListControl>
101
+ </slot>
102
+ </div>
108
103
 
109
104
  <!--
110
105
  Empty slot with a default empty component.
@@ -154,7 +149,7 @@ function controlChanged(event) {
154
149
  class="rsui-list__empty"
155
150
  >
156
151
  <Empty>
157
- <slot name="filter-empty-description">No items meet your filter criteria.</slot>
152
+ <slot name="control-empty-description">No items meet your filter criteria.</slot>
158
153
  </Empty>
159
154
  </div>
160
155
  </slot>
@@ -168,7 +163,7 @@ function controlChanged(event) {
168
163
  &__empty {
169
164
  @apply mt-6;
170
165
  }
171
- &___control {
166
+ &__control-bottom {
172
167
  @apply mt-3;
173
168
  }
174
169
  }