Merge branch 'main' of https://github.com/dzangolab/vue into refactor…

…/components-menu

apps/demo/src/locales/en/form.json

@@ -3,6 +3,9 @@
     "submit": "Submit"
   },
   "errors": {
+    "checkbox": {
+      "min": "Please select at least {min} options"
+    },
     "daysInput": {
       "invalid": "Please provide number of days within a year"
     },
@@ -40,26 +43,32 @@
     }
   },
   "label": {
+    "accept": "Accept the terms and conditions to proceed",
     "appointmentDate": "Appointment date",
     "appointmentTime": "Appointment time",
     "arrivalDate": "Arrival date",
+    "assumptions": "Assumptions",
     "availableDatetime": "Available datetime",
     "basicInput": "Basic",
     "bike": "Bike",
     "car": "Car",
+    "checkbox": "Checkbox input",
+    "consequences": "Consequences",
     "contentElement": "Content element",
     "customColsRowsInput": "With cols and rows props",
     "customErrorMessageInput": "With custom error message",
     "customFormat": "Custom format",
     "customValidationInput": "With custom validation",
     "customStyleInput": "Custom style",
+    "dailySynchro": "Select the sections that should be in the daily synchro",
     "dateOfBirth": "Date of birth",
     "datePicker": "Date picker",
     "dateRange": "Date range",
     "dateTime": "Date and time",
     "dateTimePicker": "Datetime picker",
     "daysInput": "Days input",
     "debouncedTypeahead": "With debounce time prop",
+    "deliverableList": "A list of your daily deliverables",
     "disabled": "Disabled",
     "disableWeekDays": "Disable week days",
     "disabledMultiSelect": "Disabled multiselect",
@@ -68,6 +77,7 @@
     "expiresAfter": "Expires after",
     "female": "Female",
     "gender": "Gender",
+    "generalQuestions": "General questions",
     "getStarted": "Get started",
     "iconSlot": "Icon slot",
     "input": "Input",
@@ -83,9 +93,12 @@
     "monthAndYearPicker": "Month and year picker",
     "monthPicker": "Month picker",
     "multiCalendars": "Multicalendar",
+    "multiCheckbox": "Multiple checkbox input",
     "multiSelect": "Multiselect",
+    "next": "Next",
     "number": "Number",
     "one": "One",
+    "other": "Other",
     "password": "Password",
     "pickupDate": "Pickup date",
     "presentationDate": "Presentation date",
@@ -94,7 +107,9 @@
     "size": "Size",
     "select": "Select",
     "selection": "Selection",
+    "solutions": "Solutions",
     "submit": "Submit",
+    "summary": "Summary",
     "switch": "Switch",
     "textarea": "Textarea",
     "textInput": "Text input",
@@ -108,6 +123,7 @@
     "valid": "Show valid state",
     "vehicle": "Vehicle",
     "withI18n": "With i18n",
+    "workInProgress": "Work in progress",
     "year": "Year",
     "yearPicker": "Year picker"
   },

apps/demo/src/locales/en/ui.json

@@ -129,6 +129,19 @@
       "withI18n": "With i18n"
     }
   },
