@appscode/design-system 2.5.8 → 2.5.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appscode/design-system",
-  "version": "2.5.8",
+  "version": "2.5.9",
   "description": "A design system for Appscode websites and dashboards made using Bulma",
   "main": "main.scss",
   "scripts": {

package/vue-components/v3/form-fields/SingleStepFormArray.vue

@@ -24,6 +24,7 @@ interface Props {
   updateEditFields?: Function;
   saveNewItem?: Function;
   onDeleteItem: Function;
+  initiallyHidden?: boolean;
 }
 
 const prop = withDefaults(defineProps<Props>(), {
@@ -40,13 +41,14 @@ const prop = withDefaults(defineProps<Props>(), {
   updateEditFields: () => () => ({}),
   saveEditedItem: () => () => ({}),
   onDeleteItem: () => () => ({}),
+  initiallyHidden: false,
 });
 
 const Accordion = defineAsyncComponent(() => import("./Accordion.vue"));
 
 const expandableFieldIndex = ref(-1);
 const editFieldIndex = ref(-1);
-const isFormHidden = ref(true);
+const isFormHidden = ref(prop.initiallyHidden);
 const isSavingNewElement = ref(false);
 const dataForTable = defineModel<Array<AcTableRow>>({ required: true });
 
@@ -89,6 +91,10 @@ function readableTime(utcTime: unknown) {
   if (typeof utcTime === "string") return new Date(utcTime).toLocaleString();
   else return utcTime;
 }
+
+function collapseForm() {
+  if (prop.isCollapsible) isFormHidden.value = !isFormHidden.value;
+}
 </script>
 
 <template>
@@ -102,7 +108,7 @@ function readableTime(utcTime: unknown) {
           :isRequired="isRequired"
           :errors="errors"
           :isFormHidden="isFormHidden"
-          @click="isFormHidden = !isFormHidden"
+          @click="collapseForm()"
         />
         <div class="buttons pb-5">
           <!-- save button start -->
@@ -147,7 +153,7 @@ function readableTime(utcTime: unknown) {
           :isRequired="isRequired"
           :errors="errors"
           :isFormHidden="isFormHidden"
-          @click="isFormHidden = !isFormHidden"
+          @click="collapseForm()"
         />
         <button
           v-if="!disabled && !isCreateDisabled"