@vuetify/nightly 3.0.0-alpha.8 → 3.0.0-beta.0

package/lib/components/VAlert/VAlertTitle.mjs

@@ -0,0 +1,3 @@
+import { createSimpleFunctional } from "../../util/index.mjs";
+export const VAlertTitle = createSimpleFunctional('v-alert-title');
+//# sourceMappingURL=VAlertTitle.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/VAlert/VAlertTitle.ts"],"names":["createSimpleFunctional","VAlertTitle"],"mappings":"SAASA,sB;AAET,OAAO,MAAMC,WAAW,GAAGD,sBAAsB,CAAC,eAAD,CAA1C","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport const VAlertTitle = createSimpleFunctional('v-alert-title')\n"],"file":"VAlertTitle.mjs"}

package/lib/components/VAlert/_variables.scss

@@ -1,39 +1,33 @@
+@use '../../styles/settings';
+@use '../../styles/tools';
+
 // Defaults
-$alert-avatar-height: 24px !default;
-$alert-avatar-icon-font-size: 24px !default;
-$alert-avatar-margin-inline-end: 16px !default;
-$alert-avatar-margin-inline-start: 0 !default;
-$alert-avatar-margin-top: -6px !default;
-$alert-background: rgba(var(--v-theme-on-surface), var(--v-hover-opacity)) !default;
+$alert-background: rgb(var(--v-theme-on-surface-variant)) !default;
 $alert-border-color: currentColor !default;
-$alert-border-icon-margin: 8px !default;
-$alert-border-opacity: 0.26 !default;
-$alert-border-padding-inline-start: 24px !default;
-$alert-border-radius: $border-radius-root !default;
-$alert-border-style: $border-style-root !default;
+$alert-border-radius: settings.$border-radius-root !default;
+$alert-border-style: settings.$border-style-root !default;
 $alert-border-thin-width: 8px !default;
 $alert-border-width: 0 !default;
-$alert-close-icon-font-size: 20px !default;
-$alert-close-margin-inline-start: auto !default;
-$alert-close-padding-inline-start: 8px !default;
-$alert-color: rgb(var(--v-theme-on-surface)) !default;
+$alert-border-opacity: .38 !default;
+$alert-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
 $alert-density: ('default': 0, 'comfortable': -1, 'compact': -2) !default;
-$alert-elevation: 0 !default;
-$alert-font-size: 16px !default;
-$alert-icon-font-size-multiplier: 1.5 !default;
+$alert-elevation: 1 !default;
 $alert-padding: 16px !default;
 $alert-plain-opacity: .62 !default;
-$alert-plain-transition: .2s opacity $standard-easing !default;
-$alert-positions: absolute fixed !default;
-$alert-prominent-avatar-margin-inline-end: 16px !default;
-$alert-prominent-avatar-margin-inline-start: 0 !default;
-$alert-prominent-icon-font-size: 40px !default;
-$alert-prominent-icon-size: 40px !default;
-$alert-text-padding: 16px !default;
-$alert-tip-border-inline-start-width: 6px !default;
-$alert-tip-margin-inline-start: -33px !default;
-$alert-tip-max-height: 24px !default;
-$alert-tip-max-width: 24px !default;
+$alert-plain-transition: .2s opacity settings.$standard-easing !default;
+$alert-positions: absolute fixed sticky !default;
+$alert-prepend-margin-inline-end: 16px !default;
+$alert-title-comfortable-line-height: 1.75rem !default;
+$alert-title-compact-line-height: 1.55rem !default;
+$alert-title-font-size: tools.map-deep-get(settings.$typography, 'h6', 'size') !default;
+$alert-title-font-weight: tools.map-deep-get(settings.$typography, 'h6', 'weight') !default;
+$alert-title-hyphens: auto !default;
+$alert-title-letter-spacing: tools.map-deep-get(settings.$typography, 'h6', 'letter-spacing') !default;
+$alert-title-line-height: 1.35 !default;
+$alert-title-overflow-wrap: normal !default;
+$alert-title-text-transform: none !default;
+$alert-title-word-break: normal !default;
+$alert-title-word-wrap: break-word !default;
 
 $alert-border: (
   $alert-border-color,
@@ -42,11 +36,6 @@ $alert-border: (
   $alert-border-thin-width
 ) !default;
 
-$alert-theme: (
-  $alert-background,
-  $alert-color
-) !default;
-
 $alert-variants: (
   $alert-background,
   $alert-color,

package/lib/components/VAlert/index.mjs

@@ -1,2 +1,3 @@
-export { default as VAlert } from "./VAlert.mjs";
+export { VAlert } from "./VAlert.mjs";
+export { VAlertTitle } from "./VAlertTitle.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VAlert/index.ts"],"names":["default","VAlert"],"mappings":"SAASA,OAAO,IAAIC,M","sourcesContent":["export { default as VAlert } from './VAlert'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/components/VAlert/index.ts"],"names":["VAlert","VAlertTitle"],"mappings":"SAASA,M;SACAC,W","sourcesContent":["export { VAlert } from './VAlert'\nexport { VAlertTitle } from './VAlertTitle'\n"],"file":"index.mjs"}

