sprintify-ui 0.0.192 → 0.0.194

package/src/components/BaseMediaLibrary.vue

@@ -53,12 +53,12 @@
     </BaseFileUploader>
 
     <div
-      v-if="currentMediaInternal.length + normalizedModelValue.to_add.length"
+      v-if="filteredCurrentMedia.length + normalizedModelValue.to_add.length"
       class="mt-5"
     >
       <div class="-m-1 flex flex-wrap">
         <div
-          v-for="(media, index) in currentMediaInternal"
+          v-for="(media, index) in filteredCurrentMedia"
           :key="media.id"
           class="min-w-[220px] flex-1 p-1"
         >
@@ -173,6 +173,12 @@ const emit = defineEmits([
   'upload:end',
 ]);
 
+const filteredCurrentMedia = computed(() => {
+  return props.currentMedia.filter((media) => {
+    return !normalizedModelValue.value.to_remove.includes(media.id);
+  });
+});
+
 const { emitUpdate, enableForm, disableForm } = useField({
   name: computed(() => props.name),
   required: computed(() => false),
@@ -189,8 +195,6 @@ const normalizedMax = computed(() => {
   return props.max;
 });
 
-const currentMediaInternal = ref(cloneDeep(props.currentMedia));
-
 const normalizedModelValue = computed(() => {
   if (
     props.modelValue &&
@@ -209,7 +213,7 @@ const normalizedModelValue = computed(() => {
 
 const numberOfFiles = computed((): number => {
   return (
-    currentMediaInternal.value.length +
+    props.currentMedia.length +
     (props.modelValue?.to_add.length ?? 0) -
     (props.modelValue?.to_remove.length ?? 0)
   );
@@ -241,9 +245,8 @@ function onUploadSuccess(file: UploadedFile) {
 
   if (normalizedMax.value == 1) {
     // Remove everything...
-    modelValue.to_remove.push(...currentMediaInternal.value.map((m) => m.id));
+    modelValue.to_remove.push(...props.currentMedia.map((m) => m.id));
     modelValue.to_add = [];
-    currentMediaInternal.value = [];
   }
 
   modelValue.to_add.push(file);
@@ -284,7 +287,7 @@ function removeUploadedFile(index: number, length = 1) {
 }
 
 function removeMedia(index: number) {
-  const media = currentMediaInternal.value[index];
+  const media = props.currentMedia[index];
 
   if (media) {
     const modelValue = cloneDeep(normalizedModelValue.value);
@@ -292,8 +295,6 @@ function removeMedia(index: number) {
     modelValue.to_remove.push(media.id);
 
     sync(modelValue);
-
-    currentMediaInternal.value.splice(index, 1);
   }
 }
 

package/src/components/BaseMenu.vue

@@ -6,7 +6,7 @@
     :class="[position == 'custom' ? 'static' : 'relative']"
   >
     <div>
-      <MenuButton class="flex">
+      <MenuButton :class="buttonClass">
         <slot name="button" :open="open" />
       </MenuButton>
     </div>
@@ -21,7 +21,7 @@
     >
       <MenuItems
         :class="[menuClass, menuPositionClass]"
-        class="absolute z-menu mt-2 rounded-md bg-white p-1 shadow-lg ring-1 ring-black ring-opacity-10 focus:outline-none"
+        class="absolute z-menu mt-2 rounded-md bg-white p-1 shadow-lg outline-none ring-1 ring-black ring-opacity-10 focus:outline-none"
       >
         <slot name="items" :items="items">
           <template v-for="item in items" :key="item.label + 'link'">
@@ -119,6 +119,10 @@ const props = defineProps({
     default: 'sm',
     type: String as PropType<'xs' | 'sm' | 'md'>,
   },
+  buttonClass: {
+    default: 'flex',
+    type: [String, Array, Object],
+  },
 });
 
 const menuPositionClass = computed(() => {