@vuetify/nightly 3.0.0-beta.3 → 3.0.0-beta.6

package/lib/components/VToolbar/VToolbar.css

@@ -1,6 +1,7 @@
 .v-toolbar {
   align-items: flex-start;
   display: flex;
+  flex: 1 1 auto;
   flex-direction: column;
   justify-content: space-between;
   max-width: 100%;
@@ -78,6 +79,15 @@
   width: 100%;
 }
 
+.v-toolbar__content > .v-btn:first-child {
+  margin-inline-start: -6px;
+}
+.v-toolbar__content > .v-btn:first-child + .v-toolbar-title {
+  padding-inline-start: 20px;
+}
+.v-toolbar__content > .v-btn:last-child {
+  margin-inline-end: -6px;
+}
 .v-toolbar--density-prominent .v-toolbar__content {
   align-items: flex-start;
 }
@@ -97,20 +107,16 @@
 }
 
 .v-toolbar__prepend {
+  margin-inline-start: -6px;
   margin-inline-end: auto;
 }
-.v-toolbar__prepend > .v-btn:first-child {
-  margin-inline-start: -12px;
-}
 .v-toolbar__prepend + .v-toolbar-title {
   padding-inline-start: 20px;
 }
 
 .v-toolbar__append {
   margin-inline-start: auto;
-}
-.v-toolbar__append > .v-btn:last-child {
-  margin-inline-end: -12px;
+  margin-inline-end: -6px;
 }
 
 .v-toolbar-title {
@@ -142,4 +148,7 @@
 .v-toolbar-items {
   display: flex;
   height: inherit;
+}
+.v-toolbar-items > .v-btn {
+  border-radius: 0;
 }

package/lib/components/VToolbar/VToolbar.mjs

@@ -12,13 +12,13 @@ import { makeElevationProps, useElevation } from "../../composables/elevation.mj
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
+import { provideDefaults } from "../../composables/defaults.mjs";
 import { useBackgroundColor } from "../../composables/color.mjs";
 import { useForwardRef } from "../../composables/forwardRef.mjs"; // Utilities
 
 import { computed, ref, toRef } from 'vue';
 import { convertToUnit, genericComponent, pick, propsFactory, useRender } from "../../util/index.mjs"; // Types
 
-import { provideDefaults } from "../../composables/defaults.mjs";
 const allowedDensities = [null, 'prominent', 'default', 'comfortable', 'compact'];
 export const makeVToolbarProps = propsFactory({
   absolute: Boolean,
@@ -38,7 +38,7 @@ export const makeVToolbarProps = propsFactory({
   floating: Boolean,
   height: {
     type: [Number, String],
-    default: 56
+    default: 64
   },
   image: String,
   title: String,
@@ -60,6 +60,10 @@ export const VToolbar = genericComponent()({
     let {
       slots
     } = _ref;
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(toRef(props, 'color'));
     const {
       borderClasses
     } = useBorder(props);
@@ -72,16 +76,11 @@ export const VToolbar = genericComponent()({
     const {
       themeClasses
     } = provideTheme(props);
-    const {
-      backgroundColorClasses,
-      backgroundColorStyles
-    } = useBackgroundColor(toRef(props, 'color'));
     const isExtended = ref(!!(props.extended || (_slots$extension = slots.extension) != null && _slots$extension.call(slots)));
     const contentHeight = computed(() => parseInt(Number(props.height) + (props.density === 'prominent' ? Number(props.height) : 0) - (props.density === 'comfortable' ? 8 : 0) - (props.density === 'compact' ? 16 : 0), 10));
     const extensionHeight = computed(() => isExtended.value ? parseInt(Number(props.extensionHeight) + (props.density === 'prominent' ? Number(props.extensionHeight) : 0) - (props.density === 'comfortable' ? 4 : 0) - (props.density === 'compact' ? 8 : 0), 10) : 0);
     provideDefaults({
       VBtn: {
-        flat: true,
         variant: 'text'
       }
     });
@@ -103,6 +102,7 @@ export const VToolbar = genericComponent()({
         "style": [backgroundColorStyles.value]
       }, {
         default: () => [hasImage && _createVNode("div", {
+          "key": "image",
           "class": "v-toolbar__image"
         }, [_createVNode(VDefaultsProvider, {
           "defaults": {
@@ -110,8 +110,7 @@ export const VToolbar = genericComponent()({
               cover: true,
               src: props.image
             }
-          },
-          "scoped": true
+          }
         }, {
           default: () => [slots.image ? (_slots$image = slots.image) == null ? void 0 : _slots$image.call(slots) : _createVNode(VImg, null, null)]
         })]), _createVNode("div", {
@@ -122,6 +121,7 @@ export const VToolbar = genericComponent()({
         }, [slots.prepend && _createVNode("div", {
           "class": "v-toolbar__prepend"
         }, [(_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots)]), hasTitle && _createVNode(VToolbarTitle, {
+          "key": "title",
           "text": props.title
         }, {
           text: slots.title

package/lib/components/VToolbar/VToolbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VToolbar.mjs","names":["VDefaultsProvider","VExpandTransition","VImg","VToolbarTitle","makeBorderProps","useBorder","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useBackgroundColor","useForwardRef","computed","ref","toRef","convertToUnit","genericComponent","pick","propsFactory","useRender","provideDefaults","allowedDensities","makeVToolbarProps","absolute","Boolean","collapse","color","String","density","type","default","validator","v","includes","extended","extensionHeight","Number","flat","floating","height","image","title","tag","VToolbar","name","props","setup","slots","borderClasses","elevationClasses","roundedClasses","themeClasses","backgroundColorClasses","backgroundColorStyles","isExtended","extension","contentHeight","parseInt","value","VBtn","variant","hasTitle","hasImage","cover","src","prepend","text","append","filterToolbarProps","Object","keys"],"sources":["../../../src/components/VToolbar/VToolbar.tsx"],"sourcesContent":["// Styles\nimport './VToolbar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VExpandTransition } from '@/components/transitions'\nimport { VImg } from '@/components/VImg'\nimport { VToolbarTitle } from './VToolbarTitle'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useForwardRef } from '@/composables/forwardRef'\n\n// Utilities\nimport { computed, ref, toRef } from 'vue'\nimport { convertToUnit, genericComponent, pick, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { MakeSlots } from '@/util'\nimport type { ExtractPropTypes, PropType } from 'vue'\nimport { provideDefaults } from '@/composables/defaults'\n\nexport type Density = typeof allowedDensities[number]\n\nconst allowedDensities = [null, 'prominent', 'default', 'comfortable', 'compact'] as const\n\nexport const makeVToolbarProps = propsFactory({\n  absolute: Boolean,\n  collapse: Boolean,\n  color: String,\n  density: {\n    type: String as PropType<Density>,\n    default: 'default',\n    validator: (v: any) => allowedDensities.includes(v),\n  },\n  extended: Boolean,\n  extensionHeight: {\n    type: [Number, String],\n    default: 48,\n  },\n  flat: Boolean,\n  floating: Boolean,\n  height: {\n    type: [Number, String],\n    default: 56,\n  },\n  image: String,\n  title: String,\n\n  ...makeBorderProps(),\n  ...makeElevationProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps({ tag: 'header' }),\n  ...makeThemeProps(),\n}, 'v-toolbar')\n\nexport const VToolbar = genericComponent<new () => {\n  $slots: MakeSlots<{\n    default: []\n    image: [{ image: string }]\n    prepend: []\n    append: []\n    title: []\n    extension: []\n  }>\n}>()({\n  name: 'VToolbar',\n\n  props: makeVToolbarProps(),\n\n  setup (props, { slots }) {\n    const { borderClasses } = useBorder(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const { themeClasses } = provideTheme(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n\n    const isExtended = ref(!!(props.extended || slots.extension?.()))\n    const contentHeight = computed(() => parseInt((\n      Number(props.height) +\n      (props.density === 'prominent' ? Number(props.height) : 0) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ), 10))\n    const extensionHeight = computed(() => isExtended.value\n      ? parseInt((\n        Number(props.extensionHeight) +\n        (props.density === 'prominent' ? Number(props.extensionHeight) : 0) -\n        (props.density === 'comfortable' ? 4 : 0) -\n        (props.density === 'compact' ? 8 : 0)\n      ), 10)\n      : 0\n    )\n\n    provideDefaults({\n      VBtn: {\n        flat: true,\n        variant: 'text',\n      },\n    })\n\n    useRender(() => {\n      const hasTitle = !!(props.title || slots.title)\n      const hasImage = !!(slots.image || props.image)\n\n      const extension = slots.extension?.()\n      isExtended.value = !!(props.extended || extension)\n\n      return (\n        <props.tag\n          class={[\n            'v-toolbar',\n            {\n              'v-toolbar--absolute': props.absolute,\n              'v-toolbar--collapse': props.collapse,\n              'v-toolbar--flat': props.flat,\n              'v-toolbar--floating': props.floating,\n              [`v-toolbar--density-${props.density}`]: true,\n            },\n            backgroundColorClasses.value,\n            borderClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n            themeClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n          ]}\n        >\n          { hasImage && (\n            <div class=\"v-toolbar__image\">\n              <VDefaultsProvider\n                defaults={{\n                  VImg: {\n                    cover: true,\n                    src: props.image,\n                  },\n                }}\n                scoped\n              >\n                { slots.image ? slots.image?.() : (<VImg />) }\n              </VDefaultsProvider>\n            </div>\n          ) }\n\n          <div\n            class=\"v-toolbar__content\"\n            style={{ height: convertToUnit(contentHeight.value) }}\n          >\n            { slots.prepend && (\n              <div class=\"v-toolbar__prepend\">\n                { slots.prepend?.() }\n              </div>\n            ) }\n\n            { hasTitle && (\n              <VToolbarTitle text={ props.title }>\n                {{ text: slots.title }}\n              </VToolbarTitle>\n            ) }\n\n            { slots.default?.() }\n\n            { slots.append && (\n              <div class=\"v-toolbar__append\">\n                { slots.append?.() }\n              </div>\n            ) }\n          </div>\n\n          <VExpandTransition>\n            { isExtended.value && (\n              <div\n                class=\"v-toolbar__extension\"\n                style={{ height: convertToUnit(extensionHeight.value) }}\n              >\n                { extension }\n              </div>\n            ) }\n          </VExpandTransition>\n        </props.tag>\n      )\n    })\n\n    return useForwardRef({\n      contentHeight,\n      extensionHeight,\n    })\n  },\n})\n\nexport type VToolbar = InstanceType<typeof VToolbar>\n\nexport function filterToolbarProps (props: ExtractPropTypes<ReturnType<typeof makeVToolbarProps>>) {\n  return pick(props, Object.keys(VToolbar?.props ?? {}) as any)\n}\n"],"mappings":"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"}
+{"version":3,"file":"VToolbar.mjs","names":["VDefaultsProvider","VExpandTransition","VImg","VToolbarTitle","makeBorderProps","useBorder","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","provideDefaults","useBackgroundColor","useForwardRef","computed","ref","toRef","convertToUnit","genericComponent","pick","propsFactory","useRender","allowedDensities","makeVToolbarProps","absolute","Boolean","collapse","color","String","density","type","default","validator","v","includes","extended","extensionHeight","Number","flat","floating","height","image","title","tag","VToolbar","name","props","setup","slots","backgroundColorClasses","backgroundColorStyles","borderClasses","elevationClasses","roundedClasses","themeClasses","isExtended","extension","contentHeight","parseInt","value","VBtn","variant","hasTitle","hasImage","cover","src","prepend","text","append","filterToolbarProps","Object","keys"],"sources":["../../../src/components/VToolbar/VToolbar.tsx"],"sourcesContent":["// Styles\nimport './VToolbar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VExpandTransition } from '@/components/transitions'\nimport { VImg } from '@/components/VImg'\nimport { VToolbarTitle } from './VToolbarTitle'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useForwardRef } from '@/composables/forwardRef'\n\n// Utilities\nimport { computed, ref, toRef } from 'vue'\nimport { convertToUnit, genericComponent, pick, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { ExtractPropTypes, PropType } from 'vue'\nimport type { MakeSlots } from '@/util'\n\nexport type Density = typeof allowedDensities[number]\n\nconst allowedDensities = [null, 'prominent', 'default', 'comfortable', 'compact'] as const\n\nexport const makeVToolbarProps = propsFactory({\n  absolute: Boolean,\n  collapse: Boolean,\n  color: String,\n  density: {\n    type: String as PropType<Density>,\n    default: 'default',\n    validator: (v: any) => allowedDensities.includes(v),\n  },\n  extended: Boolean,\n  extensionHeight: {\n    type: [Number, String],\n    default: 48,\n  },\n  flat: Boolean,\n  floating: Boolean,\n  height: {\n    type: [Number, String],\n    default: 64,\n  },\n  image: String,\n  title: String,\n\n  ...makeBorderProps(),\n  ...makeElevationProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps({ tag: 'header' }),\n  ...makeThemeProps(),\n}, 'v-toolbar')\n\nexport const VToolbar = genericComponent<new () => {\n  $slots: MakeSlots<{\n    default: []\n    image: []\n    prepend: []\n    append: []\n    title: []\n    extension: []\n  }>\n}>()({\n  name: 'VToolbar',\n\n  props: makeVToolbarProps(),\n\n  setup (props, { slots }) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { borderClasses } = useBorder(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const { themeClasses } = provideTheme(props)\n\n    const isExtended = ref(!!(props.extended || slots.extension?.()))\n    const contentHeight = computed(() => parseInt((\n      Number(props.height) +\n      (props.density === 'prominent' ? Number(props.height) : 0) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ), 10))\n    const extensionHeight = computed(() => isExtended.value\n      ? parseInt((\n        Number(props.extensionHeight) +\n        (props.density === 'prominent' ? Number(props.extensionHeight) : 0) -\n        (props.density === 'comfortable' ? 4 : 0) -\n        (props.density === 'compact' ? 8 : 0)\n      ), 10)\n      : 0\n    )\n\n    provideDefaults({\n      VBtn: {\n        variant: 'text',\n      },\n    })\n\n    useRender(() => {\n      const hasTitle = !!(props.title || slots.title)\n      const hasImage = !!(slots.image || props.image)\n\n      const extension = slots.extension?.()\n      isExtended.value = !!(props.extended || extension)\n\n      return (\n        <props.tag\n          class={[\n            'v-toolbar',\n            {\n              'v-toolbar--absolute': props.absolute,\n              'v-toolbar--collapse': props.collapse,\n              'v-toolbar--flat': props.flat,\n              'v-toolbar--floating': props.floating,\n              [`v-toolbar--density-${props.density}`]: true,\n            },\n            backgroundColorClasses.value,\n            borderClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n            themeClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n          ]}\n        >\n          { hasImage && (\n            <div key=\"image\" class=\"v-toolbar__image\">\n              <VDefaultsProvider\n                defaults={{\n                  VImg: {\n                    cover: true,\n                    src: props.image,\n                  },\n                }}\n              >\n                { slots.image ? slots.image?.() : (<VImg />) }\n              </VDefaultsProvider>\n            </div>\n          ) }\n\n          <div\n            class=\"v-toolbar__content\"\n            style={{ height: convertToUnit(contentHeight.value) }}\n          >\n            { slots.prepend && (\n              <div class=\"v-toolbar__prepend\">\n                { slots.prepend?.() }\n              </div>\n            ) }\n\n            { hasTitle && (\n              <VToolbarTitle key=\"title\" text={ props.title }>\n                {{ text: slots.title }}\n              </VToolbarTitle>\n            ) }\n\n            { slots.default?.() }\n\n            { slots.append && (\n              <div class=\"v-toolbar__append\">\n                { slots.append?.() }\n              </div>\n            ) }\n          </div>\n\n          <VExpandTransition>\n            { isExtended.value && (\n              <div\n                class=\"v-toolbar__extension\"\n                style={{ height: convertToUnit(extensionHeight.value) }}\n              >\n                { extension }\n              </div>\n            ) }\n          </VExpandTransition>\n        </props.tag>\n      )\n    })\n\n    return useForwardRef({\n      contentHeight,\n      extensionHeight,\n    })\n  },\n})\n\nexport type VToolbar = InstanceType<typeof VToolbar>\n\nexport function filterToolbarProps (props: ExtractPropTypes<ReturnType<typeof makeVToolbarProps>>) {\n  return pick(props, Object.keys(VToolbar?.props ?? {}) as any)\n}\n"],"mappings":";AAAA;AACA,wB,CAEA;;SACSA,iB;SACAC,iB;SACAC,I;SACAC,a,+BAET;;SACSC,e,EAAiBC,S;SACjBC,kB,EAAoBC,Y;SACpBC,gB,EAAkBC,U;SAClBC,Y;SACAC,c,EAAgBC,Y;SAChBC,e;SACAC,kB;SACAC,a,4CAET;;AACA,SAASC,QAAT,EAAmBC,GAAnB,EAAwBC,KAAxB,QAAqC,KAArC;SACSC,a,EAAeC,gB,EAAkBC,I,EAAMC,Y,EAAcC,S,gCAE9D;;AAMA,MAAMC,gBAAgB,GAAG,CAAC,IAAD,EAAO,WAAP,EAAoB,SAApB,EAA+B,aAA/B,EAA8C,SAA9C,CAAzB;AAEA,OAAO,MAAMC,iBAAiB,GAAGH,YAAY,CAAC;EAC5CI,QAAQ,EAAEC,OADkC;EAE5CC,QAAQ,EAAED,OAFkC;EAG5CE,KAAK,EAAEC,MAHqC;EAI5CC,OAAO,EAAE;IACPC,IAAI,EAAEF,MADC;IAEPG,OAAO,EAAE,SAFF;IAGPC,SAAS,EAAGC,CAAD,IAAYX,gBAAgB,CAACY,QAAjB,CAA0BD,CAA1B;EAHhB,CAJmC;EAS5CE,QAAQ,EAAEV,OATkC;EAU5CW,eAAe,EAAE;IACfN,IAAI,EAAE,CAACO,MAAD,EAAST,MAAT,CADS;IAEfG,OAAO,EAAE;EAFM,CAV2B;EAc5CO,IAAI,EAAEb,OAdsC;EAe5Cc,QAAQ,EAAEd,OAfkC;EAgB5Ce,MAAM,EAAE;IACNV,IAAI,EAAE,CAACO,MAAD,EAAST,MAAT,CADA;IAENG,OAAO,EAAE;EAFH,CAhBoC;EAoB5CU,KAAK,EAAEb,MApBqC;EAqB5Cc,KAAK,EAAEd,MArBqC;EAuB5C,GAAG1B,eAAe,EAvB0B;EAwB5C,GAAGE,kBAAkB,EAxBuB;EAyB5C,GAAGE,gBAAgB,EAzByB;EA0B5C,GAAGE,YAAY,CAAC;IAAEmC,GAAG,EAAE;EAAP,CAAD,CA1B6B;EA2B5C,GAAGlC,cAAc;AA3B2B,CAAD,EA4B1C,WA5B0C,CAAtC;AA8BP,OAAO,MAAMmC,QAAQ,GAAG1B,gBAAgB,GASnC;EACH2B,IAAI,EAAE,UADH;EAGHC,KAAK,EAAEvB,iBAAiB,EAHrB;;EAKHwB,KAAK,CAAED,KAAF,QAAoB;IAAA;;IAAA,IAAX;MAAEE;IAAF,CAAW;IACvB,MAAM;MAAEC,sBAAF;MAA0BC;IAA1B,IAAoDtC,kBAAkB,CAACI,KAAK,CAAC8B,KAAD,EAAQ,OAAR,CAAN,CAA5E;IACA,MAAM;MAAEK;IAAF,IAAoBhD,SAAS,CAAC2C,KAAD,CAAnC;IACA,MAAM;MAAEM;IAAF,IAAuB/C,YAAY,CAACyC,KAAD,CAAzC;IACA,MAAM;MAAEO;IAAF,IAAqB9C,UAAU,CAACuC,KAAD,CAArC;IACA,MAAM;MAAEQ;IAAF,IAAmB5C,YAAY,CAACoC,KAAD,CAArC;IAEA,MAAMS,UAAU,GAAGxC,GAAG,CAAC,CAAC,EAAE+B,KAAK,CAACX,QAAN,wBAAkBa,KAAK,CAACQ,SAAxB,aAAkB,sBAAAR,KAAK,CAAzB,CAAF,CAAtB;IACA,MAAMS,aAAa,GAAG3C,QAAQ,CAAC,MAAM4C,QAAQ,CAC3CrB,MAAM,CAACS,KAAK,CAACN,MAAP,CAAN,IACCM,KAAK,CAACjB,OAAN,KAAkB,WAAlB,GAAgCQ,MAAM,CAACS,KAAK,CAACN,MAAP,CAAtC,GAAuD,CADxD,KAECM,KAAK,CAACjB,OAAN,KAAkB,aAAlB,GAAkC,CAAlC,GAAsC,CAFvC,KAGCiB,KAAK,CAACjB,OAAN,KAAkB,SAAlB,GAA8B,EAA9B,GAAmC,CAHpC,CAD2C,EAK1C,EAL0C,CAAf,CAA9B;IAMA,MAAMO,eAAe,GAAGtB,QAAQ,CAAC,MAAMyC,UAAU,CAACI,KAAX,GACnCD,QAAQ,CACRrB,MAAM,CAACS,KAAK,CAACV,eAAP,CAAN,IACCU,KAAK,CAACjB,OAAN,KAAkB,WAAlB,GAAgCQ,MAAM,CAACS,KAAK,CAACV,eAAP,CAAtC,GAAgE,CADjE,KAECU,KAAK,CAACjB,OAAN,KAAkB,aAAlB,GAAkC,CAAlC,GAAsC,CAFvC,KAGCiB,KAAK,CAACjB,OAAN,KAAkB,SAAlB,GAA8B,CAA9B,GAAkC,CAHnC,CADQ,EAKP,EALO,CAD2B,GAOnC,CAP4B,CAAhC;IAUAlB,eAAe,CAAC;MACdiD,IAAI,EAAE;QACJC,OAAO,EAAE;MADL;IADQ,CAAD,CAAf;IAMAxC,SAAS,CAAC,MAAM;MAAA;;MACd,MAAMyC,QAAQ,GAAG,CAAC,EAAEhB,KAAK,CAACJ,KAAN,IAAeM,KAAK,CAACN,KAAvB,CAAlB;MACA,MAAMqB,QAAQ,GAAG,CAAC,EAAEf,KAAK,CAACP,KAAN,IAAeK,KAAK,CAACL,KAAvB,CAAlB;MAEA,MAAMe,SAAS,wBAAGR,KAAK,CAACQ,SAAT,qBAAG,uBAAAR,KAAK,CAAvB;MACAO,UAAU,CAACI,KAAX,GAAmB,CAAC,EAAEb,KAAK,CAACX,QAAN,IAAkBqB,SAApB,CAApB;MAEA;QAAA,SAEW,CACL,WADK,EAEL;UACE,uBAAuBV,KAAK,CAACtB,QAD/B;UAEE,uBAAuBsB,KAAK,CAACpB,QAF/B;UAGE,mBAAmBoB,KAAK,CAACR,IAH3B;UAIE,uBAAuBQ,KAAK,CAACP,QAJ/B;UAKE,CAAE,sBAAqBO,KAAK,CAACjB,OAAQ,EAArC,GAAyC;QAL3C,CAFK,EASLoB,sBAAsB,CAACU,KATlB,EAULR,aAAa,CAACQ,KAVT,EAWLP,gBAAgB,CAACO,KAXZ,EAYLN,cAAc,CAACM,KAZV,EAaLL,YAAY,CAACK,KAbR,CAFX;QAAA,SAiBW,CACLT,qBAAqB,CAACS,KADjB;MAjBX;QAAA,gBAqBMI,QAAQ;UAAA,OACC,OADD;UAAA,SACe;QADf;UAAA,YAGM;YACR/D,IAAI,EAAE;cACJgE,KAAK,EAAE,IADH;cAEJC,GAAG,EAAEnB,KAAK,CAACL;YAFP;UADE;QAHN;UAAA,gBAUFO,KAAK,CAACP,KAAN,mBAAcO,KAAK,CAACP,KAApB,qBAAc,kBAAAO,KAAK,CAAnB,iCAVE;QAAA,IArBd;UAAA,SAqCY,oBArCZ;UAAA,SAsCa;YAAER,MAAM,EAAEvB,aAAa,CAACwC,aAAa,CAACE,KAAf;UAAvB;QAtCb,IAwCQX,KAAK,CAACkB,OAAN;UAAA,SACW;QADX,sBAEIlB,KAAK,CAACkB,OAFV,qBAEI,oBAAAlB,KAAK,CAFT,EAxCR,EA8CQc,QAAQ;UAAA,OACW,OADX;UAAA,QAC0BhB,KAAK,CAACJ;QADhC;UAEHyB,IAAI,EAAEnB,KAAK,CAACN;QAFT,EA9ChB,oBAoDQM,KAAK,CAACjB,OApDd,qBAoDQ,oBAAAiB,KAAK,CApDb,EAsDQA,KAAK,CAACoB,MAAN;UAAA,SACW;QADX,qBAEIpB,KAAK,CAACoB,MAFV,qBAEI,mBAAApB,KAAK,CAFT,EAtDR;UAAA,gBA8DQO,UAAU,CAACI,KAAX;YAAA,SAEQ,sBAFR;YAAA,SAGS;cAAEnB,MAAM,EAAEvB,aAAa,CAACmB,eAAe,CAACuB,KAAjB;YAAvB;UAHT,IAKIH,SALJ,EA9DR;QAAA;MAAA;IAyED,CAhFQ,CAAT;IAkFA,OAAO3C,aAAa,CAAC;MACnB4C,aADmB;MAEnBrB;IAFmB,CAAD,CAApB;EAID;;AAzHE,CATmC,CAAjC;AAuIP,OAAO,SAASiC,kBAAT,CAA6BvB,KAA7B,EAA4F;EAAA;;EACjG,OAAO3B,IAAI,CAAC2B,KAAD,EAAQwB,MAAM,CAACC,IAAP,oBAAY3B,QAAZ,oBAAYA,QAAQ,CAAEE,KAAtB,8BAA+B,EAA/B,CAAR,CAAX;AACD"}

package/lib/components/VToolbar/VToolbar.sass

@@ -1,4 +1,3 @@
-@forward './variables'
 @use '../../styles/tools'
 @use './variables' as *
 
@@ -6,6 +5,7 @@
 .v-toolbar
   align-items: flex-start
   display: flex
+  flex: $toolbar-flex
   flex-direction: column
   justify-content: space-between
   max-width: 100%
@@ -62,6 +62,15 @@
   width: 100%
 
 .v-toolbar__content
+  > .v-btn:first-child
+    margin-inline-start: $toolbar-prepend-btn-margin-start
+
+    + .v-toolbar-title
+      padding-inline-start: $toolbar-title-padding
+
+  > .v-btn:last-child
+    margin-inline-end: $toolbar-append-btn-margin-end
+
   .v-toolbar--density-prominent &
     align-items: flex-start
 
@@ -75,19 +84,15 @@
   display: flex
 
 .v-toolbar__prepend
+  margin-inline-start: $toolbar-prepend-btn-margin-start
   margin-inline-end: auto
 
-  > .v-btn:first-child
-    margin-inline-start: $toolbar-prepend-btn-margin-start
-
   + .v-toolbar-title
     padding-inline-start: $toolbar-title-padding
 
 .v-toolbar__append
   margin-inline-start: auto
-
-  > .v-btn:last-child
-    margin-inline-end: $toolbar-append-btn-margin-end
+  margin-inline-end: $toolbar-append-btn-margin-end
 
 .v-toolbar-title
   flex: 1 1
@@ -110,3 +115,6 @@
 .v-toolbar-items
   display: flex
   height: inherit
+
+  > .v-btn
+    border-radius: 0

package/lib/components/VToolbar/VToolbarItems.mjs

@@ -1,15 +1,15 @@
+import { createVNode as _createVNode } from "vue";
 // Composables
 import { makeVariantProps } from "../../composables/variant.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs"; // Utilities
 
-import { defineComponent } from "../../util/index.mjs";
+import { defineComponent, useRender } from "../../util/index.mjs";
 import { toRef } from 'vue';
 export const VToolbarItems = defineComponent({
   name: 'VToolbarItems',
-  props: { ...makeVariantProps({
-      variant: 'contained-text'
-    })
-  },
+  props: makeVariantProps({
+    variant: 'text'
+  }),
 
   setup(props, _ref) {
     let {
@@ -18,14 +18,18 @@ export const VToolbarItems = defineComponent({
     provideDefaults({
       VBtn: {
         color: toRef(props, 'color'),
+        height: 'inherit',
         variant: toRef(props, 'variant')
       }
     });
-    return () => {
+    useRender(() => {
       var _slots$default;
 
-      return (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots);
-    };
+      return _createVNode("div", {
+        "class": "v-toolbar-items"
+      }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]);
+    });
+    return {};
   }
 
 });

package/lib/components/VToolbar/VToolbarItems.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VToolbarItems.mjs","names":["makeVariantProps","provideDefaults","defineComponent","toRef","VToolbarItems","name","props","variant","setup","slots","VBtn","color","default"],"sources":["../../../src/components/VToolbar/VToolbarItems.tsx"],"sourcesContent":["// Composables\nimport { makeVariantProps } from '@/composables/variant'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utilities\nimport { defineComponent } from '@/util'\nimport { toRef } from 'vue'\n\nexport const VToolbarItems = defineComponent({\n  name: 'VToolbarItems',\n\n  props: {\n    ...makeVariantProps({ variant: 'contained-text' }),\n  },\n\n  setup (props, { slots }) {\n    provideDefaults({\n      VBtn: {\n        color: toRef(props, 'color'),\n        variant: toRef(props, 'variant'),\n      },\n    })\n\n    return () => slots.default?.()\n  },\n})\n\nexport type VToolbarItems = InstanceType<typeof VToolbarItems>\n"],"mappings":"AAAA;SACSA,gB;SACAC,e,0CAET;;SACSC,e;AACT,SAASC,KAAT,QAAsB,KAAtB;AAEA,OAAO,MAAMC,aAAa,GAAGF,eAAe,CAAC;EAC3CG,IAAI,EAAE,eADqC;EAG3CC,KAAK,EAAE,EACL,GAAGN,gBAAgB,CAAC;MAAEO,OAAO,EAAE;IAAX,CAAD;EADd,CAHoC;;EAO3CC,KAAK,CAAEF,KAAF,QAAoB;IAAA,IAAX;MAAEG;IAAF,CAAW;IACvBR,eAAe,CAAC;MACdS,IAAI,EAAE;QACJC,KAAK,EAAER,KAAK,CAACG,KAAD,EAAQ,OAAR,CADR;QAEJC,OAAO,EAAEJ,KAAK,CAACG,KAAD,EAAQ,SAAR;MAFV;IADQ,CAAD,CAAf;IAOA,OAAO;MAAA;;MAAA,yBAAMG,KAAK,CAACG,OAAZ,qBAAM,oBAAAH,KAAK,CAAX;IAAA,CAAP;EACD;;AAhB0C,CAAD,CAArC"}
+{"version":3,"file":"VToolbarItems.mjs","names":["makeVariantProps","provideDefaults","defineComponent","useRender","toRef","VToolbarItems","name","props","variant","setup","slots","VBtn","color","height","default"],"sources":["../../../src/components/VToolbar/VToolbarItems.tsx"],"sourcesContent":["// Composables\nimport { makeVariantProps } from '@/composables/variant'\nimport { provideDefaults } from '@/composables/defaults'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\nimport { toRef } from 'vue'\n\nexport const VToolbarItems = defineComponent({\n  name: 'VToolbarItems',\n\n  props: makeVariantProps({ variant: 'text' }),\n\n  setup (props, { slots }) {\n    provideDefaults({\n      VBtn: {\n        color: toRef(props, 'color'),\n        height: 'inherit',\n        variant: toRef(props, 'variant'),\n      },\n    })\n\n    useRender(() => (\n      <div class=\"v-toolbar-items\">\n        { slots.default?.() }\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VToolbarItems = InstanceType<typeof VToolbarItems>\n"],"mappings":";AAAA;SACSA,gB;SACAC,e,0CAET;;SACSC,e,EAAiBC,S;AAC1B,SAASC,KAAT,QAAsB,KAAtB;AAEA,OAAO,MAAMC,aAAa,GAAGH,eAAe,CAAC;EAC3CI,IAAI,EAAE,eADqC;EAG3CC,KAAK,EAAEP,gBAAgB,CAAC;IAAEQ,OAAO,EAAE;EAAX,CAAD,CAHoB;;EAK3CC,KAAK,CAAEF,KAAF,QAAoB;IAAA,IAAX;MAAEG;IAAF,CAAW;IACvBT,eAAe,CAAC;MACdU,IAAI,EAAE;QACJC,KAAK,EAAER,KAAK,CAACG,KAAD,EAAQ,OAAR,CADR;QAEJM,MAAM,EAAE,SAFJ;QAGJL,OAAO,EAAEJ,KAAK,CAACG,KAAD,EAAQ,SAAR;MAHV;IADQ,CAAD,CAAf;IAQAJ,SAAS,CAAC;MAAA;;MAAA;QAAA,SACG;MADH,sBAEJO,KAAK,CAACI,OAFF,qBAEJ,oBAAAJ,KAAK,CAFD;IAAA,CAAD,CAAT;IAMA,OAAO,EAAP;EACD;;AArB0C,CAAD,CAArC"}

package/lib/components/VToolbar/_variables.scss

@@ -3,6 +3,7 @@
 @use "../../styles/settings/variables";
 @use "../../styles/tools/functions";
 
+// VToolbar
 $toolbar-background: rgb(var(--v-theme-on-surface-variant)) !default;
 $toolbar-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
 $toolbar-border-color: settings.$border-color-root !default;
@@ -18,14 +19,16 @@ $toolbar-content-padding-y: 4px !default;
 $toolbar-density: ( 'default': 0, 'comfortable': -1, 'compact': -2, 'prominent': -3 ) !default;
 $toolbar-elevation: 0 !default;
 $toolbar-flat-elevation: 0 !default;
+$toolbar-flex: 1 1 auto !default;
 $toolbar-padding-end: 16px !default;
 $toolbar-padding-start: 16px !default;
 $toolbar-padding: 16px !default;
-$toolbar-prepend-btn-margin-start: -12px !default;
-$toolbar-append-btn-margin-end: -12px !default;
+$toolbar-prepend-btn-margin-start: -6px !default;
+$toolbar-append-btn-margin-end: -6px !default;
 $toolbar-rounded-border-radius: variables.$border-radius-root !default;
 $toolbar-transition: .2s variables.$standard-easing !default;
 
+// VToolbarTitle
 $toolbar-title-padding: 20px !default;
 $toolbar-title-extended-padding: 56px !default;
 $toolbar-title-font-size: 1.25rem !default;
@@ -39,6 +42,7 @@ $toolbar-prominent-title-letter-spacing: 0 !default;
 $toolbar-prominent-title-line-height: 2.25rem !default;
 $toolbar-prominent-title-text-transform: none !default;
 
+// Lists
 $toolbar-border: (
   $toolbar-border-color,
   $toolbar-border-style,

package/lib/components/VTooltip/VTooltip.mjs

@@ -4,13 +4,14 @@ import "./VTooltip.css"; // Components
 
 import { VOverlay } from "../VOverlay/index.mjs"; // Composables
 
+import { makeTransitionProps } from "../../composables/transition.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs";
-import { makeTransitionProps } from "../../composables/transition.mjs"; // Utilities
+import { useScopeId } from "../../composables/scopeId.mjs";
+import { useForwardRef } from "../../composables/forwardRef.mjs"; // Utilities
 
-import { computed } from 'vue';
-import { genericComponent, getUid } from "../../util/index.mjs"; // Types
+import { computed, ref } from 'vue';
+import { genericComponent, getUid, useRender } from "../../util/index.mjs"; // Types
 
-import { useScopeId } from "../../composables/scopeId.mjs";
 export const VTooltip = genericComponent()({
   name: 'VTooltip',
   inheritAttrs: false,
@@ -45,6 +46,7 @@ export const VTooltip = genericComponent()({
     } = useScopeId();
     const uid = getUid();
     const id = computed(() => props.id || `v-tooltip-${uid}`);
+    const overlay = ref();
     const location = computed(() => {
       return props.location.split(' ').length > 1 ? props.location : props.location + ' center';
     });
@@ -55,43 +57,43 @@ export const VTooltip = genericComponent()({
       if (props.transition) return props.transition;
       return isActive.value ? 'scale-transition' : 'fade-transition';
     });
-    return () => {
-      return _createVNode(VOverlay, _mergeProps({
-        "modelValue": isActive.value,
-        "onUpdate:modelValue": $event => isActive.value = $event,
-        "class": ['v-tooltip'],
-        "id": id.value,
-        "transition": transition.value,
-        "absolute": true,
-        "locationStrategy": "connected",
-        "scrollStrategy": "reposition",
-        "location": location.value,
-        "origin": origin.value,
-        "min-width": 0,
-        "offset": 10,
-        "scrim": false,
-        "persistent": true,
-        "open-on-click": false,
-        "open-on-hover": true,
-        "close-on-back": false,
-        "role": "tooltip",
-        "eager": true,
-        "activatorProps": {
-          'aria-describedby': id.value
-        }
-      }, scopeId, attrs), {
-        activator: slots.activator,
-        default: function () {
-          var _slots$default, _slots$default2;
+    useRender(() => _createVNode(VOverlay, _mergeProps({
+      "modelValue": isActive.value,
+      "onUpdate:modelValue": $event => isActive.value = $event,
+      "ref": overlay,
+      "class": ['v-tooltip'],
+      "id": id.value,
+      "transition": transition.value,
+      "absolute": true,
+      "locationStrategy": "connected",
+      "scrollStrategy": "reposition",
+      "location": location.value,
+      "origin": origin.value,
+      "min-width": 0,
+      "offset": 10,
+      "scrim": false,
+      "persistent": true,
+      "open-on-click": false,
+      "open-on-hover": true,
+      "close-on-back": false,
+      "role": "tooltip",
+      "eager": true,
+      "activatorProps": {
+        'aria-describedby': id.value
+      }
+    }, scopeId, attrs), {
+      activator: slots.activator,
+      default: function () {
+        var _slots$default, _slots$default2;
 
-          for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-            args[_key] = arguments[_key];
-          }
-
-          return (_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots, ...args)) != null ? _slots$default : props.text;
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
         }
-      });
-    };
+
+        return (_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots, ...args)) != null ? _slots$default : props.text;
+      }
+    }));
+    return useForwardRef({}, overlay);
   }
 
 });

package/lib/components/VTooltip/VTooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VTooltip.mjs","names":["VOverlay","useProxiedModel","makeTransitionProps","computed","genericComponent","getUid","useScopeId","VTooltip","name","inheritAttrs","props","id","String","modelValue","Boolean","text","location","type","default","origin","transition","emits","value","setup","attrs","slots","isActive","scopeId","uid","split","length","activator","args"],"sources":["../../../src/components/VTooltip/VTooltip.tsx"],"sourcesContent":["// Styles\nimport './VTooltip.sass'\n\n// Components\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { makeTransitionProps } from '@/composables/transition'\n\n// Utilities\nimport { computed } from 'vue'\nimport { genericComponent, getUid } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\nimport type { StrategyProps } from '@/components/VOverlay/locationStrategies'\nimport { useScopeId } from '@/composables/scopeId'\n\nexport const VTooltip = genericComponent<new () => {\n  $slots: OverlaySlots\n}>()({\n  name: 'VTooltip',\n\n  inheritAttrs: false,\n\n  props: {\n    id: String,\n    modelValue: Boolean,\n    text: String,\n\n    location: {\n      type: String as PropType<StrategyProps['location']>,\n      default: 'end',\n    },\n    origin: {\n      type: String as PropType<StrategyProps['origin']>,\n      default: 'auto',\n    },\n\n    ...makeTransitionProps({\n      transition: false,\n    } as const),\n  },\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const uid = getUid()\n    const id = computed(() => props.id || `v-tooltip-${uid}`)\n\n    const location = computed(() => {\n      return props.location.split(' ').length > 1\n        ? props.location\n        : props.location + ' center' as StrategyProps['location']\n    })\n\n    const origin = computed(() => {\n      return (\n        props.origin === 'auto' ||\n        props.origin === 'overlap' ||\n        props.origin.split(' ').length > 1 ||\n        props.location.split(' ').length > 1\n      ) ? props.origin\n        : props.origin + ' center' as StrategyProps['origin']\n    })\n\n    const transition = computed(() => {\n      if (props.transition) return props.transition\n      return isActive.value ? 'scale-transition' : 'fade-transition'\n    })\n\n    return () => {\n      return (\n        <VOverlay\n          v-model={ isActive.value }\n          class={[\n            'v-tooltip',\n          ]}\n          id={ id.value }\n          transition={ transition.value }\n          absolute\n          locationStrategy=\"connected\"\n          scrollStrategy=\"reposition\"\n          location={ location.value }\n          origin={ origin.value }\n          min-width={ 0 }\n          offset={ 10 }\n          scrim={ false }\n          persistent\n          open-on-click={ false }\n          open-on-hover\n          close-on-back={ false }\n          role=\"tooltip\"\n          eager\n          activatorProps={{\n            'aria-describedby': id.value,\n          }}\n          { ...scopeId }\n          { ...attrs }\n        >\n          {{\n            activator: slots.activator,\n            default: (...args) => slots.default?.(...args) ?? props.text,\n          }}\n        </VOverlay>\n      )\n    }\n  },\n})\n\nexport type VTooltip = InstanceType<typeof VTooltip>\n"],"mappings":";AAAA;AACA,wB,CAEA;;SACSA,Q,iCAET;;SACSC,e;SACAC,mB,4CAET;;AACA,SAASC,QAAT,QAAyB,KAAzB;SACSC,gB,EAAkBC,M,gCAE3B;;SAISC,U;AAET,OAAO,MAAMC,QAAQ,GAAGH,gBAAgB,GAEnC;EACHI,IAAI,EAAE,UADH;EAGHC,YAAY,EAAE,KAHX;EAKHC,KAAK,EAAE;IACLC,EAAE,EAAEC,MADC;IAELC,UAAU,EAAEC,OAFP;IAGLC,IAAI,EAAEH,MAHD;IAKLI,QAAQ,EAAE;MACRC,IAAI,EAAEL,MADE;MAERM,OAAO,EAAE;IAFD,CALL;IASLC,MAAM,EAAE;MACNF,IAAI,EAAEL,MADA;MAENM,OAAO,EAAE;IAFH,CATH;IAcL,GAAGhB,mBAAmB,CAAC;MACrBkB,UAAU,EAAE;IADS,CAAD;EAdjB,CALJ;EAwBHC,KAAK,EAAE;IACL,qBAAsBC,KAAD,IAAoB;EADpC,CAxBJ;;EA4BHC,KAAK,CAAEb,KAAF,QAA2B;IAAA,IAAlB;MAAEc,KAAF;MAASC;IAAT,CAAkB;IAC9B,MAAMC,QAAQ,GAAGzB,eAAe,CAACS,KAAD,EAAQ,YAAR,CAAhC;IACA,MAAM;MAAEiB;IAAF,IAAcrB,UAAU,EAA9B;IAEA,MAAMsB,GAAG,GAAGvB,MAAM,EAAlB;IACA,MAAMM,EAAE,GAAGR,QAAQ,CAAC,MAAMO,KAAK,CAACC,EAAN,IAAa,aAAYiB,GAAI,EAApC,CAAnB;IAEA,MAAMZ,QAAQ,GAAGb,QAAQ,CAAC,MAAM;MAC9B,OAAOO,KAAK,CAACM,QAAN,CAAea,KAAf,CAAqB,GAArB,EAA0BC,MAA1B,GAAmC,CAAnC,GACHpB,KAAK,CAACM,QADH,GAEHN,KAAK,CAACM,QAAN,GAAiB,SAFrB;IAGD,CAJwB,CAAzB;IAMA,MAAMG,MAAM,GAAGhB,QAAQ,CAAC,MAAM;MAC5B,OACEO,KAAK,CAACS,MAAN,KAAiB,MAAjB,IACAT,KAAK,CAACS,MAAN,KAAiB,SADjB,IAEAT,KAAK,CAACS,MAAN,CAAaU,KAAb,CAAmB,GAAnB,EAAwBC,MAAxB,GAAiC,CAFjC,IAGApB,KAAK,CAACM,QAAN,CAAea,KAAf,CAAqB,GAArB,EAA0BC,MAA1B,GAAmC,CAJ9B,GAKHpB,KAAK,CAACS,MALH,GAMHT,KAAK,CAACS,MAAN,GAAe,SANnB;IAOD,CARsB,CAAvB;IAUA,MAAMC,UAAU,GAAGjB,QAAQ,CAAC,MAAM;MAChC,IAAIO,KAAK,CAACU,UAAV,EAAsB,OAAOV,KAAK,CAACU,UAAb;MACtB,OAAOM,QAAQ,CAACJ,KAAT,GAAiB,kBAAjB,GAAsC,iBAA7C;IACD,CAH0B,CAA3B;IAKA,OAAO,MAAM;MACX;QAAA,cAEcI,QAAQ,CAACJ,KAFvB;QAAA,iCAEcI,QAAQ,CAACJ,KAFvB;QAAA,SAGW,CACL,WADK,CAHX;QAAA,MAMSX,EAAE,CAACW,KANZ;QAAA,cAOiBF,UAAU,CAACE,KAP5B;QAAA;QAAA,oBASqB,WATrB;QAAA,kBAUmB,YAVnB;QAAA,YAWeN,QAAQ,CAACM,KAXxB;QAAA,UAYaH,MAAM,CAACG,KAZpB;QAAA,aAagB,CAbhB;QAAA,UAca,EAdb;QAAA,SAeY,KAfZ;QAAA;QAAA,iBAiBoB,KAjBpB;QAAA;QAAA,iBAmBoB,KAnBpB;QAAA,QAoBS,SApBT;QAAA;QAAA,kBAsBoB;UACd,oBAAoBX,EAAE,CAACW;QADT;MAtBpB,GAyBSK,OAzBT,EA0BSH,KA1BT;QA6BMO,SAAS,EAAEN,KAAK,CAACM,SA7BvB;QA8BMb,OAAO,EAAE;UAAA;;UAAA,kCAAIc,IAAJ;YAAIA,IAAJ;UAAA;;UAAA,4CAAaP,KAAK,CAACP,OAAnB,qBAAa,qBAAAO,KAAK,EAAW,GAAGO,IAAd,CAAlB,6BAAyCtB,KAAK,CAACK,IAA/C;QAAA;MA9Bf;IAkCD,CAnCD;EAoCD;;AA5FE,CAFmC,CAAjC"}
+{"version":3,"file":"VTooltip.mjs","names":["VOverlay","makeTransitionProps","useProxiedModel","useScopeId","useForwardRef","computed","ref","genericComponent","getUid","useRender","VTooltip","name","inheritAttrs","props","id","String","modelValue","Boolean","text","location","type","default","origin","transition","emits","value","setup","attrs","slots","isActive","scopeId","uid","overlay","split","length","activator","args"],"sources":["../../../src/components/VTooltip/VTooltip.tsx"],"sourcesContent":["// Styles\nimport './VTooltip.sass'\n\n// Components\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { makeTransitionProps } from '@/composables/transition'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\nimport { useForwardRef } from '@/composables/forwardRef'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { genericComponent, getUid, useRender } from '@/util'\n\n// Types\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\nimport type { PropType } from 'vue'\nimport type { StrategyProps } from '@/components/VOverlay/locationStrategies'\n\nexport const VTooltip = genericComponent<new () => {\n  $slots: OverlaySlots\n}>()({\n  name: 'VTooltip',\n\n  inheritAttrs: false,\n\n  props: {\n    id: String,\n    modelValue: Boolean,\n    text: String,\n\n    location: {\n      type: String as PropType<StrategyProps['location']>,\n      default: 'end',\n    },\n    origin: {\n      type: String as PropType<StrategyProps['origin']>,\n      default: 'auto',\n    },\n\n    ...makeTransitionProps({\n      transition: false,\n    } as const),\n  },\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const uid = getUid()\n    const id = computed(() => props.id || `v-tooltip-${uid}`)\n\n    const overlay = ref<VOverlay>()\n\n    const location = computed(() => {\n      return props.location.split(' ').length > 1\n        ? props.location\n        : props.location + ' center' as StrategyProps['location']\n    })\n\n    const origin = computed(() => {\n      return (\n        props.origin === 'auto' ||\n        props.origin === 'overlap' ||\n        props.origin.split(' ').length > 1 ||\n        props.location.split(' ').length > 1\n      ) ? props.origin\n        : props.origin + ' center' as StrategyProps['origin']\n    })\n\n    const transition = computed(() => {\n      if (props.transition) return props.transition\n      return isActive.value ? 'scale-transition' : 'fade-transition'\n    })\n\n    useRender(() => (\n      <VOverlay\n        v-model={ isActive.value }\n        ref={ overlay }\n        class={[\n          'v-tooltip',\n        ]}\n        id={ id.value }\n        transition={ transition.value }\n        absolute\n        locationStrategy=\"connected\"\n        scrollStrategy=\"reposition\"\n        location={ location.value }\n        origin={ origin.value }\n        min-width={ 0 }\n        offset={ 10 }\n        scrim={ false }\n        persistent\n        open-on-click={ false }\n        open-on-hover\n        close-on-back={ false }\n        role=\"tooltip\"\n        eager\n        activatorProps={{\n          'aria-describedby': id.value,\n        }}\n        { ...scopeId }\n        { ...attrs }\n      >\n        {{\n          activator: slots.activator,\n          default: (...args) => slots.default?.(...args) ?? props.text,\n        }}\n      </VOverlay>\n    ))\n\n    return useForwardRef({}, overlay)\n  },\n})\n\nexport type VTooltip = InstanceType<typeof VTooltip>\n"],"mappings":"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"}

package/lib/components/VTooltip/VTooltip.sass

@@ -1,4 +1,3 @@
-@forward './variables'
 @use '../../styles/settings'
 @use './variables' as *
 

package/lib/components/VTooltip/_variables.scss

@@ -1,5 +1,6 @@
 @use '../../styles/settings';
 
+// VTooltip
 $tooltip-background-color: rgba(var(--v-theme-surface-variant), .7) !default;
 $tooltip-text-color: rgb(var(--v-theme-on-surface-variant)) !default;
 $tooltip-border-radius: settings.$border-radius-root !default;

package/lib/components/VWindow/VWindow.mjs

@@ -2,15 +2,15 @@ import { withDirectives as _withDirectives, resolveDirective as _resolveDirectiv
 // Styles
 import "./VWindow.css"; // Components
 
-import { VBtn } from "../VBtn/index.mjs"; // Composables
+import { VBtn } from "../VBtn/index.mjs"; // Directives
+
+import { Touch } from "../../directives/touch/index.mjs"; // Composables
 
 import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useGroup } from "../../composables/group.mjs";
 import { useLocale } from "../../composables/locale.mjs";
-import { useRtl } from "../../composables/rtl.mjs"; // Directives
-
-import { Touch } from "../../directives/touch/index.mjs"; // Utilities
+import { useRtl } from "../../composables/rtl.mjs"; // Utilities
 
 import { computed, provide, ref, watch } from 'vue';
 import { genericComponent, useRender } from "../../util/index.mjs"; // Types

package/lib/components/VWindow/VWindow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VWindow.mjs","names":["VBtn","makeTagProps","makeThemeProps","provideTheme","useGroup","useLocale","useRtl","Touch","computed","provide","ref","watch","genericComponent","useRender","VWindowSymbol","Symbol","for","VWindowGroupSymbol","VWindow","name","directives","props","continuous","Boolean","nextIcon","type","String","Function","Object","default","prevIcon","reverse","showArrows","validator","v","touch","undefined","direction","modelValue","disabled","selectedClass","mandatory","emits","setup","slots","themeClasses","isRtl","t","group","rootRef","isRtlReverse","value","isReversed","transition","axis","transitionCount","transitionHeight","activeIndex","items","findIndex","item","selected","includes","id","newVal","oldVal","itemsLength","length","lastIndex","canMoveBack","canMoveForward","prev","next","arrows","prevProps","icon","class","onClick","ariaLabel","push","nextProps","touchOptions","options","left","right","end","originalEvent","stopPropagation","start","height","additional"],"sources":["../../../src/components/VWindow/VWindow.tsx"],"sourcesContent":["// Styles\nimport './VWindow.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useGroup } from '@/composables/group'\nimport { useLocale } from '@/composables/locale'\nimport { useRtl } from '@/composables/rtl'\n\n// Directives\nimport { Touch } from '@/directives/touch'\n\n// Utilities\nimport { computed, provide, ref, watch } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, InjectionKey, PropType, Ref } from 'vue'\nimport type { GroupItemProvide, GroupProvide } from '@/composables/group'\nimport type { TouchHandlers } from '@/directives/touch'\nimport type { MakeSlots } from '@/util'\nimport type { IconValue } from '@/composables/icons'\n\ntype WindowProvide = {\n  transition: ComputedRef<undefined | string>\n  transitionCount: Ref<number>\n  transitionHeight: Ref<undefined | string>\n  isReversed: Ref<boolean>\n  rootRef: Ref<HTMLElement | undefined>\n}\n\ntype ControlProps = {\n  icon: IconValue\n  class: string\n  onClick: () => void\n  ariaLabel: string\n}\n\nexport const VWindowSymbol: InjectionKey<WindowProvide> = Symbol.for('vuetify:v-window')\nexport const VWindowGroupSymbol: InjectionKey<GroupItemProvide> = Symbol.for('vuetify:v-window-group')\n\nexport const VWindow = genericComponent<new () => {\n  $slots: MakeSlots<{\n    default: [{ group: GroupProvide }]\n    additional: [{ group: GroupProvide }]\n    prev: [{ props: ControlProps }]\n    next: [{ props: ControlProps }]\n  }>\n}>()({\n  name: 'VWindow',\n\n  directives: {\n    Touch,\n  },\n\n  props: {\n    continuous: Boolean,\n    nextIcon: {\n      type: [Boolean, String, Function, Object] as PropType<IconValue>,\n      default: '$next',\n    },\n    prevIcon: {\n      type: [Boolean, String, Function, Object] as PropType<IconValue>,\n      default: '$prev',\n    },\n    reverse: Boolean,\n    showArrows: {\n      type: [Boolean, String],\n      validator: (v: any) => typeof v === 'boolean' || v === 'hover',\n    },\n    touch: {\n      type: [Object, Boolean] as PropType<boolean | TouchHandlers>,\n      default: undefined,\n    },\n    direction: {\n      type: String,\n      default: 'horizontal',\n    },\n\n    modelValue: null,\n    disabled: Boolean,\n    selectedClass: {\n      type: String,\n      default: 'v-window-item--active',\n    },\n    // TODO: mandatory should probably not be exposed but do this for now\n    mandatory: {\n      default: 'force' as const,\n    },\n\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (v: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { isRtl } = useRtl()\n    const { t } = useLocale()\n\n    const group = useGroup(props, VWindowGroupSymbol)\n\n    const rootRef = ref()\n    const isRtlReverse = computed(() => isRtl.value ? !props.reverse : props.reverse)\n    const isReversed = ref(false)\n    const transition = computed(() => {\n      const axis = props.direction === 'vertical' ? 'y' : 'x'\n      const reverse = isRtlReverse.value ? !isReversed.value : isReversed.value\n      const direction = reverse ? '-reverse' : ''\n\n      return `v-window-${axis}${direction}-transition`\n    })\n    const transitionCount = ref(0)\n    const transitionHeight = ref<undefined | string>(undefined)\n\n    const activeIndex = computed(() => {\n      return group.items.value.findIndex(item => group.selected.value.includes(item.id))\n    })\n\n    watch(activeIndex, (newVal, oldVal) => {\n      const itemsLength = group.items.value.length\n      const lastIndex = itemsLength - 1\n\n      if (itemsLength <= 2) {\n        isReversed.value = newVal < oldVal\n      } else if (newVal === lastIndex && oldVal === 0) {\n        isReversed.value = true\n      } else if (newVal === 0 && oldVal === lastIndex) {\n        isReversed.value = false\n      } else {\n        isReversed.value = newVal < oldVal\n      }\n    })\n\n    provide(VWindowSymbol, {\n      transition,\n      isReversed,\n      transitionCount,\n      transitionHeight,\n      rootRef,\n    })\n\n    const canMoveBack = computed(() => props.continuous || activeIndex.value !== 0)\n    const canMoveForward = computed(() => props.continuous || activeIndex.value !== group.items.value.length - 1)\n\n    function prev () {\n      canMoveBack.value && group.prev()\n    }\n\n    function next () {\n      canMoveForward.value && group.next()\n    }\n\n    const arrows = computed(() => {\n      const arrows = []\n\n      const prevProps = {\n        icon: isRtl.value ? props.nextIcon : props.prevIcon,\n        class: `v-window__${isRtlReverse.value ? 'right' : 'left'}`,\n        onClick: group.prev,\n        ariaLabel: t('$vuetify.carousel.prev'),\n      }\n\n      arrows.push(canMoveBack.value\n        ? slots.prev\n          ? slots.prev({ props: prevProps })\n          : <VBtn { ...prevProps } />\n        : <div />\n      )\n\n      const nextProps = {\n        icon: isRtl.value ? props.prevIcon : props.nextIcon,\n        class: `v-window__${isRtlReverse.value ? 'left' : 'right'}`,\n        onClick: group.next,\n        ariaLabel: t('$vuetify.carousel.next'),\n      }\n\n      arrows.push(canMoveForward.value\n        ? slots.next\n          ? slots.next({ props: nextProps })\n          : <VBtn { ...nextProps } />\n        : <div />\n      )\n\n      return arrows\n    })\n\n    const touchOptions = computed(() => {\n      if (props.touch === false) return props.touch\n\n      const options: TouchHandlers = {\n        left: () => {\n          isRtlReverse.value ? prev() : next()\n        },\n        right: () => {\n          isRtlReverse.value ? next() : prev()\n        },\n        end: ({ originalEvent }) => {\n          originalEvent.stopPropagation()\n        },\n        start: ({ originalEvent }) => {\n          originalEvent.stopPropagation()\n        },\n      }\n\n      return {\n        ...options,\n        ...(props.touch === true ? {} : props.touch),\n      }\n    })\n\n    useRender(() => (\n      <props.tag\n        ref={ rootRef }\n        class={[\n          'v-window',\n          {\n            'v-window--show-arrows-on-hover': props.showArrows === 'hover',\n          },\n          themeClasses.value,\n        ]}\n        v-touch={ touchOptions.value }\n      >\n        <div\n          class=\"v-window__container\"\n          style={{\n            height: transitionHeight.value,\n          }}\n        >\n          { slots.default?.({ group }) }\n\n          { props.showArrows !== false && (\n            <div class=\"v-window__controls\">\n              { arrows.value }\n            </div>\n          )}\n        </div>\n\n        { slots.additional?.({ group }) }\n      </props.tag>\n    ))\n\n    return {\n      group,\n    }\n  },\n})\n\nexport type VWindow = InstanceType<typeof VWindow>\n"],"mappings":"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"}
+{"version":3,"file":"VWindow.mjs","names":["VBtn","Touch","makeTagProps","makeThemeProps","provideTheme","useGroup","useLocale","useRtl","computed","provide","ref","watch","genericComponent","useRender","VWindowSymbol","Symbol","for","VWindowGroupSymbol","VWindow","name","directives","props","continuous","Boolean","nextIcon","type","String","Function","Object","default","prevIcon","reverse","showArrows","validator","v","touch","undefined","direction","modelValue","disabled","selectedClass","mandatory","emits","setup","slots","themeClasses","isRtl","t","group","rootRef","isRtlReverse","value","isReversed","transition","axis","transitionCount","transitionHeight","activeIndex","items","findIndex","item","selected","includes","id","newVal","oldVal","itemsLength","length","lastIndex","canMoveBack","canMoveForward","prev","next","arrows","prevProps","icon","class","onClick","ariaLabel","push","nextProps","touchOptions","options","left","right","end","originalEvent","stopPropagation","start","height","additional"],"sources":["../../../src/components/VWindow/VWindow.tsx"],"sourcesContent":["// Styles\nimport './VWindow.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Directives\nimport { Touch } from '@/directives/touch'\n\n// Composables\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useGroup } from '@/composables/group'\nimport { useLocale } from '@/composables/locale'\nimport { useRtl } from '@/composables/rtl'\n\n// Utilities\nimport { computed, provide, ref, watch } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, InjectionKey, PropType, Ref } from 'vue'\nimport type { GroupItemProvide, GroupProvide } from '@/composables/group'\nimport type { IconValue } from '@/composables/icons'\nimport type { MakeSlots } from '@/util'\nimport type { TouchHandlers } from '@/directives/touch'\n\ntype WindowProvide = {\n  transition: ComputedRef<undefined | string>\n  transitionCount: Ref<number>\n  transitionHeight: Ref<undefined | string>\n  isReversed: Ref<boolean>\n  rootRef: Ref<HTMLElement | undefined>\n}\n\ntype ControlProps = {\n  icon: IconValue\n  class: string\n  onClick: () => void\n  ariaLabel: string\n}\n\nexport const VWindowSymbol: InjectionKey<WindowProvide> = Symbol.for('vuetify:v-window')\nexport const VWindowGroupSymbol: InjectionKey<GroupItemProvide> = Symbol.for('vuetify:v-window-group')\n\nexport const VWindow = genericComponent<new () => {\n  $slots: MakeSlots<{\n    default: [{ group: GroupProvide }]\n    additional: [{ group: GroupProvide }]\n    prev: [{ props: ControlProps }]\n    next: [{ props: ControlProps }]\n  }>\n}>()({\n  name: 'VWindow',\n\n  directives: {\n    Touch,\n  },\n\n  props: {\n    continuous: Boolean,\n    nextIcon: {\n      type: [Boolean, String, Function, Object] as PropType<IconValue>,\n      default: '$next',\n    },\n    prevIcon: {\n      type: [Boolean, String, Function, Object] as PropType<IconValue>,\n      default: '$prev',\n    },\n    reverse: Boolean,\n    showArrows: {\n      type: [Boolean, String],\n      validator: (v: any) => typeof v === 'boolean' || v === 'hover',\n    },\n    touch: {\n      type: [Object, Boolean] as PropType<boolean | TouchHandlers>,\n      default: undefined,\n    },\n    direction: {\n      type: String,\n      default: 'horizontal',\n    },\n\n    modelValue: null,\n    disabled: Boolean,\n    selectedClass: {\n      type: String,\n      default: 'v-window-item--active',\n    },\n    // TODO: mandatory should probably not be exposed but do this for now\n    mandatory: {\n      default: 'force' as const,\n    },\n\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (v: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { isRtl } = useRtl()\n    const { t } = useLocale()\n\n    const group = useGroup(props, VWindowGroupSymbol)\n\n    const rootRef = ref()\n    const isRtlReverse = computed(() => isRtl.value ? !props.reverse : props.reverse)\n    const isReversed = ref(false)\n    const transition = computed(() => {\n      const axis = props.direction === 'vertical' ? 'y' : 'x'\n      const reverse = isRtlReverse.value ? !isReversed.value : isReversed.value\n      const direction = reverse ? '-reverse' : ''\n\n      return `v-window-${axis}${direction}-transition`\n    })\n    const transitionCount = ref(0)\n    const transitionHeight = ref<undefined | string>(undefined)\n\n    const activeIndex = computed(() => {\n      return group.items.value.findIndex(item => group.selected.value.includes(item.id))\n    })\n\n    watch(activeIndex, (newVal, oldVal) => {\n      const itemsLength = group.items.value.length\n      const lastIndex = itemsLength - 1\n\n      if (itemsLength <= 2) {\n        isReversed.value = newVal < oldVal\n      } else if (newVal === lastIndex && oldVal === 0) {\n        isReversed.value = true\n      } else if (newVal === 0 && oldVal === lastIndex) {\n        isReversed.value = false\n      } else {\n        isReversed.value = newVal < oldVal\n      }\n    })\n\n    provide(VWindowSymbol, {\n      transition,\n      isReversed,\n      transitionCount,\n      transitionHeight,\n      rootRef,\n    })\n\n    const canMoveBack = computed(() => props.continuous || activeIndex.value !== 0)\n    const canMoveForward = computed(() => props.continuous || activeIndex.value !== group.items.value.length - 1)\n\n    function prev () {\n      canMoveBack.value && group.prev()\n    }\n\n    function next () {\n      canMoveForward.value && group.next()\n    }\n\n    const arrows = computed(() => {\n      const arrows = []\n\n      const prevProps = {\n        icon: isRtl.value ? props.nextIcon : props.prevIcon,\n        class: `v-window__${isRtlReverse.value ? 'right' : 'left'}`,\n        onClick: group.prev,\n        ariaLabel: t('$vuetify.carousel.prev'),\n      }\n\n      arrows.push(canMoveBack.value\n        ? slots.prev\n          ? slots.prev({ props: prevProps })\n          : <VBtn { ...prevProps } />\n        : <div />\n      )\n\n      const nextProps = {\n        icon: isRtl.value ? props.prevIcon : props.nextIcon,\n        class: `v-window__${isRtlReverse.value ? 'left' : 'right'}`,\n        onClick: group.next,\n        ariaLabel: t('$vuetify.carousel.next'),\n      }\n\n      arrows.push(canMoveForward.value\n        ? slots.next\n          ? slots.next({ props: nextProps })\n          : <VBtn { ...nextProps } />\n        : <div />\n      )\n\n      return arrows\n    })\n\n    const touchOptions = computed(() => {\n      if (props.touch === false) return props.touch\n\n      const options: TouchHandlers = {\n        left: () => {\n          isRtlReverse.value ? prev() : next()\n        },\n        right: () => {\n          isRtlReverse.value ? next() : prev()\n        },\n        end: ({ originalEvent }) => {\n          originalEvent.stopPropagation()\n        },\n        start: ({ originalEvent }) => {\n          originalEvent.stopPropagation()\n        },\n      }\n\n      return {\n        ...options,\n        ...(props.touch === true ? {} : props.touch),\n      }\n    })\n\n    useRender(() => (\n      <props.tag\n        ref={ rootRef }\n        class={[\n          'v-window',\n          {\n            'v-window--show-arrows-on-hover': props.showArrows === 'hover',\n          },\n          themeClasses.value,\n        ]}\n        v-touch={ touchOptions.value }\n      >\n        <div\n          class=\"v-window__container\"\n          style={{\n            height: transitionHeight.value,\n          }}\n        >\n          { slots.default?.({ group }) }\n\n          { props.showArrows !== false && (\n            <div class=\"v-window__controls\">\n              { arrows.value }\n            </div>\n          )}\n        </div>\n\n        { slots.additional?.({ group }) }\n      </props.tag>\n    ))\n\n    return {\n      group,\n    }\n  },\n})\n\nexport type VWindow = InstanceType<typeof VWindow>\n"],"mappings":"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"}

package/lib/components/VWindow/VWindow.sass

@@ -1,5 +1,3 @@
-// Imports
-@forward './variables'
 @use './variables' as *
 
 .v-window