@vuetify/nightly 4.0.0-dev-20230426.0 → 4.0.0-dev-20230427.0

package/lib/blueprints/index.d.ts

@@ -116,7 +116,7 @@ type DateOptions = {
     };
 };
 
-type IconValue = string | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 interface IconAliases {
     [name: string]: IconValue;

package/lib/blueprints/md1.d.ts

@@ -116,7 +116,7 @@ type DateOptions = {
     };
 };
 
-type IconValue = string | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 interface IconAliases {
     [name: string]: IconValue;

package/lib/blueprints/md2.d.ts

@@ -116,7 +116,7 @@ type DateOptions = {
     };
 };
 
-type IconValue = string | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 interface IconAliases {
     [name: string]: IconValue;

package/lib/blueprints/md3.d.ts

@@ -116,7 +116,7 @@ type DateOptions = {
     };
 };
 
-type IconValue = string | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 interface IconAliases {
     [name: string]: IconValue;

package/lib/components/VAlert/VAlert.mjs

@@ -8,6 +8,8 @@ import { VBtn } from "../VBtn/index.mjs";
 import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
 import { VIcon } from "../VIcon/index.mjs"; // Composables
 import { genOverlays, makeVariantProps, useVariant } from "../../composables/variant.mjs";
+import { IconValue } from "../../composables/icons.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
 import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
@@ -18,8 +20,7 @@ import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useLocale } from "../../composables/locale.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs";
-import { useTextColor } from "../../composables/color.mjs";
-import { IconValue } from "../../composables/icons.mjs"; // Utilities
+import { useTextColor } from "../../composables/color.mjs"; // Utilities
 import { computed, toRef } from 'vue';
 import { genericComponent } from "../../util/index.mjs"; // Types
 const allowedTypes = ['success', 'info', 'warning', 'error'];
