@dimailn/vuetify 2.7.2-alpha2 → 2.7.2-superbundle2

package/es5/components/VColorPicker/VColorPickerCanvas.js

@@ -5,17 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _vue = require("vue");
-
 require("../../../src/components/VColorPicker/VColorPickerCanvas.sass");
 
 var _helpers = require("../../util/helpers");
 
 var _util = require("./util");
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+var _vue = _interopRequireDefault(require("vue"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _default2 = (0, _vue.defineComponent)({
+// Styles
+// Helpers
+// Types
+var _default2 = _vue.default.extend({
   name: 'v-color-picker-canvas',
   props: {
     color: {
@@ -126,7 +129,7 @@ var _default2 = (0, _vue.defineComponent)({
       window.removeEventListener('mouseup', this.handleMouseUp);
     },
     genCanvas: function genCanvas() {
-      return (0, _vue.h)('canvas', {
+      return this.$createElement('canvas', {
         ref: 'canvas',
         attrs: {
           width: this.width,
@@ -135,25 +138,25 @@ var _default2 = (0, _vue.defineComponent)({
       });
     },
     genDot: function genDot() {
-      var _h;
-
       var radius = parseInt(this.dotSize, 10) / 2;
       var x = (0, _helpers.convertToUnit)(this.dot.x - radius);
       var y = (0, _helpers.convertToUnit)(this.dot.y - radius);
-      return (0, _vue.h)('div', (_h = {
-        class: 'v-color-picker__canvas-dot'
-      }, _defineProperty(_h, "class", {
-        'v-color-picker__canvas-dot--disabled': this.disabled
-      }), _defineProperty(_h, "style", {
-        width: (0, _helpers.convertToUnit)(this.dotSize),
-        height: (0, _helpers.convertToUnit)(this.dotSize),
-        transform: "translate(".concat(x, ", ").concat(y, ")")
-      }), _h));
+      return this.$createElement('div', {
+        staticClass: 'v-color-picker__canvas-dot',
+        class: {
+          'v-color-picker__canvas-dot--disabled': this.disabled
+        },
+        style: {
+          width: (0, _helpers.convertToUnit)(this.dotSize),
+          height: (0, _helpers.convertToUnit)(this.dotSize),
+          transform: "translate(".concat(x, ", ").concat(y, ")")
+        }
+      });
     }
   },
-  render: function render() {
-    return (0, _vue.h)('div', {
-      class: 'v-color-picker__canvas',
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'v-color-picker__canvas',
       style: {
         width: (0, _helpers.convertToUnit)(this.width),
         height: (0, _helpers.convertToUnit)(this.height)

package/es5/components/VColorPicker/VColorPickerCanvas.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerCanvas.ts"],"names":[],"mappings":"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","sourcesContent":["import {h} from 'vue'\n// Styles\nimport './VColorPickerCanvas.sass'\n\n// Helpers\nimport { clamp, convertToUnit } from '../../util/helpers'\nimport { fromHSVA, VColorPickerColor, fromRGBA } from './util'\n\n// Types\nimport { defineComponent, VNode, PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'v-color-picker-canvas',\n\n  props: {\n    color: {\n      type: Object as PropType<VColorPickerColor>,\n      default: () => fromRGBA({ r: 255, g: 0, b: 0, a: 1 }),\n    },\n    disabled: Boolean,\n    dotSize: {\n      type: [Number, String],\n      default: 10,\n    },\n    height: {\n      type: [Number, String],\n      default: 150,\n    },\n    width: {\n      type: [Number, String],\n      default: 300,\n    },\n  },\n\n  data () {\n    return {\n      boundingRect: {\n        width: 0,\n        height: 0,\n        left: 0,\n        top: 0,\n      } as ClientRect,\n    }\n  },\n\n  computed: {\n    dot (): { x: number, y: number} {\n      if (!this.color) return { x: 0, y: 0 }\n\n      return {\n        x: this.color.hsva.s * parseInt(this.width, 10),\n        y: (1 - this.color.hsva.v) * parseInt(this.height, 10),\n      }\n    },\n  },\n\n  watch: {\n    'color.hue': 'updateCanvas',\n  },\n\n  mounted () {\n    this.updateCanvas()\n  },\n\n  methods: {\n    emitColor (x: number, y: number) {\n      const { left, top, width, height } = this.boundingRect\n\n      this.$emit('update:color', fromHSVA({\n        h: this.color.hue,\n        s: clamp(x - left, 0, width) / width,\n        v: 1 - clamp(y - top, 0, height) / height,\n        a: this.color.alpha,\n      }))\n    },\n    updateCanvas () {\n      if (!this.color) return\n\n      const canvas = this.$refs.canvas as HTMLCanvasElement\n      const ctx = canvas.getContext('2d')\n\n      if (!ctx) return\n\n      const saturationGradient = ctx.createLinearGradient(0, 0, canvas.width, 0)\n      saturationGradient.addColorStop(0, 'hsla(0, 0%, 100%, 1)') // white\n      saturationGradient.addColorStop(1, `hsla(${this.color.hue}, 100%, 50%, 1)`)\n      ctx.fillStyle = saturationGradient\n      ctx.fillRect(0, 0, canvas.width, canvas.height)\n\n      const valueGradient = ctx.createLinearGradient(0, 0, 0, canvas.height)\n      valueGradient.addColorStop(0, 'hsla(0, 0%, 100%, 0)') // transparent\n      valueGradient.addColorStop(1, 'hsla(0, 0%, 0%, 1)') // black\n      ctx.fillStyle = valueGradient\n      ctx.fillRect(0, 0, canvas.width, canvas.height)\n    },\n    handleClick (e: MouseEvent) {\n      if (this.disabled) return\n\n      this.boundingRect = this.$el.getBoundingClientRect()\n      this.emitColor(e.clientX, e.clientY)\n    },\n    handleMouseDown (e: MouseEvent) {\n      // To prevent selection while moving cursor\n      e.preventDefault()\n\n      if (this.disabled) return\n\n      this.boundingRect = this.$el.getBoundingClientRect()\n\n      window.addEventListener('mousemove', this.handleMouseMove)\n      window.addEventListener('mouseup', this.handleMouseUp)\n    },\n    handleMouseMove (e: MouseEvent) {\n      if (this.disabled) return\n\n      this.emitColor(e.clientX, e.clientY)\n    },\n    handleMouseUp () {\n      window.removeEventListener('mousemove', this.handleMouseMove)\n      window.removeEventListener('mouseup', this.handleMouseUp)\n    },\n    genCanvas (): VNode {\n      return h('canvas', {\n        ref: 'canvas',\n        attrs: {\n          width: this.width,\n          height: this.height,\n        },\n      })\n    },\n    genDot (): VNode {\n      const radius = parseInt(this.dotSize, 10) / 2\n      const x = convertToUnit(this.dot.x - radius)\n      const y = convertToUnit(this.dot.y - radius)\n\n      return h('div', {\n        class: 'v-color-picker__canvas-dot',\n        class: {\n          'v-color-picker__canvas-dot--disabled': this.disabled,\n        },\n        style: {\n          width: convertToUnit(this.dotSize),\n          height: convertToUnit(this.dotSize),\n          transform: `translate(${x}, ${y})`,\n        },\n      })\n    },\n  },\n\n  render (): VNode {\n    return h('div', {\n      class: 'v-color-picker__canvas',\n      style: {\n        width: convertToUnit(this.width),\n        height: convertToUnit(this.height),\n      },\n      on: {\n        click: this.handleClick,\n        mousedown: this.handleMouseDown,\n      },\n    }, [\n      this.genCanvas(),\n      this.genDot(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerCanvas.js"}
+{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerCanvas.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './VColorPickerCanvas.sass'\n\n// Helpers\nimport { clamp, convertToUnit } from '../../util/helpers'\nimport { fromHSVA, VColorPickerColor, fromRGBA } from './util'\n\n// Types\nimport Vue, { VNode, PropType } from 'vue'\n\nexport default Vue.extend({\n  name: 'v-color-picker-canvas',\n\n  props: {\n    color: {\n      type: Object as PropType<VColorPickerColor>,\n      default: () => fromRGBA({ r: 255, g: 0, b: 0, a: 1 }),\n    },\n    disabled: Boolean,\n    dotSize: {\n      type: [Number, String],\n      default: 10,\n    },\n    height: {\n      type: [Number, String],\n      default: 150,\n    },\n    width: {\n      type: [Number, String],\n      default: 300,\n    },\n  },\n\n  data () {\n    return {\n      boundingRect: {\n        width: 0,\n        height: 0,\n        left: 0,\n        top: 0,\n      } as ClientRect,\n    }\n  },\n\n  computed: {\n    dot (): { x: number, y: number} {\n      if (!this.color) return { x: 0, y: 0 }\n\n      return {\n        x: this.color.hsva.s * parseInt(this.width, 10),\n        y: (1 - this.color.hsva.v) * parseInt(this.height, 10),\n      }\n    },\n  },\n\n  watch: {\n    'color.hue': 'updateCanvas',\n  },\n\n  mounted () {\n    this.updateCanvas()\n  },\n\n  methods: {\n    emitColor (x: number, y: number) {\n      const { left, top, width, height } = this.boundingRect\n\n      this.$emit('update:color', fromHSVA({\n        h: this.color.hue,\n        s: clamp(x - left, 0, width) / width,\n        v: 1 - clamp(y - top, 0, height) / height,\n        a: this.color.alpha,\n      }))\n    },\n    updateCanvas () {\n      if (!this.color) return\n\n      const canvas = this.$refs.canvas as HTMLCanvasElement\n      const ctx = canvas.getContext('2d')\n\n      if (!ctx) return\n\n      const saturationGradient = ctx.createLinearGradient(0, 0, canvas.width, 0)\n      saturationGradient.addColorStop(0, 'hsla(0, 0%, 100%, 1)') // white\n      saturationGradient.addColorStop(1, `hsla(${this.color.hue}, 100%, 50%, 1)`)\n      ctx.fillStyle = saturationGradient\n      ctx.fillRect(0, 0, canvas.width, canvas.height)\n\n      const valueGradient = ctx.createLinearGradient(0, 0, 0, canvas.height)\n      valueGradient.addColorStop(0, 'hsla(0, 0%, 100%, 0)') // transparent\n      valueGradient.addColorStop(1, 'hsla(0, 0%, 0%, 1)') // black\n      ctx.fillStyle = valueGradient\n      ctx.fillRect(0, 0, canvas.width, canvas.height)\n    },\n    handleClick (e: MouseEvent) {\n      if (this.disabled) return\n\n      this.boundingRect = this.$el.getBoundingClientRect()\n      this.emitColor(e.clientX, e.clientY)\n    },\n    handleMouseDown (e: MouseEvent) {\n      // To prevent selection while moving cursor\n      e.preventDefault()\n\n      if (this.disabled) return\n\n      this.boundingRect = this.$el.getBoundingClientRect()\n\n      window.addEventListener('mousemove', this.handleMouseMove)\n      window.addEventListener('mouseup', this.handleMouseUp)\n    },\n    handleMouseMove (e: MouseEvent) {\n      if (this.disabled) return\n\n      this.emitColor(e.clientX, e.clientY)\n    },\n    handleMouseUp () {\n      window.removeEventListener('mousemove', this.handleMouseMove)\n      window.removeEventListener('mouseup', this.handleMouseUp)\n    },\n    genCanvas (): VNode {\n      return this.$createElement('canvas', {\n        ref: 'canvas',\n        attrs: {\n          width: this.width,\n          height: this.height,\n        },\n      })\n    },\n    genDot (): VNode {\n      const radius = parseInt(this.dotSize, 10) / 2\n      const x = convertToUnit(this.dot.x - radius)\n      const y = convertToUnit(this.dot.y - radius)\n\n      return this.$createElement('div', {\n        staticClass: 'v-color-picker__canvas-dot',\n        class: {\n          'v-color-picker__canvas-dot--disabled': this.disabled,\n        },\n        style: {\n          width: convertToUnit(this.dotSize),\n          height: convertToUnit(this.dotSize),\n          transform: `translate(${x}, ${y})`,\n        },\n      })\n    },\n  },\n\n  render (h): VNode {\n    return h('div', {\n      staticClass: 'v-color-picker__canvas',\n      style: {\n        width: convertToUnit(this.width),\n        height: convertToUnit(this.height),\n      },\n      on: {\n        click: this.handleClick,\n        mousedown: this.handleMouseDown,\n      },\n    }, [\n      this.genCanvas(),\n      this.genDot(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerCanvas.js"}

package/es5/components/VColorPicker/VColorPickerEdit.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.modes = void 0;
 
-var _vue = require("vue");
-
 require("../../../src/components/VColorPicker/VColorPickerEdit.sass");
 
 var _VBtn = _interopRequireDefault(require("../VBtn"));
@@ -15,10 +13,14 @@ var _VIcon = _interopRequireDefault(require("../VIcon"));
 
 var _colorUtils = require("../../util/colorUtils");
 
+var _vue = _interopRequireDefault(require("vue"));
+
 var _util = require("./util");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -31,12 +33,6 @@ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var modes = {
   rgba: {
     inputs: [['r', 255, 'int'], ['g', 255, 'int'], ['b', 255, 'int'], ['a', 1, 'float']],
@@ -52,7 +48,7 @@ var modes = {
 };
 exports.modes = modes;
 
-var _default = (0, _vue.defineComponent)({
+var _default = _vue.default.extend({
   name: 'v-color-picker-edit',
   props: {
     color: Object,
@@ -101,13 +97,16 @@ var _default = (0, _vue.defineComponent)({
       this.$emit('update:mode', newMode);
     },
     genInput: function genInput(target, attrs, value, on) {
-      return (0, _vue.h)('div', {
-        class: 'v-color-picker__input'
-      }, [(0, _vue.h)('input', _objectSpread(_objectSpread({
-        key: target
-      }, attrs), {}, {
-        value: value
-      }, on)), (0, _vue.h)('span', target.toUpperCase())]);
+      return this.$createElement('div', {
+        staticClass: 'v-color-picker__input'
+      }, [this.$createElement('input', {
+        key: target,
+        attrs: attrs,
+        domProps: {
+          value: value
+        },
+        on: on
+      }), this.$createElement('span', target.toUpperCase())]);
     },
     genInputs: function genInputs() {
       var _this = this;
@@ -153,17 +152,21 @@ var _default = (0, _vue.defineComponent)({
       }
     },
     genSwitch: function genSwitch() {
-      return (0, _vue.h)(_VBtn.default, {
-        small: true,
-        icon: true,
-        disabled: this.disabled,
-        onClick: this.changeMode
-      }, [(0, _vue.h)(_VIcon.default, '$unfold')]);
+      return this.$createElement(_VBtn.default, {
+        props: {
+          small: true,
+          icon: true,
+          disabled: this.disabled
+        },
+        on: {
+          click: this.changeMode
+        }
+      }, [this.$createElement(_VIcon.default, '$unfold')]);
     }
   },
-  render: function render() {
-    return (0, _vue.h)('div', {
-      class: 'v-color-picker__edit'
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'v-color-picker__edit'
     }, [this.genInputs(), !this.hideModeSwitch && this.genSwitch()]);
   }
 });

package/es5/components/VColorPicker/VColorPickerEdit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerEdit.ts"],"names":[],"mappings":"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","sourcesContent":["import {h} from 'vue'\n// Styles\nimport './VColorPickerEdit.sass'\n\n// Components\nimport VBtn from '../VBtn'\nimport VIcon from '../VIcon'\n\n// Helpers\nimport { parseHex } from '../../util/colorUtils'\n\n// Types\nimport { defineComponent, VNode, PropType } from 'vue'\nimport { VColorPickerColor, fromRGBA, fromHexa, fromHSLA } from './util'\n\ntype Input = [string, number, string]\n\nexport type Mode = {\n  inputs?: Input[]\n  from: Function\n}\n\nexport const modes = {\n  rgba: {\n    inputs: [\n      ['r', 255, 'int'],\n      ['g', 255, 'int'],\n      ['b', 255, 'int'],\n      ['a', 1, 'float'],\n    ],\n    from: fromRGBA,\n  },\n  hsla: {\n    inputs: [\n      ['h', 360, 'int'],\n      ['s', 1, 'float'],\n      ['l', 1, 'float'],\n      ['a', 1, 'float'],\n    ],\n    from: fromHSLA,\n  },\n  hexa: {\n    from: fromHexa,\n  },\n} as { [key: string]: Mode }\n\nexport default defineComponent({\n  name: 'v-color-picker-edit',\n\n  props: {\n    color: Object as PropType<VColorPickerColor>,\n    disabled: Boolean,\n    hideAlpha: Boolean,\n    hideModeSwitch: Boolean,\n    mode: {\n      type: String,\n      default: 'rgba',\n      validator: (v: string) => Object.keys(modes).includes(v),\n    },\n  },\n\n  data () {\n    return {\n      modes,\n      internalMode: this.mode,\n    }\n  },\n\n  computed: {\n    currentMode (): Mode {\n      return this.modes[this.internalMode]\n    },\n  },\n\n  watch: {\n    mode (mode) {\n      this.internalMode = mode\n    },\n  },\n\n  created () {\n    this.internalMode = this.mode\n  },\n\n  methods: {\n    getValue (v: any, type: string) {\n      if (type === 'float') return Math.round(v * 100) / 100\n      else if (type === 'int') return Math.round(v)\n      else return 0\n    },\n    parseValue (v: string, type: string) {\n      if (type === 'float') return parseFloat(v)\n      else if (type === 'int') return parseInt(v, 10) || 0\n      else return 0\n    },\n    changeMode () {\n      const modes = Object.keys(this.modes)\n      const index = modes.indexOf(this.internalMode)\n      const newMode = modes[(index + 1) % modes.length]\n      this.internalMode = newMode\n      this.$emit('update:mode', newMode)\n    },\n    genInput (target: string, attrs: any, value: any, on: any): VNode {\n      return h('div', {\n        class: 'v-color-picker__input',\n      }, [\n        h('input', {\n          key: target,\n          ...attrs,\n          value,\n          ...on,\n        }),\n        h('span', target.toUpperCase()),\n      ])\n    },\n    genInputs (): VNode[] | VNode {\n      if (this.internalMode === 'hexa') {\n        const hex = this.color.hexa\n        const value = this.hideAlpha && hex.endsWith('FF') ? hex.substr(0, 7) : hex\n        return this.genInput(\n          'hex',\n          {\n            maxlength: this.hideAlpha ? 7 : 9,\n            disabled: this.disabled,\n          },\n          value,\n          {\n            change: (e: Event) => {\n              const el = e.target as HTMLInputElement\n              this.$emit('update:color', this.currentMode.from(parseHex(el.value)))\n            },\n          }\n        )\n      } else {\n        const inputs = this.hideAlpha ? this.currentMode.inputs!.slice(0, -1) : this.currentMode.inputs!\n        return inputs.map(([target, max, type]) => {\n          const value = this.color[this.internalMode as keyof VColorPickerColor] as any\n          return this.genInput(\n            target,\n            {\n              type: 'number',\n              min: 0,\n              max,\n              step: type === 'float' ? '0.01' : type === 'int' ? '1' : undefined,\n              disabled: this.disabled,\n            },\n            this.getValue(value[target], type),\n            {\n              input: (e: Event) => {\n                const el = e.target as HTMLInputElement\n                const newVal = this.parseValue(el.value || '0', type)\n\n                this.$emit('update:color', this.currentMode.from(\n                  Object.assign({}, value, { [target]: newVal }),\n                  this.color.alpha\n                ))\n              },\n            }\n          )\n        })\n      }\n    },\n    genSwitch (): VNode {\n      return h(VBtn, {\n        small: true,\n        icon: true,\n        disabled: this.disabled,\n        onClick: this.changeMode,\n      }, [\n        h(VIcon, '$unfold'),\n      ])\n    },\n  },\n\n  render (): VNode {\n    return h('div', {\n      class: 'v-color-picker__edit',\n    }, [\n      this.genInputs(),\n      !this.hideModeSwitch && this.genSwitch(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerEdit.js"}
+{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerEdit.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './VColorPickerEdit.sass'\n\n// Components\nimport VBtn from '../VBtn'\nimport VIcon from '../VIcon'\n\n// Helpers\nimport { parseHex } from '../../util/colorUtils'\n\n// Types\nimport Vue, { VNode, PropType } from 'vue'\nimport { VColorPickerColor, fromRGBA, fromHexa, fromHSLA } from './util'\n\ntype Input = [string, number, string]\n\nexport type Mode = {\n  inputs?: Input[]\n  from: Function\n}\n\nexport const modes = {\n  rgba: {\n    inputs: [\n      ['r', 255, 'int'],\n      ['g', 255, 'int'],\n      ['b', 255, 'int'],\n      ['a', 1, 'float'],\n    ],\n    from: fromRGBA,\n  },\n  hsla: {\n    inputs: [\n      ['h', 360, 'int'],\n      ['s', 1, 'float'],\n      ['l', 1, 'float'],\n      ['a', 1, 'float'],\n    ],\n    from: fromHSLA,\n  },\n  hexa: {\n    from: fromHexa,\n  },\n} as { [key: string]: Mode }\n\nexport default Vue.extend({\n  name: 'v-color-picker-edit',\n\n  props: {\n    color: Object as PropType<VColorPickerColor>,\n    disabled: Boolean,\n    hideAlpha: Boolean,\n    hideModeSwitch: Boolean,\n    mode: {\n      type: String,\n      default: 'rgba',\n      validator: (v: string) => Object.keys(modes).includes(v),\n    },\n  },\n\n  data () {\n    return {\n      modes,\n      internalMode: this.mode,\n    }\n  },\n\n  computed: {\n    currentMode (): Mode {\n      return this.modes[this.internalMode]\n    },\n  },\n\n  watch: {\n    mode (mode) {\n      this.internalMode = mode\n    },\n  },\n\n  created () {\n    this.internalMode = this.mode\n  },\n\n  methods: {\n    getValue (v: any, type: string) {\n      if (type === 'float') return Math.round(v * 100) / 100\n      else if (type === 'int') return Math.round(v)\n      else return 0\n    },\n    parseValue (v: string, type: string) {\n      if (type === 'float') return parseFloat(v)\n      else if (type === 'int') return parseInt(v, 10) || 0\n      else return 0\n    },\n    changeMode () {\n      const modes = Object.keys(this.modes)\n      const index = modes.indexOf(this.internalMode)\n      const newMode = modes[(index + 1) % modes.length]\n      this.internalMode = newMode\n      this.$emit('update:mode', newMode)\n    },\n    genInput (target: string, attrs: any, value: any, on: any): VNode {\n      return this.$createElement('div', {\n        staticClass: 'v-color-picker__input',\n      }, [\n        this.$createElement('input', {\n          key: target,\n          attrs,\n          domProps: {\n            value,\n          },\n          on,\n        }),\n        this.$createElement('span', target.toUpperCase()),\n      ])\n    },\n    genInputs (): VNode[] | VNode {\n      if (this.internalMode === 'hexa') {\n        const hex = this.color.hexa\n        const value = this.hideAlpha && hex.endsWith('FF') ? hex.substr(0, 7) : hex\n        return this.genInput(\n          'hex',\n          {\n            maxlength: this.hideAlpha ? 7 : 9,\n            disabled: this.disabled,\n          },\n          value,\n          {\n            change: (e: Event) => {\n              const el = e.target as HTMLInputElement\n              this.$emit('update:color', this.currentMode.from(parseHex(el.value)))\n            },\n          }\n        )\n      } else {\n        const inputs = this.hideAlpha ? this.currentMode.inputs!.slice(0, -1) : this.currentMode.inputs!\n        return inputs.map(([target, max, type]) => {\n          const value = this.color[this.internalMode as keyof VColorPickerColor] as any\n          return this.genInput(\n            target,\n            {\n              type: 'number',\n              min: 0,\n              max,\n              step: type === 'float' ? '0.01' : type === 'int' ? '1' : undefined,\n              disabled: this.disabled,\n            },\n            this.getValue(value[target], type),\n            {\n              input: (e: Event) => {\n                const el = e.target as HTMLInputElement\n                const newVal = this.parseValue(el.value || '0', type)\n\n                this.$emit('update:color', this.currentMode.from(\n                  Object.assign({}, value, { [target]: newVal }),\n                  this.color.alpha\n                ))\n              },\n            }\n          )\n        })\n      }\n    },\n    genSwitch (): VNode {\n      return this.$createElement(VBtn, {\n        props: {\n          small: true,\n          icon: true,\n          disabled: this.disabled,\n        },\n        on: {\n          click: this.changeMode,\n        },\n      }, [\n        this.$createElement(VIcon, '$unfold'),\n      ])\n    },\n  },\n\n  render (h): VNode {\n    return h('div', {\n      staticClass: 'v-color-picker__edit',\n    }, [\n      this.genInputs(),\n      !this.hideModeSwitch && this.genSwitch(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerEdit.js"}

package/es5/components/VColorPicker/VColorPickerPreview.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _vue = require("vue");
-
 require("../../../src/components/VColorPicker/VColorPickerPreview.sass");
 
 var _VSlider = _interopRequireDefault(require("../VSlider/VSlider"));
 
 var _colorUtils = require("../../util/colorUtils");
 
+var _vue = _interopRequireDefault(require("vue"));
+
 var _util = require("./util");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -23,7 +23,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-var _default = (0, _vue.defineComponent)({
+var _default = _vue.default.extend({
   name: 'v-color-picker-preview',
   props: {
     color: Object,
@@ -35,32 +35,36 @@ var _default = (0, _vue.defineComponent)({
       var _this = this;
 
       return this.genTrack({
-        class: 'v-color-picker__alpha',
-        thumbColor: 'grey lighten-2',
-        hideDetails: true,
-        value: this.color.alpha,
-        step: 0,
-        min: 0,
-        max: 1,
+        staticClass: 'v-color-picker__alpha',
+        props: {
+          thumbColor: 'grey lighten-2',
+          hideDetails: true,
+          value: this.color.alpha,
+          step: 0,
+          min: 0,
+          max: 1
+        },
         style: {
           backgroundImage: this.disabled ? undefined : "linear-gradient(to ".concat(this.$vuetify.rtl ? 'left' : 'right', ", transparent, ").concat((0, _colorUtils.RGBtoCSS)(this.color.rgba), ")")
         },
-        onInput: function onInput(val) {
-          return _this.color.alpha !== val && _this.$emit('update:color', (0, _util.fromHSVA)(_objectSpread(_objectSpread({}, _this.color.hsva), {}, {
-            a: val
-          })));
+        on: {
+          input: function input(val) {
+            return _this.color.alpha !== val && _this.$emit('update:color', (0, _util.fromHSVA)(_objectSpread(_objectSpread({}, _this.color.hsva), {}, {
+              a: val
+            })));
+          }
         }
       });
     },
     genSliders: function genSliders() {
-      return (0, _vue.h)('div', {
-        class: 'v-color-picker__sliders'
+      return this.$createElement('div', {
+        staticClass: 'v-color-picker__sliders'
       }, [this.genHue(), !this.hideAlpha && this.genAlpha()]);
     },
     genDot: function genDot() {
-      return (0, _vue.h)('div', {
-        class: 'v-color-picker__dot'
-      }, [(0, _vue.h)('div', {
+      return this.$createElement('div', {
+        staticClass: 'v-color-picker__dot'
+      }, [this.$createElement('div', {
         style: {
           background: (0, _colorUtils.RGBAtoCSS)(this.color.rgba)
         }
@@ -70,33 +74,40 @@ var _default = (0, _vue.defineComponent)({
       var _this2 = this;
 
       return this.genTrack({
-        class: 'v-color-picker__hue',
-        thumbColor: 'grey lighten-2',
-        hideDetails: true,
-        value: this.color.hue,
-        step: 0,
-        min: 0,
-        max: 360,
-        onInput: function onInput(val) {
-          return _this2.color.hue !== val && _this2.$emit('update:color', (0, _util.fromHSVA)(_objectSpread(_objectSpread({}, _this2.color.hsva), {}, {
-            h: val
-          })));
+        staticClass: 'v-color-picker__hue',
+        props: {
+          thumbColor: 'grey lighten-2',
+          hideDetails: true,
+          value: this.color.hue,
+          step: 0,
+          min: 0,
+          max: 360
+        },
+        on: {
+          input: function input(val) {
+            return _this2.color.hue !== val && _this2.$emit('update:color', (0, _util.fromHSVA)(_objectSpread(_objectSpread({}, _this2.color.hsva), {}, {
+              h: val
+            })));
+          }
         }
       });
     },
     genTrack: function genTrack(options) {
-      return (0, _vue.h)(_VSlider.default, _objectSpread(_objectSpread({
+      return this.$createElement(_VSlider.default, _objectSpread(_objectSpread({
         class: 'v-color-picker__track'
       }, options), {}, {
-        disabled: this.disabled
-      }, options.props));
+        props: _objectSpread({
+          disabled: this.disabled
+        }, options.props)
+      }));
     }
   },
-  render: function render() {
-    return (0, _vue.h)('div', {
-      class: ['v-color-picker__preview', {
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'v-color-picker__preview',
+      class: {
         'v-color-picker__preview--hide-alpha': this.hideAlpha
-      }]
+      }
     }, [this.genDot(), this.genSliders()]);
   }
 });

package/es5/components/VColorPicker/VColorPickerPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerPreview.ts"],"names":[],"mappings":"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","sourcesContent":["import {h} from 'vue'\n// Styles\nimport './VColorPickerPreview.sass'\n\n// Components\nimport VSlider from '../VSlider/VSlider'\n\n// Utilities\nimport { RGBtoCSS, RGBAtoCSS } from '../../util/colorUtils'\n\n// Types\nimport { defineComponent, VNode, VNodeData, PropType } from 'vue'\nimport { VColorPickerColor, fromHSVA } from './util'\n\nexport default defineComponent({\n  name: 'v-color-picker-preview',\n\n  props: {\n    color: Object as PropType<VColorPickerColor>,\n    disabled: Boolean,\n    hideAlpha: Boolean,\n  },\n\n  methods: {\n    genAlpha (): VNode {\n      return this.genTrack({\n        class: 'v-color-picker__alpha',\n        thumbColor: 'grey lighten-2',\n        hideDetails: true,\n        value: this.color.alpha,\n        step: 0,\n        min: 0,\n        max: 1,\n        style: {\n          backgroundImage: this.disabled\n            ? undefined\n            : `linear-gradient(to ${this.$vuetify.rtl ? 'left' : 'right'}, transparent, ${RGBtoCSS(this.color.rgba)})`,\n        },\n        onInput: (val: number) => this.color.alpha !== val && this.$emit('update:color', fromHSVA({ ...this.color.hsva, a: val })),\n      })\n    },\n    genSliders (): VNode {\n      return h('div', {\n        class: 'v-color-picker__sliders',\n      }, [\n        this.genHue(),\n        !this.hideAlpha && this.genAlpha(),\n      ])\n    },\n    genDot (): VNode {\n      return h('div', {\n        class: 'v-color-picker__dot',\n      }, [\n        h('div', {\n          style: {\n            background: RGBAtoCSS(this.color.rgba),\n          },\n        }),\n      ])\n    },\n    genHue (): VNode {\n      return this.genTrack({\n        class: 'v-color-picker__hue',\n        thumbColor: 'grey lighten-2',\n        hideDetails: true,\n        value: this.color.hue,\n        step: 0,\n        min: 0,\n        max: 360,\n        onInput: (val: number) => this.color.hue !== val && this.$emit('update:color', fromHSVA({ ...this.color.hsva, h: val })),\n      })\n    },\n    genTrack (options: VNodeData): VNode {\n      return h(VSlider, {\n        class: 'v-color-picker__track',\n        ...options,\n        disabled: this.disabled,\n        ...options.props\n      })\n    },\n  },\n\n  render (): VNode {\n    return h('div', {\n      class: ['v-color-picker__preview', {\n        'v-color-picker__preview--hide-alpha': this.hideAlpha,\n      }],\n    }, [\n      this.genDot(),\n      this.genSliders(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerPreview.js"}
+{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerPreview.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './VColorPickerPreview.sass'\n\n// Components\nimport VSlider from '../VSlider/VSlider'\n\n// Utilities\nimport { RGBtoCSS, RGBAtoCSS } from '../../util/colorUtils'\n\n// Types\nimport Vue, { VNode, VNodeData, PropType } from 'vue'\nimport { VColorPickerColor, fromHSVA } from './util'\n\nexport default Vue.extend({\n  name: 'v-color-picker-preview',\n\n  props: {\n    color: Object as PropType<VColorPickerColor>,\n    disabled: Boolean,\n    hideAlpha: Boolean,\n  },\n\n  methods: {\n    genAlpha (): VNode {\n      return this.genTrack({\n        staticClass: 'v-color-picker__alpha',\n        props: {\n          thumbColor: 'grey lighten-2',\n          hideDetails: true,\n          value: this.color.alpha,\n          step: 0,\n          min: 0,\n          max: 1,\n        },\n        style: {\n          backgroundImage: this.disabled\n            ? undefined\n            : `linear-gradient(to ${this.$vuetify.rtl ? 'left' : 'right'}, transparent, ${RGBtoCSS(this.color.rgba)})`,\n        },\n        on: {\n          input: (val: number) => this.color.alpha !== val && this.$emit('update:color', fromHSVA({ ...this.color.hsva, a: val })),\n        },\n      })\n    },\n    genSliders (): VNode {\n      return this.$createElement('div', {\n        staticClass: 'v-color-picker__sliders',\n      }, [\n        this.genHue(),\n        !this.hideAlpha && this.genAlpha(),\n      ])\n    },\n    genDot (): VNode {\n      return this.$createElement('div', {\n        staticClass: 'v-color-picker__dot',\n      }, [\n        this.$createElement('div', {\n          style: {\n            background: RGBAtoCSS(this.color.rgba),\n          },\n        }),\n      ])\n    },\n    genHue (): VNode {\n      return this.genTrack({\n        staticClass: 'v-color-picker__hue',\n        props: {\n          thumbColor: 'grey lighten-2',\n          hideDetails: true,\n          value: this.color.hue,\n          step: 0,\n          min: 0,\n          max: 360,\n        },\n        on: {\n          input: (val: number) => this.color.hue !== val && this.$emit('update:color', fromHSVA({ ...this.color.hsva, h: val })),\n        },\n      })\n    },\n    genTrack (options: VNodeData): VNode {\n      return this.$createElement(VSlider, {\n        class: 'v-color-picker__track',\n        ...options,\n        props: {\n          disabled: this.disabled,\n          ...options.props,\n        },\n      })\n    },\n  },\n\n  render (h): VNode {\n    return h('div', {\n      staticClass: 'v-color-picker__preview',\n      class: {\n        'v-color-picker__preview--hide-alpha': this.hideAlpha,\n      },\n    }, [\n      this.genDot(),\n      this.genSliders(),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerPreview.js"}

package/es5/components/VColorPicker/VColorPickerSwatches.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _vue = require("vue");
-
 require("../../../src/components/VColorPicker/VColorPickerSwatches.sass");
 
 var _VIcon = _interopRequireDefault(require("../VIcon"));
@@ -56,17 +54,19 @@ var _default2 = (0, _mixins.default)(_themeable.default).extend({
     genColor: function genColor(color) {
       var _this = this;
 
-      var content = (0, _vue.h)('div', {
+      var content = this.$createElement('div', {
         style: {
           background: color
         }
-      }, [(0, _helpers.deepEqual)(this.color, (0, _util.parseColor)(color, null)) && (0, _vue.h)(_VIcon.default, {
-        small: true,
-        dark: (0, _colorUtils.contrastRatio)(this.color.rgba, white) > 2 && this.color.alpha > 0.5,
-        light: (0, _colorUtils.contrastRatio)(this.color.rgba, black) > 2 && this.color.alpha > 0.5
+      }, [(0, _helpers.deepEqual)(this.color, (0, _util.parseColor)(color, null)) && this.$createElement(_VIcon.default, {
+        props: {
+          small: true,
+          dark: (0, _colorUtils.contrastRatio)(this.color.rgba, white) > 2 && this.color.alpha > 0.5,
+          light: (0, _colorUtils.contrastRatio)(this.color.rgba, black) > 2 && this.color.alpha > 0.5
+        }
       }, '$success')]);
-      return (0, _vue.h)('div', {
-        class: 'v-color-picker__color',
+      return this.$createElement('div', {
+        staticClass: 'v-color-picker__color',
         on: {
           // TODO: Less hacky way of catching transparent
           click: function click() {
@@ -80,20 +80,20 @@ var _default2 = (0, _mixins.default)(_themeable.default).extend({
 
       return this.swatches.map(function (swatch) {
         var colors = swatch.map(_this2.genColor);
-        return (0, _vue.h)('div', {
-          class: 'v-color-picker__swatch'
+        return _this2.$createElement('div', {
+          staticClass: 'v-color-picker__swatch'
         }, colors);
       });
     }
   },
-  render: function render() {
-    return (0, _vue.h)('div', {
-      class: 'v-color-picker__swatches',
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'v-color-picker__swatches',
       style: {
         maxWidth: (0, _helpers.convertToUnit)(this.maxWidth),
         maxHeight: (0, _helpers.convertToUnit)(this.maxHeight)
       }
-    }, [(0, _vue.h)('div', this.genSwatches())]);
+    }, [this.$createElement('div', this.genSwatches())]);
   }
 });
 

package/es5/components/VColorPicker/VColorPickerSwatches.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerSwatches.ts"],"names":[],"mappings":"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","sourcesContent":["import {h} from 'vue'\n// Styles\nimport './VColorPickerSwatches.sass'\n\n// Components\nimport VIcon from '../VIcon'\n\n// Helpers\nimport colors from '../../util/colors'\nimport { VColorPickerColor, fromHex, parseColor } from './util'\nimport { convertToUnit, deepEqual } from '../../util/helpers'\nimport mixins from '../../util/mixins'\nimport Themeable from '../../mixins/themeable'\n\n// Types\nimport { VNode, PropType } from 'vue'\nimport { contrastRatio } from '../../util/colorUtils'\n\nfunction parseDefaultColors (colors: Record<string, Record<string, string>>) {\n  return Object.keys(colors).map(key => {\n    const color = colors[key]\n    return color.base ? [\n      color.base,\n      color.darken4,\n      color.darken3,\n      color.darken2,\n      color.darken1,\n      color.lighten1,\n      color.lighten2,\n      color.lighten3,\n      color.lighten4,\n      color.lighten5,\n    ] : [\n      color.black,\n      color.white,\n      color.transparent,\n    ]\n  })\n}\n\nconst white = fromHex('#FFFFFF').rgba\nconst black = fromHex('#000000').rgba\n\nexport default mixins(Themeable).extend({\n  name: 'v-color-picker-swatches',\n\n  props: {\n    swatches: {\n      type: Array as PropType<string[][]>,\n      default: () => parseDefaultColors(colors),\n    },\n    disabled: Boolean,\n    color: Object as PropType<VColorPickerColor>,\n    maxWidth: [Number, String],\n    maxHeight: [Number, String],\n  },\n\n  methods: {\n    genColor (color: string) {\n      const content = h('div', {\n        style: {\n          background: color,\n        },\n      }, [\n        deepEqual(this.color, parseColor(color, null)) && h(VIcon, {\n          small: true,\n          dark: contrastRatio(this.color.rgba, white) > 2 && this.color.alpha > 0.5,\n          light: contrastRatio(this.color.rgba, black) > 2 && this.color.alpha > 0.5\n        }, '$success'),\n      ])\n\n      return h('div', {\n        class: 'v-color-picker__color',\n        on: {\n          // TODO: Less hacky way of catching transparent\n          click: () => this.disabled || this.$emit('update:color', fromHex(color === 'transparent' ? '#00000000' : color)),\n        },\n      }, [content])\n    },\n    genSwatches () {\n      return this.swatches.map(swatch => {\n        const colors = swatch.map(this.genColor)\n\n        return h('div', {\n          class: 'v-color-picker__swatch',\n        }, colors)\n      })\n    },\n  },\n\n  render (): VNode {\n    return h('div', {\n      class: 'v-color-picker__swatches',\n      style: {\n        maxWidth: convertToUnit(this.maxWidth),\n        maxHeight: convertToUnit(this.maxHeight),\n      },\n    }, [\n      h('div', this.genSwatches()),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerSwatches.js"}
+{"version":3,"sources":["../../../src/components/VColorPicker/VColorPickerSwatches.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './VColorPickerSwatches.sass'\n\n// Components\nimport VIcon from '../VIcon'\n\n// Helpers\nimport colors from '../../util/colors'\nimport { VColorPickerColor, fromHex, parseColor } from './util'\nimport { convertToUnit, deepEqual } from '../../util/helpers'\nimport mixins from '../../util/mixins'\nimport Themeable from '../../mixins/themeable'\n\n// Types\nimport { VNode, PropType } from 'vue'\nimport { contrastRatio } from '../../util/colorUtils'\n\nfunction parseDefaultColors (colors: Record<string, Record<string, string>>) {\n  return Object.keys(colors).map(key => {\n    const color = colors[key]\n    return color.base ? [\n      color.base,\n      color.darken4,\n      color.darken3,\n      color.darken2,\n      color.darken1,\n      color.lighten1,\n      color.lighten2,\n      color.lighten3,\n      color.lighten4,\n      color.lighten5,\n    ] : [\n      color.black,\n      color.white,\n      color.transparent,\n    ]\n  })\n}\n\nconst white = fromHex('#FFFFFF').rgba\nconst black = fromHex('#000000').rgba\n\nexport default mixins(Themeable).extend({\n  name: 'v-color-picker-swatches',\n\n  props: {\n    swatches: {\n      type: Array as PropType<string[][]>,\n      default: () => parseDefaultColors(colors),\n    },\n    disabled: Boolean,\n    color: Object as PropType<VColorPickerColor>,\n    maxWidth: [Number, String],\n    maxHeight: [Number, String],\n  },\n\n  methods: {\n    genColor (color: string) {\n      const content = this.$createElement('div', {\n        style: {\n          background: color,\n        },\n      }, [\n        deepEqual(this.color, parseColor(color, null)) && this.$createElement(VIcon, {\n          props: {\n            small: true,\n            dark: contrastRatio(this.color.rgba, white) > 2 && this.color.alpha > 0.5,\n            light: contrastRatio(this.color.rgba, black) > 2 && this.color.alpha > 0.5,\n          },\n        }, '$success'),\n      ])\n\n      return this.$createElement('div', {\n        staticClass: 'v-color-picker__color',\n        on: {\n          // TODO: Less hacky way of catching transparent\n          click: () => this.disabled || this.$emit('update:color', fromHex(color === 'transparent' ? '#00000000' : color)),\n        },\n      }, [content])\n    },\n    genSwatches () {\n      return this.swatches.map(swatch => {\n        const colors = swatch.map(this.genColor)\n\n        return this.$createElement('div', {\n          staticClass: 'v-color-picker__swatch',\n        }, colors)\n      })\n    },\n  },\n\n  render (h): VNode {\n    return h('div', {\n      staticClass: 'v-color-picker__swatches',\n      style: {\n        maxWidth: convertToUnit(this.maxWidth),\n        maxHeight: convertToUnit(this.maxHeight),\n      },\n    }, [\n      this.$createElement('div', this.genSwatches()),\n    ])\n  },\n})\n"],"sourceRoot":"","file":"VColorPickerSwatches.js"}