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

package/lib/components/VCard/VCard.css

@@ -0,0 +1,268 @@
+.v-card {
+  display: block;
+  overflow: hidden;
+  position: relative;
+  padding: 0;
+  text-decoration: none;
+  transition-duration: 0.28s;
+  transition-property: box-shadow, opacity, background;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+  border-radius: 4px;
+}
+.v-card--border {
+  border-width: thin;
+  box-shadow: none;
+}
+.v-card--absolute {
+  position: absolute;
+}
+.v-card--fixed {
+  position: fixed;
+}
+.v-card:hover .v-card__overlay {
+  opacity: calc(0.04 * var(--v-theme-overlay-multiplier));
+}
+.v-card:focus-visible .v-card__overlay {
+  opacity: calc(0.12 * var(--v-theme-overlay-multiplier));
+}
+@supports not selector(:focus-visible) {
+  .v-card:focus .v-card__overlay {
+    opacity: calc(0.12 * var(--v-theme-overlay-multiplier));
+  }
+}
+.v-card--active:hover.v-card__overlay,
+.v-card--active .v-card__overlay {
+  opacity: calc(0.12 * var(--v-theme-overlay-multiplier));
+}
+.v-card--active:focus .v-card__overlay {
+  opacity: calc(0.16 * var(--v-theme-overlay-multiplier));
+}
+.v-card--variant-plain, .v-card--variant-outlined, .v-card--variant-text, .v-card--variant-contained-text {
+  background: transparent;
+  color: inherit;
+}
+.v-card--variant-plain {
+  opacity: 0.62;
+}
+.v-card--variant-plain:focus, .v-card--variant-plain:hover {
+  opacity: 1;
+}
+.v-card--variant-plain .v-card__overlay {
+  display: none;
+}
+.v-card--variant-contained, .v-card--variant-contained-flat {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-card--variant-contained {
+  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
+}
+.v-card--variant-contained-flat {
+  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);
+}
+.v-card--variant-outlined {
+  border: thin solid currentColor;
+}
+.v-card--variant-text .v-card__overlay {
+  background: currentColor;
+}
+.v-card--variant-contained-text .v-card__underlay {
+  background: currentColor;
+  opacity: var(--v-activated-opacity);
+  border-radius: inherit;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease-in-out;
+}
+.v-card--disabled {
+  pointer-events: none;
+  user-select: none;
+}
+.v-card--disabled > [class*=v-card-] {
+  opacity: 0.6;
+}
+.v-card--flat {
+  box-shadow: none;
+}
+.v-card--hover {
+  cursor: pointer;
+  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);
+}
+.v-card--hover::before, .v-card--hover::after {
+  border-radius: inherit;
+  bottom: 0;
+  content: "";
+  display: block;
+  left: 0;
+  pointer-events: none;
+  position: absolute;
+  right: 0;
+  top: 0;
+  transition: inherit;
+}
+.v-card--hover::before {
+  opacity: 1;
+  z-index: -1;
+  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
+}
+.v-card--hover::after {
+  z-index: 1;
+  opacity: 0;
+  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+.v-card--hover:hover::after {
+  opacity: 1;
+}
+.v-card--hover:hover::before {
+  opacity: 0;
+}
+.v-card--link {
+  cursor: pointer;
+}
+.v-card--tile {
+  border-radius: 0;
+}
+
+.v-card-actions {
+  align-items: center;
+  display: flex;
+  flex: 1 1 auto;
+  min-height: 52px;
+  padding: 0.5rem;
+}
+
+.v-card-avatar {
+  align-self: flex-start;
+  padding: 0.5rem 1rem;
+}
+.v-card-header .v-card-avatar:last-child {
+  padding-inline-end: 0;
+}
+.v-card-header .v-card-avatar:first-child {
+  padding-inline-start: 0;
+}
+
+.v-card-header-text {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+.v-card-img {
+  border-radius: inherit;
+  display: flex;
+  height: 100%;
+  left: 0;
+  overflow: hidden;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+
+.v-card-header {
+  align-items: center;
+  display: flex;
+  padding: 0.625rem 1rem;
+}
+.v-card-header + .v-card-text {
+  padding-top: 0;
+}
+
+.v-card-media {
+  overflow: hidden;
+}
+
+.v-card-subtitle {
+  align-items: center;
+  display: flex;
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.0178571429em;
+  opacity: var(--v-medium-emphasis-opacity);
+  padding: 0 1rem;
+  text-transform: none;
+}
+.v-card .v-card-subtitle {
+  line-height: 1.25rem;
+}
+.v-card--density-comfortable .v-card-subtitle {
+  line-height: 1.125rem;
+}
+.v-card--density-compact .v-card-subtitle {
+  line-height: 1rem;
+}
+.v-card-header .v-card-subtitle {
+  padding: 0 0 0.25rem;
+}
+
+.v-card-text {
+  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+  font-size: 0.875rem;
+  font-weight: 400;
+  letter-spacing: 0.0178571429em;
+  padding: 1rem;
+  text-transform: none;
+  transition: inherit;
+  transition-property: color, opacity;
+}
+.v-card .v-card-text {
+  line-height: 1.25rem;
+}
+.v-card--density-comfortable .v-card-text {
+  line-height: 1.2rem;
+}
+.v-card--density-compact .v-card-text {
+  line-height: 1.15rem;
+}
+.v-card-text + .v-card-actions {
+  margin-top: -0.5rem;
+}
+
+.v-card-title {
+  align-items: center;
+  display: flex;
+  font-size: 1.25rem;
+  font-weight: 500;
+  hyphens: auto;
+  letter-spacing: 0.0125em;
+  overflow-wrap: normal;
+  padding: 0.5rem 1rem;
+  text-transform: none;
+  word-break: normal;
+  word-wrap: break-word;
+}
+.v-card .v-card-title {
+  line-height: 2rem;
+}
+.v-card--density-comfortable .v-card-title {
+  line-height: 1.75rem;
+}
+.v-card--density-compact .v-card-title {
+  line-height: 1.55rem;
+}
+.v-card-header .v-card-title {
+  padding: 0;
+}
+
+.v-card__overlay {
+  background-color: currentColor;
+  border-radius: inherit;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  pointer-events: none;
+  opacity: 0;
+  transition: opacity 0.2s ease-in-out;
+}
+.v-card__overlay + .v-card-media {
+  border-top-left-radius: inherit;
+  border-top-right-radius: inherit;
+}

package/lib/components/VCard/VCard.mjs

@@ -1,18 +1,19 @@
 import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
+
+/* eslint-disable complexity */
 // Styles
-import "./VCard.sass"; // Components
+import "./VCard.css"; // Components
 
-import VCardActions from "./VCardActions.mjs";
-import VCardAvatar from "./VCardAvatar.mjs";
-import VCardHeader from "./VCardHeader.mjs";
-import VCardHeaderText from "./VCardHeaderText.mjs";
-import VCardImg from "./VCardImg.mjs";
-import VCardMedia from "./VCardMedia.mjs";
-import VCardSubtitle from "./VCardSubtitle.mjs";
-import VCardText from "./VCardText.mjs";
-import VCardTitle from "./VCardTitle.mjs";
 import { VAvatar } from "../VAvatar/index.mjs";
-import { VImg } from "../VImg/index.mjs"; // Composables
+import { VImg } from "../VImg/index.mjs";
+import { VCardActions } from "./VCardActions.mjs";
+import { VCardAvatar } from "./VCardAvatar.mjs";
+import { VCardHeader } from "./VCardHeader.mjs";
+import { VCardHeaderText } from "./VCardHeaderText.mjs";
+import { VCardImg } from "./VCardImg.mjs";
+import { VCardSubtitle } from "./VCardSubtitle.mjs";
+import { VCardText } from "./VCardText.mjs";
+import { VCardTitle } from "./VCardTitle.mjs"; // Composables
 
 import { makeBorderProps, useBorder } from "../../composables/border.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
@@ -22,19 +23,19 @@ import { makePositionProps, usePosition } from "../../composables/position.mjs";
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeRouterProps, useLink } from "../../composables/router.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
-import { makeThemeProps, useTheme } from "../../composables/theme.mjs";
+import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { genOverlays, makeVariantProps, useVariant } from "../../composables/variant.mjs"; // Directives
 
 import { Ripple } from "../../directives/ripple/index.mjs"; // Utilities
 
-import { defineComponent } from 'vue';
-import { makeProps } from "../../util/index.mjs";
-export default defineComponent({
+import { defineComponent } from "../../util/index.mjs";
+import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
+export const VCard = defineComponent({
   name: 'VCard',
   directives: {
     Ripple
   },
-  props: makeProps({
+  props: {
     appendAvatar: String,
     appendIcon: String,
     disabled: Boolean,
@@ -60,26 +61,27 @@ export default defineComponent({
     ...makeVariantProps({
       variant: 'contained'
     })
-  }),
+  },
 
-  setup(props, {
-    attrs,
-    slots
-  }) {
+  setup(props, _ref) {
+    let {
+      attrs,
+      slots
+    } = _ref;
     const {
       themeClasses
-    } = useTheme(props);
+    } = provideTheme(props);
     const {
       borderClasses
-    } = useBorder(props, 'v-card');
+    } = useBorder(props);
     const {
       colorClasses,
       colorStyles,
       variantClasses
-    } = useVariant(props, 'v-card');
+    } = useVariant(props);
     const {
       densityClasses
-    } = useDensity(props, 'v-card');
+    } = useDensity(props);
     const {
       dimensionStyles
     } = useDimension(props);
@@ -89,13 +91,13 @@ export default defineComponent({
     const {
       positionClasses,
       positionStyles
-    } = usePosition(props, 'v-card');
+    } = usePosition(props);
     const {
       roundedClasses
-    } = useRounded(props, 'v-card');
+    } = useRounded(props);
     const link = useLink(props, attrs);
     return () => {
-      var _slots$image, _slots$default;
+      var _slots$image, _slots$media, _slots$default;
 
       const Tag = link.isLink.value ? 'a' : props.tag;
       const hasTitle = !!(slots.title || props.title);
@@ -118,44 +120,57 @@ export default defineComponent({
         "href": link.href.value,
         "onClick": isClickable && link.navigate
       }, {
-        default: () => [genOverlays(isClickable, 'v-card'), hasImage && _createVNode(VCardImg, null, {
-          default: () => [slots.image ? (_slots$image = slots.image) == null ? void 0 : _slots$image.call(slots, {
-            src: props.image
-          }) : _createVNode(VImg, {
-            "src": props.image,
-            "alt": ""
-          }, null, 8, ["src"])]
-        }), slots.media && _createVNode(VCardMedia, null, {
-          default: slots.media
-        }), hasHeader && _createVNode(VCardHeader, null, {
-          default: () => [hasPrepend && _createVNode(VCardAvatar, null, {
-            default: () => [slots.prepend ? slots.prepend() : _createVNode(VAvatar, {
-              "density": props.density,
-              "icon": props.prependIcon,
-              "image": props.prependAvatar
-            }, null, 8, ["density", "icon", "image"])]
+        default: () => [genOverlays(isClickable, 'v-card'), hasImage && _createVNode(VDefaultsProvider, {
+          "defaults": {
+            VImg: {
+              cover: true,
+              src: props.image
+            }
+          }
+        }, {
+          default: () => [_createVNode(VCardImg, null, {
+            default: () => [slots.image ? (_slots$image = slots.image) == null ? void 0 : _slots$image.call(slots) : _createVNode(VImg, {
+              "alt": ""
+            }, null)]
+          })]
+        }), (_slots$media = slots.media) == null ? void 0 : _slots$media.call(slots), hasHeader && _createVNode(VCardHeader, null, {
+          default: () => [hasPrepend && _createVNode(VDefaultsProvider, {
+            "defaults": {
+              VAvatar: {
+                density: props.density,
+                icon: props.prependIcon,
+                image: props.prependAvatar
+              }
+            }
+          }, {
+            default: () => [_createVNode(VCardAvatar, null, {
+              default: () => [slots.prepend ? slots.prepend() : _createVNode(VAvatar, null, null)]
+            })]
           }), hasHeaderText && _createVNode(VCardHeaderText, null, {
             default: () => [hasTitle && _createVNode(VCardTitle, null, {
               default: () => [slots.title ? slots.title() : props.title]
-            }), _createVNode(VCardSubtitle, null, {
+            }), hasSubtitle && _createVNode(VCardSubtitle, null, {
               default: () => [slots.subtitle ? slots.subtitle() : props.subtitle]
-            })],
-            _: 1
-          }), hasAppend && _createVNode(VCardAvatar, null, {
-            default: () => [slots.append ? slots.append() : _createVNode(VAvatar, {
-              "density": props.density,
-              "icon": props.appendIcon,
-              "image": props.appendAvatar
-            }, null, 8, ["density", "icon", "image"])]
-          })],
-          _: 1
+            })]
+          }), hasAppend && _createVNode(VDefaultsProvider, {
+            "defaults": {
+              VAvatar: {
+                density: props.density,
+                icon: props.appendIcon,
+                image: props.appendAvatar
+              }
+            }
+          }, {
+            default: () => [_createVNode(VCardAvatar, null, {
+              default: () => [slots.append ? slots.append() : _createVNode(VAvatar, null, null)]
+            })]
+          })]
         }), hasText && _createVNode(VCardText, null, {
           default: () => [slots.text ? slots.text() : props.text]
         }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), slots.actions && _createVNode(VCardActions, null, {
           default: slots.actions
-        })],
-        _: 1
-      }, 8, ["class", "style", "href", "onClick"]), [[_resolveDirective("ripple"), isClickable]]);
+        })]
+      }), [[_resolveDirective("ripple"), isClickable]]);
     };
   }
 