@@ -57,6 +58,7 @@ export const VAlert = genericComponent()({
       type: String,
       validator: val => allowedTypes.includes(val)
     },
+    ...makeComponentProps(),
     ...makeDensityProps(),
     ...makeDimensionProps(),
     ...makeElevationProps(),
@@ -139,8 +141,8 @@ export const VAlert = genericComponent()({
           [`v-alert--border-${props.border === true ? 'start' : props.border}`]: true
         }, {
           'v-alert--prominent': props.prominent
-        }, themeClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, variantClasses.value],
-        "style": [colorStyles.value, dimensionStyles.value, locationStyles.value],
+        }, themeClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, variantClasses.value, props.class],
+        "style": [colorStyles.value, dimensionStyles.value, locationStyles.value, props.style],
         "role": "alert"
       }, {
         default: () => [genOverlays(false, 'v-alert'), props.border && _createVNode("div", {

package/lib/components/VAlert/VAlert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VAlert.mjs","names":["VAlertTitle","VBtn","VDefaultsProvider","VIcon","genOverlays","makeVariantProps","useVariant","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useLocale","useProxiedModel","useTextColor","IconValue","computed","toRef","genericComponent","allowedTypes","VAlert","name","props","border","type","Boolean","String","validator","val","includes","borderColor","closable","closeIcon","default","closeLabel","icon","Function","Object","modelValue","prominent","title","text","variant","emits","e","value","setup","_ref","emit","slots","isActive","undefined","variantProps","color","themeClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","textColorClasses","textColorStyles","t","closeProps","onClick","hasPrepend","prepend","hasTitle","hasText","hasClose","close","_createVNode","tag","density","size","append","_mergeProps"],"sources":["../../../src/components/VAlert/VAlert.tsx"],"sourcesContent":["// Styles\nimport './VAlert.sass'\n\n// Components\nimport { VAlertTitle } from './VAlertTitle'\nimport { VBtn } from '@/components/VBtn'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useTextColor } from '@/composables/color'\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { MakeSlots } from '@/util'\n\nconst allowedTypes = ['success', 'info', 'warning', 'error'] as const\n\ntype ContextualType = typeof allowedTypes[number]\n\nexport type VAlertSlots = MakeSlots<{\n  default: []\n  prepend: []\n  title: []\n  text: []\n  append: []\n  close: []\n}>\n\nexport const VAlert = genericComponent<VAlertSlots>()({\n  name: 'VAlert',\n\n  props: {\n    border: {\n      type: [Boolean, String] as PropType<boolean | 'top' | 'end' | 'bottom' | 'start'>,\n      validator: (val: boolean | string) => {\n        return typeof val === 'boolean' || [\n          'top',\n          'end',\n          'bottom',\n          'start',\n        ].includes(val)\n      },\n    },\n    borderColor: String,\n    closable: Boolean,\n    closeIcon: {\n      type: IconValue,\n      default: '$close',\n    },\n    closeLabel: {\n      type: String,\n      default: '$vuetify.close',\n    },\n    icon: {\n      type: [Boolean, String, Function, Object] as PropType<false | IconValue>,\n      default: null,\n    },\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    prominent: Boolean,\n    title: String,\n    text: String,\n    type: {\n      type: String as PropType<ContextualType>,\n      validator: (val: ContextualType) => allowedTypes.includes(val),\n    },\n\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeLocationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeVariantProps({ variant: 'flat' } as const),\n  },\n\n  emits: {\n    'click:close': (e: MouseEvent) => true,\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const icon = computed(() => {\n      if (props.icon === false) return undefined\n      if (!props.type) return props.icon\n\n      return props.icon ?? `$${props.type}`\n    })\n    const variantProps = computed(() => ({\n      color: props.color ?? props.type,\n      variant: props.variant,\n    }))\n\n    const { themeClasses } = provideTheme(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'borderColor'))\n    const { t } = useLocale()\n\n    const closeProps = computed(() => ({\n      'aria-label': t(props.closeLabel),\n      onClick (e: MouseEvent) {\n        isActive.value = false\n\n        emit('click:close', e)\n      },\n    }))\n\n    return () => {\n      const hasPrepend = !!(slots.prepend || icon.value)\n      const hasTitle = !!(slots.title || props.title)\n      const hasText = !!(props.text || slots.text)\n      const hasClose = !!(slots.close || props.closable)\n\n      return isActive.value && (\n        <props.tag\n          class={[\n            'v-alert',\n            props.border && {\n              'v-alert--border': !!props.border,\n              [`v-alert--border-${props.border === true ? 'start' : props.border}`]: true,\n            },\n            {\n              'v-alert--prominent': props.prominent,\n            },\n            themeClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            locationStyles.value,\n          ]}\n          role=\"alert\"\n        >\n          { genOverlays(false, 'v-alert') }\n\n          { props.border && (\n            <div\n              key=\"border\"\n              class={[\n                'v-alert__border',\n                textColorClasses.value,\n              ]}\n              style={ textColorStyles.value }\n            />\n          )}\n\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-alert__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  density={ props.density }\n                  icon={ icon.value }\n                  size={ props.prominent ? 44 : 28 }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !icon.value }\n                  defaults={{\n                    VIcon: {\n                      density: props.density,\n                      icon: icon.value,\n                      size: props.prominent ? 44 : 28,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          <div class=\"v-alert__content\">\n            { hasTitle && (\n              <VAlertTitle key=\"title\">\n                { slots.title?.() ?? props.title }\n              </VAlertTitle>\n            )}\n\n            { hasText && (slots.text?.() ?? props.text) }\n\n            { slots.default?.() }\n          </div>\n\n          { slots.append && (\n            <div key=\"append\" class=\"v-alert__append\">\n              { slots.append() }\n            </div>\n          )}\n\n          { hasClose && (\n            <div key=\"close\" class=\"v-alert__close\">\n              { !slots.close ? (\n                <VBtn\n                  key=\"close-btn\"\n                  icon={ props.closeIcon }\n                  size=\"x-small\"\n                  variant=\"text\"\n                  { ...closeProps.value }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"close-defaults\"\n                  defaults={{\n                    VBtn: {\n                      icon: props.closeIcon,\n                      size: 'x-small',\n                      variant: 'text',\n                    },\n                  }}\n                >\n                  { slots.close?.({ props: closeProps.value }) }\n                </VDefaultsProvider>\n              )}\n            </div>\n          )}\n        </props.tag>\n      )\n    }\n  },\n})\n\nexport type VAlert = InstanceType<typeof VAlert>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,WAAW;AAAA,SACXC,IAAI;AAAA,SACJC,iBAAiB;AAAA,SACjBC,KAAK,8BAEd;AAAA,SACSC,WAAW,EAAEC,gBAAgB,EAAEC,UAAU;AAAA,SACzCC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,iBAAiB,EAAEC,WAAW;AAAA,SAC9BC,iBAAiB,EAAEC,WAAW;AAAA,SAC9BC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,SAAS;AAAA,SACTC,eAAe;AAAA,SACfC,YAAY;AAAA,SACZC,SAAS,uCAElB;AACA,SAASC,QAAQ,EAAEC,KAAK,QAAQ,KAAK;AAAA,SAC5BC,gBAAgB,gCAEzB;AAIA,MAAMC,YAAY,GAAG,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,CAAU;AAarE,OAAO,MAAMC,MAAM,GAAGF,gBAAgB,EAAe,CAAC;EACpDG,IAAI,EAAE,QAAQ;EAEdC,KAAK,EAAE;IACLC,MAAM,EAAE;MACNC,IAAI,EAAE,CAACC,OAAO,EAAEC,MAAM,CAA2D;MACjFC,SAAS,EAAGC,GAAqB,IAAK;QACpC,OAAO,OAAOA,GAAG,KAAK,SAAS,IAAI,CACjC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,CACR,CAACC,QAAQ,CAACD,GAAG,CAAC;MACjB;IACF,CAAC;IACDE,WAAW,EAAEJ,MAAM;IACnBK,QAAQ,EAAEN,OAAO;IACjBO,SAAS,EAAE;MACTR,IAAI,EAAET,SAAS;MACfkB,OAAO,EAAE;IACX,CAAC;IACDC,UAAU,EAAE;MACVV,IAAI,EAAEE,MAAM;MACZO,OAAO,EAAE;IACX,CAAC;IACDE,IAAI,EAAE;MACJX,IAAI,EAAE,CAACC,OAAO,EAAEC,MAAM,EAAEU,QAAQ,EAAEC,MAAM,CAAgC;MACxEJ,OAAO,EAAE;IACX,CAAC;IACDK,UAAU,EAAE;MACVd,IAAI,EAAEC,OAAO;MACbQ,OAAO,EAAE;IACX,CAAC;IACDM,SAAS,EAAEd,OAAO;IAClBe,KAAK,EAAEd,MAAM;IACbe,IAAI,EAAEf,MAAM;IACZF,IAAI,EAAE;MACJA,IAAI,EAAEE,MAAkC;MACxCC,SAAS,EAAGC,GAAmB,IAAKT,YAAY,CAACU,QAAQ,CAACD,GAAG;IAC/D,CAAC;IAED,GAAG/B,gBAAgB,EAAE;IACrB,GAAGE,kBAAkB,EAAE;IACvB,GAAGE,kBAAkB,EAAE;IACvB,GAAGE,iBAAiB,EAAE;IACtB,GAAGE,iBAAiB,EAAE;IACtB,GAAGE,gBAAgB,EAAE;IACrB,GAAGE,YAAY,EAAE;IACjB,GAAGC,cAAc,EAAE;IACnB,GAAGf,gBAAgB,CAAC;MAAE+C,OAAO,EAAE;IAAO,CAAC;EACzC,CAAC;EAEDC,KAAK,EAAE;IACL,aAAa,EAAGC,CAAa,IAAK,IAAI;IACtC,mBAAmB,EAAGC,KAAc,IAAK;EAC3C,CAAC;EAEDC,KAAKA,CAAExB,KAAK,EAAAyB,IAAA,EAAmB;IAAA,IAAjB;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAC3B,MAAMG,QAAQ,GAAGrC,eAAe,CAACS,KAAK,EAAE,YAAY,CAAC;IACrD,MAAMa,IAAI,GAAGnB,QAAQ,CAAC,MAAM;MAC1B,IAAIM,KAAK,CAACa,IAAI,KAAK,KAAK,EAAE,OAAOgB,SAAS;MAC1C,IAAI,CAAC7B,KAAK,CAACE,IAAI,EAAE,OAAOF,KAAK,CAACa,IAAI;MAElC,OAAOb,KAAK,CAACa,IAAI,IAAK,IAAGb,KAAK,CAACE,IAAK,EAAC;IACvC,CAAC,CAAC;IACF,MAAM4B,YAAY,GAAGpC,QAAQ,CAAC,OAAO;MACnCqC,KAAK,EAAE/B,KAAK,CAAC+B,KAAK,IAAI/B,KAAK,CAACE,IAAI;MAChCkB,OAAO,EAAEpB,KAAK,CAACoB;IACjB,CAAC,CAAC,CAAC;IAEH,MAAM;MAAEY;IAAa,CAAC,GAAG3C,YAAY,CAACW,KAAK,CAAC;IAC5C,MAAM;MAAEiC,YAAY;MAAEC,WAAW;MAAEC;IAAe,CAAC,GAAG7D,UAAU,CAACwD,YAAY,CAAC;IAC9E,MAAM;MAAEM;IAAe,CAAC,GAAG5D,UAAU,CAACwB,KAAK,CAAC;IAC5C,MAAM;MAAEqC;IAAgB,CAAC,GAAG3D,YAAY,CAACsB,KAAK,CAAC;IAC/C,MAAM;MAAEsC;IAAiB,CAAC,GAAG1D,YAAY,CAACoB,KAAK,CAAC;IAChD,MAAM;MAAEuC;IAAe,CAAC,GAAGzD,WAAW,CAACkB,KAAK,CAAC;IAC7C,MAAM;MAAEwC;IAAgB,CAAC,GAAGxD,WAAW,CAACgB,KAAK,CAAC;IAC9C,MAAM;MAAEyC;IAAe,CAAC,GAAGvD,UAAU,CAACc,KAAK,CAAC;IAC5C,MAAM;MAAE0C,gBAAgB;MAAEC;IAAgB,CAAC,GAAGnD,YAAY,CAACG,KAAK,CAACK,KAAK,EAAE,aAAa,CAAC,CAAC;IACvF,MAAM;MAAE4C;IAAE,CAAC,GAAGtD,SAAS,EAAE;IAEzB,MAAMuD,UAAU,GAAGnD,QAAQ,CAAC,OAAO;MACjC,YAAY,EAAEkD,CAAC,CAAC5C,KAAK,CAACY,UAAU,CAAC;MACjCkC,OAAOA,CAAExB,CAAa,EAAE;QACtBM,QAAQ,CAACL,KAAK,GAAG,KAAK;QAEtBG,IAAI,CAAC,aAAa,EAAEJ,CAAC,CAAC;MACxB;IACF,CAAC,CAAC,CAAC;IAEH,OAAO,MAAM;MACX,MAAMyB,UAAU,GAAG,CAAC,EAAEpB,KAAK,CAACqB,OAAO,IAAInC,IAAI,CAACU,KAAK,CAAC;MAClD,MAAM0B,QAAQ,GAAG,CAAC,EAAEtB,KAAK,CAACT,KAAK,IAAIlB,KAAK,CAACkB,KAAK,CAAC;MAC/C,MAAMgC,OAAO,GAAG,CAAC,EAAElD,KAAK,CAACmB,IAAI,IAAIQ,KAAK,CAACR,IAAI,CAAC;MAC5C,MAAMgC,QAAQ,GAAG,CAAC,EAAExB,KAAK,CAACyB,KAAK,IAAIpD,KAAK,CAACS,QAAQ,CAAC;MAElD,OAAOmB,QAAQ,CAACL,KAAK,IAAA8B,YAAA,CAAArD,KAAA,CAAAsD,GAAA;QAAA,SAEV,CACL,SAAS,EACTtD,KAAK,CAACC,MAAM,IAAI;UACd,iBAAiB,EAAE,CAAC,CAACD,KAAK,CAACC,MAAM;UACjC,CAAE,mBAAkBD,KAAK,CAACC,MAAM,KAAK,IAAI,GAAG,OAAO,GAAGD,KAAK,CAACC,MAAO,EAAC,GAAG;QACzE,CAAC,EACD;UACE,oBAAoB,EAAED,KAAK,CAACiB;QAC9B,CAAC,EACDe,YAAY,CAACT,KAAK,EAClBU,YAAY,CAACV,KAAK,EAClBa,cAAc,CAACb,KAAK,EACpBe,gBAAgB,CAACf,KAAK,EACtBiB,eAAe,CAACjB,KAAK,EACrBkB,cAAc,CAAClB,KAAK,EACpBY,cAAc,CAACZ,KAAK,CACrB;QAAA,SACM,CACLW,WAAW,CAACX,KAAK,EACjBc,eAAe,CAACd,KAAK,EACrBgB,cAAc,CAAChB,KAAK,CACrB;QAAA,QACI;MAAO;QAAAZ,OAAA,EAAAA,CAAA,MAEVvC,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC,EAE7B4B,KAAK,CAACC,MAAM,IAAAoD,YAAA;UAAA,OAEN,QAAQ;UAAA,SACL,CACL,iBAAiB,EACjBX,gBAAgB,CAACnB,KAAK,CACvB;UAAA,SACOoB,eAAe,CAACpB;QAAK,QAEhC,EAECwB,UAAU,IAAAM,YAAA;UAAA,OACD,SAAS;UAAA,SAAO;QAAkB,IACvC,CAAC1B,KAAK,CAACqB,OAAO,GAAAK,YAAA,CAAAlF,KAAA;UAAA,OAER,cAAc;UAAA,WACR6B,KAAK,CAACuD,OAAO;UAAA,QAChB1C,IAAI,CAACU,KAAK;UAAA,QACVvB,KAAK,CAACiB,SAAS,GAAG,EAAE,GAAG;QAAE,WAAAoC,YAAA,CAAAnF,iBAAA;UAAA,OAI5B,kBAAkB;UAAA,YACX,CAAC2C,IAAI,CAACU,KAAK;UAAA,YACZ;YACRpD,KAAK,EAAE;cACLoF,OAAO,EAAEvD,KAAK,CAACuD,OAAO;cACtB1C,IAAI,EAAEA,IAAI,CAACU,KAAK;cAChBiC,IAAI,EAAExD,KAAK,CAACiB,SAAS,GAAG,EAAE,GAAG;YAC/B;UACF;QAAC,GACiBU,KAAK,CAACqB,OAAO,CAElC,EAEJ,EAAAK,YAAA;UAAA,SAEU;QAAkB,IACzBJ,QAAQ,IAAAI,YAAA,CAAArF,WAAA;UAAA,OACS;QAAO;UAAA2C,OAAA,EAAAA,CAAA,MACpBgB,KAAK,CAACT,KAAK,IAAI,IAAIlB,KAAK,CAACkB,KAAK;QAAA,EAEnC,EAECgC,OAAO,KAAKvB,KAAK,CAACR,IAAI,IAAI,IAAInB,KAAK,CAACmB,IAAI,CAAC,EAEzCQ,KAAK,CAAChB,OAAO,IAAI,IAGnBgB,KAAK,CAAC8B,MAAM,IAAAJ,YAAA;UAAA,OACH,QAAQ;UAAA,SAAO;QAAiB,IACrC1B,KAAK,CAAC8B,MAAM,EAAE,EAEnB,EAECN,QAAQ,IAAAE,YAAA;UAAA,OACC,OAAO;UAAA,SAAO;QAAgB,IACnC,CAAC1B,KAAK,CAACyB,KAAK,GAAAC,YAAA,CAAApF,IAAA,EAAAyF,WAAA;UAAA,OAEN,WAAW;UAAA,QACR1D,KAAK,CAACU,SAAS;UAAA,QACjB,SAAS;UAAA,WACN;QAAM,GACTmC,UAAU,CAACtB,KAAK,WAAA8B,YAAA,CAAAnF,iBAAA;UAAA,OAIjB,gBAAgB;UAAA,YACV;YACRD,IAAI,EAAE;cACJ4C,IAAI,EAAEb,KAAK,CAACU,SAAS;cACrB8C,IAAI,EAAE,SAAS;cACfpC,OAAO,EAAE;YACX;UACF;QAAC;UAAAT,OAAA,EAAAA,CAAA,MAECgB,KAAK,CAACyB,KAAK,GAAG;YAAEpD,KAAK,EAAE6C,UAAU,CAACtB;UAAM,CAAC,CAAC;QAAA,EAE/C,EAEJ;MAAA,EAEJ;IACH,CAAC;EACH;AACF,CAAC,CAAC"}
+{"version":3,"file":"VAlert.mjs","names":["VAlertTitle","VBtn","VDefaultsProvider","VIcon","genOverlays","makeVariantProps","useVariant","IconValue","makeComponentProps","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useLocale","useProxiedModel","useTextColor","computed","toRef","genericComponent","allowedTypes","VAlert","name","props","border","type","Boolean","String","validator","val","includes","borderColor","closable","closeIcon","default","closeLabel","icon","Function","Object","modelValue","prominent","title","text","variant","emits","e","value","setup","_ref","emit","slots","isActive","undefined","variantProps","color","themeClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","locationStyles","positionClasses","roundedClasses","textColorClasses","textColorStyles","t","closeProps","onClick","hasPrepend","prepend","hasTitle","hasText","hasClose","close","_createVNode","tag","class","style","density","size","append","_mergeProps"],"sources":["../../../src/components/VAlert/VAlert.tsx"],"sourcesContent":["// Styles\nimport './VAlert.sass'\n\n// Components\nimport { VAlertTitle } from './VAlertTitle'\nimport { VBtn } from '@/components/VBtn'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nconst allowedTypes = ['success', 'info', 'warning', 'error'] as const\n\ntype ContextualType = typeof allowedTypes[number]\n\nexport type VAlertSlots = {\n  default: []\n  prepend: []\n  title: []\n  text: []\n  append: []\n  close: []\n}\n\nexport const VAlert = genericComponent<VAlertSlots>()({\n  name: 'VAlert',\n\n  props: {\n    border: {\n      type: [Boolean, String] as PropType<boolean | 'top' | 'end' | 'bottom' | 'start'>,\n      validator: (val: boolean | string) => {\n        return typeof val === 'boolean' || [\n          'top',\n          'end',\n          'bottom',\n          'start',\n        ].includes(val)\n      },\n    },\n    borderColor: String,\n    closable: Boolean,\n    closeIcon: {\n      type: IconValue,\n      default: '$close',\n    },\n    closeLabel: {\n      type: String,\n      default: '$vuetify.close',\n    },\n    icon: {\n      type: [Boolean, String, Function, Object] as PropType<false | IconValue>,\n      default: null,\n    },\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    prominent: Boolean,\n    title: String,\n    text: String,\n    type: {\n      type: String as PropType<ContextualType>,\n      validator: (val: ContextualType) => allowedTypes.includes(val),\n    },\n\n    ...makeComponentProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeLocationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeVariantProps({ variant: 'flat' } as const),\n  },\n\n  emits: {\n    'click:close': (e: MouseEvent) => true,\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const icon = computed(() => {\n      if (props.icon === false) return undefined\n      if (!props.type) return props.icon\n\n      return props.icon ?? `$${props.type}`\n    })\n    const variantProps = computed(() => ({\n      color: props.color ?? props.type,\n      variant: props.variant,\n    }))\n\n    const { themeClasses } = provideTheme(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'borderColor'))\n    const { t } = useLocale()\n\n    const closeProps = computed(() => ({\n      'aria-label': t(props.closeLabel),\n      onClick (e: MouseEvent) {\n        isActive.value = false\n\n        emit('click:close', e)\n      },\n    }))\n\n    return () => {\n      const hasPrepend = !!(slots.prepend || icon.value)\n      const hasTitle = !!(slots.title || props.title)\n      const hasText = !!(props.text || slots.text)\n      const hasClose = !!(slots.close || props.closable)\n\n      return isActive.value && (\n        <props.tag\n          class={[\n            'v-alert',\n            props.border && {\n              'v-alert--border': !!props.border,\n              [`v-alert--border-${props.border === true ? 'start' : props.border}`]: true,\n            },\n            {\n              'v-alert--prominent': props.prominent,\n            },\n            themeClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n            props.class,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            locationStyles.value,\n            props.style,\n          ]}\n          role=\"alert\"\n        >\n          { genOverlays(false, 'v-alert') }\n\n          { props.border && (\n            <div\n              key=\"border\"\n              class={[\n                'v-alert__border',\n                textColorClasses.value,\n              ]}\n              style={ textColorStyles.value }\n            />\n          )}\n\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-alert__prepend\">\n              { !slots.prepend ? (\n                <VIcon\n                  key=\"prepend-icon\"\n                  density={ props.density }\n                  icon={ icon.value }\n                  size={ props.prominent ? 44 : 28 }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"prepend-defaults\"\n                  disabled={ !icon.value }\n                  defaults={{\n                    VIcon: {\n                      density: props.density,\n                      icon: icon.value,\n                      size: props.prominent ? 44 : 28,\n                    },\n                  }}\n                  v-slots:default={ slots.prepend }\n                />\n              )}\n            </div>\n          )}\n\n          <div class=\"v-alert__content\">\n            { hasTitle && (\n              <VAlertTitle key=\"title\">\n                { slots.title?.() ?? props.title }\n              </VAlertTitle>\n            )}\n\n            { hasText && (slots.text?.() ?? props.text) }\n\n            { slots.default?.() }\n          </div>\n\n          { slots.append && (\n            <div key=\"append\" class=\"v-alert__append\">\n              { slots.append() }\n            </div>\n          )}\n\n          { hasClose && (\n            <div key=\"close\" class=\"v-alert__close\">\n              { !slots.close ? (\n                <VBtn\n                  key=\"close-btn\"\n                  icon={ props.closeIcon }\n                  size=\"x-small\"\n                  variant=\"text\"\n                  { ...closeProps.value }\n                />\n              ) : (\n                <VDefaultsProvider\n                  key=\"close-defaults\"\n                  defaults={{\n                    VBtn: {\n                      icon: props.closeIcon,\n                      size: 'x-small',\n                      variant: 'text',\n                    },\n                  }}\n                >\n                  { slots.close?.({ props: closeProps.value }) }\n                </VDefaultsProvider>\n              )}\n            </div>\n          )}\n        </props.tag>\n      )\n    }\n  },\n})\n\nexport type VAlert = InstanceType<typeof VAlert>\n"],"mappings":"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"}

package/lib/components/VAlert/index.d.ts

@@ -13,7 +13,7 @@ interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions
 
 type Density = null | 'default' | 'comfortable' | 'compact';
 
-type IconValue = string | JSXComponent;
+type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
 declare const IconValue: PropType<IconValue>;
 
 declare const allowedTypes: readonly ["success", "info", "warning", "error"];
@@ -23,6 +23,7 @@ declare const VAlert: {
         $: vue.ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            style: vue.StyleValue;
             tag: string;
             icon: false | IconValue;
             rounded: string | number | boolean;
@@ -34,6 +35,7 @@ declare const VAlert: {
             closeIcon: IconValue;
             closeLabel: string;
         }> & Omit<{
+            style: vue.StyleValue;
             tag: string;
             icon: false | IconValue;
             prominent: boolean;
@@ -58,11 +60,12 @@ declare const VAlert: {
             position?: "fixed" | "absolute" | "static" | "relative" | "sticky" | undefined;
             title?: string | undefined;
             text?: string | undefined;
+            class?: any;
             elevation?: string | number | undefined;
             theme?: string | undefined;
             rounded?: string | number | boolean | undefined;
         } & {
-            $children?: {} | vue.VNodeChild | {
+            $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
                 prepend?: (() => vue.VNodeChild) | undefined;
                 title?: (() => vue.VNodeChild) | undefined;
@@ -70,14 +73,6 @@ declare const VAlert: {
                 append?: (() => vue.VNodeChild) | undefined;
                 close?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-                prepend?: (() => vue.VNodeChild) | undefined;
-                title?: (() => vue.VNodeChild) | undefined;
-                text?: (() => vue.VNodeChild) | undefined;
-                append?: (() => vue.VNodeChild) | undefined;
-                close?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
                 prepend?: false | (() => vue.VNodeChild) | undefined;
@@ -96,7 +91,7 @@ declare const VAlert: {
         } & {
             "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
             "onClick:close"?: ((e: MouseEvent) => any) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "tag" | "icon" | "rounded" | "prominent" | "density" | "variant" | "modelValue" | "closable" | "closeIcon" | "closeLabel">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style" | "tag" | "icon" | "rounded" | "prominent" | "density" | "variant" | "modelValue" | "closable" | "closeIcon" | "closeLabel">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -111,6 +106,7 @@ declare const VAlert: {
         $emit: ((event: "update:modelValue", value: boolean) => void) & ((event: "click:close", e: MouseEvent) => void);
         $el: any;
         $options: vue.ComponentOptionsBase<{
+            style: vue.StyleValue;
             tag: string;
             icon: false | IconValue;
             prominent: boolean;
@@ -135,11 +131,12 @@ declare const VAlert: {
             position?: "fixed" | "absolute" | "static" | "relative" | "sticky" | undefined;
             title?: string | undefined;
             text?: string | undefined;
+            class?: any;
             elevation?: string | number | undefined;
             theme?: string | undefined;
             rounded?: string | number | boolean | undefined;
         } & {
-            $children?: {} | vue.VNodeChild | {
+            $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
                 prepend?: (() => vue.VNodeChild) | undefined;
                 title?: (() => vue.VNodeChild) | undefined;
@@ -147,14 +144,6 @@ declare const VAlert: {
                 append?: (() => vue.VNodeChild) | undefined;
                 close?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-                prepend?: (() => vue.VNodeChild) | undefined;
-                title?: (() => vue.VNodeChild) | undefined;
-                text?: (() => vue.VNodeChild) | undefined;
-                append?: (() => vue.VNodeChild) | undefined;
-                close?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
                 prepend?: false | (() => vue.VNodeChild) | undefined;
@@ -177,6 +166,7 @@ declare const VAlert: {
             'click:close': (e: MouseEvent) => true;
             'update:modelValue': (value: boolean) => true;
         }, string, {
+            style: vue.StyleValue;
             tag: string;
             icon: false | IconValue;
             rounded: string | number | boolean;
@@ -208,6 +198,7 @@ declare const VAlert: {
         $nextTick: typeof vue.nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
     } & {
+        style: vue.StyleValue;
         tag: string;
         icon: false | IconValue;
         prominent: boolean;
@@ -232,11 +223,12 @@ declare const VAlert: {
         position?: "fixed" | "absolute" | "static" | "relative" | "sticky" | undefined;
         title?: string | undefined;
         text?: string | undefined;
+        class?: any;
         elevation?: string | number | undefined;
         theme?: string | undefined;
         rounded?: string | number | boolean | undefined;
     } & {
-        $children?: {} | vue.VNodeChild | {
+        $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
             prepend?: (() => vue.VNodeChild) | undefined;
             title?: (() => vue.VNodeChild) | undefined;
@@ -244,14 +236,6 @@ declare const VAlert: {
             append?: (() => vue.VNodeChild) | undefined;
             close?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-            prepend?: (() => vue.VNodeChild) | undefined;
-            title?: (() => vue.VNodeChild) | undefined;
-            text?: (() => vue.VNodeChild) | undefined;
-            append?: (() => vue.VNodeChild) | undefined;
-            close?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
             prepend?: false | (() => vue.VNodeChild) | undefined;
@@ -275,6 +259,7 @@ declare const VAlert: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & vue.ComponentOptionsBase<{
+    style: vue.StyleValue;
     tag: string;
     icon: false | IconValue;
     prominent: boolean;
@@ -299,11 +284,12 @@ declare const VAlert: {
     position?: "fixed" | "absolute" | "static" | "relative" | "sticky" | undefined;
     title?: string | undefined;
     text?: string | undefined;
+    class?: any;
     elevation?: string | number | undefined;
     theme?: string | undefined;
     rounded?: string | number | boolean | undefined;
 } & {
-    $children?: {} | vue.VNodeChild | {
+    $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
         prepend?: (() => vue.VNodeChild) | undefined;
         title?: (() => vue.VNodeChild) | undefined;
@@ -311,14 +297,6 @@ declare const VAlert: {
         append?: (() => vue.VNodeChild) | undefined;
         close?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-        prepend?: (() => vue.VNodeChild) | undefined;
-        title?: (() => vue.VNodeChild) | undefined;
-        text?: (() => vue.VNodeChild) | undefined;
-        append?: (() => vue.VNodeChild) | undefined;
-        close?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
         prepend?: false | (() => vue.VNodeChild) | undefined;
@@ -341,6 +319,7 @@ declare const VAlert: {
     'click:close': (e: MouseEvent) => true;
     'update:modelValue': (value: boolean) => true;
 }, string, {
+    style: vue.StyleValue;
     tag: string;
     icon: false | IconValue;
     rounded: string | number | boolean;
@@ -390,6 +369,11 @@ declare const VAlert: {
         default: string;
         validator: (v: any) => boolean;
     };
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
     border: {
         type: PropType<boolean | "end" | "start" | "top" | "bottom">;
         validator: (val: boolean | string) => boolean;
@@ -458,6 +442,11 @@ declare const VAlert: {
         default: string;
         validator: (v: any) => boolean;
     };
+    class: PropType<any>;
+    style: {
+        type: PropType<vue.StyleValue>;
+        default: null;
+    };
     border: {
         type: PropType<boolean | "end" | "start" | "top" | "bottom">;
         validator: (val: boolean | string) => boolean;
@@ -495,22 +484,23 @@ declare const VAlertTitle: {
         $: vue.ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            style: vue.StyleValue;
             tag: string;
         }> & Omit<{
+            style: vue.StyleValue;
             tag: string;
-        } & {} & {
+        } & {
+            class?: any;
+        } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "tag">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style" | "tag">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -525,14 +515,14 @@ declare const VAlertTitle: {
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: vue.ComponentOptionsBase<{
+            style: vue.StyleValue;
             tag: string;
-        } & {} & {
+        } & {
+            class?: any;
+        } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
@@ -541,6 +531,7 @@ declare const VAlertTitle: {
         }, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
             [key: string]: any;
         }>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+            style: vue.StyleValue;
             tag: string;
         }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -563,14 +554,14 @@ declare const VAlertTitle: {
         $nextTick: typeof vue.nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
     } & {
+        style: vue.StyleValue;
         tag: string;
-    } & {} & {
+    } & {
+        class?: any;
+    } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
@@ -583,14 +574,14 @@ declare const VAlertTitle: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & vue.ComponentOptionsBase<{
+    style: vue.StyleValue;
     tag: string;
-} & {} & {
+} & {
+    class?: any;
+} & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
@@ -599,13 +590,24 @@ declare const VAlertTitle: {
 }, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
 }>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+    style: vue.StyleValue;
     tag: string;
 }, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     tag: {
         type: StringConstructor;
         default: string;
     };
 }, vue.ExtractPropTypes<{
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
     tag: {
         type: StringConstructor;
         default: string;

package/lib/components/VApp/VApp.mjs

@@ -4,12 +4,14 @@ import "./VApp.css";
 
 // Composables
 import { createLayout, makeLayoutProps } from "../../composables/layout.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useRtl } from "../../composables/locale.mjs"; // Utilities
 import { genericComponent, useRender } from "../../util/index.mjs";
 export const VApp = genericComponent()({
   name: 'VApp',
   props: {
+    ...makeComponentProps(),
     ...makeLayoutProps({
       fullHeight: true
     }),
@@ -32,8 +34,8 @@ export const VApp = genericComponent()({
     } = useRtl();
     useRender(() => _createVNode("div", {
       "ref": layoutRef,
-      "class": ['v-application', theme.themeClasses.value, layoutClasses.value, rtlClasses.value],
-      "style": layoutStyles.value
+      "class": ['v-application', theme.themeClasses.value, layoutClasses.value, rtlClasses.value, props.class],
+      "style": [layoutStyles.value, props.style]
     }, [_createVNode("div", {
       "class": "v-application__wrap"
     }, [slots.default?.()])]));

package/lib/components/VApp/VApp.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VApp.mjs","names":["createLayout","makeLayoutProps","makeThemeProps","provideTheme","useRtl","genericComponent","useRender","VApp","name","props","fullHeight","setup","_ref","slots","theme","layoutClasses","layoutStyles","getLayoutItem","items","layoutRef","rtlClasses","_createVNode","themeClasses","value","default"],"sources":["../../../src/components/VApp/VApp.tsx"],"sourcesContent":["// Styles\nimport './VApp.sass'\n\n// Composables\nimport { createLayout, makeLayoutProps } from '@/composables/layout'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useRtl } from '@/composables/locale'\n\n// Utilities\nimport { genericComponent, useRender } from '@/util'\n\nexport const VApp = genericComponent()({\n  name: 'VApp',\n\n  props: {\n    ...makeLayoutProps({ fullHeight: true }),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const theme = provideTheme(props)\n    const { layoutClasses, layoutStyles, getLayoutItem, items, layoutRef } = createLayout(props)\n    const { rtlClasses } = useRtl()\n\n    useRender(() => (\n      <div\n        ref={ layoutRef }\n        class={[\n          'v-application',\n          theme.themeClasses.value,\n          layoutClasses.value,\n          rtlClasses.value,\n        ]}\n        style={ layoutStyles.value }\n      >\n        <div class=\"v-application__wrap\">\n          { slots.default?.() }\n        </div>\n      </div>\n    ))\n\n    return {\n      getLayoutItem,\n      items,\n      theme,\n    }\n  },\n})\n\nexport type VApp = InstanceType<typeof VApp>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,YAAY,EAAEC,eAAe;AAAA,SAC7BC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,MAAM,wCAEf;AAAA,SACSC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,IAAI,GAAGF,gBAAgB,EAAE,CAAC;EACrCG,IAAI,EAAE,MAAM;EAEZC,KAAK,EAAE;IACL,GAAGR,eAAe,CAAC;MAAES,UAAU,EAAE;IAAK,CAAC,CAAC;IACxC,GAAGR,cAAc;EACnB,CAAC;EAEDS,KAAKA,CAAEF,KAAK,EAAAG,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAME,KAAK,GAAGX,YAAY,CAACM,KAAK,CAAC;IACjC,MAAM;MAAEM,aAAa;MAAEC,YAAY;MAAEC,aAAa;MAAEC,KAAK;MAAEC;IAAU,CAAC,GAAGnB,YAAY,CAACS,KAAK,CAAC;IAC5F,MAAM;MAAEW;IAAW,CAAC,GAAGhB,MAAM,EAAE;IAE/BE,SAAS,CAAC,MAAAe,YAAA;MAAA,OAEAF,SAAS;MAAA,SACR,CACL,eAAe,EACfL,KAAK,CAACQ,YAAY,CAACC,KAAK,EACxBR,aAAa,CAACQ,KAAK,EACnBH,UAAU,CAACG,KAAK,CACjB;MAAA,SACOP,YAAY,CAACO;IAAK,IAAAF,YAAA;MAAA,SAEf;IAAqB,IAC5BR,KAAK,CAACW,OAAO,IAAI,IAGxB,CAAC;IAEF,OAAO;MACLP,aAAa;MACbC,KAAK;MACLJ;IACF,CAAC;EACH;AACF,CAAC,CAAC"}
+{"version":3,"file":"VApp.mjs","names":["createLayout","makeLayoutProps","makeComponentProps","makeThemeProps","provideTheme","useRtl","genericComponent","useRender","VApp","name","props","fullHeight","setup","_ref","slots","theme","layoutClasses","layoutStyles","getLayoutItem","items","layoutRef","rtlClasses","_createVNode","themeClasses","value","class","style","default"],"sources":["../../../src/components/VApp/VApp.tsx"],"sourcesContent":["// Styles\nimport './VApp.sass'\n\n// Composables\nimport { createLayout, makeLayoutProps } from '@/composables/layout'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useRtl } from '@/composables/locale'\n\n// Utilities\nimport { genericComponent, useRender } from '@/util'\n\nexport const VApp = genericComponent()({\n  name: 'VApp',\n\n  props: {\n    ...makeComponentProps(),\n    ...makeLayoutProps({ fullHeight: true }),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const theme = provideTheme(props)\n    const { layoutClasses, layoutStyles, getLayoutItem, items, layoutRef } = createLayout(props)\n    const { rtlClasses } = useRtl()\n\n    useRender(() => (\n      <div\n        ref={ layoutRef }\n        class={[\n          'v-application',\n          theme.themeClasses.value,\n          layoutClasses.value,\n          rtlClasses.value,\n          props.class,\n        ]}\n        style={[\n          layoutStyles.value,\n          props.style,\n        ]}\n      >\n        <div class=\"v-application__wrap\">\n          { slots.default?.() }\n        </div>\n      </div>\n    ))\n\n    return {\n      getLayoutItem,\n      items,\n      theme,\n    }\n  },\n})\n\nexport type VApp = InstanceType<typeof VApp>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,YAAY,EAAEC,eAAe;AAAA,SAC7BC,kBAAkB;AAAA,SAClBC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,MAAM,wCAEf;AAAA,SACSC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,IAAI,GAAGF,gBAAgB,EAAE,CAAC;EACrCG,IAAI,EAAE,MAAM;EAEZC,KAAK,EAAE;IACL,GAAGR,kBAAkB,EAAE;IACvB,GAAGD,eAAe,CAAC;MAAEU,UAAU,EAAE;IAAK,CAAC,CAAC;IACxC,GAAGR,cAAc;EACnB,CAAC;EAEDS,KAAKA,CAAEF,KAAK,EAAAG,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAME,KAAK,GAAGX,YAAY,CAACM,KAAK,CAAC;IACjC,MAAM;MAAEM,aAAa;MAAEC,YAAY;MAAEC,aAAa;MAAEC,KAAK;MAAEC;IAAU,CAAC,GAAGpB,YAAY,CAACU,KAAK,CAAC;IAC5F,MAAM;MAAEW;IAAW,CAAC,GAAGhB,MAAM,EAAE;IAE/BE,SAAS,CAAC,MAAAe,YAAA;MAAA,OAEAF,SAAS;MAAA,SACR,CACL,eAAe,EACfL,KAAK,CAACQ,YAAY,CAACC,KAAK,EACxBR,aAAa,CAACQ,KAAK,EACnBH,UAAU,CAACG,KAAK,EAChBd,KAAK,CAACe,KAAK,CACZ;MAAA,SACM,CACLR,YAAY,CAACO,KAAK,EAClBd,KAAK,CAACgB,KAAK;IACZ,IAAAJ,YAAA;MAAA,SAEU;IAAqB,IAC5BR,KAAK,CAACa,OAAO,IAAI,IAGxB,CAAC;IAEF,OAAO;MACLT,aAAa;MACbC,KAAK;MACLJ;IACF,CAAC;EACH;AACF,CAAC,CAAC"}

package/lib/components/VApp/index.d.ts

@@ -52,25 +52,25 @@ declare const VApp: {
         $: vue.ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            style: vue.StyleValue;
             fullHeight: boolean;
         }> & Omit<{
+            style: vue.StyleValue;
             fullHeight: boolean;
         } & {
+            class?: any;
             theme?: string | undefined;
             overlaps?: string[] | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
             "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "fullHeight">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style" | "fullHeight">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -85,17 +85,16 @@ declare const VApp: {
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: vue.ComponentOptionsBase<{
+            style: vue.StyleValue;
             fullHeight: boolean;
         } & {
+            class?: any;
             theme?: string | undefined;
             overlaps?: string[] | undefined;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
-            $slots?: {
-                default?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
@@ -122,6 +121,7 @@ declare const VApp: {
             }[]>;
             theme: ThemeInstance;
         }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+            style: vue.StyleValue;
             fullHeight: boolean;
         }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -144,17 +144,16 @@ declare const VApp: {
         $nextTick: typeof vue.nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
     } & {
+        style: vue.StyleValue;
         fullHeight: boolean;
     } & {
+        class?: any;
         theme?: string | undefined;
         overlaps?: string[] | undefined;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
             default?: (() => vue.VNodeChild) | undefined;
         };
-        $slots?: {
-            default?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
         'v-slots'?: {
             default?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
@@ -185,17 +184,16 @@ declare const VApp: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & vue.ComponentOptionsBase<{
+    style: vue.StyleValue;
     fullHeight: boolean;
 } & {
+    class?: any;
     theme?: string | undefined;
     overlaps?: string[] | undefined;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
         default?: (() => vue.VNodeChild) | undefined;
     };
-    $slots?: {
-        default?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
     'v-slots'?: {
         default?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
@@ -222,6 +220,7 @@ declare const VApp: {
     }[]>;
     theme: ThemeInstance;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+    style: vue.StyleValue;
     fullHeight: boolean;
 }, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
@@ -230,6 +229,11 @@ declare const VApp: {
         type: vue.PropType<boolean>;
         default: boolean;
     };
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
 }, vue.ExtractPropTypes<{
     theme: StringConstructor;
     overlaps: vue.Prop<string[]>;
@@ -237,6 +241,11 @@ declare const VApp: {
         type: vue.PropType<boolean>;
         default: boolean;
     };
+    class: vue.PropType<any>;
+    style: {
+        type: vue.PropType<vue.StyleValue>;
+        default: null;
+    };
 }>>;
 type VApp = InstanceType<typeof VApp>;