@vuetify/nightly 3.4.0-beta.1-dev.2023-11-08 → 3.4.0-dev.2023-12-01

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.4.0-beta.1-dev.2023-11-08
+* Vuetify v3.4.0-dev.2023-12-01
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -2993,6 +2993,101 @@
 
   // Types
 
+  // Composables
+  function useColor(colors) {
+    return destructComputed(() => {
+      const classes = [];
+      const styles = {};
+      if (colors.value.background) {
+        if (isCssColor(colors.value.background)) {
+          styles.backgroundColor = colors.value.background;
+          if (!colors.value.text && isParsableColor(colors.value.background)) {
+            const backgroundColor = parseColor(colors.value.background);
+            if (backgroundColor.a == null || backgroundColor.a === 1) {
+              const textColor = getForeground(backgroundColor);
+              styles.color = textColor;
+              styles.caretColor = textColor;
+            }
+          }
+        } else {
+          classes.push(`bg-${colors.value.background}`);
+        }
+      }
+      if (colors.value.text) {
+        if (isCssColor(colors.value.text)) {
+          styles.color = colors.value.text;
+          styles.caretColor = colors.value.text;
+        } else {
+          classes.push(`text-${colors.value.text}`);
+        }
+      }
+      return {
+        colorClasses: classes,
+        colorStyles: styles
+      };
+    });
+  }
+  function useTextColor(props, name) {
+    const colors = vue.computed(() => ({
+      text: vue.isRef(props) ? props.value : name ? props[name] : null
+    }));
+    const {
+      colorClasses: textColorClasses,
+      colorStyles: textColorStyles
+    } = useColor(colors);
+    return {
+      textColorClasses,
+      textColorStyles
+    };
+  }
+  function useBackgroundColor(props, name) {
+    const colors = vue.computed(() => ({
+      background: vue.isRef(props) ? props.value : name ? props[name] : null
+    }));
+    const {
+      colorClasses: backgroundColorClasses,
+      colorStyles: backgroundColorStyles
+    } = useColor(colors);
+    return {
+      backgroundColorClasses,
+      backgroundColorStyles
+    };
+  }
+
+  // Utilities
+
+  // Types
+
+  // Composables
+  const makeRoundedProps = propsFactory({
+    rounded: {
+      type: [Boolean, Number, String],
+      default: undefined
+    }
+  }, 'rounded');
+  function useRounded(props) {
+    let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
+    const roundedClasses = vue.computed(() => {
+      const rounded = vue.isRef(props) ? props.value : props.rounded;
+      const classes = [];
+      if (rounded === true || rounded === '') {
+        classes.push(`${name}--rounded`);
+      } else if (typeof rounded === 'string' || rounded === 0) {
+        for (const value of String(rounded).split(' ')) {
+          classes.push(`rounded-${value}`);
+        }
+      }
+      return classes;
+    });
+    return {
+      roundedClasses
+    };
+  }
+
+  // Utilities
+
+  // Types
+
   const makeTransitionProps = propsFactory({
     transition: {
       type: [Boolean, String, Object],
@@ -3073,6 +3168,7 @@
   const makeVImgProps = propsFactory({
     alt: String,
     cover: Boolean,
+    color: String,
     draggable: {
       type: [Boolean, String],
       default: undefined
@@ -3101,6 +3197,7 @@
     position: String,
     ...makeVResponsiveProps(),
     ...makeComponentProps(),
+    ...makeRoundedProps(),
     ...makeTransitionProps()
   }, 'VImg');
   const VImg = genericComponent()({
@@ -3119,6 +3216,13 @@
         emit,
         slots
       } = _ref;
+      const {
+        backgroundColorClasses,
+        backgroundColorStyles
+      } = useBackgroundColor(vue.toRef(props, 'color'));
+      const {
+        roundedClasses
+      } = useRounded(props);
       const currentSrc = vue.shallowRef(''); // Set from srcset
       const image = vue.ref();
       const state = vue.shallowRef(props.eager ? 'loading' : 'idle');
@@ -3311,10 +3415,10 @@
         return vue.withDirectives(vue.createVNode(VResponsive, vue.mergeProps({
           "class": ['v-img', {
             'v-img--booting': !isBooted.value
-          }, props.class],
+          }, backgroundColorClasses.value, roundedClasses.value, props.class],
           "style": [{
             width: convertToUnit(props.width === 'auto' ? naturalWidth.value : props.width)
-          }, props.style]
+          }, backgroundColorStyles.value, props.style]
         }, responsiveProps, {
           "aspectRatio": aspectRatio.value,
           "aria-label": props.alt,
@@ -3370,71 +3474,6 @@
 
   // Types
 
-  // Composables
-  function useColor(colors) {
-    return destructComputed(() => {
-      const classes = [];
-      const styles = {};
-      if (colors.value.background) {
-        if (isCssColor(colors.value.background)) {
-          styles.backgroundColor = colors.value.background;
-          if (!colors.value.text && isParsableColor(colors.value.background)) {
-            const backgroundColor = parseColor(colors.value.background);
-            if (backgroundColor.a == null || backgroundColor.a === 1) {
-              const textColor = getForeground(backgroundColor);
-              styles.color = textColor;
-              styles.caretColor = textColor;
-            }
-          }
-        } else {
-          classes.push(`bg-${colors.value.background}`);
-        }
-      }
-      if (colors.value.text) {
-        if (isCssColor(colors.value.text)) {
-          styles.color = colors.value.text;
-          styles.caretColor = colors.value.text;
-        } else {
-          classes.push(`text-${colors.value.text}`);
-        }
-      }
-      return {
-        colorClasses: classes,
-        colorStyles: styles
-      };
-    });
-  }
-  function useTextColor(props, name) {
-    const colors = vue.computed(() => ({
-      text: vue.isRef(props) ? props.value : name ? props[name] : null
-    }));
-    const {
-      colorClasses: textColorClasses,
-      colorStyles: textColorStyles
-    } = useColor(colors);
-    return {
-      textColorClasses,
-      textColorStyles
-    };
-  }
-  function useBackgroundColor(props, name) {
-    const colors = vue.computed(() => ({
-      background: vue.isRef(props) ? props.value : name ? props[name] : null
-    }));
-    const {
-      colorClasses: backgroundColorClasses,
-      colorStyles: backgroundColorStyles
-    } = useColor(colors);
-    return {
-      backgroundColorClasses,
-      backgroundColorStyles
-    };
-  }
-
-  // Utilities
-
-  // Types
-
   // Composables
   const makeElevationProps = propsFactory({
     elevation: {
@@ -3461,36 +3500,6 @@
     };
   }
 
-  // Utilities
-
-  // Types
-
-  // Composables
-  const makeRoundedProps = propsFactory({
-    rounded: {
-      type: [Boolean, Number, String],
-      default: undefined
-    }
-  }, 'rounded');
-  function useRounded(props) {
-    let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
-    const roundedClasses = vue.computed(() => {
-      const rounded = vue.isRef(props) ? props.value : props.rounded;
-      const classes = [];
-      if (rounded === true || rounded === '') {
-        classes.push(`${name}--rounded`);
-      } else if (typeof rounded === 'string' || rounded === 0) {
-        for (const value of String(rounded).split(' ')) {
-          classes.push(`rounded-${value}`);
-        }
-      }
-      return classes;
-    });
-    return {
-      roundedClasses
-    };
-  }
-
   // Types
 
   const allowedDensities$1 = [null, 'prominent', 'default', 'comfortable', 'compact'];
@@ -18406,7 +18415,7 @@
     },
     setup(props, _ref) {
       let {
-        emit,
+        attrs,
         slots
       } = _ref;
       const {
@@ -18554,7 +18563,7 @@
               height: 0,
               border: 0
             }
-          }, null)]), slots['body.prepend']?.(slotProps.value), vue.createVNode(VDataTableRows, vue.mergeProps(dataTableRowsProps, {
+          }, null)]), slots['body.prepend']?.(slotProps.value), vue.createVNode(VDataTableRows, vue.mergeProps(attrs, dataTableRowsProps, {
             "items": displayItems.value
           }), {
             ...slots,
@@ -18619,7 +18628,7 @@
     },
     setup(props, _ref) {
       let {
-        emit,
+        attrs,
         slots
       } = _ref;
       const {
@@ -18752,7 +18761,7 @@
           }), slots)]), slots.thead?.(slotProps.value), vue.createVNode("tbody", {
             "class": "v-data-table__tbody",
             "role": "rowgroup"
-          }, [slots['body.prepend']?.(slotProps.value), slots.body ? slots.body(slotProps.value) : vue.createVNode(VDataTableRows, vue.mergeProps(dataTableRowsProps, {
+          }, [slots['body.prepend']?.(slotProps.value), slots.body ? slots.body(slotProps.value) : vue.createVNode(VDataTableRows, vue.mergeProps(attrs, dataTableRowsProps, {
             "items": flatItems.value
           }), slots), slots['body.append']?.(slotProps.value)]), slots.tbody?.(slotProps.value), slots.tfoot?.(slotProps.value)]),
           bottom: () => slots.bottom ? slots.bottom(slotProps.value) : vue.createVNode(VDataTableFooter, dataTableFooterProps, {
@@ -19031,7 +19040,7 @@
     }
   });
 
