sprintify-ui 0.0.59 → 0.0.60

package/dist/sprintify-ui.es.js

@@ -9955,9 +9955,13 @@ const om = /* @__PURE__ */ Ne(Zf, [["render", rm], ["__scopeId", "data-v-e5ae83e
       return y === void 0 || y === o;
     }
     const I = E(() => g(r.modelValue) || !S() ? l : r.modelValue);
-    Vt(a.value, () => {
-      b.value = A();
-    }), ge(() => {
+    Vt(
+      a,
+      () => {
+        b.value = A();
+      },
+      { attributes: !1, childList: !0 }
+    ), ge(() => {
       b.value = A();
     });
     function A() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprintify-ui",
-  "version": "0.0.59",
+  "version": "0.0.60",
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",
     "build-fast": "rimraf dist && vite build",

package/src/components/BaseSelect.stories.js

@@ -33,7 +33,14 @@ const Template = (args) => ({
     // For optional, make sure the default option is selected
     // For required, try to submit, it should be prevented
     const value = ref('test');
-    return { args, value, onSubmit };
+
+    // Test if dynamically added options are available & selected
+    const showTest = ref(false);
+    setTimeout(() => {
+      showTest.value = true;
+    }, 3000);
+
+    return { args, value, showTest, onSubmit };
   },
   template: `
   <form @submit.prevent="onSubmit" class="border-none">
@@ -42,6 +49,7 @@ const Template = (args) => ({
       <option value="javascript">JavaScript</option>
       <option value="typescript">Typescript</option>
       <option value="golang">Golang</option>
+      <option v-if="showTest" value="test">Test</option>
     </BaseSelect>
     <button type="submit" class="btn btn-primary mt-5">Submit</button>
   </form>

package/src/components/BaseSelect.vue

@@ -113,9 +113,13 @@ const modelValueInternal = computed(() => {
 /**
  * Checks if the current modelValue is valid
  */
-useMutationObserver(select.value, () => {
-  options.value = getOptions();
-});
+useMutationObserver(
+  select,
+  () => {
+    options.value = getOptions();
+  },
+  { attributes: false, childList: true }
+);
 
 onMounted(() => {
   options.value = getOptions();