feat(main): add height prop for GDialog

Author: MichaelGitArt

src/components/GDialog.vue

@@ -16,8 +16,9 @@
           :style="styles"
         >
           <GDialogContent
-            :width="width"
             :max-width="maxWidth"
+            :width="width"
+            :height="height"
             :scrollable="scrollable"
             :depressed="depressed"
           >
@@ -89,6 +90,11 @@ export default defineComponent({
       default: 'auto',
     },
 
+    height: {
+      type: [String, Number],
+      default: 'auto',
+    },
+
     scrollable: {
       type: Boolean,
       default: false,

src/components/GDialogContent.vue

@@ -6,7 +6,7 @@
 
 <script lang="ts">
 import { computed, defineComponent } from 'vue'
-import { useWidthStyle } from '../composable/widthStyle'
+import { useSizeStyle } from '../composable/sizeStyle'
 
 export default defineComponent({
   name: 'GDialogContent',
@@ -21,6 +21,11 @@ export default defineComponent({
       default: 'auto',
     },
 
+    height: {
+      type: [String, Number],
+      default: 'auto',
+    },
+
     scrollable: {
       type: Boolean,
       default: false,
@@ -36,7 +41,7 @@ export default defineComponent({
   },
 
   setup(props) {
-    const { widthStyles: styles } = useWidthStyle(props)
+    const { sizeStyles: styles } = useSizeStyle(props)
     const classes = computed(() => [
       'q-dialog-content',
       {

src/composable/widthStyle.ts renamed to src/composable/sizeStyle.ts

@@ -3,13 +3,14 @@ import { computed } from 'vue'
 // helpers
 import { convertToUnit } from '../helper'
 
-export interface WidthProps {
+export interface SizeProps {
   maxWidth?: number | string
   width?: number | string
+  height?: number | string
 }
 
-export const useWidthStyle = (props: WidthProps) => {
-  const widthStyles = computed(() => ({
+export const useSizeStyle = (props: SizeProps) => {
+  const sizeStyles = computed(() => ({
     maxWidth:
         props.maxWidth === 'none'
           ? undefined
@@ -19,9 +20,14 @@ export const useWidthStyle = (props: WidthProps) => {
         props.width === 'auto'
           ? undefined
           : convertToUnit(props.width),
+
+    height:
+        props.height === 'auto'
+          ? undefined
+          : convertToUnit(props.height),
   }))
 
   return {
-    widthStyles,
+    sizeStyles,
   }
 }