package/lib/components/VApp/VApp.css

@@ -0,0 +1,28 @@
+.v-application {
+  display: flex;
+  background: rgb(var(--v-theme-background));
+  color: rgba(var(--v-theme-on-background), var(--v-high-emphasis-opacity));
+}
+.v-application a {
+  cursor: pointer;
+}
+
+.v-application__wrap {
+  flex: 1 1 auto;
+  backface-visibility: hidden;
+  display: flex;
+  flex-direction: column;
+  max-width: 100%;
+  position: relative;
+}
+
+@-moz-document url-prefix() {
+  @media print {
+    .v-application {
+      display: block;
+    }
+    .v-application__wrap {
+      display: block;
+    }
+  }
+}

package/lib/components/VApp/VApp.mjs

@@ -1,42 +1,51 @@
 import { createVNode as _createVNode } from "vue";
 // Styles
-import "./VApp.sass"; // Composables
+import "./VApp.css"; // Composables
 
-import { makeThemeProps, useTheme } from "../../composables/theme.mjs";
+import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { createLayout, makeLayoutProps } from "../../composables/layout.mjs"; // Utilities
 
-import { defineComponent } from 'vue';
-import { makeProps } from "../../util/index.mjs";
+import { defineComponent, useRender } from "../../util/index.mjs";
 import { useRtl } from "../../composables/rtl.mjs";
-export default defineComponent({
+export const VApp = defineComponent({
   name: 'VApp',
-  props: makeProps({ ...makeLayoutProps({
+  props: { ...makeLayoutProps({
       fullHeight: true
     }),
     ...makeThemeProps()
-  }),
+  },
 
-  setup(props, {
-    slots
-  }) {
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const theme = provideTheme(props);
     const {
-      themeClasses
-    } = useTheme(props);
-    const {
-      layoutClasses
+      layoutClasses,
+      layoutStyles,
+      getLayoutItem,
+      items,
+      layoutRef
     } = createLayout(props);
     const {
       rtlClasses
     } = useRtl();
-    return () => {
+    useRender(() => {
       var _slots$default;
 
       return _createVNode("div", {
-        "class": ['v-application', themeClasses.value, layoutClasses.value, rtlClasses.value],
+        "ref": layoutRef,
+        "class": ['v-application', theme.themeClasses.value, layoutClasses.value, rtlClasses.value],
+        "style": layoutStyles.value,
         "data-app": "true"
       }, [_createVNode("div", {
         "class": "v-application__wrap"
-      }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)])], 2);
+      }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)])]);
+    });
+    return {
+      getLayoutItem,
+      items,
+      theme
     };
   }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VApp/VApp.tsx"],"names":["makeThemeProps","useTheme","createLayout","makeLayoutProps","defineComponent","makeProps","useRtl","name","props","fullHeight","setup","slots","themeClasses","layoutClasses","rtlClasses","value","default"],"mappings":";AAAA;AACA,qB,CAEA;;SACSA,c,EAAgBC,Q;SAChBC,Y,EAAcC,e,wCAEvB;;AACA,SAASC,eAAT,QAAgC,KAAhC;SACSC,S;SACAC,M;AAET,eAAeF,eAAe,CAAC;AAC7BG,EAAAA,IAAI,EAAE,MADuB;AAG7BC,EAAAA,KAAK,EAAEH,SAAS,CAAC,EACf,GAAGF,eAAe,CAAC;AAAEM,MAAAA,UAAU,EAAE;AAAd,KAAD,CADH;AAEf,OAAGT,cAAc;AAFF,GAAD,CAHa;;AAQ7BU,EAAAA,KAAK,CAAEF,KAAF,EAAS;AAAEG,IAAAA;AAAF,GAAT,EAAoB;AACvB,UAAM;AAAEC,MAAAA;AAAF,QAAmBX,QAAQ,CAACO,KAAD,CAAjC;AACA,UAAM;AAAEK,MAAAA;AAAF,QAAoBX,YAAY,CAACM,KAAD,CAAtC;AACA,UAAM;AAAEM,MAAAA;AAAF,QAAiBR,MAAM,EAA7B;AAEA,WAAO;AAAA;;AAAA;AAAA,iBAEI,CACL,eADK,EAELM,YAAY,CAACG,KAFR,EAGLF,aAAa,CAACE,KAHT,EAILD,UAAU,CAACC,KAJN,CAFJ;AAAA,oBAQM;AARN;AAAA,iBAUQ;AAVR,4BAWCJ,KAAK,CAACK,OAXP,qBAWC,oBAAAL,KAAK,CAXN;AAAA,KAAP;AAeD;;AA5B4B,CAAD,CAA9B","sourcesContent":["// Styles\nimport './VApp.sass'\n\n// Composables\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { createLayout, makeLayoutProps } from '@/composables/layout'\n\n// Utilities\nimport { defineComponent } from 'vue'\nimport { makeProps } from '@/util'\nimport { useRtl } from '@/composables/rtl'\n\nexport default defineComponent({\n  name: 'VApp',\n\n  props: makeProps({\n    ...makeLayoutProps({ fullHeight: true }),\n    ...makeThemeProps(),\n  }),\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme(props)\n    const { layoutClasses } = createLayout(props)\n    const { rtlClasses } = useRtl()\n\n    return () => (\n      <div\n        class={[\n          'v-application',\n          themeClasses.value,\n          layoutClasses.value,\n          rtlClasses.value,\n        ]}\n        data-app=\"true\"\n      >\n        <div class=\"v-application__wrap\">\n          { slots.default?.() }\n        </div>\n      </div>\n    )\n  },\n})\n"],"file":"VApp.mjs"}