package/lib/components/VCard/VCard.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VCard/VCard.tsx"],"names":["VCardActions","VCardAvatar","VCardHeader","VCardHeaderText","VCardImg","VCardMedia","VCardSubtitle","VCardText","VCardTitle","VAvatar","VImg","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeRouterProps","useLink","makeTagProps","makeThemeProps","useTheme","genOverlays","makeVariantProps","useVariant","Ripple","defineComponent","makeProps","name","directives","props","appendAvatar","String","appendIcon","disabled","Boolean","flat","hover","image","link","prependAvatar","prependIcon","ripple","subtitle","text","title","variant","setup","attrs","slots","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","positionClasses","positionStyles","roundedClasses","Tag","isLink","value","tag","hasTitle","hasSubtitle","hasHeaderText","hasAppend","append","hasPrepend","prepend","hasImage","hasHeader","hasText","isClickable","href","navigate","src","media","default","density","actions"],"mappings":"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","sourcesContent":["// Styles\nimport './VCard.sass'\n\n// Components\nimport VCardActions from './VCardActions'\nimport VCardAvatar from './VCardAvatar'\nimport VCardHeader from './VCardHeader'\nimport VCardHeaderText from './VCardHeaderText'\nimport VCardImg from './VCardImg'\nimport VCardMedia from './VCardMedia'\nimport VCardSubtitle from './VCardSubtitle'\nimport VCardText from './VCardText'\nimport VCardTitle from './VCardTitle'\nimport { VAvatar } from '@/components/VAvatar'\nimport { VImg } from '@/components/VImg'\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 { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { defineComponent } from 'vue'\nimport { makeProps } from '@/util'\n\nexport default defineComponent({\n  name: 'VCard',\n\n  directives: { Ripple },\n\n  props: makeProps({\n    appendAvatar: String,\n    appendIcon: String,\n    disabled: Boolean,\n    flat: Boolean,\n    hover: Boolean,\n    image: String,\n    link: Boolean,\n    prependAvatar: String,\n    prependIcon: String,\n    ripple: Boolean,\n    subtitle: String,\n    text: String,\n    title: String,\n\n    ...makeThemeProps(),\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeRouterProps(),\n    ...makeTagProps(),\n    ...makeVariantProps({ variant: 'contained' } as const),\n  }),\n\n  setup (props, { attrs, slots }) {\n    const { themeClasses } = useTheme(props)\n    const { borderClasses } = useBorder(props, 'v-card')\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props, 'v-card')\n    const { densityClasses } = useDensity(props, 'v-card')\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { positionClasses, positionStyles } = usePosition(props, 'v-card')\n    const { roundedClasses } = useRounded(props, 'v-card')\n    const link = useLink(props, attrs)\n\n    return () => {\n      const Tag = (link.isLink.value) ? 'a' : props.tag\n      const hasTitle = !!(slots.title || props.title)\n      const hasSubtitle = !!(slots.subtitle || props.subtitle)\n      const hasHeaderText = hasTitle || hasSubtitle\n      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon)\n      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon)\n      const hasImage = !!(slots.image || props.image)\n      const hasHeader = hasHeaderText || hasPrepend || hasAppend\n      const hasText = !!(slots.text || props.text)\n      const isClickable = !props.disabled && (link.isClickable.value || props.link)\n\n      return (\n        <Tag\n          class={[\n            'v-card',\n            {\n              'v-card--disabled': props.disabled,\n              'v-card--flat': props.flat,\n              'v-card--hover': props.hover && !(props.disabled || props.flat),\n              'v-card--link': isClickable,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            positionStyles.value,\n          ]}\n          href={ link.href.value }\n          onClick={ isClickable && link.navigate }\n          v-ripple={ isClickable }\n        >\n          { genOverlays(isClickable, 'v-card') }\n\n          { hasImage && (\n            <VCardImg>\n              { slots.image\n                ? slots.image?.({ src: props.image })\n                : (<VImg src={ props.image } alt=\"\" />)\n              }\n            </VCardImg>\n          ) }\n\n          { slots.media && (\n            <VCardMedia v-slots={{ default: slots.media }} />\n          ) }\n\n          { hasHeader && (\n            <VCardHeader>\n              { hasPrepend && (\n                <VCardAvatar>\n                  { slots.prepend\n                    ? slots.prepend()\n                    : (\n                      <VAvatar\n                        density={ props.density }\n                        icon={ props.prependIcon }\n                        image={ props.prependAvatar }\n                      />\n                    )\n                  }\n                </VCardAvatar>\n              ) }\n\n              { hasHeaderText && (\n                <VCardHeaderText>\n                  { hasTitle && (\n                    <VCardTitle>\n                      { slots.title\n                        ? slots.title()\n                        : props.title\n                      }\n                    </VCardTitle>\n                  ) }\n\n                  <VCardSubtitle>\n                    { slots.subtitle\n                      ? slots.subtitle()\n                      : props.subtitle\n                    }\n                  </VCardSubtitle>\n                </VCardHeaderText>\n              ) }\n\n              { hasAppend && (\n                <VCardAvatar>\n                  { slots.append\n                    ? slots.append()\n                    : (\n                      <VAvatar\n                        density={ props.density }\n                        icon={ props.appendIcon }\n                        image={ props.appendAvatar }\n                      />\n                    )\n                  }\n                </VCardAvatar>\n              ) }\n            </VCardHeader>\n          ) }\n\n          { hasText && (\n            <VCardText>\n              { slots.text ? slots.text() : props.text }\n            </VCardText>\n          ) }\n\n          { slots.default?.() }\n\n          { slots.actions && (\n            <VCardActions v-slots={{ default: slots.actions }} />\n          ) }\n        </Tag>\n      )\n    }\n  },\n})\n"],"file":"VCard.mjs"}
+{"version":3,"sources":["../../../src/components/VCard/VCard.tsx"],"names":["VAvatar","VImg","VCardActions","VCardAvatar","VCardHeader","VCardHeaderText","VCardImg","VCardSubtitle","VCardText","VCardTitle","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeRouterProps","useLink","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","Ripple","defineComponent","VDefaultsProvider","VCard","name","directives","props","appendAvatar","String","appendIcon","disabled","Boolean","flat","hover","image","link","prependAvatar","prependIcon","ripple","subtitle","text","title","variant","setup","attrs","slots","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","positionClasses","positionStyles","roundedClasses","Tag","isLink","value","tag","hasTitle","hasSubtitle","hasHeaderText","hasAppend","append","hasPrepend","prepend","hasImage","hasHeader","hasText","isClickable","href","navigate","cover","src","media","density","icon","default","actions"],"mappings":"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","sourcesContent":["/* eslint-disable complexity */\n\n// Styles\nimport './VCard.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport { VImg } from '@/components/VImg'\nimport { VCardActions } from './VCardActions'\nimport { VCardAvatar } from './VCardAvatar'\nimport { VCardHeader } from './VCardHeader'\nimport { VCardHeaderText } from './VCardHeaderText'\nimport { VCardImg } from './VCardImg'\nimport { VCardSubtitle } from './VCardSubtitle'\nimport { VCardText } from './VCardText'\nimport { VCardTitle } from './VCardTitle'\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 { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { defineComponent } from '@/util'\nimport { VDefaultsProvider } from '../VDefaultsProvider'\n\nexport const VCard = defineComponent({\n  name: 'VCard',\n\n  directives: { Ripple },\n\n  props: {\n    appendAvatar: String,\n    appendIcon: String,\n    disabled: Boolean,\n    flat: Boolean,\n    hover: Boolean,\n    image: String,\n    link: Boolean,\n    prependAvatar: String,\n    prependIcon: String,\n    ripple: Boolean,\n    subtitle: String,\n    text: String,\n    title: String,\n\n    ...makeThemeProps(),\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeRouterProps(),\n    ...makeTagProps(),\n    ...makeVariantProps({ variant: 'contained' } as const),\n  },\n\n  setup (props, { attrs, slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { positionClasses, positionStyles } = usePosition(props)\n    const { roundedClasses } = useRounded(props)\n    const link = useLink(props, attrs)\n\n    return () => {\n      const Tag = (link.isLink.value) ? 'a' : props.tag\n      const hasTitle = !!(slots.title || props.title)\n      const hasSubtitle = !!(slots.subtitle || props.subtitle)\n      const hasHeaderText = hasTitle || hasSubtitle\n      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon)\n      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon)\n      const hasImage = !!(slots.image || props.image)\n      const hasHeader = hasHeaderText || hasPrepend || hasAppend\n      const hasText = !!(slots.text || props.text)\n      const isClickable = !props.disabled && (link.isClickable.value || props.link)\n\n      return (\n        <Tag\n          class={[\n            'v-card',\n            {\n              'v-card--disabled': props.disabled,\n              'v-card--flat': props.flat,\n              'v-card--hover': props.hover && !(props.disabled || props.flat),\n              'v-card--link': isClickable,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            colorClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            positionClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          style={[\n            colorStyles.value,\n            dimensionStyles.value,\n            positionStyles.value,\n          ]}\n          href={ link.href.value }\n          onClick={ isClickable && link.navigate }\n          v-ripple={ isClickable }\n        >\n          { genOverlays(isClickable, 'v-card') }\n\n          { hasImage && (\n            <VDefaultsProvider\n              defaults={{\n                VImg: {\n                  cover: true,\n                  src: props.image,\n                },\n              }}\n            >\n              <VCardImg>\n                { slots.image ? slots.image?.() : (<VImg alt=\"\" />) }\n              </VCardImg>\n            </VDefaultsProvider>\n          ) }\n\n          { slots.media?.() }\n\n          { hasHeader && (\n            <VCardHeader>\n              { hasPrepend && (\n                <VDefaultsProvider\n                  defaults={{\n                    VAvatar: {\n                      density: props.density,\n                      icon: props.prependIcon,\n                      image: props.prependAvatar,\n                    },\n                  }}\n                >\n                  <VCardAvatar>\n                    { slots.prepend ? slots.prepend() : (<VAvatar />) }\n                  </VCardAvatar>\n                </VDefaultsProvider>\n              ) }\n\n              { hasHeaderText && (\n                <VCardHeaderText>\n                  { hasTitle && (\n                    <VCardTitle>\n                      { slots.title ? slots.title() : props.title}\n                    </VCardTitle>\n                  ) }\n\n                  { hasSubtitle && (\n                    <VCardSubtitle>\n                      { slots.subtitle ? slots.subtitle() : props.subtitle }\n                    </VCardSubtitle>\n                  ) }\n                </VCardHeaderText>\n              ) }\n\n              { hasAppend && (\n                <VDefaultsProvider\n                  defaults={{\n                    VAvatar: {\n                      density: props.density,\n                      icon: props.appendIcon,\n                      image: props.appendAvatar,\n                    },\n                  }}\n                >\n                  <VCardAvatar>\n                    { slots.append ? slots.append() : (<VAvatar />) }\n                  </VCardAvatar>\n                </VDefaultsProvider>\n              ) }\n            </VCardHeader>\n          ) }\n\n          { hasText && (\n            <VCardText>\n              { slots.text ? slots.text() : props.text }\n            </VCardText>\n          ) }\n\n          { slots.default?.() }\n\n          { slots.actions && (\n            <VCardActions v-slots={{ default: slots.actions }} />\n          ) }\n        </Tag>\n      )\n    }\n  },\n})\n\nexport type VCard = InstanceType<typeof VCard>\n"],"file":"VCard.mjs"}

