vuetify eingebunden + erster Versuch Combobox
This commit is contained in:
+68
@@ -0,0 +1,68 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
|
||||
exports.default = function () {
|
||||
var expandedParentClass = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
||||
var x = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
||||
|
||||
var sizeProperty = x ? 'width' : 'height';
|
||||
return {
|
||||
beforeEnter: function beforeEnter(el) {
|
||||
el._parent = el.parentNode;
|
||||
el._initialStyle = _defineProperty({
|
||||
transition: el.style.transition,
|
||||
visibility: el.style.visibility,
|
||||
overflow: el.style.overflow
|
||||
}, sizeProperty, el.style[sizeProperty]);
|
||||
},
|
||||
enter: function enter(el) {
|
||||
var initialStyle = el._initialStyle;
|
||||
el.style.setProperty('transition', 'none', 'important');
|
||||
el.style.visibility = 'hidden';
|
||||
var size = el['offset' + (0, _helpers.upperFirst)(sizeProperty)] + 'px';
|
||||
el.style.visibility = initialStyle.visibility;
|
||||
el.style.overflow = 'hidden';
|
||||
el.style[sizeProperty] = 0;
|
||||
void el.offsetHeight; // force reflow
|
||||
el.style.transition = initialStyle.transition;
|
||||
expandedParentClass && el._parent && el._parent.classList.add(expandedParentClass);
|
||||
requestAnimationFrame(function () {
|
||||
el.style[sizeProperty] = size;
|
||||
});
|
||||
},
|
||||
|
||||
afterEnter: resetStyles,
|
||||
enterCancelled: resetStyles,
|
||||
leave: function leave(el) {
|
||||
el._initialStyle = _defineProperty({
|
||||
overflow: el.style.overflow
|
||||
}, sizeProperty, el.style[sizeProperty]);
|
||||
el.style.overflow = 'hidden';
|
||||
el.style[sizeProperty] = el['offset' + (0, _helpers.upperFirst)(sizeProperty)] + 'px';
|
||||
void el.offsetHeight; // force reflow
|
||||
requestAnimationFrame(function () {
|
||||
return el.style[sizeProperty] = 0;
|
||||
});
|
||||
},
|
||||
|
||||
afterLeave: afterLeave,
|
||||
leaveCancelled: afterLeave
|
||||
};
|
||||
function afterLeave(el) {
|
||||
expandedParentClass && el._parent && el._parent.classList.remove(expandedParentClass);
|
||||
resetStyles(el);
|
||||
}
|
||||
function resetStyles(el) {
|
||||
el.style.overflow = el._initialStyle.overflow;
|
||||
el.style[sizeProperty] = el._initialStyle[sizeProperty];
|
||||
delete el._initialStyle;
|
||||
}
|
||||
};
|
||||
|
||||
var _helpers = require('../../util/helpers');
|
||||
|
||||
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; }
|
||||
//# sourceMappingURL=expand-transition.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/transitions/expand-transition.js"],"names":[],"mappings":";;;;;;kBAEc,YAA8C;AAAA,QAAnC,mBAAmC,uEAAb,EAAa;AAAA,QAAT,CAAS,uEAAL,KAAK;;AAC1D,QAAM,eAAe,IAAI,OAAJ,GAAc,QAAnC;AAEA,WAAO;AACL,mBADK,uBACQ,EADR,EACU;AACb,eAAG,OAAH,GAAa,GAAG,UAAhB;AACA,eAAG,aAAH;AACE,4BAAY,GAAG,KAAH,CAAS,UADvB;AAEE,4BAAY,GAAG,KAAH,CAAS,UAFvB;AAGE,0BAAU,GAAG,KAAH,CAAS;AAHrB,eAIG,YAJH,EAIkB,GAAG,KAAH,CAAS,YAAT,CAJlB;AAMD,SATI;AAWL,aAXK,iBAWE,EAXF,EAWI;AACP,gBAAM,eAAe,GAAG,aAAxB;AACA,eAAG,KAAH,CAAS,WAAT,CAAqB,YAArB,EAAmC,MAAnC,EAA2C,WAA3C;AACA,eAAG,KAAH,CAAS,UAAT,GAAsB,QAAtB;AACA,gBAAM,OAAU,GAAG,WAAW,yBAAW,YAAX,CAAd,CAAV,OAAN;AACA,eAAG,KAAH,CAAS,UAAT,GAAsB,aAAa,UAAnC;AACA,eAAG,KAAH,CAAS,QAAT,GAAoB,QAApB;AACA,eAAG,KAAH,CAAS,YAAT,IAAyB,CAAzB;AACA,iBAAK,GAAG,YAAR,CARO,CAQc;AACrB,eAAG,KAAH,CAAS,UAAT,GAAsB,aAAa,UAAnC;AAEA,mCAAuB,GAAG,OAA1B,IAAqC,GAAG,OAAH,CAAW,SAAX,CAAqB,GAArB,CAAyB,mBAAzB,CAArC;AAEA,kCAAsB,YAAK;AACzB,mBAAG,KAAH,CAAS,YAAT,IAAyB,IAAzB;AACD,aAFD;AAGD,SA3BI;;AA6BL,oBAAY,WA7BP;AA8BL,wBAAgB,WA9BX;AAgCL,aAhCK,iBAgCE,EAhCF,EAgCI;AACP,eAAG,aAAH;AACE,0BAAU,GAAG,KAAH,CAAS;AADrB,eAEG,YAFH,EAEkB,GAAG,KAAH,CAAS,YAAT,CAFlB;AAKA,eAAG,KAAH,CAAS,QAAT,GAAoB,QAApB;AACA,eAAG,KAAH,CAAS,YAAT,IAA4B,GAAG,WAAW,yBAAW,YAAX,CAAd,CAA5B;AACA,iBAAK,GAAG,YAAR,CARO,CAQc;AAErB,kCAAsB;AAAA,uBAAM,GAAG,KAAH,CAAS,YAAT,IAAyB,CAA/B;AAAA,aAAtB;AACD,SA3CI;;AA6CL,8BA7CK;AA8CL,wBAAgB;AA9CX,KAAP;AAiDA,aAAS,UAAT,CAAqB,EAArB,EAAuB;AACrB,+BAAuB,GAAG,OAA1B,IAAqC,GAAG,OAAH,CAAW,SAAX,CAAqB,MAArB,CAA4B,mBAA5B,CAArC;AACA,oBAAY,EAAZ;AACD;AAED,aAAS,WAAT,CAAsB,EAAtB,EAAwB;AACtB,WAAG,KAAH,CAAS,QAAT,GAAoB,GAAG,aAAH,CAAiB,QAArC;AACA,WAAG,KAAH,CAAS,YAAT,IAAyB,GAAG,aAAH,CAAiB,YAAjB,CAAzB;AACA,eAAO,GAAG,aAAV;AACD;AACF,C","sourcesContent":["import { upperFirst } from '../../util/helpers'\n\nexport default function (expandedParentClass = '', x = false) {\n const sizeProperty = x ? 'width' : 'height'\n\n return {\n beforeEnter (el) {\n el._parent = el.parentNode\n el._initialStyle = {\n transition: el.style.transition,\n visibility: el.style.visibility,\n overflow: el.style.overflow,\n [sizeProperty]: el.style[sizeProperty]\n }\n },\n\n enter (el) {\n const initialStyle = el._initialStyle\n el.style.setProperty('transition', 'none', 'important')\n el.style.visibility = 'hidden'\n const size = `${el['offset' + upperFirst(sizeProperty)]}px`\n el.style.visibility = initialStyle.visibility\n el.style.overflow = 'hidden'\n el.style[sizeProperty] = 0\n void el.offsetHeight // force reflow\n el.style.transition = initialStyle.transition\n\n expandedParentClass && el._parent && el._parent.classList.add(expandedParentClass)\n\n requestAnimationFrame(() => {\n el.style[sizeProperty] = size\n })\n },\n\n afterEnter: resetStyles,\n enterCancelled: resetStyles,\n\n leave (el) {\n el._initialStyle = {\n overflow: el.style.overflow,\n [sizeProperty]: el.style[sizeProperty]\n }\n\n el.style.overflow = 'hidden'\n el.style[sizeProperty] = `${el['offset' + upperFirst(sizeProperty)]}px`\n void el.offsetHeight // force reflow\n\n requestAnimationFrame(() => el.style[sizeProperty] = 0)\n },\n\n afterLeave,\n leaveCancelled: afterLeave\n }\n\n function afterLeave (el) {\n expandedParentClass && el._parent && el._parent.classList.remove(expandedParentClass)\n resetStyles(el)\n }\n\n function resetStyles (el) {\n el.style.overflow = el._initialStyle.overflow\n el.style[sizeProperty] = el._initialStyle[sizeProperty]\n delete el._initialStyle\n }\n}\n"],"sourceRoot":""}
|
||||
+67
@@ -0,0 +1,67 @@
|
||||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.VRowExpandTransition = exports.VExpandXTransition = exports.VExpandTransition = exports.VSlideYReverseTransition = exports.VSlideYTransition = exports.VSlideXReverseTransition = exports.VSlideXTransition = exports.VScrollYReverseTransition = exports.VScrollYTransition = exports.VScrollXReverseTransition = exports.VScrollXTransition = exports.VScaleTransition = exports.VFadeTransition = exports.VDialogBottomTransition = exports.VDialogTransition = exports.VFabTransition = exports.VMenuTransition = exports.VTabReverseTransition = exports.VTabTransition = exports.VCarouselReverseTransition = exports.VCarouselTransition = exports.VBottomSheetTransition = undefined;
|
||||
|
||||
var _helpers = require('../../util/helpers');
|
||||
|
||||
var _expandTransition = require('./expand-transition');
|
||||
|
||||
var _expandTransition2 = _interopRequireDefault(_expandTransition);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
// Component specific transitions
|
||||
var VBottomSheetTransition = exports.VBottomSheetTransition = (0, _helpers.createSimpleTransition)('bottom-sheet-transition');
|
||||
var VCarouselTransition = exports.VCarouselTransition = (0, _helpers.createSimpleTransition)('carousel-transition');
|
||||
var VCarouselReverseTransition = exports.VCarouselReverseTransition = (0, _helpers.createSimpleTransition)('carousel-reverse-transition');
|
||||
var VTabTransition = exports.VTabTransition = (0, _helpers.createSimpleTransition)('tab-transition');
|
||||
var VTabReverseTransition = exports.VTabReverseTransition = (0, _helpers.createSimpleTransition)('tab-reverse-transition');
|
||||
var VMenuTransition = exports.VMenuTransition = (0, _helpers.createSimpleTransition)('menu-transition');
|
||||
var VFabTransition = exports.VFabTransition = (0, _helpers.createSimpleTransition)('fab-transition', 'center center', 'out-in');
|
||||
// Generic transitions
|
||||
var VDialogTransition = exports.VDialogTransition = (0, _helpers.createSimpleTransition)('dialog-transition');
|
||||
var VDialogBottomTransition = exports.VDialogBottomTransition = (0, _helpers.createSimpleTransition)('dialog-bottom-transition');
|
||||
var VFadeTransition = exports.VFadeTransition = (0, _helpers.createSimpleTransition)('fade-transition');
|
||||
var VScaleTransition = exports.VScaleTransition = (0, _helpers.createSimpleTransition)('scale-transition');
|
||||
var VScrollXTransition = exports.VScrollXTransition = (0, _helpers.createSimpleTransition)('scroll-x-transition');
|
||||
var VScrollXReverseTransition = exports.VScrollXReverseTransition = (0, _helpers.createSimpleTransition)('scroll-x-reverse-transition');
|
||||
var VScrollYTransition = exports.VScrollYTransition = (0, _helpers.createSimpleTransition)('scroll-y-transition');
|
||||
var VScrollYReverseTransition = exports.VScrollYReverseTransition = (0, _helpers.createSimpleTransition)('scroll-y-reverse-transition');
|
||||
var VSlideXTransition = exports.VSlideXTransition = (0, _helpers.createSimpleTransition)('slide-x-transition');
|
||||
var VSlideXReverseTransition = exports.VSlideXReverseTransition = (0, _helpers.createSimpleTransition)('slide-x-reverse-transition');
|
||||
var VSlideYTransition = exports.VSlideYTransition = (0, _helpers.createSimpleTransition)('slide-y-transition');
|
||||
var VSlideYReverseTransition = exports.VSlideYReverseTransition = (0, _helpers.createSimpleTransition)('slide-y-reverse-transition');
|
||||
// JavaScript transitions
|
||||
var VExpandTransition = exports.VExpandTransition = (0, _helpers.createJavaScriptTransition)('expand-transition', (0, _expandTransition2.default)());
|
||||
var VExpandXTransition = exports.VExpandXTransition = (0, _helpers.createJavaScriptTransition)('expand-x-transition', (0, _expandTransition2.default)('', true));
|
||||
var VRowExpandTransition = exports.VRowExpandTransition = (0, _helpers.createJavaScriptTransition)('row-expand-transition', (0, _expandTransition2.default)('datatable__expand-col--expanded'));
|
||||
exports.default = {
|
||||
$_vuetify_subcomponents: {
|
||||
VBottomSheetTransition: VBottomSheetTransition,
|
||||
VCarouselTransition: VCarouselTransition,
|
||||
VCarouselReverseTransition: VCarouselReverseTransition,
|
||||
VDialogTransition: VDialogTransition,
|
||||
VDialogBottomTransition: VDialogBottomTransition,
|
||||
VFabTransition: VFabTransition,
|
||||
VFadeTransition: VFadeTransition,
|
||||
VMenuTransition: VMenuTransition,
|
||||
VScaleTransition: VScaleTransition,
|
||||
VScrollXTransition: VScrollXTransition,
|
||||
VScrollXReverseTransition: VScrollXReverseTransition,
|
||||
VScrollYTransition: VScrollYTransition,
|
||||
VScrollYReverseTransition: VScrollYReverseTransition,
|
||||
VSlideXTransition: VSlideXTransition,
|
||||
VSlideXReverseTransition: VSlideXReverseTransition,
|
||||
VSlideYTransition: VSlideYTransition,
|
||||
VSlideYReverseTransition: VSlideYReverseTransition,
|
||||
VTabReverseTransition: VTabReverseTransition,
|
||||
VTabTransition: VTabTransition,
|
||||
VExpandTransition: VExpandTransition,
|
||||
VExpandXTransition: VExpandXTransition,
|
||||
VRowExpandTransition: VRowExpandTransition
|
||||
}
|
||||
};
|
||||
//# sourceMappingURL=index.js.map
|
||||
+1
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["../../../src/components/transitions/index.js"],"names":[],"mappings":";;;;;;;;;AAKA;;;;;;AAEA;AACO,IAAM,0DAAyB,qCAAuB,yBAAvB,CAA/B;AACA,IAAM,oDAAsB,qCAAuB,qBAAvB,CAA5B;AACA,IAAM,kEAA6B,qCAAuB,6BAAvB,CAAnC;AACA,IAAM,0CAAiB,qCAAuB,gBAAvB,CAAvB;AACA,IAAM,wDAAwB,qCAAuB,wBAAvB,CAA9B;AACA,IAAM,4CAAkB,qCAAuB,iBAAvB,CAAxB;AACA,IAAM,0CAAiB,qCAAuB,gBAAvB,EAAyC,eAAzC,EAA0D,QAA1D,CAAvB;AAEP;AACO,IAAM,gDAAoB,qCAAuB,mBAAvB,CAA1B;AACA,IAAM,4DAA0B,qCAAuB,0BAAvB,CAAhC;AACA,IAAM,4CAAkB,qCAAuB,iBAAvB,CAAxB;AACA,IAAM,8CAAmB,qCAAuB,kBAAvB,CAAzB;AACA,IAAM,kDAAqB,qCAAuB,qBAAvB,CAA3B;AACA,IAAM,gEAA4B,qCAAuB,6BAAvB,CAAlC;AACA,IAAM,kDAAqB,qCAAuB,qBAAvB,CAA3B;AACA,IAAM,gEAA4B,qCAAuB,6BAAvB,CAAlC;AACA,IAAM,gDAAoB,qCAAuB,oBAAvB,CAA1B;AACA,IAAM,8DAA2B,qCAAuB,4BAAvB,CAAjC;AACA,IAAM,gDAAoB,qCAAuB,oBAAvB,CAA1B;AACA,IAAM,8DAA2B,qCAAuB,4BAAvB,CAAjC;AAEP;AACO,IAAM,gDAAoB,yCAA2B,mBAA3B,EAAgD,iCAAhD,CAA1B;AACA,IAAM,kDAAqB,yCAA2B,qBAA3B,EAAkD,gCAA0B,EAA1B,EAA8B,IAA9B,CAAlD,CAA3B;AACA,IAAM,sDAAuB,yCAA2B,uBAA3B,EAAoD,gCAA0B,iCAA1B,CAApD,CAA7B;kBAEQ;AACb,6BAAyB;AACvB,sDADuB;AAEvB,gDAFuB;AAGvB,8DAHuB;AAIvB,4CAJuB;AAKvB,wDALuB;AAMvB,sCANuB;AAOvB,wCAPuB;AAQvB,wCARuB;AASvB,0CATuB;AAUvB,8CAVuB;AAWvB,4DAXuB;AAYvB,8CAZuB;AAavB,4DAbuB;AAcvB,4CAduB;AAevB,0DAfuB;AAgBvB,4CAhBuB;AAiBvB,0DAjBuB;AAkBvB,oDAlBuB;AAmBvB,sCAnBuB;AAoBvB,4CApBuB;AAqBvB,8CArBuB;AAsBvB;AAtBuB;AADZ,C","sourcesContent":["import {\n createSimpleTransition,\n createJavaScriptTransition\n} from '../../util/helpers'\n\nimport ExpandTransitionGenerator from './expand-transition'\n\n// Component specific transitions\nexport const VBottomSheetTransition = createSimpleTransition('bottom-sheet-transition')\nexport const VCarouselTransition = createSimpleTransition('carousel-transition')\nexport const VCarouselReverseTransition = createSimpleTransition('carousel-reverse-transition')\nexport const VTabTransition = createSimpleTransition('tab-transition')\nexport const VTabReverseTransition = createSimpleTransition('tab-reverse-transition')\nexport const VMenuTransition = createSimpleTransition('menu-transition')\nexport const VFabTransition = createSimpleTransition('fab-transition', 'center center', 'out-in')\n\n// Generic transitions\nexport const VDialogTransition = createSimpleTransition('dialog-transition')\nexport const VDialogBottomTransition = createSimpleTransition('dialog-bottom-transition')\nexport const VFadeTransition = createSimpleTransition('fade-transition')\nexport const VScaleTransition = createSimpleTransition('scale-transition')\nexport const VScrollXTransition = createSimpleTransition('scroll-x-transition')\nexport const VScrollXReverseTransition = createSimpleTransition('scroll-x-reverse-transition')\nexport const VScrollYTransition = createSimpleTransition('scroll-y-transition')\nexport const VScrollYReverseTransition = createSimpleTransition('scroll-y-reverse-transition')\nexport const VSlideXTransition = createSimpleTransition('slide-x-transition')\nexport const VSlideXReverseTransition = createSimpleTransition('slide-x-reverse-transition')\nexport const VSlideYTransition = createSimpleTransition('slide-y-transition')\nexport const VSlideYReverseTransition = createSimpleTransition('slide-y-reverse-transition')\n\n// JavaScript transitions\nexport const VExpandTransition = createJavaScriptTransition('expand-transition', ExpandTransitionGenerator())\nexport const VExpandXTransition = createJavaScriptTransition('expand-x-transition', ExpandTransitionGenerator('', true))\nexport const VRowExpandTransition = createJavaScriptTransition('row-expand-transition', ExpandTransitionGenerator('datatable__expand-col--expanded'))\n\nexport default {\n $_vuetify_subcomponents: {\n VBottomSheetTransition,\n VCarouselTransition,\n VCarouselReverseTransition,\n VDialogTransition,\n VDialogBottomTransition,\n VFabTransition,\n VFadeTransition,\n VMenuTransition,\n VScaleTransition,\n VScrollXTransition,\n VScrollXReverseTransition,\n VScrollYTransition,\n VScrollYReverseTransition,\n VSlideXTransition,\n VSlideXReverseTransition,\n VSlideYTransition,\n VSlideYReverseTransition,\n VTabReverseTransition,\n VTabTransition,\n VExpandTransition,\n VExpandXTransition,\n VRowExpandTransition\n }\n}\n"],"sourceRoot":""}
|
||||
Reference in New Issue
Block a user