@redseed/redseed-ui-vue3 2.25.1 → 2.25.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redseed/redseed-ui-vue3",
-  "version": "2.25.1",
+  "version": "2.25.3",
   "description": "RedSeed UI Vue 3 components",
   "main": "index.js",
   "scripts": {

package/src/components/FormField/FormFieldUploaderWrapper.vue

@@ -9,6 +9,10 @@ defineOptions({
 })
 
 const props = defineProps({
+    hasMedia: {
+        type: Boolean,
+        default: false,
+    },
     removable: {
         type: Boolean,
         default: false,
@@ -83,6 +87,11 @@ const uploaderStateIconClass = computed(() => [
     }
 ])
 
+const showRemoveAction = computed(() => {
+    return (props.hasMedia || stateSuccess.value)
+        && props.removable
+})
+
 function removeAction() {
     setDefault()
     emit('remove')
@@ -110,7 +119,7 @@ function removeAction() {
     <div :class="uploaderContainerClass">
         <div :class="uploaderContentClass">
             <div :class="uploaderStateIconClass">
-                <slot name="state-icon-default" v-if="stateDefault">
+                <slot name="state-icon-default" v-if="stateDefault && !hasMedia">
                     <PlusIcon />
                 </slot>
                 <slot name="state-icon-uploading" v-if="stateUploading">
@@ -122,7 +131,7 @@ function removeAction() {
                 <slot name="state-icon-error" v-if="stateError">
                     <ExclamationCircleIcon />
                 </slot>
-                <slot name="state-icon-success" v-if="stateSuccess">
+                <slot name="state-icon-success" v-if="stateSuccess || hasMedia">
                     <DocumentIcon />
                 </slot>
             </div>
@@ -164,7 +173,7 @@ function removeAction() {
             </div>
 
         </div>
-        <div v-if="stateSuccess && removable"
+        <div v-if="showRemoveAction"
             class="rsui-form-field-uploader__action"
         >
             <div class="rsui-form-field-uploader__action-icon"
@@ -185,18 +194,15 @@ function removeAction() {
         @apply relative select-none;
         @apply rounded-md border border-rsui-grey-300 border-dashed;
         @apply flex flex-nowrap justify-center items-center gap-4;
+        @apply px-4 py-2.5;
         &--success {
-            @apply border-rsui-light border-solid pr-4;
+            @apply border-rsui-light border-solid;
         }
     }
 
     &__content {
         @apply relative flex flex-nowrap justify-center items-center gap-4;
-        @apply px-4 py-2.5 text-rsui-default;
-
-        &--success {
-            @apply pr-0;
-        }
+        @apply text-rsui-default;
     }
 
     &__state-icon {

package/src/components/LinkedList/LinkedListItem.vue

@@ -85,15 +85,11 @@ const statusClass = computed(() => [
     &__status {
         @apply absolute top-1.5 left-3 size-3 border border-current bg-current rounded-full;
         @apply flex items-center justify-center transition;
-
-        &--active {
-            @apply bg-white;
-        }
     }
 
     &__active-icon {
         :deep(svg), svg {
-            @apply size-2 text-current;
+            @apply size-2 text-white;
         }
     }