package/lib/components/VCard/VCard.sass

@@ -1,8 +1,11 @@
-// Imports
-@import './index'
+@forward './variables'
+@use '../../styles/tools'
+@use './variables' as *
+@use './mixins' as *
 
 .v-card
-  color: $card-color
+  display: block
+  overflow: hidden
   position: relative
   padding: $card-padding
   text-decoration: none
@@ -10,11 +13,11 @@
   transition-property: $card-transition-property
   transition-timing-function: $card-transition-timing-function
 
-  @include border($card-border...)
-  @include position($card-positions)
-  @include rounded($card-border-radius)
-  @include states('.v-card__overlay')
-  @include variant($card-variants...)
+  @include tools.border($card-border...)
+  @include tools.position($card-positions)
+  @include tools.rounded($card-border-radius)
+  @include tools.states('.v-card__overlay')
+  @include tools.variant($card-variants...)
 
   &--disabled
     pointer-events: none
@@ -46,13 +49,13 @@
       opacity: 1
       z-index: -1
 
-      @include elevation($card-elevation)
+      @include tools.elevation($card-elevation)
 
     &::after
       z-index: 1
       opacity: 0
 
-      @include elevation($card-hover-elevation)
+      @include tools.elevation($card-hover-elevation)
 
     &:hover::after
       opacity: 1
