@redseed/redseed-ui-vue3 2.23.4 → 2.23.6

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/package.json +1 -1
  2. package/src/components/ColumnLayout/SingleColumnLayout.vue +1 -1
  3. package/src/components/Link/LinkPrimary.vue +4 -0
  4. package/src/components/Link/LinkSlot.vue +11 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redseed/redseed-ui-vue3",
3
- "version": "2.23.4",
3
+ "version": "2.23.6",
4
4
  "description": "RedSeed UI Vue 3 components",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/components/ColumnLayout/SingleColumnLayout.vue CHANGED
@@ -7,6 +7,6 @@
7
7
  </template>
8
8
  <style lang="scss">
9
9
  .rsui-single-column-layout {
10
- @apply mx-auto w-full max-w-3xl overflow-x-hidden;
10
+ @apply mx-auto w-full max-w-3xl;
11
11
  }
12
12
  </style>
package/src/components/Link/LinkPrimary.vue CHANGED
@@ -9,6 +9,10 @@ defineOptions({
9
9
  <LinkSlot class="rsui-link-primary"
10
10
  v-bind="$attrs"
11
11
  >
12
+ <template #icon>
13
+ <slot name="icon" />
14
+ </template>
15
+
12
16
  <slot></slot>
13
17
  </LinkSlot>
14
18
  </template>
package/src/components/Link/LinkSlot.vue CHANGED
@@ -49,6 +49,8 @@ const linkLabelClass = computed(() => [
49
49
  v-bind="$attrs"
50
50
  @click="$emit('click', $event)"
51
51
  >
52
+ <slot name="icon"></slot>
53
+
52
54
  <span :class="linkLabelClass">
53
55
  <slot></slot>
54
56
  </span>
@@ -57,10 +59,10 @@ const linkLabelClass = computed(() => [
57
59
  <style lang="scss" scoped>
58
60
  .rsui-link-slot {
59
61
  // default shape and control
60
- @apply relative w-fit h-fit inline-flex items-center justify-center;
62
+ @apply relative w-fit h-fit inline-flex shrink-0 items-center justify-center whitespace-nowrap will-change-transform;
61
63
  @apply select-none outline-none cursor-pointer transition;
62
64
  // default text styles
63
- @apply font-medium text-black;
65
+ @apply font-medium text-black gap-2;
64
66
  // disabled state
65
67
  &--disabled {
66
68
  @apply opacity-30 cursor-default pointer-events-none;
@@ -68,14 +70,20 @@ const linkLabelClass = computed(() => [
68
70
  // modifier md size
69
71
  &--md {
70
72
  @apply text-base leading-6;
73
+ :deep(svg) {
74
+ @apply size-6;
75
+ }
71
76
  }
72
77
  // modifier lg size
73
78
  &--lg {
74
79
  @apply text-lg leading-7;
80
+ :deep(svg) {
81
+ @apply size-7;
82
+ }
75
83
  }
76
84
  // label
77
85
  &__label {
78
- @apply relative;
86
+ @apply relative inline-flex shrink-0 items-center justify-center whitespace-nowrap will-change-transform;
79
87
  @apply after:content-[''] after:absolute after:inset-x-0 after:bottom-0;
80
88
  @apply after:w-full after:h-px after:transition;
81
89
  @apply after:bg-current after:opacity-30 hover:after:opacity-100;