+{"version":3,"sources":["../../../src/components/VApp/VApp.tsx"],"names":["makeThemeProps","provideTheme","createLayout","makeLayoutProps","defineComponent","useRender","useRtl","VApp","name","props","fullHeight","setup","slots","theme","layoutClasses","layoutStyles","getLayoutItem","items","layoutRef","rtlClasses","themeClasses","value","default"],"mappings":";AAAA;AACA,oB,CAEA;;SACSA,c,EAAgBC,Y;SAChBC,Y,EAAcC,e,wCAEvB;;SACSC,e,EAAiBC,S;SACjBC,M;AAET,OAAO,MAAMC,IAAI,GAAGH,eAAe,CAAC;AAClCI,EAAAA,IAAI,EAAE,MAD4B;AAGlCC,EAAAA,KAAK,EAAE,EACL,GAAGN,eAAe,CAAC;AAAEO,MAAAA,UAAU,EAAE;AAAd,KAAD,CADb;AAEL,OAAGV,cAAc;AAFZ,GAH2B;;AAQlCW,EAAAA,KAAK,CAAEF,KAAF,QAAoB;AAAA,QAAX;AAAEG,MAAAA;AAAF,KAAW;AACvB,UAAMC,KAAK,GAAGZ,YAAY,CAACQ,KAAD,CAA1B;AACA,UAAM;AAAEK,MAAAA,aAAF;AAAiBC,MAAAA,YAAjB;AAA+BC,MAAAA,aAA/B;AAA8CC,MAAAA,KAA9C;AAAqDC,MAAAA;AAArD,QAAmEhB,YAAY,CAACO,KAAD,CAArF;AACA,UAAM;AAAEU,MAAAA;AAAF,QAAiBb,MAAM,EAA7B;AAEAD,IAAAA,SAAS,CAAC;AAAA;;AAAA;AAAA,eAEAa,SAFA;AAAA,iBAGC,CACL,eADK,EAELL,KAAK,CAACO,YAAN,CAAmBC,KAFd,EAGLP,aAAa,CAACO,KAHT,EAILF,UAAU,CAACE,KAJN,CAHD;AAAA,iBASEN,YAAY,CAACM,KATf;AAAA,oBAUG;AAVH;AAAA,iBAYK;AAZL,4BAaFT,KAAK,CAACU,OAbJ,qBAaF,oBAAAV,KAAK,CAbH;AAAA,KAAD,CAAT;AAkBA,WAAO;AACLI,MAAAA,aADK;AAELC,MAAAA,KAFK;AAGLJ,MAAAA;AAHK,KAAP;AAKD;;AApCiC,CAAD,CAA5B","sourcesContent":["// Styles\nimport './VApp.sass'\n\n// Composables\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { createLayout, makeLayoutProps } from '@/composables/layout'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\nimport { useRtl } from '@/composables/rtl'\n\nexport const VApp = defineComponent({\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        data-app=\"true\"\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"],"file":"VApp.mjs"}

package/lib/components/VApp/VApp.sass

@@ -1,9 +1,7 @@
-@import './index'
-
 .v-application
   display: flex
   background: rgb(var(--v-theme-background))
-  color: rgb(var(--v-theme-on-background))
+  color: rgba(var(--v-theme-on-background), var(--v-high-emphasis-opacity))
 
   a
     cursor: pointer
@@ -13,7 +11,6 @@
     backface-visibility: hidden
     display: flex
     flex-direction: column
-    min-height: 100vh
     max-width: 100%
     position: relative
 

package/lib/components/VApp/index.mjs

@@ -1,2 +1,2 @@
-export { default as VApp } from "./VApp.mjs";
+export { VApp } from "./VApp.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VApp/index.ts"],"names":["default","VApp"],"mappings":"SAASA,OAAO,IAAIC,I","sourcesContent":["export { default as VApp } from './VApp'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/components/VApp/index.ts"],"names":["VApp"],"mappings":"SAASA,I","sourcesContent":["export { VApp } from './VApp'\n"],"file":"index.mjs"}

package/lib/components/VAppBar/VAppBar.css