@@ -60,13 +63,13 @@
     &:hover::before
       opacity: 0
 
-    @include elevation(0)
+    @include tools.elevation(0)
 
   &--link
     cursor: pointer
 
   &--tile
-    @include rounded($card-tile-border-radius)
+    @include tools.rounded($card-tile-border-radius)
 
 .v-card-actions
   align-items: center
@@ -81,22 +84,15 @@
 
   &:last-child
     .v-card-header &
-      @include ltr()
-        padding-right: $card-avatar-header-padding
-
-      @include rtl()
-        padding-left: $card-avatar-header-padding
+      padding-inline-end: $card-avatar-header-padding
 
   &:first-child
     .v-card-header &
-      @include ltr()
-        padding-left: $card-avatar-header-padding
-
-      @include rtl()
-        padding-right: $card-avatar-header-padding
+      padding-inline-start: $card-avatar-header-padding
 
 .v-card-header-text
   flex: 1 1 auto
+  min-width: 0
 
 .v-card-img
   border-radius: inherit
@@ -107,26 +103,18 @@
   position: absolute
   top: 0
   width: 100%
-  z-index: -1
 
 .v-card-header
   align-items: $card-item-align-items
   display: flex
   padding: $card-item-padding
 
+  + .v-card-text
+    padding-top: 0
+
 .v-card-media
   overflow: hidden
 
-  &:first-child
-    .v-card &
-      border-top-left-radius: inherit
-      border-top-right-radius: inherit
-
-  &:last-child
-    .v-card &
-      border-bottom-left-radius: inherit
-      border-bottom-right-radius: inherit
-
 .v-card-subtitle
   align-items: center
   display: flex
@@ -143,10 +131,10 @@
     padding: $card-subtitle-header-padding
 
 .v-card-text
+  color: $card-text-color
   font-size: $card-text-font-size
   font-weight: $card-text-font-weight
   letter-spacing: $card-text-letter-spacing
-  opacity: $card-text-opacity
   padding: $card-text-padding
   text-transform: $card-text-text-transform
   transition: inherit
@@ -154,6 +142,9 @@
 
   @include card-line-height-densities($card-text-densities)
 
+  + .v-card-actions
+    margin-top: -.5rem
+
 .v-card-title
   align-items: center
   display: flex
@@ -187,11 +178,3 @@
   + .v-card-media
     border-top-left-radius: inherit
     border-top-right-radius: inherit
-
-// VDialog
-.v-card
-  .v-dialog .v-overlay__content > &
-    border-radius: inherit
-    overflow: hidden
-
-    @include elevation($card-dialog-elevation)