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

package/lib/components/VBadge/VBadge.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBadge/VBadge.tsx"],"names":["VIcon","makeRoundedProps","useRounded","makeTagProps","makeTransitionProps","MaybeTransition","useBackgroundColor","useTextColor","computed","toRef","convertToUnit","defineComponent","pick","name","inheritAttrs","props","bordered","Boolean","color","type","String","default","content","dot","floating","icon","inline","label","location","validator","value","vertical","horizontal","split","includes","max","Number","modelValue","offsetX","offsetY","textColor","transition","setup","ctx","backgroundColorClasses","backgroundColorStyles","roundedClasses","textColorClasses","textColorStyles","position","calculatePosition","offset","parseInt","locationStyles","styles","bottom","left","right","top","isNaN","badgeAttrs","attrs","slots","undefined","badge"],"mappings":"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","sourcesContent":["// Styles\nimport './VBadge.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, defineComponent, pick } from '@/util'\n\nexport default defineComponent({\n  name: 'VBadge',\n\n  inheritAttrs: false,\n\n  props: {\n    bordered: Boolean,\n    color: {\n      type: String,\n      default: 'primary',\n    },\n    content: String,\n    dot: Boolean,\n    floating: Boolean,\n    icon: String,\n    inline: Boolean,\n    label: {\n      type: String,\n      default: '$vuetify.badge',\n    },\n    location: {\n      type: String,\n      default: 'top-right',\n      validator: (value: string) => {\n        const [vertical, horizontal] = (value ?? '').split('-')\n\n        return (\n          ['top', 'bottom'].includes(vertical) &&\n          ['left', 'right'].includes(horizontal)\n        )\n      },\n    },\n    max: [Number, String],\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    offsetX: [Number, String],\n    offsetY: [Number, String],\n    textColor: String,\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeTransitionProps({ transition: 'scale-rotate-transition' }),\n  },\n\n  setup (props, ctx) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { roundedClasses } = useRounded(props, 'v-badge')\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'textColor'))\n\n    const position = computed(() => {\n      return props.floating\n        ? (props.dot ? 2 : 4)\n        : (props.dot ? 8 : 12)\n    })\n\n    function calculatePosition (offset?: number | string) {\n      return `calc(100% - ${convertToUnit(position.value + parseInt(offset ?? 0, 10))})`\n    }\n\n    const locationStyles = computed(() => {\n      const [vertical, horizontal] = (props.location ?? '').split('-')\n\n      // TODO: RTL support\n\n      const styles = {\n        bottom: 'auto',\n        left: 'auto',\n        right: 'auto',\n        top: 'auto',\n      }\n\n      if (!props.inline) {\n        styles[horizontal === 'left' ? 'right' : 'left'] = calculatePosition(props.offsetX)\n        styles[vertical === 'top' ? 'bottom' : 'top'] = calculatePosition(props.offsetY)\n      }\n\n      return styles\n    })\n\n    return () => {\n      const value = Number(props.content)\n      const content = (!props.max || isNaN(value)) ? props.content\n        : value <= props.max ? value\n        : `${props.max}+`\n\n      const [badgeAttrs, attrs] = pick(ctx.attrs as Record<string, any>, [\n        'aria-atomic',\n        'aria-label',\n        'aria-live',\n        'role',\n        'title',\n      ])\n\n      return (\n        <props.tag\n          class={[\n            'v-badge',\n            {\n              'v-badge--bordered': props.bordered,\n              'v-badge--dot': props.dot,\n              'v-badge--floating': props.floating,\n              'v-badge--inline': props.inline,\n            },\n          ]}\n          { ...attrs }\n        >\n          <div class=\"v-badge__wrapper\">\n            { ctx.slots.default?.() }\n\n            <MaybeTransition transition={ props.transition }>\n              <span\n                v-show={ props.modelValue }\n                class={[\n                  'v-badge__badge',\n                  backgroundColorClasses.value,\n                  roundedClasses.value,\n                  textColorClasses.value,\n                ]}\n                style={[\n                  backgroundColorStyles.value,\n                  locationStyles.value,\n                  textColorStyles.value,\n                ] as any} // TODO: Fix this :(\n                aria-atomic=\"true\"\n                aria-label=\"locale string here\" // TODO: locale string here\n                aria-live=\"polite\"\n                role=\"status\"\n                { ...badgeAttrs }\n              >\n                {\n                  props.dot ? undefined\n                  : ctx.slots.badge ? ctx.slots.badge?.()\n                  : props.icon ? <VIcon icon={props.icon} />\n                  : <span class=\"v-badge__content\">{content}</span>\n                }\n              </span>\n            </MaybeTransition>\n          </div>\n        </props.tag>\n      )\n    }\n  },\n})\n"],"file":"VBadge.mjs"}
+{"version":3,"sources":["../../../src/components/VBadge/VBadge.tsx"],"names":["VIcon","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","makeTransitionProps","MaybeTransition","useBackgroundColor","useTextColor","useLocale","useRtl","computed","toRef","convertToUnit","defineComponent","pick","VBadge","name","inheritAttrs","props","bordered","Boolean","color","String","content","Number","dot","floating","icon","inline","label","type","default","location","validator","value","vertical","horizontal","split","includes","max","modelValue","offsetX","offsetY","textColor","transition","setup","ctx","backgroundColorClasses","backgroundColorStyles","isRtl","roundedClasses","t","textColorClasses","textColorStyles","themeClasses","position","calculatePosition","offset","parseInt","locationStyles","styles","bottom","left","right","top","isRight","isNaN","badgeAttrs","attrs","slots","undefined","badge"],"mappings":"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","sourcesContent":["// Styles\nimport './VBadge.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { makeTransitionProps, MaybeTransition } from '@/composables/transition'\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\nimport { useLocale } from '@/composables/locale'\nimport { useRtl } from '@/composables/rtl'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, defineComponent, pick } from '@/util'\n\nexport const VBadge = defineComponent({\n  name: 'VBadge',\n\n  inheritAttrs: false,\n\n  props: {\n    bordered: Boolean,\n    color: String,\n    content: [Number, String],\n    dot: Boolean,\n    floating: Boolean,\n    icon: String,\n    inline: Boolean,\n    label: {\n      type: String,\n      default: '$vuetify.badge',\n    },\n    location: {\n      type: String,\n      default: 'top-end',\n      validator: (value: string) => {\n        const [vertical, horizontal] = (value ?? '').split('-')\n\n        return (\n          ['top', 'bottom'].includes(vertical) &&\n          ['start', 'end'].includes(horizontal)\n        )\n      },\n    },\n    max: [Number, String],\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    offsetX: [Number, String],\n    offsetY: [Number, String],\n    textColor: String,\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeTransitionProps({ transition: 'scale-rotate-transition' }),\n  },\n\n  setup (props, ctx) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { isRtl } = useRtl()\n    const { roundedClasses } = useRounded(props)\n    const { t } = useLocale()\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'textColor'))\n    const { themeClasses } = useTheme()\n\n    const position = computed(() => {\n      return props.floating\n        ? (props.dot ? 2 : 4)\n        : (props.dot ? 8 : 12)\n    })\n\n    function calculatePosition (offset?: number | string) {\n      return `calc(100% - ${convertToUnit(position.value + parseInt(offset ?? 0, 10))})`\n    }\n\n    const locationStyles = computed(() => {\n      const [vertical, horizontal] = (props.location ?? '').split('-')\n\n      const styles = {\n        bottom: 'auto',\n        left: 'auto',\n        right: 'auto',\n        top: 'auto',\n      }\n\n      if (!props.inline) {\n        const isRight = (isRtl.value && horizontal === 'end') || (!isRtl.value && horizontal === 'start')\n\n        styles[isRight ? 'right' : 'left'] = calculatePosition(props.offsetX)\n        styles[vertical === 'top' ? 'bottom' : 'top'] = calculatePosition(props.offsetY)\n      }\n\n      return styles\n    })\n\n    return () => {\n      const value = Number(props.content)\n      const content = (!props.max || isNaN(value)) ? props.content\n        : value <= props.max ? value\n        : `${props.max}+`\n\n      const [badgeAttrs, attrs] = pick(ctx.attrs as Record<string, any>, [\n        'aria-atomic',\n        'aria-label',\n        'aria-live',\n        'role',\n        'title',\n      ])\n\n      return (\n        <props.tag\n          class={[\n            'v-badge',\n            {\n              'v-badge--bordered': props.bordered,\n              'v-badge--dot': props.dot,\n              'v-badge--floating': props.floating,\n              'v-badge--inline': props.inline,\n            },\n          ]}\n          { ...attrs }\n        >\n          <div class=\"v-badge__wrapper\">\n            { ctx.slots.default?.() }\n\n            <MaybeTransition transition={ props.transition }>\n              <span\n                v-show={ props.modelValue }\n                class={[\n                  'v-badge__badge',\n                  backgroundColorClasses.value,\n                  roundedClasses.value,\n                  textColorClasses.value,\n                  themeClasses.value,\n                ]}\n                style={[\n                  backgroundColorStyles.value,\n                  locationStyles.value,\n                  textColorStyles.value,\n                ]}\n                aria-atomic=\"true\"\n                aria-label={ t(props.label, value) }\n                aria-live=\"polite\"\n                role=\"status\"\n                { ...badgeAttrs }\n              >\n                {\n                  props.dot ? undefined\n                  : ctx.slots.badge ? ctx.slots.badge?.()\n                  : props.icon ? <VIcon icon={props.icon} />\n                  : <span class=\"v-badge__content\">{content}</span>\n                }\n              </span>\n            </MaybeTransition>\n          </div>\n        </props.tag>\n      )\n    }\n  },\n})\n\nexport type VBadge = InstanceType<typeof VBadge>\n"],"file":"VBadge.mjs"}

