review / add missing doc + check attributes

src/BIMDataComponents/BIMDataPieSpinner/BIMDataPieSpinner.vue

@@ -6,7 +6,7 @@
       fill="transparent"
       :width="width"
       :height="width"
-      style="transform: rotate(-90deg);"
+      style="transform: rotate(-90deg)"
     >
       <circle
         :cx="width / 2"
@@ -20,11 +20,16 @@
         --dasharray: ${dashArray};
         --dashoffset-from: ${dashOffsetFrom};
         --dashoffset-to: ${dashOffsetTo};`"
-        @animationiteration="$emit('lap', (delay * laps - $event.elapsedTime) / delay)"
+        @animationiteration="
+          $emit('lap', (delay * laps - $event.elapsedTime) / delay)
+        "
         @animationend="$emit('stop')"
       />
     </svg>
-    <div class="bimdata-pie-spinner__inside" :style="{width : width + 'px', height: width + 'px'}">
+    <div
+      class="bimdata-pie-spinner__inside"
+      :style="{ width: width + 'px', height: width + 'px' }"
+    >
       <slot />
     </div>
   </div>
@@ -35,44 +40,41 @@ export default {
   props: {
     width: {
       type: Number,
-      default: 22
+      default: 22,
     },
     strokeWidth: {
       type: Number,
-      default: 2
+      default: 2,
     },
     stroke: {
       type: String,
-      default: "currentColor"
+      default: "currentColor",
     },
     delay: {
       type: Number,
-      default: 1
+      default: 1,
     },
     laps: {
       type: [Number, String],
-      default: 1
+      default: 1,
     },
     dashOffsetFrom: {
       type: Number,
-      default: 0
+      default: 0,
     },
     dashOffsetTo: {
       type: Number,
-      default: 63
+      default: 63,
     },
     dashArray: {
       type: Number,
-      default: 63
-    }
+      default: 63,
+    },
   },
-  emits: [
-    'lap',
-    'stop'
-  ]
+  emits: ["lap", "stop"],
 };
 </script>
 
 <style lang="scss">
 @import "./_BIMDataPieSpinner.scss";
-</style>
+</style>

src/web/views/Components/Card/props-data.js

@@ -19,4 +19,10 @@ export default [
     "215px",
     "Use this props to change the width of the card.",
   ],
+  [
+    "borderRadius",
+    "String",
+    "0px",
+    "Use this props to change the border radius of the card.",
+  ],
 ];

src/web/views/Components/Charts/Charts.vue

@@ -74,6 +74,7 @@
             :firstBarDistanceFromCenter="
               Number(barDistanceFromCenterMultiplePie)
             "
+            :size="Number(multiplePieSize)"
             :barStrokeWidth="Number(barStrokeWidthMultiplePie)"
             :interBarDistance="Number(interBarDistance)"
             :placeholderBarStrokeWidth="Number(placeholderBarStrokeWidth)"
@@ -84,6 +85,12 @@
         </template>
 
         <template #parameters>
+          <BIMDataInput
+            margin="24px 0"
+            type="number"
+            placeholder="Size"
+            v-model="multiplePieSize"
+          />
           <BIMDataInput
             margin="24px 0"
             type="number"
@@ -127,6 +134,7 @@
               :firstBarDistanceFromCenter="{{
               barDistanceFromCenterMultiplePie
             }}"
+              :size="{{ multiplePieSize }}"
               :barStrokeWidth="{{ barStrokeWidthMultiplePie }}"
               :interBarDistance="{{ interBarDistance }}"
               :placeholderBarStrokeWidth="{{ placeholderBarStrokeWidth }}"
@@ -187,6 +195,7 @@ export default {
       placeholderBarStroke: "#D8D8D8",
       simplePiePropsData,
       multiplePiePropsData,
+      multiplePieSize: 200,
       values: [
         {
           color: "yellowgreen",

src/web/views/Components/Charts/multiple-pie-props-data.js

@@ -1,6 +1,12 @@
 /* eslint-disable */
 export default [
   [ "Name", "Type", "Default Value", "Description" ],
+  [
+    "size",
+    "Number",
+    "200",
+    "size of the graph"
+  ],
   [
     "barsData",
     "Array",

src/web/views/Components/Checkbox/Checkbox.vue

@@ -45,11 +45,19 @@
         </BIMDataText>
         <BIMDataTable :columns="propsData[0]" :rows="propsData.slice(1)" />
       </div>
+
+      <div class="m-t-12">
+        <BIMDataText component="h5" color="color-primary" margin="15px 0 10px">
+          Events:
+        </BIMDataText>
+        <BIMDataTable :columns="eventsData[0]" :rows="eventsData.slice(1)" />
+      </div>
     </div>
   </main>
 </template>
 
 <script>
+import eventsData from "./events-data.js";
 import propsData from "./props-data.js";
 
 import BIMDataTable from "../../../../../src/BIMDataComponents/BIMDataTable/BIMDataTable.vue";
@@ -69,8 +77,10 @@ export default {
       checked: false,
       checkboxTextChecked: true,
       checkboxDisabledChecked: false,
+      margin: "0px",
       // Data
       propsData,
+      eventsData,
     };
   },
   methods: {

src/web/views/Components/Checkbox/events-data.js

@@ -0,0 +1,8 @@
+/* eslint-disable */
+export default [
+  ["Event", "Payload"],
+  [
+    "update:modelValue",
+    "The clicked checkbox state.",
+  ],
+];

src/web/views/Components/Checkbox/props-data.js

@@ -17,6 +17,12 @@ export default [
     "disabled",
     "Boolean",
     "false",
-    "Use this props to disabled the checkbox",
+    "Use this props to disable the checkbox",
+  ],
+  [
+    "margin",
+    "String",
+    "0px",
+    "Use this props to set a margin",
   ],
 ];

src/web/views/Components/ColorSelector/events-data.js

@@ -3,6 +3,6 @@ export default [
   ["Event", "Payload"],
   [
     "update:modelValue",
-    "The value of the clicked color.",
+    "The clicked color value.",
   ],
 ];

src/web/views/Components/DropdownList/DropdownList.vue

@@ -136,6 +136,13 @@
         >
         <BIMDataTable :columns="slotData[0]" :rows="slotData.slice(1)" />
       </div>
+
+      <div class="m-t-24">
+        <BIMDataText component="h5" color="color-primary" margin="15px 0 10px"
+          >Events:</BIMDataText
+        >
+        <BIMDataTable :columns="eventData[0]" :rows="eventData.slice(1)" />
+      </div>
     </div>
   </main>
 </template>
@@ -218,6 +225,13 @@ export default {
           "'up', 'down', 'right' or 'left' values",
           "Use this props to choose the opening of the submenu.",
         ],
+        [
+          "loading",
+          "Boolean",
+          "false",
+          "",
+          "Use this props to display a loader.",
+        ],
         [
           "closeOnElementClick",
           "Boolean",
@@ -249,6 +263,10 @@ export default {
         ],
         ["element", "Use this slot to custum the elements list"],
       ],
+      eventData: [
+        ["Event name", "Description"],
+        ["element-click", "Use this event to get the clicked element data"],
+      ],
     };
   },
   computed: {

src/web/views/Components/DropdownMenu/DropdownMenu.vue

@@ -147,10 +147,10 @@ export default {
     return {
       checkboxDisabledChecked: false,
       checkboxTwoLevelChecked: false,
-      checkboxHeaderChecked: false,
+      checkboxHeaderChecked: true,
       checkboxDisabledHeader: true,
       checkboxAfterHeaderChecked: false,
-      checkboxElementSlotChecked: false,
+      checkboxElementSlotChecked: true,
       customListCheckbox: false,
       dropdownOptions: {
         transition: ["up", "down"],

src/web/views/Components/Icons/Icons.vue

@@ -232,6 +232,14 @@ export default {
           "Several custom size are available to handle the custom icons size.",
           "xxxs, xxs, xs, s, m, l, xl, xxl, xxxl.",
         ],
+        [
+          "stroke",
+          "Boolean",
+          "",
+          "false",
+          "Make icon body transparent, keep border drawn.",
+        ],
+        ["fill", "Boolean", "", "true", "Fill the icon with color."],
       ],
       iconsSizeData: [
         ["Size value", "Output"],

src/web/views/Components/Illustrations/Illustrations.vue

@@ -38,13 +38,21 @@
           </pre>
         </template>
       </ComponentCode>
+
+      <div class="m-t-12">
+        <BIMDataText component="h5" color="color-primary" margin="15px 0 10px"
+          >Props:</BIMDataText
+        >
+        <BIMDataTable :columns="propsData[0]" :rows="propsData.slice(1)" />
+      </div>
     </div>
   </main>
 </template>
 
 <script>
 import Illustrations from "./Illustrations.js";
 import ComponentCode from "../../Elements/ComponentCode/ComponentCode.vue";
+import BIMDataTable from "../../../../../src/BIMDataComponents/BIMDataTable/BIMDataTable.vue";
 
 import BIMDataIllustration from "../../../../../src/BIMDataComponents/BIMDataIllustration/BIMDataIllustration.vue";
 import BIMDataText from "../../../../../src/BIMDataComponents/BIMDataText/BIMDataText.vue";
@@ -53,6 +61,7 @@ export default {
   components: {
     ComponentCode,
     BIMDataIllustration,
+    BIMDataTable,
     BIMDataText,
   },
   data() {
@@ -64,6 +73,25 @@ export default {
         x: "23",
         y: "30",
       },
+      propsData: [
+        ["Props", "Type", "Required", "Default value", "Description"],
+        ["x", "[Number, String]", "", "90", "Specify the width"],
+        ["y", "[Number, String]", "", "90", "Specify the height"],
+        [
+          "customWidth",
+          "[Number, String]",
+          "",
+          "90",
+          "Specify the width, won't affect the viewBox",
+        ],
+        [
+          "customHeight",
+          "[Number, String]",
+          "",
+          "90",
+          "Specify the height, won't affect the viewBox",
+        ],
+      ],
     };
   },
   methods: {

src/web/views/Components/Input/events-data.js

@@ -1,8 +1,10 @@
 /* eslint-disable */
 export default [
   [ "Event name", "Payload" ],
-  [ "update:modelValue", "The value of the input." ],
+  [ "update:modelValue", "The input value." ],
   [ "blur", "The native blur event." ],
   [ "keypress", "The native keypress event." ],
   [ "focus", "The native focus event." ],
+  ["change", "To catch the Event object"],
+
 ];

src/web/views/Components/Loaders/Loaders.vue

@@ -84,7 +84,7 @@
 
       <ComponentCode class="m-t-12" language="javascript">
         <template #module>
-          <BIMDataPieSpinner :delay="50">
+          <BIMDataPieSpinner :delay="50" @lap="lap = $event">
             <BIMDataIcon name="close" size="xxxs" class="fill-primary" />
           </BIMDataPieSpinner>
         </template>
@@ -151,6 +151,7 @@ export default {
   },
   data() {
     return {
+      lap: 0,
       propsBIMDataLoading: [
         ["Props", "Type", "Default value", "Description"],
         ["message", "String", "loading...", "custom waiting message"],

src/web/views/Components/ModelPreview/ModelPreview.vue

@@ -9,8 +9,8 @@
           <BIMDataModelPreview
             :type="type"
             :previewUrl="imgUrl"
-            :width="width"
-            :height="height"
+            :width="Number(width)"
+            :height="Number(height)"
             :backgroundColor="bgColor"
             :zoomFactor="zoomFactor"
           />