-  // Utilities
+  // Styles
   const VSpacer = createSimpleFunctional('v-spacer', 'div', 'VSpacer');
 
   // Types
@@ -23508,9 +23517,7 @@
 
   const VStepperSymbol$1 = Symbol.for('vuetify:v-stepper');
   const makeVStepperWindowProps = propsFactory({
-    ...makeVWindowProps({
-      mandatory: false
-    })
+    ...omit(makeVWindowProps(), ['continuous', 'nextIcon', 'prevIcon', 'showArrows', 'touch', 'mandatory'])
   }, 'VStepperWindow');
   const VStepperWindow = genericComponent()({
     name: 'VStepperWindow',
@@ -23540,10 +23547,14 @@
       });
       useRender(() => {
         const windowProps = VWindow.filterProps(props);
-        return vue.createVNode(VWindow, vue.mergeProps(windowProps, {
+        return vue.createVNode(VWindow, vue.mergeProps({
+          "_as": "VStepperWindow"
+        }, windowProps, {
           "modelValue": model.value,
           "onUpdate:modelValue": $event => model.value = $event,
-          "class": "v-stepper-window"
+          "class": "v-stepper-window",
+          "mandatory": false,
+          "touch": false
         }), slots);
       });
       return {};
@@ -23562,7 +23573,9 @@
       } = _ref;
       useRender(() => {
         const windowItemProps = VWindowItem.filterProps(props);
-        return vue.createVNode(VWindowItem, vue.mergeProps(windowItemProps, {
+        return vue.createVNode(VWindowItem, vue.mergeProps({
+          "_as": "VStepperWindowItem"
+        }, windowItemProps, {
           "class": "v-stepper-window-item"
         }), slots);
       });
@@ -25178,7 +25191,7 @@
       date
     };
   }
-  const version$1 = "3.4.0-beta.1-dev.2023-11-08";
+  const version$1 = "3.4.0-dev.2023-12-01";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -25192,7 +25205,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.4.0-beta.1-dev.2023-11-08";
+  const version = "3.4.0-dev.2023-12-01";
 
   /* eslint-disable local-rules/sort-imports */