package/lib/components/VBadge/VBadge.sass

@@ -23,6 +23,8 @@
   transition: $badge-transition
   white-space: nowrap
 
+  @include tools.theme($badge-theme...)
+
   .v-badge--bordered &
     &::after
       border-radius: inherit
@@ -44,8 +46,6 @@
     padding: 0
     width: $badge-dot-width
 
-    @include tools.theme($badge-theme...)
-
     &::after
       border-width: $badge-dot-border-width
 

package/lib/components/VBadge/_variables.scss

@@ -1,13 +1,14 @@
 @use '../../styles/settings';
 
 // Defaults
+
+$badge-background: rgb(var(--v-theme-surface-variant)) !default;
+$badge-color: rgba(var(--v-theme-on-surface-variant), var(--v-high-emphasis-opacity)) !default;
 $badge-border-color: rgb(var(--v-theme-background)) !default;
 $badge-border-radius: 10px !default;
 $badge-border-style: solid !default;
 $badge-border-transform: scale(1.20) !default;
 $badge-border-width: 2px !default;
-$badge-background: rgb(var(--v-theme-surface)) !default;
-$badge-color: rgb(var(--v-theme-on-surface)) !default;
 $badge-content-padding: 0 2px !default;
 $badge-dot-border-radius: 4.5px;
 $badge-dot-border-width: 1.5px !default;