@@ -0,0 +1,10 @@
+.v-app-bar {
+  display: flex;
+}
+.v-app-bar.v-toolbar {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-app-bar.v-toolbar:not(.v-toolbar--flat) {
+  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+}

package/lib/components/VAppBar/VAppBar.mjs

@@ -1,25 +1,18 @@
-import { createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, mergeProps as _mergeProps, resolveDirective as _resolveDirective } from "vue";
 // Styles
-import "./VAppBar.sass"; // Components
+import "./VAppBar.css"; // Components
 
-import { VImg } from "../VImg/index.mjs"; // Composables
+import { filterToolbarProps, makeVToolbarProps, VToolbar } from "../VToolbar/VToolbar.mjs"; // Composables
 
-import { makeBorderProps, useBorder } from "../../composables/border.mjs";
-import { makeDensityProps, useDensity } from "../../composables/density.mjs";
-import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
 import { makeLayoutItemProps, useLayoutItem } from "../../composables/layout.mjs";
-import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
-import { makeTagProps } from "../../composables/tag.mjs";
-import { useBackgroundColor } from "../../composables/color.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 
-import { computed, defineComponent, ref, toRef } from 'vue';
-import { convertToUnit } from "../../util/index.mjs";
-import { makeProps } from "../../util/makeProps.mjs"; // Types
+import { computed, ref, toRef } from 'vue';
+import { defineComponent } from "../../util/index.mjs"; // Types
 
-export default defineComponent({
+export const VAppBar = defineComponent({
   name: 'VAppBar',
-  props: makeProps({
+  props: {
     // TODO: Implement scrolling techniques
     // hideOnScroll: Boolean
     // invertedScroll: Boolean
@@ -27,109 +20,57 @@ export default defineComponent({
     // elevateOnScroll: Boolean
     // shrinkOnScroll: Boolean
     // fadeImageOnScroll: Boolean
-    collapse: Boolean,
-    color: String,
-    flat: Boolean,
-    height: {
-      type: [Number, String],
-      default: 64
-    },
-    extensionHeight: {
-      type: [Number, String],
-      default: 48
-    },
-    floating: Boolean,
-    image: String,
     modelValue: {
       type: Boolean,
       default: true
     },
-    prominent: Boolean,
-    prominentHeight: {
-      type: [Number, String],
-      default: 128
-    },
     position: {
       type: String,
       default: 'top',
       validator: value => ['top', 'bottom'].includes(value)
     },
-    ...makeBorderProps(),
-    ...makeDensityProps(),
-    ...makeElevationProps(),
-    ...makeRoundedProps(),
-    ...makeLayoutItemProps({
-      name: 'app-bar'
-    }),
-    ...makeTagProps({
-      tag: 'header'
-    })
-  }),
+    ...makeVToolbarProps(),
+    ...makeLayoutItemProps(),
+    height: {
+      type: [Number, String],
+      default: 64
+    }
+  },
   emits: {
     'update:modelValue': value => true
   },
 
-  setup(props, {
-    slots
-  }) {
-    const {
-      borderClasses
-    } = useBorder(props, 'v-app-bar');
-    const {
-      densityClasses
-    } = useDensity(props, 'v-app-bar');
-    const {
-      elevationClasses
-    } = useElevation(props);
-    const {
-      roundedClasses
-    } = useRounded(props, 'v-app-bar');
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const vToolbarRef = ref();
+    const isActive = useProxiedModel(props, 'modelValue');
+    const height = computed(() => {
+      var _vToolbarRef$value;
+
+      return (_vToolbarRef$value = vToolbarRef.value) == null ? void 0 : _vToolbarRef$value.contentHeight;
+    });
     const {
-      backgroundColorClasses,
-      backgroundColorStyles
-    } = useBackgroundColor(toRef(props, 'color'));
-    const extension = ref(!!slots.extension);
-    const height = computed(() => Number(props.prominent ? props.prominentHeight : props.height) + Number(extension.value ? props.extensionHeight : 0) - (props.density === 'comfortable' ? 8 : 0) - (props.density === 'compact' ? 16 : 0));
-    const isActive = useProxiedModel(props, 'modelValue', props.modelValue);
-    const layoutStyles = useLayoutItem(props.name, toRef(props, 'priority'), toRef(props, 'position'), height, height, isActive);
+      layoutItemStyles
+    } = useLayoutItem({
+      id: props.name,
+      priority: computed(() => parseInt(props.priority, 10)),
+      position: toRef(props, 'position'),
+      layoutSize: height,
+      elementSize: height,
+      active: isActive,
+      absolute: toRef(props, 'absolute')
+    });
     return () => {
-      var _slots$img, _slots$default, _slots$extension;
-
-      const hasImage = !!(slots.image || props.image);
-      return _createVNode(props.tag, {
+      const [toolbarProps] = filterToolbarProps(props);
+      return _createVNode(VToolbar, _mergeProps({
+        "ref": vToolbarRef,
         "class": ['v-app-bar', {
-          'v-app-bar--bottom': props.position === 'bottom',
-          'v-app-bar--collapsed': props.collapse,
-          'v-app-bar--flat': props.flat,
-          'v-app-bar--floating': props.floating,
-          'v-app-bar--is-active': isActive.value,
-          'v-app-bar--prominent': props.prominent,
-          'v-app-bar--absolute': props.absolute
-        }, backgroundColorClasses.value, borderClasses.value, densityClasses.value, elevationClasses.value, roundedClasses.value],
-        "style": [backgroundColorStyles.value, layoutStyles.value]
-      }, {
-        default: () => [hasImage && _createVNode("div", {
-          "class": "v-app-bar__image"
-        }, [slots.image ? (_slots$img = slots.img) == null ? void 0 : _slots$img.call(slots, {
-          src: props.image
-        }) : _createVNode(VImg, {
-          "src": props.image,
-          "cover": true
-        }, null, 8, ["src", "cover"])]), _createVNode("div", {
-          "class": "v-app-bar__content"
-        }, [slots.prepend && _createVNode("div", {
-          "class": "v-app-bar__prepend"
-        }, [slots.prepend()]), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), slots.append && _createVNode("div", {
-          "class": "v-app-bar__append"
-        }, [slots.append()])]), slots.extension && _createVNode("div", {
-          "class": "v-app-bar__extension",
-          "style": {
-            height: convertToUnit(props.extensionHeight)
-          },
-          "ref": extension
-        }, [(_slots$extension = slots.extension) == null ? void 0 : _slots$extension.call(slots)], 4)],
-        _: 1
-      }, 8, ["class", "style"]);
+          'v-app-bar--bottom': props.position === 'bottom'
+        }],
+        "style": layoutItemStyles.value
+      }, toolbarProps), slots);
     };
   }
 

package/lib/components/VAppBar/VAppBar.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VAppBar/VAppBar.tsx"],"names":["VImg","makeBorderProps","useBorder","makeDensityProps","useDensity","makeElevationProps","useElevation","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","useBackgroundColor","useProxiedModel","computed","defineComponent","ref","toRef","convertToUnit","makeProps","name","props","collapse","Boolean","color","String","flat","height","type","Number","default","extensionHeight","floating","image","modelValue","prominent","prominentHeight","position","validator","value","includes","tag","emits","setup","slots","borderClasses","densityClasses","elevationClasses","roundedClasses","backgroundColorClasses","backgroundColorStyles","extension","density","isActive","layoutStyles","hasImage","absolute","img","src","prepend","append"],"mappings":"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","sourcesContent":["// Styles\nimport './VAppBar.sass'\n\n// Components\nimport { VImg } from '@/components/VImg'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, defineComponent, ref, toRef } from 'vue'\nimport { convertToUnit } from '@/util'\nimport { makeProps } from '@/util/makeProps'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'VAppBar',\n\n  props: makeProps({\n    // TODO: Implement scrolling techniques\n    // hideOnScroll: Boolean\n    // invertedScroll: Boolean\n    // collapseOnScroll: Boolean\n    // elevateOnScroll: Boolean\n    // shrinkOnScroll: Boolean\n    // fadeImageOnScroll: Boolean\n    collapse: Boolean,\n    color: String,\n    flat: Boolean,\n    height: {\n      type: [Number, String],\n      default: 64,\n    },\n    extensionHeight: {\n      type: [Number, String],\n      default: 48,\n    },\n    floating: Boolean,\n    image: String,\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    prominent: Boolean,\n    prominentHeight: {\n      type: [Number, String],\n      default: 128,\n    },\n    position: {\n      type: String as PropType<'top' | 'bottom'>,\n      default: 'top',\n      validator: (value: any) => ['top', 'bottom'].includes(value),\n    },\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeLayoutItemProps({ name: 'app-bar' }),\n    ...makeTagProps({ tag: 'header' }),\n  }),\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const { borderClasses } = useBorder(props, 'v-app-bar')\n    const { densityClasses } = useDensity(props, 'v-app-bar')\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props, 'v-app-bar')\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const extension = ref<HTMLElement | boolean>(!!slots.extension)\n    const height = computed(() => (\n      Number(props.prominent ? props.prominentHeight : props.height) +\n      Number(extension.value ? props.extensionHeight : 0) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)\n    const layoutStyles = useLayoutItem(\n      props.name,\n      toRef(props, 'priority'),\n      toRef(props, 'position'),\n      height,\n      height,\n      isActive,\n    )\n\n    return () => {\n      const hasImage = !!(slots.image || props.image)\n\n      return (\n        <props.tag\n          class={[\n            'v-app-bar',\n            {\n              'v-app-bar--bottom': props.position === 'bottom',\n              'v-app-bar--collapsed': props.collapse,\n              'v-app-bar--flat': props.flat,\n              'v-app-bar--floating': props.floating,\n              'v-app-bar--is-active': isActive.value,\n              'v-app-bar--prominent': props.prominent,\n              'v-app-bar--absolute': props.absolute,\n            },\n            backgroundColorClasses.value,\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            layoutStyles.value,\n          ]}\n        >\n          { hasImage && (\n            <div class=\"v-app-bar__image\">\n              { slots.image\n                ? slots.img?.({ src: props.image })\n                : (<VImg src={ props.image } cover />)\n              }\n            </div>\n          ) }\n\n          <div class=\"v-app-bar__content\">\n            { slots.prepend && (\n              <div class=\"v-app-bar__prepend\">\n                { slots.prepend() }\n              </div>\n            ) }\n\n            { slots.default?.() }\n\n            { slots.append && (\n              <div class=\"v-app-bar__append\">\n                { slots.append() }\n              </div>\n            ) }\n          </div>\n\n          { slots.extension && (\n            <div\n              class=\"v-app-bar__extension\"\n              style={{ height: convertToUnit(props.extensionHeight) }}\n              ref={ extension }\n            >\n              { slots.extension?.() }\n            </div>\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n"],"file":"VAppBar.mjs"}
+{"version":3,"sources":["../../../src/components/VAppBar/VAppBar.tsx"],"names":["filterToolbarProps","makeVToolbarProps","VToolbar","makeLayoutItemProps","useLayoutItem","useProxiedModel","computed","ref","toRef","defineComponent","VAppBar","name","props","modelValue","type","Boolean","default","position","String","validator","value","includes","height","Number","emits","setup","slots","vToolbarRef","isActive","contentHeight","layoutItemStyles","id","priority","parseInt","layoutSize","elementSize","active","absolute","toolbarProps"],"mappings":";AAAA;AACA,uB,CAEA;;SACSA,kB,EAAoBC,iB,EAAmBC,Q,oCAEhD;;SACSC,mB,EAAqBC,a;SACrBC,e,8CAET;;AACA,SAASC,QAAT,EAAmBC,GAAnB,EAAwBC,KAAxB,QAAqC,KAArC;SACSC,e,gCAET;;AAGA,OAAO,MAAMC,OAAO,GAAGD,eAAe,CAAC;AACrCE,EAAAA,IAAI,EAAE,SAD+B;AAGrCC,EAAAA,KAAK,EAAE;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACAC,IAAAA,UAAU,EAAE;AACVC,MAAAA,IAAI,EAAEC,OADI;AAEVC,MAAAA,OAAO,EAAE;AAFC,KARP;AAYLC,IAAAA,QAAQ,EAAE;AACRH,MAAAA,IAAI,EAAEI,MADE;AAERF,MAAAA,OAAO,EAAE,KAFD;AAGRG,MAAAA,SAAS,EAAGC,KAAD,IAAgB,CAAC,KAAD,EAAQ,QAAR,EAAkBC,QAAlB,CAA2BD,KAA3B;AAHnB,KAZL;AAkBL,OAAGnB,iBAAiB,EAlBf;AAmBL,OAAGE,mBAAmB,EAnBjB;AAqBLmB,IAAAA,MAAM,EAAE;AACNR,MAAAA,IAAI,EAAE,CAACS,MAAD,EAASL,MAAT,CADA;AAENF,MAAAA,OAAO,EAAE;AAFH;AArBH,GAH8B;AA8BrCQ,EAAAA,KAAK,EAAE;AACL,yBAAsBJ,KAAD,IAAoB;AADpC,GA9B8B;;AAkCrCK,EAAAA,KAAK,CAAEb,KAAF,QAAoB;AAAA,QAAX;AAAEc,MAAAA;AAAF,KAAW;AACvB,UAAMC,WAAW,GAAGpB,GAAG,EAAvB;AACA,UAAMqB,QAAQ,GAAGvB,eAAe,CAACO,KAAD,EAAQ,YAAR,CAAhC;AACA,UAAMU,MAAM,GAAGhB,QAAQ,CAAC;AAAA;;AAAA,mCAAMqB,WAAW,CAACP,KAAlB,qBAAM,mBAAmBS,aAAzB;AAAA,KAAD,CAAvB;AACA,UAAM;AAAEC,MAAAA;AAAF,QAAuB1B,aAAa,CAAC;AACzC2B,MAAAA,EAAE,EAAEnB,KAAK,CAACD,IAD+B;AAEzCqB,MAAAA,QAAQ,EAAE1B,QAAQ,CAAC,MAAM2B,QAAQ,CAACrB,KAAK,CAACoB,QAAP,EAAiB,EAAjB,CAAf,CAFuB;AAGzCf,MAAAA,QAAQ,EAAET,KAAK,CAACI,KAAD,EAAQ,UAAR,CAH0B;AAIzCsB,MAAAA,UAAU,EAAEZ,MAJ6B;AAKzCa,MAAAA,WAAW,EAAEb,MAL4B;AAMzCc,MAAAA,MAAM,EAAER,QANiC;AAOzCS,MAAAA,QAAQ,EAAE7B,KAAK,CAACI,KAAD,EAAQ,UAAR;AAP0B,KAAD,CAA1C;AAUA,WAAO,MAAM;AACX,YAAM,CAAC0B,YAAD,IAAiBtC,kBAAkB,CAACY,KAAD,CAAzC;AAEA;AAAA,eAEUe,WAFV;AAAA,iBAGW,CACL,WADK,EAEL;AACE,+BAAqBf,KAAK,CAACK,QAAN,KAAmB;AAD1C,SAFK,CAHX;AAAA,iBASYa,gBAAgB,CAACV;AAT7B,SAUSkB,YAVT,GAWcZ,KAXd;AAcD,KAjBD;AAkBD;;AAlEoC,CAAD,CAA/B","sourcesContent":["// Styles\nimport './VAppBar.sass'\n\n// Components\nimport { filterToolbarProps, makeVToolbarProps, VToolbar } from '@/components/VToolbar/VToolbar'\n\n// Composables\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, toRef } from 'vue'\nimport { defineComponent } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const VAppBar = defineComponent({\n  name: 'VAppBar',\n\n  props: {\n    // TODO: Implement scrolling techniques\n    // hideOnScroll: Boolean\n    // invertedScroll: Boolean\n    // collapseOnScroll: Boolean\n    // elevateOnScroll: Boolean\n    // shrinkOnScroll: Boolean\n    // fadeImageOnScroll: Boolean\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    position: {\n      type: String as PropType<'top' | 'bottom'>,\n      default: 'top',\n      validator: (value: any) => ['top', 'bottom'].includes(value),\n    },\n\n    ...makeVToolbarProps(),\n    ...makeLayoutItemProps(),\n\n    height: {\n      type: [Number, String],\n      default: 64,\n    },\n  },\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const vToolbarRef = ref()\n    const isActive = useProxiedModel(props, 'modelValue')\n    const height = computed(() => vToolbarRef.value?.contentHeight)\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      priority: computed(() => parseInt(props.priority, 10)),\n      position: toRef(props, 'position'),\n      layoutSize: height,\n      elementSize: height,\n      active: isActive,\n      absolute: toRef(props, 'absolute'),\n    })\n\n    return () => {\n      const [toolbarProps] = filterToolbarProps(props)\n\n      return (\n        <VToolbar\n          ref={ vToolbarRef }\n          class={[\n            'v-app-bar',\n            {\n              'v-app-bar--bottom': props.position === 'bottom',\n            },\n          ]}\n          style={ layoutItemStyles.value }\n          { ...toolbarProps }\n          v-slots={ slots }\n        />\n      )\n    }\n  },\n})\n\nexport type VAppBar = InstanceType<typeof VAppBar>\n"],"file":"VAppBar.mjs"}

package/lib/components/VAppBar/VAppBar.sass

@@ -1,98 +1,12 @@
-@import './index'
+@forward './variables'
+@use '../../styles/tools'
+@use './variables' as *
 
 .v-app-bar
-  align-items: flex-start
   display: flex
-  flex-direction: column
-  justify-content: space-between
-  max-width: 100%
-  overflow: hidden
-  padding-left: $app-bar-padding-start
-  padding-right: calc(#{$app-bar-padding-end} + var(--v-scrollbar-offset))
-  position: fixed
-  transition: $app-bar-transition
-  transition-property: height, transform
 
-  // must be above border mixin for cascade
-  &--is-active
-    @include elevation($app-bar-elevation)
+  &.v-toolbar
+    @include tools.theme($app-bar-theme...)
 
-  @include border($app-bar-border...)
-  @include rounded($app-bar-border-radius)
-  @include theme($app-bar-theme...)
-
-  &--absolute
-    position: absolute
-
-  &--border
-    &.v-app-bar--bottom
-      border-bottom-width: $app-bar-border-width
-      border-top-width: $app-bar-border-thin-width
-
-  &--collapsed
-    max-width: $app-bar-collapsed-max-width
-    overflow: hidden
-
-    @include ltr()
-      border-bottom-right-radius: $app-bar-collapsed-border-radius
-
-    @include rtl()
-      border-bottom-left-radius: $app-bar-collapsed-border-radius
-
-  &--flat
-    @include elevation($app-bar-flat-elevation)
-
-  &--floating
-    display: inline-flex
-
-  &--rounded
-    @include rounded($app-bar-rounded-border-radius)
-
-.v-app-bar__content
-  align-items: center
-  display: flex
-  flex: 0 0 auto
-  transition: inherit
-  width: 100%
-
-  .v-app-bar--density-default &
-    padding-bottom: $app-bar-density-default-padding
-    padding-top: $app-bar-density-default-padding
-
-  .v-app-bar--density-comfortable &
-    padding-bottom: $app-bar-density-comfortable-padding
-    padding-top: $app-bar-density-comfortable-padding
-
-  .v-app-bar--density-compact &
-    padding-bottom: $app-bar-density-compact-padding
-    padding-top: $app-bar-density-compact-padding
-
-.v-app-bar__extension
-  align-items: center
-  display: flex
-  flex: 0 0 auto
-  transition: inherit
-  width: 100%
-
-.v-app-bar__image
-  height: 100%
-  left: 0
-  position: absolute
-  top: 0
-  width: 100%
-  z-index: -1
-  display: flex
-
-.v-app-bar__append
-  display: flex
-  flex: 0 1 auto
-
-  @include ltr()
-    margin-left: auto
-
-  @include rtl()
-    margin-right: auto
-
-.v-app-bar__prepend
-  display: flex
-  flex: 0 1 auto
+    &:not(.v-toolbar--flat)
+      @include tools.elevation($app-bar-elevation)

package/lib/components/VAppBar/VAppBarNavIcon.mjs

@@ -2,20 +2,20 @@ import { createVNode as _createVNode } from "vue";
 // Components
 import { VBtn } from "../VBtn/index.mjs"; // Utilities
 
-import { defineComponent } from 'vue';
-import { makeProps } from "../../util/index.mjs";
-export default defineComponent({
+import { defineComponent } from "../../util/index.mjs";
+export const VAppBarNavIcon = defineComponent({
   name: 'VAppBarNavIcon',
-  props: makeProps({
+  props: {
     icon: {
       type: String,
       default: '$menu'
     }
-  }),
+  },
 
-  setup(props, {
-    slots
-  }) {
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
     return () => {
       var _slots$default;
 
@@ -24,7 +24,7 @@ export default defineComponent({
         "icon": props.icon
       }, {
         default: () => [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]
-      }, 8, ["icon"]);
+      });
     };
   }
 

package/lib/components/VAppBar/VAppBarNavIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VAppBar/VAppBarNavIcon.tsx"],"names":["VBtn","defineComponent","makeProps","name","props","icon","type","String","default","setup","slots"],"mappings":";AAAA;SACSA,I,6BAET;;AACA,SAASC,eAAT,QAAgC,KAAhC;SACSC,S;AAET,eAAeD,eAAe,CAAC;AAC7BE,EAAAA,IAAI,EAAE,gBADuB;AAG7BC,EAAAA,KAAK,EAAEF,SAAS,CAAC;AACfG,IAAAA,IAAI,EAAE;AACJC,MAAAA,IAAI,EAAEC,MADF;AAEJC,MAAAA,OAAO,EAAE;AAFL;AADS,GAAD,CAHa;;AAU7BC,EAAAA,KAAK,CAAEL,KAAF,EAAS;AAAEM,IAAAA;AAAF,GAAT,EAAoB;AACvB,WAAO;AAAA;;AAAA;AAAA,iBACO,oBADP;AAAA,gBACmCN,KAAK,CAACC;AADzC;AAAA,0CAEDK,KAAK,CAACF,OAFL,qBAED,oBAAAE,KAAK,CAFJ;AAAA;AAAA,KAAP;AAKD;;AAhB4B,CAAD,CAA9B","sourcesContent":["// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Utilities\nimport { defineComponent } from 'vue'\nimport { makeProps } from '@/util'\n\nexport default defineComponent({\n  name: 'VAppBarNavIcon',\n\n  props: makeProps({\n    icon: {\n      type: String,\n      default: '$menu',\n    },\n  }),\n\n  setup (props, { slots }) {\n    return () => (\n      <VBtn class=\"v-app-bar-nav-icon\" icon={ props.icon }>\n        { slots.default?.() }\n      </VBtn>\n    )\n  },\n})\n"],"file":"VAppBarNavIcon.mjs"}
+{"version":3,"sources":["../../../src/components/VAppBar/VAppBarNavIcon.tsx"],"names":["VBtn","defineComponent","VAppBarNavIcon","name","props","icon","type","String","default","setup","slots"],"mappings":";AAAA;SACSA,I,6BAET;;SACSC,e;AAET,OAAO,MAAMC,cAAc,GAAGD,eAAe,CAAC;AAC5CE,EAAAA,IAAI,EAAE,gBADsC;AAG5CC,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE;AACJC,MAAAA,IAAI,EAAEC,MADF;AAEJC,MAAAA,OAAO,EAAE;AAFL;AADD,GAHqC;;AAU5CC,EAAAA,KAAK,CAAEL,KAAF,QAAoB;AAAA,QAAX;AAAEM,MAAAA;AAAF,KAAW;AACvB,WAAO;AAAA;;AAAA;AAAA,iBACO,oBADP;AAAA,gBACmCN,KAAK,CAACC;AADzC;AAAA,0CAEDK,KAAK,CAACF,OAFL,qBAED,oBAAAE,KAAK,CAFJ;AAAA;AAAA,KAAP;AAKD;;AAhB2C,CAAD,CAAtC","sourcesContent":["// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\nexport const VAppBarNavIcon = defineComponent({\n  name: 'VAppBarNavIcon',\n\n  props: {\n    icon: {\n      type: String,\n      default: '$menu',\n    },\n  },\n\n  setup (props, { slots }) {\n    return () => (\n      <VBtn class=\"v-app-bar-nav-icon\" icon={ props.icon }>\n        { slots.default?.() }\n      </VBtn>\n    )\n  },\n})\n"],"file":"VAppBarNavIcon.mjs"}