@vuetify/nightly 3.3.11-dev.2023-08-07 → 3.3.11-dev.2023-08-09

package/dist/vuetify.css

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.3.11-dev.2023-08-07
+* Vuetify v3.3.11-dev.2023-08-09
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -19965,6 +19965,35 @@ html.overflow-y-hidden {
   flex: 0 1 auto;
   font-size: 12px;
   transition-duration: 150ms;
+}.v-divider {
+  display: block;
+  flex: 1 1 100%;
+  height: 0px;
+  max-height: 0px;
+  opacity: var(--v-border-opacity);
+  transition: inherit;
+  border-style: solid;
+  border-width: thin 0 0 0;
+}
+.v-divider--vertical {
+  align-self: stretch;
+  border-width: 0 thin 0 0;
+  display: inline-flex;
+  height: inherit;
+  margin-left: -1px;
+  max-height: 100%;
+  max-width: 0px;
+  vertical-align: text-bottom;
+  width: 0px;
+}
+.v-divider--inset:not(.v-divider--vertical) {
+  max-width: calc(100% - 72px);
+  margin-inline-start: 72px;
+}
+.v-divider--inset.v-divider--vertical {
+  margin-bottom: 8px;
+  margin-top: 8px;
+  max-height: calc(100% - 16px);
 }.v-dialog {
   align-items: center;
   justify-content: center;
@@ -20050,35 +20079,6 @@ html.overflow-y-hidden {
   -webkit-backface-visibility: hidden;
           backface-visibility: hidden;
   overflow-y: auto;
-}.v-divider {
-  display: block;
-  flex: 1 1 100%;
-  height: 0px;
-  max-height: 0px;
-  opacity: var(--v-border-opacity);
-  transition: inherit;
-  border-style: solid;
-  border-width: thin 0 0 0;
-}
-.v-divider--vertical {
-  align-self: stretch;
-  border-width: 0 thin 0 0;
-  display: inline-flex;
-  height: inherit;
-  margin-left: -1px;
-  max-height: 100%;
-  max-width: 0px;
-  vertical-align: text-bottom;
-  width: 0px;
-}
-.v-divider--inset:not(.v-divider--vertical) {
-  max-width: calc(100% - 72px);
-  margin-inline-start: 72px;
-}
-.v-divider--inset.v-divider--vertical {
-  margin-bottom: 8px;
-  margin-top: 8px;
-  max-height: calc(100% - 16px);
 }.v-expansion-panel {
   background-color: rgb(var(--v-theme-surface));
   color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
@@ -23909,6 +23909,11 @@ html.v-overlay-scroll-blocked {
   align-items: center;
   display: flex;
   margin-bottom: 0;
+}
+
+.v-color-picker-preview__eye-dropper {
+  position: relative;
+  margin-right: 12px;
 }.v-color-picker-swatches {
   overflow-y: auto;
 }

package/dist/vuetify.d.ts

@@ -13192,6 +13192,7 @@ declare const VImg: {
                 component?: vue.Component | undefined;
             }) | undefined;
             style?: vue.StyleValue | undefined;
+            draggable?: boolean | "false" | "true" | undefined;
             eager?: boolean | undefined;
             options?: IntersectionObserverInit | undefined;
             cover?: boolean | undefined;
@@ -13316,6 +13317,7 @@ declare const VImg: {
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
+            draggable?: boolean | "false" | "true" | undefined;
             class?: any;
             referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
             alt?: string | undefined;
@@ -13363,6 +13365,7 @@ declare const VImg: {
                 component?: vue.Component | undefined;
             });
             style: vue.StyleValue;
+            draggable: boolean | "false" | "true";
             eager: boolean;
             options: IntersectionObserverInit;
             cover: boolean;
@@ -13418,6 +13421,7 @@ declare const VImg: {
         maxWidth?: string | number | undefined;
         minHeight?: string | number | undefined;
         minWidth?: string | number | undefined;
+        draggable?: boolean | "false" | "true" | undefined;
         class?: any;
         referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
         alt?: string | undefined;
@@ -13477,6 +13481,7 @@ declare const VImg: {
     maxWidth?: string | number | undefined;
     minHeight?: string | number | undefined;
     minWidth?: string | number | undefined;
+    draggable?: boolean | "false" | "true" | undefined;
     class?: any;
     referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
     alt?: string | undefined;
@@ -13524,6 +13529,7 @@ declare const VImg: {
         component?: vue.Component | undefined;
     });
     style: vue.StyleValue;
+    draggable: boolean | "false" | "true";
     eager: boolean;
     options: IntersectionObserverInit;
     cover: boolean;
@@ -13565,6 +13571,10 @@ declare const VImg: {
     inline: BooleanConstructor;
     alt: StringConstructor;
     cover: BooleanConstructor;
+    draggable: {
+        type: PropType<boolean | "false" | "true">;
+        default: undefined;
+    };
     eager: BooleanConstructor;
     gradient: StringConstructor;
     lazySrc: StringConstructor;
@@ -13608,6 +13618,10 @@ declare const VImg: {
     inline: BooleanConstructor;
     alt: StringConstructor;
     cover: BooleanConstructor;
+    draggable: {
+        type: PropType<boolean | "false" | "true">;
+        default: undefined;
+    };
     eager: BooleanConstructor;
     gradient: StringConstructor;
     lazySrc: StringConstructor;
@@ -13638,6 +13652,7 @@ declare const VCarouselItem: {
             inline?: boolean | undefined;
             transition?: string | boolean | undefined;
             style?: vue.StyleValue | undefined;
+            draggable?: boolean | "false" | "true" | undefined;
             eager?: boolean | undefined;
             disabled?: boolean | undefined;
             options?: IntersectionObserverInit | undefined;
@@ -13763,6 +13778,7 @@ declare const VCarouselItem: {
             minWidth?: string | number | undefined;
             transition?: string | boolean | undefined;
             value?: any;
+            draggable?: boolean | "false" | "true" | undefined;
             class?: any;
             referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
             alt?: string | undefined;
@@ -13796,6 +13812,7 @@ declare const VCarouselItem: {
             inline: boolean;
             transition: string | boolean;
             style: vue.StyleValue;
+            draggable: boolean | "false" | "true";
             eager: boolean;
             disabled: boolean;
             options: IntersectionObserverInit;
@@ -13853,6 +13870,7 @@ declare const VCarouselItem: {
         minWidth?: string | number | undefined;
         transition?: string | boolean | undefined;
         value?: any;
+        draggable?: boolean | "false" | "true" | undefined;
         class?: any;
         referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
         alt?: string | undefined;
@@ -13904,6 +13922,7 @@ declare const VCarouselItem: {
     minWidth?: string | number | undefined;
     transition?: string | boolean | undefined;
     value?: any;
+    draggable?: boolean | "false" | "true" | undefined;
     class?: any;
     referrerpolicy?: "origin" | "same-origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
     alt?: string | undefined;
@@ -13937,6 +13956,7 @@ declare const VCarouselItem: {
     inline: boolean;
     transition: string | boolean;
     style: vue.StyleValue;
+    draggable: boolean | "false" | "true";
     eager: boolean;
     disabled: boolean;
     options: IntersectionObserverInit;
@@ -13985,6 +14005,10 @@ declare const VCarouselItem: {
     inline: BooleanConstructor;
     alt: StringConstructor;
     cover: BooleanConstructor;
+    draggable: {
+        type: vue.PropType<boolean | "false" | "true">;
+        default: undefined;
+    };
     gradient: StringConstructor;
     lazySrc: StringConstructor;
     options: {
@@ -14032,6 +14056,10 @@ declare const VCarouselItem: {
     inline: BooleanConstructor;
     alt: StringConstructor;
     cover: BooleanConstructor;
+    draggable: {
+        type: vue.PropType<boolean | "false" | "true">;
+        default: undefined;
+    };
     gradient: StringConstructor;
     lazySrc: StringConstructor;
     options: {
@@ -60227,8 +60255,8 @@ declare module '@vue/runtime-core' {
     VChipGroup: typeof import('vuetify/components')['VChipGroup']
     VCode: typeof import('vuetify/components')['VCode']
     VColorPicker: typeof import('vuetify/components')['VColorPicker']
-    VCounter: typeof import('vuetify/components')['VCounter']
     VCombobox: typeof import('vuetify/components')['VCombobox']
+    VCounter: typeof import('vuetify/components')['VCounter']
     VDialog: typeof import('vuetify/components')['VDialog']
     VDivider: typeof import('vuetify/components')['VDivider']
     VExpansionPanels: typeof import('vuetify/components')['VExpansionPanels']

package/dist/vuetify.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.3.11-dev.2023-08-07
+* Vuetify v3.3.11-dev.2023-08-09
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, watch, onScopeDispose, effectScope, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, readonly, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
+import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, watch, onScopeDispose, effectScope, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, readonly, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, vModelText } from 'vue';
 
 // Types
 // eslint-disable-line vue/prefer-import-from-vue
@@ -74,6 +74,7 @@ const makeComponentProps = propsFactory({
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
 const SUPPORTS_TOUCH = IN_BROWSER && ('ontouchstart' in window || window.navigator.maxTouchPoints > 0);
+const SUPPORTS_EYE_DROPPER = IN_BROWSER && 'EyeDropper' in window;
 
 function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
 function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
@@ -2962,6 +2963,10 @@ const Intersect = {
 const makeVImgProps = propsFactory({
   alt: String,
   cover: Boolean,
+  draggable: {
+    type: [Boolean, String],
+    default: undefined
+  },
   eager: Boolean,
   gradient: String,
   lazySrc: String,
@@ -3108,6 +3113,7 @@ const VImg = genericComponent()({
         "alt": props.alt,
         "crossorigin": props.crossorigin,
         "referrerpolicy": props.referrerpolicy,
+        "draggable": props.draggable,
         "sizes": props.sizes,
         "ref": image,
         "onLoad": onLoad,
@@ -3131,7 +3137,8 @@ const VImg = genericComponent()({
         "src": normalisedSrc.value.lazySrc,
         "alt": props.alt,
         "crossorigin": props.crossorigin,
-        "referrerpolicy": props.referrerpolicy
+        "referrerpolicy": props.referrerpolicy,
+        "draggable": props.draggable
       }, null)]
     });
     const __placeholder = () => {
@@ -4150,7 +4157,8 @@ const aliases = {
   file: 'mdi-paperclip',
   plus: 'mdi-plus',
   minus: 'mdi-minus',
-  calendar: 'mdi-calendar'
+  calendar: 'mdi-calendar',
+  eyeDropper: 'mdi-eyedropper'
 };
 const mdi = {
   // Not using mergeProps here, functional components merge props by default (?)
@@ -14145,12 +14153,36 @@ const VColorPickerPreview = defineComponent({
     let {
       emit
     } = _ref;
+    const abortController = new AbortController();
+    onUnmounted(() => abortController.abort());
+    async function openEyeDropper() {
+      if (!SUPPORTS_EYE_DROPPER) return;
+      const eyeDropper = new window.EyeDropper();
+      try {
+        const result = await eyeDropper.open({
+          signal: abortController.signal
+        });
+        const colorHexValue = HexToHSV(result.sRGBHex);
+        emit('update:color', {
+          ...(props.color ?? nullColor),
+          ...colorHexValue
+        });
+      } catch (e) {}
+    }
     useRender(() => createVNode("div", {
       "class": ['v-color-picker-preview', {
         'v-color-picker-preview--hide-alpha': props.hideAlpha
       }, props.class],
       "style": props.style
-    }, [createVNode("div", {
+    }, [SUPPORTS_EYE_DROPPER && createVNode("div", {
+      "class": "v-color-picker-preview__eye-dropper",
+      "key": "eyeDropper"
+    }, [createVNode(VBtn, {
+      "onClick": openEyeDropper,
+      "icon": "$eyeDropper",
+      "variant": "plain",
+      "density": "comfortable"
+    }, null)]), createVNode("div", {
       "class": "v-color-picker-preview__dot"
     }, [createVNode("div", {
       "style": {
@@ -20308,7 +20340,7 @@ function createVuetify$1() {
     date
   };
 }
-const version$1 = "3.3.11-dev.2023-08-07";
+const version$1 = "3.3.11-dev.2023-08-09";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -20333,7 +20365,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.3.11-dev.2023-08-07";
+const version = "3.3.11-dev.2023-08-09";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDefaults, useDisplay, useLayout, useLocale, useRtl, useTheme, version };