package/lib/components/VBadge/index.mjs

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

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

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

package/lib/components/VBanner/VBanner.css

@@ -1,5 +1,4 @@
 .v-banner {
-  background: rgb(var(--v-theme-background));
   display: flex;
   flex-wrap: wrap;
   font-size: 0.875rem;
@@ -13,8 +12,8 @@
   border-width: 0 0 thin 0;
   box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
   border-radius: 0;
-  background: rgb(var(--v-theme-background));
-  color: rgb(var(--v-theme-on-surface));
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
 }
 .v-banner--border {
   border-width: thin;
@@ -40,7 +39,7 @@
 .v-banner--rounded {
   border-radius: 4px;
 }
-.v-banner--density-default.v-banner--one-line {
+.v-banner--density-default {
   padding-top: 10px;
 }
 .v-banner--density-default.v-banner--two-line {
@@ -50,7 +49,7 @@
   padding-top: 24px;
 }
 
-.v-banner--density-comfortable.v-banner--one-line {
+.v-banner--density-comfortable {
   padding-top: 6px;
 }
 .v-banner--density-comfortable.v-banner--two-line {
@@ -60,7 +59,7 @@
   padding-top: 20px;
 }
 
-.v-banner--density-compact.v-banner--one-line {
+.v-banner--density-compact {
   padding-top: 2px;
 }
 .v-banner--density-compact.v-banner--two-line {
@@ -84,60 +83,49 @@
   flex: 1 0;
 }
 
-.v-banner-content {
+.v-banner__content {
   display: flex;
   flex: 1 1;
   min-width: 0;
   padding-inline-end: 90px;
 }
-.v-banner--mobile .v-banner-content {
+.v-banner--mobile .v-banner__content {
   flex: 1 1 auto;
   padding-inline-end: 8px;
 }
-.v-banner--two-line .v-banner-content {
+.v-banner--two-line .v-banner__content {
   margin-bottom: 4px;
 }
-.v-banner--three-line .v-banner-content {
+.v-banner--three-line .v-banner__content {
   margin-bottom: 8px;
 }
 
-.v-banner-avatar {
+.v-banner__avatar {
   align-self: flex-start;
   border-radius: 50%;
   margin-inline-end: 24px;
   margin-inline-start: 0;
   position: relative;
 }
-.v-banner-avatar::after {
-  background: currentColor;
-  border-radius: inherit;
-  bottom: 0;
-  content: "";
-  left: 0;
-  opacity: var(--v-border-opacity);
-  position: absolute;
-  right: 0;
-  top: 0;
-}
-.v-banner--mobile .v-banner-avatar {
+.v-banner--mobile .v-banner__avatar {
   margin-inline-end: 16px;
 }
-.v-banner--one-line .v-banner-avatar {
+.v-banner--one-line .v-banner__avatar {
   align-self: center;
 }
 
 .v-banner-text {
   -webkit-box-orient: vertical;
-  align-self: flex-start;
-  color: rgb(var(--v-theme-on-surface));
+  align-self: center;
   display: -webkit-box;
   line-height: 1.375rem;
   overflow: hidden;
 }
 .v-banner--one-line .v-banner-text {
-  align-self: center;
+  -webkit-line-clamp: 1;
 }
-.v-banner--two-line .v-banner-text {
+.v-banner--two-line .v-banner-text, .v-banner--three-line .v-banner-text {
+  align-self: flex-start;
   -webkit-line-clamp: 2;
 }
 .v-banner--three-line .v-banner-text {

package/lib/components/VBanner/VBanner.mjs

@@ -3,10 +3,9 @@ import { resolveDirective as _resolveDirective, createVNode as _createVNode } fr
 import "./VBanner.css"; // Components
 
 import { VAvatar } from "../VAvatar/index.mjs";
-import VBannerActions from "./VBannerActions.mjs";
-import VBannerAvatar from "./VBannerAvatar.mjs";
-import VBannerContent from "./VBannerContent.mjs";
-import VBannerText from "./VBannerText.mjs"; // Composables
+import { VBannerActions } from "./VBannerActions.mjs";
+import { VBannerText } from "./VBannerText.mjs";
+import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs"; // Composables
 
 import { makeBorderProps, useBorder } from "../../composables/border.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
@@ -15,22 +14,18 @@ import { makeElevationProps, useElevation } from "../../composables/elevation.mj
 import { makePositionProps, usePosition } from "../../composables/position.mjs";
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
-import { makeThemeProps, useTheme } from "../../composables/theme.mjs";
-import { useDisplay } from "../../composables/display.mjs";
-import { useTextColor } from "../../composables/color.mjs"; // Utilities
+import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
+import { useDisplay } from "../../composables/display.mjs"; // Utilities
 
-import { toRef } from 'vue';
-import { defineComponent } from "../../util/index.mjs";
-export default defineComponent({
+import { defineComponent, useRender } from "../../util/index.mjs"; // Types
+
+export const VBanner = defineComponent({
   name: 'VBanner',
   props: {
     avatar: String,
     color: String,
     icon: String,
-    lines: {
-      type: String,
-      default: 'one'
-    },
+    lines: String,
     sticky: Boolean,
     text: String,
     ...makeBorderProps(),
@@ -43,18 +38,19 @@ export default defineComponent({
     ...makeThemeProps()
   },
 
-  setup(props, {
-    slots
-  }) {
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
     const {
       themeClasses
-    } = useTheme(props);
+    } = provideTheme(props);
     const {
       borderClasses
-    } = useBorder(props, 'v-banner');
+    } = useBorder(props);
     const {
       densityClasses
-    } = useDensity(props, 'v-banner');
+    } = useDensity(props);
     const {
       dimensionStyles
     } = useDimension(props);
@@ -67,15 +63,11 @@ export default defineComponent({
     const {
       positionClasses,
       positionStyles
-    } = usePosition(props, 'v-banner');
+    } = usePosition(props);
     const {
       roundedClasses
-    } = useRounded(props, 'v-banner');
-    const {
-      textColorClasses,
-      textColorStyles
-    } = useTextColor(toRef(props, 'color'));
-    return () => {
+    } = useRounded(props);
+    useRender(() => {
       var _slots$default;
 
       const hasAvatar = !!(props.avatar || props.icon || slots.avatar || slots.icon);
@@ -86,27 +78,42 @@ export default defineComponent({
           'v-banner--mobile': mobile.value,
           'v-banner--sticky': props.sticky,
           [`v-banner--${props.lines}-line`]: true
-        }, borderClasses.value, densityClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, textColorClasses.value, themeClasses.value],
-        "style": [dimensionStyles.value, positionStyles.value, textColorStyles.value],
+        }, borderClasses.value, densityClasses.value, elevationClasses.value, positionClasses.value, roundedClasses.value, themeClasses.value],
+        "style": [dimensionStyles.value, positionStyles.value],
         "role": "banner"
       }, {
-        default: () => [hasContent && _createVNode(VBannerContent, null, {
-          default: () => [hasAvatar && _createVNode(VBannerAvatar, null, {
-            default: () => [slots.avatar ? slots.avatar() : _createVNode(VAvatar, {
-              "density": props.density,
-              "icon": props.icon,
-              "image": props.avatar
-            }, null, 8, ["density", "icon", "image"])]
-          }), hasText && _createVNode(VBannerText, null, {
-            default: () => [slots.text ? slots.text() : props.text]
-          }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)],
-          _: 1
-        }), slots.actions && _createVNode(VBannerActions, null, {
-          default: slots.actions
-        })],
-        _: 1
-      }, 8, ["class", "style"]);
-    };
+        default: () => [hasContent && _createVNode("div", {
+          "class": "v-banner__content"
+        }, [hasAvatar && _createVNode(VDefaultsProvider, {
+          "defaults": {
+            VAvatar: {
+              color: props.color,
+              density: props.density,
+              icon: props.icon,
+              image: props.avatar
+            }
+          }
+        }, {
+          default: () => [_createVNode("div", {
+            "class": "v-banner__avatar"
+          }, [slots.avatar ? slots.avatar() : _createVNode(VAvatar, null, null)])]
+        }), hasText && _createVNode(VBannerText, null, {
+          default: () => [slots.text ? slots.text() : props.text]
+        }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]), slots.actions && _createVNode(VDefaultsProvider, {
+          "defaults": {
+            VBtn: {
+              color: props.color,
+              density: props.density,
+              variant: 'text'
+            }
+          }
+        }, {
+          default: () => [_createVNode(VBannerActions, null, {
+            default: slots.actions
+          })]
+        })]
+      });
+    });
   }
 
 });

package/lib/components/VBanner/VBanner.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/VBanner.tsx"],"names":["VAvatar","VBannerActions","VBannerAvatar","VBannerContent","VBannerText","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","useDisplay","useTextColor","toRef","defineComponent","name","props","avatar","String","color","icon","lines","type","default","sticky","Boolean","text","setup","slots","themeClasses","borderClasses","densityClasses","dimensionStyles","mobile","elevationClasses","positionClasses","positionStyles","roundedClasses","textColorClasses","textColorStyles","hasAvatar","hasText","hasContent","value","density","actions"],"mappings":"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","sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport VBannerActions from './VBannerActions'\nimport VBannerAvatar from './VBannerAvatar'\nimport VBannerContent from './VBannerContent'\nimport VBannerText from './VBannerText'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { useDisplay } from '@/composables/display'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { defineComponent } from '@/util'\n\nexport default defineComponent({\n  name: 'VBanner',\n\n  props: {\n    avatar: String,\n    color: String,\n    icon: String,\n    lines: {\n      type: String,\n      default: 'one',\n    },\n    sticky: Boolean,\n    text: String,\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme(props)\n    const { borderClasses } = useBorder(props, 'v-banner')\n    const { densityClasses } = useDensity(props, 'v-banner')\n    const { dimensionStyles } = useDimension(props)\n    const { mobile } = useDisplay()\n    const { elevationClasses } = useElevation(props)\n    const { positionClasses, positionStyles } = usePosition(props, 'v-banner')\n    const { roundedClasses } = useRounded(props, 'v-banner')\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'color'))\n\n    return () => {\n      const hasAvatar = !!(props.avatar || props.icon || slots.avatar || slots.icon)\n      const hasText = !!(props.text || slots.text)\n      const hasContent = hasAvatar || hasText || slots.default\n\n      return (\n        <props.tag\n          class={[\n            'v-banner',\n            {\n              'v-banner--mobile': mobile.value,\n              'v-banner--sticky': props.sticky,\n              [`v-banner--${props.lines}-line`]: true,\n            },\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            textColorClasses.value,\n            themeClasses.value,\n          ]}\n          style={[\n            dimensionStyles.value,\n            positionStyles.value,\n            textColorStyles.value,\n          ]}\n          role=\"banner\"\n        >\n          { hasContent && (\n            <VBannerContent>\n              { hasAvatar && (\n                <VBannerAvatar>\n                  { slots.avatar\n                    ? slots.avatar()\n                    : (\n                      <VAvatar\n                        density={ props.density }\n                        icon={ props.icon }\n                        image={ props.avatar }\n                      />\n                    )\n                  }\n                </VBannerAvatar>\n              ) }\n\n              { hasText && (\n                <VBannerText>\n                  { slots.text ? slots.text() : props.text }\n                </VBannerText>\n              ) }\n\n              { slots.default?.() }\n            </VBannerContent>\n          ) }\n\n          { slots.actions && (\n            <VBannerActions v-slots={{ default: slots.actions }} />\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n"],"file":"VBanner.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/VBanner.tsx"],"names":["VAvatar","VBannerActions","VBannerText","VDefaultsProvider","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useDisplay","defineComponent","useRender","VBanner","name","props","avatar","String","color","icon","lines","sticky","Boolean","text","setup","slots","themeClasses","borderClasses","densityClasses","dimensionStyles","mobile","elevationClasses","positionClasses","positionStyles","roundedClasses","hasAvatar","hasText","hasContent","default","value","density","image","actions","VBtn","variant"],"mappings":"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","sourcesContent":["// Styles\nimport './VBanner.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport { VBannerActions } from './VBannerActions'\nimport { VBannerText } from './VBannerText'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useDisplay } from '@/composables/display'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const VBanner = defineComponent({\n  name: 'VBanner',\n\n  props: {\n    avatar: String,\n    color: String,\n    icon: String,\n    lines: String as PropType<'one' | 'two' | 'three'>,\n    sticky: Boolean,\n    text: String,\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { mobile } = useDisplay()\n    const { elevationClasses } = useElevation(props)\n    const { positionClasses, positionStyles } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n\n    useRender(() => {\n      const hasAvatar = !!(props.avatar || props.icon || slots.avatar || slots.icon)\n      const hasText = !!(props.text || slots.text)\n      const hasContent = hasAvatar || hasText || slots.default\n\n      return (\n        <props.tag\n          class={[\n            'v-banner',\n            {\n              'v-banner--mobile': mobile.value,\n              'v-banner--sticky': props.sticky,\n              [`v-banner--${props.lines}-line`]: true,\n            },\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            themeClasses.value,\n          ]}\n          style={[\n            dimensionStyles.value,\n            positionStyles.value,\n          ]}\n          role=\"banner\"\n        >\n          { hasContent && (\n            <div class=\"v-banner__content\">\n              { hasAvatar && (\n                <VDefaultsProvider\n                  defaults={{\n                    VAvatar: {\n                      color: props.color,\n                      density: props.density,\n                      icon: props.icon,\n                      image: props.avatar,\n                    },\n                  }}\n                >\n                  <div class=\"v-banner__avatar\">\n                    { slots.avatar ? slots.avatar() : (<VAvatar />) }\n                  </div>\n                </VDefaultsProvider>\n              ) }\n\n              { hasText && (\n                <VBannerText>\n                  { slots.text ? slots.text() : props.text }\n                </VBannerText>\n              ) }\n\n              { slots.default?.() }\n            </div>\n          ) }\n\n          { slots.actions && (\n            <VDefaultsProvider\n              defaults={{\n                VBtn: {\n                  color: props.color,\n                  density: props.density,\n                  variant: 'text',\n                },\n              }}\n            >\n              <VBannerActions v-slots={{ default: slots.actions }} />\n            </VDefaultsProvider>\n          ) }\n        </props.tag>\n      )\n    })\n  },\n})\n\nexport type VBanner = InstanceType<typeof VBanner>\n"],"file":"VBanner.mjs"}

package/lib/components/VBanner/VBanner.sass

@@ -5,7 +5,6 @@
 .v-banner
   $root: &
 
-  background: $banner-background
   display: flex
   flex-wrap: wrap
   font-size: $banner-font-size
@@ -34,8 +33,7 @@
 
   @at-root
     @include tools.density('v-banner', $banner-density) using ($modifier)
-      &.v-banner--one-line
-        padding-top: $banner-padding-top + $modifier
+      padding-top: $banner-padding-top + $modifier
 
       &.v-banner--two-line
         padding-top: $banner-two-line-padding-top + $modifier
@@ -55,7 +53,7 @@
   .v-banner--mobile &
     flex: 1 0
 
-.v-banner-content
+.v-banner__content
   display: flex
   flex: 1 1
   min-width: 0
@@ -71,24 +69,13 @@
   .v-banner--three-line &
     margin-bottom: $banner-three-line-content-margin-bottom
 
-.v-banner-avatar
+.v-banner__avatar
   align-self: flex-start
   border-radius: $banner-avatar-border-radius
   margin-inline-end: $banner-avatar-margin-end
   margin-inline-start: $banner-avatar-margin-start
   position: relative
 
-  &::after
-    background: currentColor
-    border-radius: inherit
-    bottom: 0
-    content: ''
-    left: 0
-    opacity: $banner-avatar-after-opacity
-    position: absolute
-    right: 0
-    top: 0
-
   .v-banner--mobile &
     margin-inline-end: $banner-mobile-avatar-margin-end
 
@@ -97,16 +84,17 @@
 
 .v-banner-text
   -webkit-box-orient: vertical
-  align-self: flex-start
-  color: $banner-text-color
+  align-self: center
   display: -webkit-box
   line-height: $banner-text-line-height
   overflow: hidden
 
   .v-banner--one-line &
-    align-self: center
+    -webkit-line-clamp: 1
 
-  .v-banner--two-line &
+  .v-banner--two-line &,
+  .v-banner--three-line &
+    align-self: flex-start
     -webkit-line-clamp: 2
 
   .v-banner--three-line &

package/lib/components/VBanner/VBannerActions.mjs

@@ -1,3 +1,3 @@
 import { createSimpleFunctional } from "../../util/index.mjs";
-export default createSimpleFunctional('v-banner-actions');
+export const VBannerActions = createSimpleFunctional('v-banner-actions');
 //# sourceMappingURL=VBannerActions.mjs.map

package/lib/components/VBanner/VBannerActions.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/VBannerActions.ts"],"names":["createSimpleFunctional"],"mappings":"SAASA,sB;AAET,eAAeA,sBAAsB,CAAC,kBAAD,CAArC","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport default createSimpleFunctional('v-banner-actions')\n"],"file":"VBannerActions.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/VBannerActions.ts"],"names":["createSimpleFunctional","VBannerActions"],"mappings":"SAASA,sB;AAET,OAAO,MAAMC,cAAc,GAAGD,sBAAsB,CAAC,kBAAD,CAA7C","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport const VBannerActions = createSimpleFunctional('v-banner-actions')\n"],"file":"VBannerActions.mjs"}

package/lib/components/VBanner/VBannerText.mjs

@@ -1,3 +1,3 @@
 import { createSimpleFunctional } from "../../util/index.mjs";
-export default createSimpleFunctional('v-banner-text');
+export const VBannerText = createSimpleFunctional('v-banner-text');
 //# sourceMappingURL=VBannerText.mjs.map

package/lib/components/VBanner/VBannerText.mjs.map

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

package/lib/components/VBanner/_variables.scss

@@ -3,13 +3,11 @@
 @use '../../styles/tools';
 
 // Defaults
-$banner-avatar-after-opacity: var(--v-border-opacity) !default;
-$banner-avatar-after-opacity: var(--v-border-opacity) !default;
 $banner-avatar-border-radius: map.get(settings.$rounded, 'circle') !default;
 $banner-avatar-margin-end: 24px !default;
 $banner-avatar-margin-start: 0 !default;
-$banner-background: rgb(var(--v-theme-background)) !default;
-$banner-color: rgb(var(--v-theme-on-surface)) !default;
+$banner-background: rgb(var(--v-theme-surface)) !default;
+$banner-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
 $banner-border-color: settings.$border-color-root !default;
 $banner-border-radius: map.get(settings.$rounded, 0) !default;
 $banner-border-style: settings.$border-style-root !default;
@@ -26,12 +24,10 @@ $banner-padding-top: 10px !default;
 $banner-positions: absolute fixed sticky !default;
 $banner-rounded-border-radius: settings.$border-radius-root !default;
 $banner-sticky-top: 0 !default;
-$banner-text-color: rgb(var(--v-theme-on-surface)) !default;
 $banner-text-line-height: tools.map-deep-get(settings.$typography, 'subtitle-2', 'line-height') !default;
 $banner-two-line-content-margin-bottom: 4px !default;
 $banner-two-line-padding-top: 24px !default;
 $banner-three-line-content-margin-bottom: 8px !default;
-$banner-three-line-margin-bottom: 24px !default;
 $banner-three-line-padding-top: 24px !default;
 $banner-width: 100% !default;
 

package/lib/components/VBanner/index.mjs

@@ -1,6 +1,4 @@
-export { default as VBanner } from "./VBanner.mjs";
-export { default as VBannerActions } from "./VBannerActions.mjs";
-export { default as VBannerAvatar } from "./VBannerAvatar.mjs";
-export { default as VBannerContent } from "./VBannerContent.mjs";
-export { default as VBannerText } from "./VBannerText.mjs";
+export { VBanner } from "./VBanner.mjs";
+export { VBannerActions } from "./VBannerActions.mjs";
+export { VBannerText } from "./VBannerText.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/index.ts"],"names":["default","VBanner","VBannerActions","VBannerAvatar","VBannerContent","VBannerText"],"mappings":"SAASA,OAAO,IAAIC,O;SACXD,OAAO,IAAIE,c;SACXF,OAAO,IAAIG,a;SACXH,OAAO,IAAII,c;SACXJ,OAAO,IAAIK,W","sourcesContent":["export { default as VBanner } from './VBanner'\nexport { default as VBannerActions } from './VBannerActions'\nexport { default as VBannerAvatar } from './VBannerAvatar'\nexport { default as VBannerContent } from './VBannerContent'\nexport { default as VBannerText } from './VBannerText'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/index.ts"],"names":["VBanner","VBannerActions","VBannerText"],"mappings":"SAASA,O;SACAC,c;SACAC,W","sourcesContent":["export { VBanner } from './VBanner'\nexport { VBannerActions } from './VBannerActions'\nexport { VBannerText } from './VBannerText'\n"],"file":"index.mjs"}

package/lib/components/VBottomNavigation/VBottomNavigation.css

@@ -2,29 +2,60 @@
   display: flex;
   max-width: 100%;
   overflow: hidden;
-  position: fixed;
-  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  position: absolute;
   border-color: rgba(var(--v-border-color), var(--v-border-opacity));
   border-style: solid;
   border-width: 0;
+  border-radius: 0;
   background: rgb(var(--v-theme-surface));
-  color: rgb(var(--v-theme-on-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
 }
 .v-bottom-navigation--border {
   border-width: thin;
   box-shadow: none;
 }
-.v-bottom-navigation--is-active {
+.v-bottom-navigation--active {
   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);
 }
-.v-bottom-navigation--absolute {
-  position: absolute;
-}
 
 .v-bottom-navigation__content {
   display: flex;
   flex: none;
+  font-size: 0.75rem;
   justify-content: center;
+  transition: transform, color 0.2s, 0.1s cubic-bezier(0.4, 0, 0.2, 1);
+  width: 100%;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn {
+  font-size: inherit;
+  height: 100%;
+  max-width: 168px;
+  min-width: 80px;
+  text-transform: none;
+  transition: inherit;
+  width: auto;
+  border-radius: 0;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__content,
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
   transition: inherit;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
+  font-size: 1.5rem;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn:not(.v-btn--selected):not(.v-btn--disabled) {
+  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+}
+.v-bottom-navigation--grow .v-bottom-navigation__content > .v-btn {
   width: 100%;
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn .v-btn__icon {
+  top: 0.5rem;
+  transform: translateY(-0.5rem);
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__content {
+  color: rgba(var(--v-theme-on-surface), 0);
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__icon {
+  transform: translateY(0);
 }