project-booster-vue 8.115.6 → 8.115.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-booster-vue",
-  "version": "8.115.6",
+  "version": "8.115.7",
   "private": false,
   "scripts": {
     "test:unit": "vue-cli-service test:unit --forceExit --detectOpenHandles",

package/src/components/question/dimensions-input/PbDimensionsInput.vue

@@ -62,7 +62,7 @@
             </div>
           </m-flex>
         </m-flex>
-        <m-flex class="pb-dimensions-input__buttons-container" direction="column">
+        <m-flex class="pb-dimensions-input__buttons-container" direction="column" align-items="center">
           <m-button
             class="pb-dimensions-input__button"
             :label="computedPayload.viewModel.actionLabel"
@@ -70,6 +70,15 @@
             size="l"
             @click="handleFormSubmit"
           />
+          <m-link
+            v-if="payload.skippable"
+            class="pb-dimensions-input__link"
+            :label="payload.skippable.label"
+            width="full"
+            size="l"
+            @click="skipQuestion"
+            :theme="payload.skippable.theme"
+          />
         </m-flex>
       </m-flex>
     </form>
@@ -266,7 +275,17 @@ export default {
         ],
       });
     });
-
+    const skipQuestion = () => {
+      /**
+       * Emitted when step is completed
+       * @event dynamic event name according to completedEventName prop
+       * @type {Event}
+       */
+      emit(props.completedEventName, {
+        answers: props.payload?.skippable?.defaultAnswer ? [props.payload?.skippable?.defaultAnswer] : [],
+        nextStep: props.payload?.skippable?.nextStep,
+      });
+    };
     onMounted(() => {
       setTimeout(() => {
         pbDimensionsInputLengthInput.value.focus();
@@ -282,6 +301,7 @@ export default {
       computedPayload,
       pbDimensionsInputLengthInput,
       handleFormSubmit,
+      skipQuestion,
     };
   },
 };
@@ -415,5 +435,9 @@ $responsive-breakpoint: 'm';
     position: sticky;
     z-index: 1;
   }
+
+  &__link {
+    margin-top: $mu250;
+  }
 }
 </style>

package/src/components/question/space-input/PbSpaceInput.vue

@@ -56,7 +56,7 @@
           </m-flexy-col>
         </m-flex>
 
-        <m-flex class="pb-space-input__buttons-container" direction="column">
+        <m-flex class="pb-space-input__buttons-container" direction="column" align-items="center">
           <m-button
             class="pb-space-input__button"
             :label="computedPayload.viewModel.actionLabel"
@@ -64,6 +64,15 @@
             size="l"
             @click="handleFormSubmit"
           />
+          <m-link
+            v-if="payload.skippable"
+            class="pb-space-input__link"
+            :label="payload.skippable.label"
+            :theme="payload.skippable.theme"
+            width="full"
+            size="l"
+            @click="skipQuestion"
+          />
         </m-flex>
       </m-flex>
     </form>
@@ -233,6 +242,17 @@ export default {
         ],
       });
     });
+    const skipQuestion = () => {
+      /**
+       * Emitted when step is completed
+       * @event dynamic event name according to completedEventName prop
+       * @type {Event}
+       */
+      emit(props.completedEventName, {
+        answers: props.payload?.skippable?.defaultAnswer ? [props.payload?.skippable?.defaultAnswer] : [],
+        nextStep: props.payload?.skippable?.nextStep,
+      });
+    };
 
     const isShowingFooter = computed(() => {
       return computedPayload.value.viewModel.footer;
@@ -254,6 +274,7 @@ export default {
       handleFormSubmit,
       isShowingFooter,
       decorateBoolean,
+      skipQuestion,
     };
   },
 };
@@ -382,5 +403,9 @@ $responsive-breakpoint: 'm';
     position: sticky;
     z-index: 1;
   }
+
+  &__link {
+    margin-top: $mu250;
+  }
 }
 </style>