+  "data": {
+    "label": {
+      "email": "Email",
+      "name": "Name"
+    },
+    "title": "Data",
+    "usage": {
+      "basic": "Basic",
+      "displayObject": "Display value from object",
+      "separatorSlot": "With separator slot",
+      "structuredData": "Rendering structured data"
+    }
+  },
   "divider": {
     "title": "Divider",
     "usage": {

apps/demo/src/locales/fr/form.json

@@ -40,26 +40,32 @@
     }
   },
   "label": {
+    "accept": "Accept the terms and conditions to proceed",
     "appointmentDate": "Appointment date[fr]",
     "appointmentTime": "Appointment time[fr]",
     "arrivalDate": "Arrival date[fr]",
+    "assumptions": "Assumptions",
     "availableDatetime": "Available datetime[fr]",
     "basicInput": "Basic[fr]",
     "bike": "Bike",
     "car": "Car",
+    "checkbox": "Checkbox input",
+    "consequences": "Consequences",
     "contentElement": "Content element",
     "customColsRowsInput": "With cols and rows props[fr]",
     "customErrorMessageInput": "With custom error message[fr]",
     "customFormat": "Custom format[fr]",
     "customValidationInput": "With custom validation[fr]",
     "customStyleInput": "Custom style[fr]",
+    "dailySynchro": "Select the sections that should be in the daily synchro",
     "dateOfBirth": "Date of birth[fr]",
     "datePicker": "Date picker[fr]",
     "dateRange": "Date range[fr]",
     "dateTime": "Date and time",
     "dateTimePicker": "Datetime picker[fr]",
     "daysInput": "Days input",
     "debouncedTypeahead": "With debounce time prop",
+    "deliverableList": "A list of your daily deliverables",
     "disabledMultiSelect": "Disabled multiselect[fr]",
     "disabled": "Disabled[fr]",
     "disableWeekDays": "Disable week days[fr]",
@@ -68,6 +74,7 @@
     "expiresAfter": "Expires after",
     "female": "Female",
     "gender": "Gender",
+    "generalQuestions": "General questions",
     "getStarted": "Get started",
     "iconSlot": "Icon slot",
     "input": "Input[fr]",
@@ -83,9 +90,12 @@
     "monthAndYearPicker": "Month and year picker[fr]",
     "monthPicker": "Month picker[fr]",
     "multiCalendars": "Multicalendar[fr]",
+    "multiCheckbox": "Multiple checkbox input",
     "multiSelect": "Multiselect[fr]",
+    "next": "Next",
     "number": "Number[fr]",
     "one": "One",
+    "other": "Other",
     "password": "Password[fr]",
     "pickupDate": "Pickup date[fr]",
     "presentationDate": "Presentation date[fr]",
@@ -94,7 +104,9 @@
     "size": "Size",
     "select": "Select[fr]",
     "selection": "Selection",
+    "solutions": "Solutions",
     "submit": "Submit",
+    "summary": "Summary",
     "switch": "Switch[fr]",
     "textarea": "Textarea[fr]",
     "textInput": "Text input[fr]",
@@ -108,6 +120,7 @@
     "valid": "Show valid state[fr]",
     "vehicle": "Vehicle",
     "withI18n": "With i18n[fr]",
+    "workInProgress": "Work in progress",
     "year": "Year[fr]",
     "yearPicker": "Year picke[fr]"
   },

apps/demo/src/locales/fr/ui.json

@@ -129,6 +129,19 @@
       "withI18n": "With i18n"
     }
   },
+  "data": {
+    "label": {
+      "email": "Email",
+      "name": "Name"
+    },
+    "title": "Data",
+    "usage": {
+      "basic": "Basic",
+      "displayObject": "Display value from object",
+      "separatorSlot": "With separator slot",
+      "structuredData": "Rendering structured data"
+    }
+  },
   "divider": {
     "title": "Divider",
     "usage": {

apps/demo/src/router/form.ts

@@ -1,3 +1,4 @@
+const CheckboxInput = () => import("@/views/Form/checkboxInput/Index.vue");
 const DatePicker = () => import("@/views/Form/datePicker/Index.vue");
 const DaysInput = () => import("@/views/Form/daysInput/Index.vue");
 const EditableContent = () => import("@/views/Form/editableContent/Index.vue");
@@ -17,6 +18,11 @@ const routes = [
   {
     path: "/form",
     children: [
+      {
+        component: CheckboxInput,
+        name: "checkboxInput",
+        path: "checkbox-input",
+      },
       {
         component: DatePicker,
         name: "datePicker",

apps/demo/src/router/ui.ts

@@ -4,6 +4,7 @@ const Button = () => import("@/views/UI/button/Index.vue");
 const Card = () => import("@/views/UI/card/Index.vue");
 const ConfirmationModal = () =>
   import("@/views/UI/confirmationModal/Index.vue");
+const Data = () => import("@/views/UI/data/Index.vue");
 const Divider = () => import("@/views/UI/divider/Index.vue");
 const Dropdown = () => import("@/views/UI/dropdown/Index.vue");
 const GridContainer = () => import("@/views/UI/gridContainer/Index.vue");
@@ -64,6 +65,11 @@ const routes = [
         name: "confirmationModal",
         path: "confirmation-modal",
       },
+      {
+        component: Data,
+        name: "data",
+        path: "data",
+      },
       {
         component: GridContainer,
         name: "gridContainer",

apps/demo/src/views/Form/FormPage.vue

@@ -89,6 +89,10 @@ const menu = [
   {
     name: t("form.label.selection"),
     children: [
+      {
+        name: t("form.label.checkbox"),
+        routeName: "checkboxInput",
+      },
       {
         name: t("form.label.radio"),
         routeName: "radioInput",