vuetify 3.3.13 → 3.3.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/json/attributes.json +70 -66
- package/dist/json/importMap-labs.json +4 -4
- package/dist/json/importMap.json +12 -12
- package/dist/json/tags.json +5 -4
- package/dist/json/web-types.json +180 -140
- package/dist/vuetify-labs.css +363 -304
- package/dist/vuetify-labs.d.ts +384 -236
- package/dist/vuetify-labs.esm.js +410 -297
- package/dist/vuetify-labs.esm.js.map +1 -1
- package/dist/vuetify-labs.js +409 -296
- package/dist/vuetify-labs.min.css +2 -2
- package/dist/vuetify.css +291 -232
- package/dist/vuetify.d.ts +232 -76
- package/dist/vuetify.esm.js +210 -160
- package/dist/vuetify.esm.js.map +1 -1
- package/dist/vuetify.js +209 -159
- package/dist/vuetify.js.map +1 -1
- package/dist/vuetify.min.css +2 -2
- package/dist/vuetify.min.js +838 -827
- package/dist/vuetify.min.js.map +1 -1
- package/lib/components/VAppBar/VAppBar.mjs.map +1 -1
- package/lib/components/VAppBar/index.d.mts +6 -6
- package/lib/components/VAutocomplete/VAutocomplete.mjs +12 -2
- package/lib/components/VAutocomplete/VAutocomplete.mjs.map +1 -1
- package/lib/components/VBadge/VBadge.css +1 -1
- package/lib/components/VBadge/_variables.scss +1 -1
- package/lib/components/VCheckbox/VCheckbox.mjs +2 -2
- package/lib/components/VCheckbox/VCheckbox.mjs.map +1 -1
- package/lib/components/VCheckbox/VCheckboxBtn.mjs +14 -11
- package/lib/components/VCheckbox/VCheckboxBtn.mjs.map +1 -1
- package/lib/components/VColorPicker/VColorPickerEdit.css +4 -2
- package/lib/components/VColorPicker/VColorPickerPreview.css +11 -6
- package/lib/components/VCombobox/VCombobox.mjs +11 -1
- package/lib/components/VCombobox/VCombobox.mjs.map +1 -1
- package/lib/components/VField/VField.css +22 -7
- package/lib/components/VField/VField.sass +8 -1
- package/lib/components/VField/_variables.scss +1 -0
- package/lib/components/VGrid/VGrid.css +153 -142
- package/lib/components/VProgressLinear/VProgressLinear.css +3 -2
- package/lib/components/VRadioGroup/VRadioGroup.mjs +2 -2
- package/lib/components/VRadioGroup/VRadioGroup.mjs.map +1 -1
- package/lib/components/VRangeSlider/index.d.mts +114 -33
- package/lib/components/VSelect/VSelect.mjs +12 -2
- package/lib/components/VSelect/VSelect.mjs.map +1 -1
- package/lib/components/VSelectionControl/VSelectionControl.mjs +2 -1
- package/lib/components/VSelectionControl/VSelectionControl.mjs.map +1 -1
- package/lib/components/VSlider/VSlider.mjs.map +1 -1
- package/lib/components/VSlider/VSliderThumb.css +8 -4
- package/lib/components/VSlider/VSliderTrack.css +22 -12
- package/lib/components/VSlider/index.d.mts +114 -33
- package/lib/components/VSwitch/VSwitch.mjs +9 -9
- package/lib/components/VSwitch/VSwitch.mjs.map +1 -1
- package/lib/components/VTimeline/VTimeline.css +19 -10
- package/lib/components/VTimeline/VTimeline.sass +5 -0
- package/lib/components/VToolbar/VToolbar.css +4 -2
- package/lib/components/index.d.mts +228 -72
- package/lib/composables/color.mjs +6 -1
- package/lib/composables/color.mjs.map +1 -1
- package/lib/composables/defaults.mjs +9 -9
- package/lib/composables/defaults.mjs.map +1 -1
- package/lib/composables/theme.mjs +2 -5
- package/lib/composables/theme.mjs.map +1 -1
- package/lib/entry-bundler.mjs +1 -1
- package/lib/framework.mjs +1 -1
- package/lib/index.d.mts +4 -4
- package/lib/labs/VDateInput/index.d.mts +2 -2
- package/lib/labs/VDatePicker/VDateCard.mjs +3 -0
- package/lib/labs/VDatePicker/VDateCard.mjs.map +1 -1
- package/lib/labs/VDatePicker/VDatePicker.mjs +51 -21
- package/lib/labs/VDatePicker/VDatePicker.mjs.map +1 -1
- package/lib/labs/VDatePicker/VDatePickerControls.css +1 -1
- package/lib/labs/VDatePicker/VDatePickerControls.mjs +53 -35
- package/lib/labs/VDatePicker/VDatePickerControls.mjs.map +1 -1
- package/lib/labs/VDatePicker/VDatePickerMonth.mjs +37 -28
- package/lib/labs/VDatePicker/VDatePickerMonth.mjs.map +1 -1
- package/lib/labs/VDatePicker/VDatePickerYears.mjs +19 -17
- package/lib/labs/VDatePicker/VDatePickerYears.mjs.map +1 -1
- package/lib/labs/VDatePicker/index.d.mts +148 -156
- package/lib/labs/VDateRangePicker/VDateRangeCard.mjs +3 -0
- package/lib/labs/VDateRangePicker/VDateRangeCard.mjs.map +1 -1
- package/lib/labs/VDateRangePicker/index.d.mts +59 -52
- package/lib/labs/VSkeletonLoader/VSkeletonLoader.mjs.map +1 -1
- package/lib/labs/VSkeletonLoader/index.d.mts +8 -8
- package/lib/labs/components.d.mts +156 -164
- package/lib/locale/no.mjs +1 -1
- package/lib/locale/no.mjs.map +1 -1
- package/lib/styles/tools/_rtl.sass +4 -2
- package/lib/util/colorUtils.mjs +6 -0
- package/lib/util/colorUtils.mjs.map +1 -1
- package/lib/util/helpers.mjs +10 -4
- package/lib/util/helpers.mjs.map +1 -1
- package/lib/util/injectSelf.mjs +2 -1
- package/lib/util/injectSelf.mjs.map +1 -1
- package/package.json +2 -2
package/dist/vuetify-labs.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* Vuetify v3.3.
|
|
2
|
+
* Vuetify v3.3.14
|
|
3
3
|
* Forged by John Leider
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
|
-
import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn,
|
|
7
|
+
import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, readonly, onDeactivated, onActivated, onMounted, onScopeDispose, effectScope, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText, withModifiers } from 'vue';
|
|
8
8
|
|
|
9
9
|
// Types
|
|
10
10
|
// eslint-disable-line vue/prefer-import-from-vue
|
|
@@ -229,14 +229,22 @@ function only(obj, include) {
|
|
|
229
229
|
include.forEach(prop => clone[prop] = obj[prop]);
|
|
230
230
|
return clone;
|
|
231
231
|
}
|
|
232
|
+
const onRE = /^on[^a-z]/;
|
|
233
|
+
const isOn = key => onRE.test(key);
|
|
234
|
+
const bubblingEvents = ['onAfterscriptexecute', 'onAnimationcancel', 'onAnimationend', 'onAnimationiteration', 'onAnimationstart', 'onAuxclick', 'onBeforeinput', 'onBeforescriptexecute', 'onChange', 'onClick', 'onCompositionend', 'onCompositionstart', 'onCompositionupdate', 'onContextmenu', 'onCopy', 'onCut', 'onDblclick', 'onFocusin', 'onFocusout', 'onFullscreenchange', 'onFullscreenerror', 'onGesturechange', 'onGestureend', 'onGesturestart', 'onGotpointercapture', 'onInput', 'onKeydown', 'onKeypress', 'onKeyup', 'onLostpointercapture', 'onMousedown', 'onMousemove', 'onMouseout', 'onMouseover', 'onMouseup', 'onMousewheel', 'onPaste', 'onPointercancel', 'onPointerdown', 'onPointerenter', 'onPointerleave', 'onPointermove', 'onPointerout', 'onPointerover', 'onPointerup', 'onReset', 'onSelect', 'onSubmit', 'onTouchcancel', 'onTouchend', 'onTouchmove', 'onTouchstart', 'onTransitioncancel', 'onTransitionend', 'onTransitionrun', 'onTransitionstart', 'onWheel'];
|
|
232
235
|
|
|
233
236
|
/**
|
|
234
237
|
* Filter attributes that should be applied to
|
|
235
|
-
* the root element of
|
|
238
|
+
* the root element of an input component. Remaining
|
|
236
239
|
* attributes should be passed to the <input> element inside.
|
|
237
240
|
*/
|
|
238
241
|
function filterInputAttrs(attrs) {
|
|
239
|
-
|
|
242
|
+
const [events, props] = pick(attrs, [onRE]);
|
|
243
|
+
const inputEvents = omit(events, bubblingEvents);
|
|
244
|
+
const [rootAttrs, inputAttrs] = pick(props, ['class', 'style', 'id', /^data-/]);
|
|
245
|
+
Object.assign(rootAttrs, events);
|
|
246
|
+
Object.assign(inputAttrs, inputEvents);
|
|
247
|
+
return [rootAttrs, inputAttrs];
|
|
240
248
|
}
|
|
241
249
|
function wrapInArray(v) {
|
|
242
250
|
return v == null ? [] : Array.isArray(v) ? v : [v];
|
|
@@ -389,8 +397,6 @@ function destructComputed(getter) {
|
|
|
389
397
|
function includes(arr, val) {
|
|
390
398
|
return arr.includes(val);
|
|
391
399
|
}
|
|
392
|
-
const onRE = /^on[^a-z]/;
|
|
393
|
-
const isOn = key => onRE.test(key);
|
|
394
400
|
function eventName(propName) {
|
|
395
401
|
return propName[2].toLowerCase() + propName.slice(3);
|
|
396
402
|
}
|
|
@@ -660,6 +666,94 @@ function unbindProps(el, props) {
|
|
|
660
666
|
});
|
|
661
667
|
}
|
|
662
668
|
|
|
669
|
+
/**
|
|
670
|
+
* WCAG 3.0 APCA perceptual contrast algorithm from https://github.com/Myndex/SAPC-APCA
|
|
671
|
+
* @licence https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
672
|
+
* @see https://www.w3.org/WAI/GL/task-forces/silver/wiki/Visual_Contrast_of_Text_Subgroup
|
|
673
|
+
*/
|
|
674
|
+
// Types
|
|
675
|
+
|
|
676
|
+
// MAGICAL NUMBERS
|
|
677
|
+
|
|
678
|
+
// sRGB Conversion to Relative Luminance (Y)
|
|
679
|
+
|
|
680
|
+
// Transfer Curve (aka "Gamma") for sRGB linearization
|
|
681
|
+
// Simple power curve vs piecewise described in docs
|
|
682
|
+
// Essentially, 2.4 best models actual display
|
|
683
|
+
// characteristics in combination with the total method
|
|
684
|
+
const mainTRC = 2.4;
|
|
685
|
+
const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)
|
|
686
|
+
const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)
|
|
687
|
+
const Bco = 0.0721750; // sRGB Blue Coefficient (from matrix)
|
|
688
|
+
|
|
689
|
+
// For Finding Raw SAPC Contrast from Relative Luminance (Y)
|
|
690
|
+
|
|
691
|
+
// Constants for SAPC Power Curve Exponents
|
|
692
|
+
// One pair for normal text, and one for reverse
|
|
693
|
+
// These are the "beating heart" of SAPC
|
|
694
|
+
const normBG = 0.55;
|
|
695
|
+
const normTXT = 0.58;
|
|
696
|
+
const revTXT = 0.57;
|
|
697
|
+
const revBG = 0.62;
|
|
698
|
+
|
|
699
|
+
// For Clamping and Scaling Values
|
|
700
|
+
|
|
701
|
+
const blkThrs = 0.03; // Level that triggers the soft black clamp
|
|
702
|
+
const blkClmp = 1.45; // Exponent for the soft black clamp curve
|
|
703
|
+
const deltaYmin = 0.0005; // Lint trap
|
|
704
|
+
const scaleBoW = 1.25; // Scaling for dark text on light
|
|
705
|
+
const scaleWoB = 1.25; // Scaling for light text on dark
|
|
706
|
+
const loConThresh = 0.078; // Threshold for new simple offset scale
|
|
707
|
+
const loConFactor = 12.82051282051282; // = 1/0.078,
|
|
708
|
+
const loConOffset = 0.06; // The simple offset
|
|
709
|
+
const loClip = 0.001; // Output clip (lint trap #2)
|
|
710
|
+
|
|
711
|
+
function APCAcontrast(text, background) {
|
|
712
|
+
// Linearize sRGB
|
|
713
|
+
const Rtxt = (text.r / 255) ** mainTRC;
|
|
714
|
+
const Gtxt = (text.g / 255) ** mainTRC;
|
|
715
|
+
const Btxt = (text.b / 255) ** mainTRC;
|
|
716
|
+
const Rbg = (background.r / 255) ** mainTRC;
|
|
717
|
+
const Gbg = (background.g / 255) ** mainTRC;
|
|
718
|
+
const Bbg = (background.b / 255) ** mainTRC;
|
|
719
|
+
|
|
720
|
+
// Apply the standard coefficients and sum to Y
|
|
721
|
+
let Ytxt = Rtxt * Rco + Gtxt * Gco + Btxt * Bco;
|
|
722
|
+
let Ybg = Rbg * Rco + Gbg * Gco + Bbg * Bco;
|
|
723
|
+
|
|
724
|
+
// Soft clamp Y when near black.
|
|
725
|
+
// Now clamping all colors to prevent crossover errors
|
|
726
|
+
if (Ytxt <= blkThrs) Ytxt += (blkThrs - Ytxt) ** blkClmp;
|
|
727
|
+
if (Ybg <= blkThrs) Ybg += (blkThrs - Ybg) ** blkClmp;
|
|
728
|
+
|
|
729
|
+
// Return 0 Early for extremely low ∆Y (lint trap #1)
|
|
730
|
+
if (Math.abs(Ybg - Ytxt) < deltaYmin) return 0.0;
|
|
731
|
+
|
|
732
|
+
// SAPC CONTRAST
|
|
733
|
+
|
|
734
|
+
let outputContrast; // For weighted final values
|
|
735
|
+
if (Ybg > Ytxt) {
|
|
736
|
+
// For normal polarity, black text on white
|
|
737
|
+
// Calculate the SAPC contrast value and scale
|
|
738
|
+
|
|
739
|
+
const SAPC = (Ybg ** normBG - Ytxt ** normTXT) * scaleBoW;
|
|
740
|
+
|
|
741
|
+
// NEW! SAPC SmoothScale™
|
|
742
|
+
// Low Contrast Smooth Scale Rollout to prevent polarity reversal
|
|
743
|
+
// and also a low clip for very low contrasts (lint trap #2)
|
|
744
|
+
// much of this is for very low contrasts, less than 10
|
|
745
|
+
// therefore for most reversing needs, only loConOffset is important
|
|
746
|
+
outputContrast = SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;
|
|
747
|
+
} else {
|
|
748
|
+
// For reverse polarity, light text on dark
|
|
749
|
+
// WoB should always return negative value.
|
|
750
|
+
|
|
751
|
+
const SAPC = (Ybg ** revBG - Ytxt ** revTXT) * scaleWoB;
|
|
752
|
+
outputContrast = SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
|
|
753
|
+
}
|
|
754
|
+
return outputContrast * 100;
|
|
755
|
+
}
|
|
756
|
+
|
|
663
757
|
/* eslint-disable no-console */
|
|
664
758
|
|
|
665
759
|
function consoleWarn(message) {
|
|
@@ -1016,36 +1110,13 @@ function getContrast(first, second) {
|
|
|
1016
1110
|
const dark = Math.min(l1, l2);
|
|
1017
1111
|
return (light + 0.05) / (dark + 0.05);
|
|
1018
1112
|
}
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
function useToggleScope(source, fn) {
|
|
1025
|
-
let scope;
|
|
1026
|
-
function start() {
|
|
1027
|
-
scope = effectScope();
|
|
1028
|
-
scope.run(() => fn.length ? fn(() => {
|
|
1029
|
-
scope?.stop();
|
|
1030
|
-
start();
|
|
1031
|
-
}) : fn());
|
|
1032
|
-
}
|
|
1033
|
-
watch(source, active => {
|
|
1034
|
-
if (active && !scope) {
|
|
1035
|
-
start();
|
|
1036
|
-
} else if (!active) {
|
|
1037
|
-
scope?.stop();
|
|
1038
|
-
scope = undefined;
|
|
1039
|
-
}
|
|
1040
|
-
}, {
|
|
1041
|
-
immediate: true
|
|
1042
|
-
});
|
|
1043
|
-
onScopeDispose(() => {
|
|
1044
|
-
scope?.stop();
|
|
1045
|
-
});
|
|
1113
|
+
function getForeground(color) {
|
|
1114
|
+
const blackContrast = Math.abs(APCAcontrast(parseColor(0), parseColor(color)));
|
|
1115
|
+
const whiteContrast = Math.abs(APCAcontrast(parseColor(0xffffff), parseColor(color)));
|
|
1116
|
+
return whiteContrast > Math.min(blackContrast, 50) ? '#fff' : '#000';
|
|
1046
1117
|
}
|
|
1047
1118
|
|
|
1048
|
-
//
|
|
1119
|
+
// Utilities
|
|
1049
1120
|
|
|
1050
1121
|
// Types
|
|
1051
1122
|
|
|
@@ -1067,6 +1138,7 @@ function provideDefaults(defaults, options) {
|
|
|
1067
1138
|
const scoped = unref(options?.scoped);
|
|
1068
1139
|
const reset = unref(options?.reset);
|
|
1069
1140
|
const root = unref(options?.root);
|
|
1141
|
+
if (providedDefaults.value == null && !(scoped || reset || root)) return injectedDefaults.value;
|
|
1070
1142
|
let properties = mergeDeep(providedDefaults.value, {
|
|
1071
1143
|
prev: injectedDefaults.value
|
|
1072
1144
|
});
|
|
@@ -1122,16 +1194,16 @@ function internalUseDefaults() {
|
|
|
1122
1194
|
let [key] = _ref;
|
|
1123
1195
|
return key.startsWith(key[0].toUpperCase());
|
|
1124
1196
|
});
|
|
1125
|
-
|
|
1197
|
+
_subcomponentDefaults.value = subComponents.length ? Object.fromEntries(subComponents) : undefined;
|
|
1198
|
+
} else {
|
|
1199
|
+
_subcomponentDefaults.value = undefined;
|
|
1126
1200
|
}
|
|
1127
1201
|
});
|
|
1128
1202
|
function provideSubDefaults() {
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
provideDefaults(mergeDeep(injectSelf(DefaultsSymbol)?.value ?? {}, _subcomponentDefaults.value));
|
|
1134
|
-
});
|
|
1203
|
+
const injected = injectSelf(DefaultsSymbol, vm);
|
|
1204
|
+
provide(DefaultsSymbol, computed(() => {
|
|
1205
|
+
return _subcomponentDefaults.value ? mergeDeep(injected?.value ?? {}, _subcomponentDefaults.value) : injected?.value;
|
|
1206
|
+
}));
|
|
1135
1207
|
}
|
|
1136
1208
|
return {
|
|
1137
1209
|
props: _props,
|
|
@@ -1313,9 +1385,10 @@ function isPotentiallyScrollable(el) {
|
|
|
1313
1385
|
// Types
|
|
1314
1386
|
|
|
1315
1387
|
function injectSelf(key) {
|
|
1388
|
+
let vm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstance('injectSelf');
|
|
1316
1389
|
const {
|
|
1317
1390
|
provides
|
|
1318
|
-
} =
|
|
1391
|
+
} = vm;
|
|
1319
1392
|
if (provides && key in provides) {
|
|
1320
1393
|
// TS doesn't allow symbol as index type
|
|
1321
1394
|
return provides[key];
|
|
@@ -1792,6 +1865,34 @@ const defaultRtl = {
|
|
|
1792
1865
|
zhHant: false
|
|
1793
1866
|
};
|
|
1794
1867
|
|
|
1868
|
+
// Utilities
|
|
1869
|
+
|
|
1870
|
+
// Types
|
|
1871
|
+
|
|
1872
|
+
function useToggleScope(source, fn) {
|
|
1873
|
+
let scope;
|
|
1874
|
+
function start() {
|
|
1875
|
+
scope = effectScope();
|
|
1876
|
+
scope.run(() => fn.length ? fn(() => {
|
|
1877
|
+
scope?.stop();
|
|
1878
|
+
start();
|
|
1879
|
+
}) : fn());
|
|
1880
|
+
}
|
|
1881
|
+
watch(source, active => {
|
|
1882
|
+
if (active && !scope) {
|
|
1883
|
+
start();
|
|
1884
|
+
} else if (!active) {
|
|
1885
|
+
scope?.stop();
|
|
1886
|
+
scope = undefined;
|
|
1887
|
+
}
|
|
1888
|
+
}, {
|
|
1889
|
+
immediate: true
|
|
1890
|
+
});
|
|
1891
|
+
onScopeDispose(() => {
|
|
1892
|
+
scope?.stop();
|
|
1893
|
+
});
|
|
1894
|
+
}
|
|
1895
|
+
|
|
1795
1896
|
// Composables
|
|
1796
1897
|
|
|
1797
1898
|
// Types
|
|
@@ -1993,94 +2094,6 @@ function useRtl() {
|
|
|
1993
2094
|
};
|
|
1994
2095
|
}
|
|
1995
2096
|
|
|
1996
|
-
/**
|
|
1997
|
-
* WCAG 3.0 APCA perceptual contrast algorithm from https://github.com/Myndex/SAPC-APCA
|
|
1998
|
-
* @licence https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
1999
|
-
* @see https://www.w3.org/WAI/GL/task-forces/silver/wiki/Visual_Contrast_of_Text_Subgroup
|
|
2000
|
-
*/
|
|
2001
|
-
// Types
|
|
2002
|
-
|
|
2003
|
-
// MAGICAL NUMBERS
|
|
2004
|
-
|
|
2005
|
-
// sRGB Conversion to Relative Luminance (Y)
|
|
2006
|
-
|
|
2007
|
-
// Transfer Curve (aka "Gamma") for sRGB linearization
|
|
2008
|
-
// Simple power curve vs piecewise described in docs
|
|
2009
|
-
// Essentially, 2.4 best models actual display
|
|
2010
|
-
// characteristics in combination with the total method
|
|
2011
|
-
const mainTRC = 2.4;
|
|
2012
|
-
const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)
|
|
2013
|
-
const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)
|
|
2014
|
-
const Bco = 0.0721750; // sRGB Blue Coefficient (from matrix)
|
|
2015
|
-
|
|
2016
|
-
// For Finding Raw SAPC Contrast from Relative Luminance (Y)
|
|
2017
|
-
|
|
2018
|
-
// Constants for SAPC Power Curve Exponents
|
|
2019
|
-
// One pair for normal text, and one for reverse
|
|
2020
|
-
// These are the "beating heart" of SAPC
|
|
2021
|
-
const normBG = 0.55;
|
|
2022
|
-
const normTXT = 0.58;
|
|
2023
|
-
const revTXT = 0.57;
|
|
2024
|
-
const revBG = 0.62;
|
|
2025
|
-
|
|
2026
|
-
// For Clamping and Scaling Values
|
|
2027
|
-
|
|
2028
|
-
const blkThrs = 0.03; // Level that triggers the soft black clamp
|
|
2029
|
-
const blkClmp = 1.45; // Exponent for the soft black clamp curve
|
|
2030
|
-
const deltaYmin = 0.0005; // Lint trap
|
|
2031
|
-
const scaleBoW = 1.25; // Scaling for dark text on light
|
|
2032
|
-
const scaleWoB = 1.25; // Scaling for light text on dark
|
|
2033
|
-
const loConThresh = 0.078; // Threshold for new simple offset scale
|
|
2034
|
-
const loConFactor = 12.82051282051282; // = 1/0.078,
|
|
2035
|
-
const loConOffset = 0.06; // The simple offset
|
|
2036
|
-
const loClip = 0.001; // Output clip (lint trap #2)
|
|
2037
|
-
|
|
2038
|
-
function APCAcontrast(text, background) {
|
|
2039
|
-
// Linearize sRGB
|
|
2040
|
-
const Rtxt = (text.r / 255) ** mainTRC;
|
|
2041
|
-
const Gtxt = (text.g / 255) ** mainTRC;
|
|
2042
|
-
const Btxt = (text.b / 255) ** mainTRC;
|
|
2043
|
-
const Rbg = (background.r / 255) ** mainTRC;
|
|
2044
|
-
const Gbg = (background.g / 255) ** mainTRC;
|
|
2045
|
-
const Bbg = (background.b / 255) ** mainTRC;
|
|
2046
|
-
|
|
2047
|
-
// Apply the standard coefficients and sum to Y
|
|
2048
|
-
let Ytxt = Rtxt * Rco + Gtxt * Gco + Btxt * Bco;
|
|
2049
|
-
let Ybg = Rbg * Rco + Gbg * Gco + Bbg * Bco;
|
|
2050
|
-
|
|
2051
|
-
// Soft clamp Y when near black.
|
|
2052
|
-
// Now clamping all colors to prevent crossover errors
|
|
2053
|
-
if (Ytxt <= blkThrs) Ytxt += (blkThrs - Ytxt) ** blkClmp;
|
|
2054
|
-
if (Ybg <= blkThrs) Ybg += (blkThrs - Ybg) ** blkClmp;
|
|
2055
|
-
|
|
2056
|
-
// Return 0 Early for extremely low ∆Y (lint trap #1)
|
|
2057
|
-
if (Math.abs(Ybg - Ytxt) < deltaYmin) return 0.0;
|
|
2058
|
-
|
|
2059
|
-
// SAPC CONTRAST
|
|
2060
|
-
|
|
2061
|
-
let outputContrast; // For weighted final values
|
|
2062
|
-
if (Ybg > Ytxt) {
|
|
2063
|
-
// For normal polarity, black text on white
|
|
2064
|
-
// Calculate the SAPC contrast value and scale
|
|
2065
|
-
|
|
2066
|
-
const SAPC = (Ybg ** normBG - Ytxt ** normTXT) * scaleBoW;
|
|
2067
|
-
|
|
2068
|
-
// NEW! SAPC SmoothScale™
|
|
2069
|
-
// Low Contrast Smooth Scale Rollout to prevent polarity reversal
|
|
2070
|
-
// and also a low clip for very low contrasts (lint trap #2)
|
|
2071
|
-
// much of this is for very low contrasts, less than 10
|
|
2072
|
-
// therefore for most reversing needs, only loConOffset is important
|
|
2073
|
-
outputContrast = SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;
|
|
2074
|
-
} else {
|
|
2075
|
-
// For reverse polarity, light text on dark
|
|
2076
|
-
// WoB should always return negative value.
|
|
2077
|
-
|
|
2078
|
-
const SAPC = (Ybg ** revBG - Ytxt ** revTXT) * scaleWoB;
|
|
2079
|
-
outputContrast = SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
|
|
2080
|
-
}
|
|
2081
|
-
return outputContrast * 100;
|
|
2082
|
-
}
|
|
2083
|
-
|
|
2084
2097
|
// Utilities
|
|
2085
2098
|
|
|
2086
2099
|
// Types
|
|
@@ -2216,8 +2229,6 @@ function createTheme(options) {
|
|
|
2216
2229
|
if (/^on-[a-z]/.test(color) || theme.colors[`on-${color}`]) continue;
|
|
2217
2230
|
const onColor = `on-${color}`;
|
|
2218
2231
|
const colorVal = parseColor(theme.colors[color]);
|
|
2219
|
-
const blackContrast = Math.abs(APCAcontrast(parseColor(0), colorVal));
|
|
2220
|
-
const whiteContrast = Math.abs(APCAcontrast(parseColor(0xffffff), colorVal));
|
|
2221
2232
|
|
|
2222
2233
|
// TODO: warn about poor color selections
|
|
2223
2234
|
// const contrastAsText = Math.abs(APCAcontrast(colorVal, colorToInt(theme.colors.background)))
|
|
@@ -2229,7 +2240,7 @@ function createTheme(options) {
|
|
|
2229
2240
|
// }
|
|
2230
2241
|
|
|
2231
2242
|
// Prefer white text if both have an acceptable contrast ratio
|
|
2232
|
-
theme.colors[onColor] =
|
|
2243
|
+
theme.colors[onColor] = getForeground(colorVal);
|
|
2233
2244
|
}
|
|
2234
2245
|
}
|
|
2235
2246
|
return acc;
|
|
@@ -3258,6 +3269,11 @@ function useColor(colors) {
|
|
|
3258
3269
|
if (colors.value.background) {
|
|
3259
3270
|
if (isCssColor(colors.value.background)) {
|
|
3260
3271
|
styles.backgroundColor = colors.value.background;
|
|
3272
|
+
if (!colors.value.text) {
|
|
3273
|
+
const textColor = getForeground(styles.backgroundColor);
|
|
3274
|
+
styles.color = textColor;
|
|
3275
|
+
styles.caretColor = textColor;
|
|
3276
|
+
}
|
|
3261
3277
|
} else {
|
|
3262
3278
|
classes.push(`bg-${colors.value.background}`);
|
|
3263
3279
|
}
|
|
@@ -5903,7 +5919,8 @@ const VSelectionControl = genericComponent()({
|
|
|
5903
5919
|
"icon": icon.value
|
|
5904
5920
|
}, null), inputNode])]), [[resolveDirective("ripple"), props.ripple && [!props.disabled && !props.readonly, null, ['center', 'circle']]]])]), label && createVNode(VLabel, {
|
|
5905
5921
|
"for": id.value,
|
|
5906
|
-
"clickable": true
|
|
5922
|
+
"clickable": true,
|
|
5923
|
+
"onClick": e => e.stopPropagation()
|
|
5907
5924
|
}, {
|
|
5908
5925
|
default: () => [label]
|
|
5909
5926
|
})]);
|
|
@@ -5952,16 +5969,19 @@ const VCheckboxBtn = genericComponent()({
|
|
|
5952
5969
|
const trueIcon = computed(() => {
|
|
5953
5970
|
return indeterminate.value ? props.indeterminateIcon : props.trueIcon;
|
|
5954
5971
|
});
|
|
5955
|
-
useRender(() =>
|
|
5956
|
-
|
|
5957
|
-
|
|
5958
|
-
|
|
5959
|
-
|
|
5960
|
-
|
|
5961
|
-
|
|
5962
|
-
|
|
5963
|
-
|
|
5964
|
-
|
|
5972
|
+
useRender(() => {
|
|
5973
|
+
const controlProps = omit(VSelectionControl.filterProps(props)[0], ['modelValue']);
|
|
5974
|
+
return createVNode(VSelectionControl, mergeProps(controlProps, {
|
|
5975
|
+
"modelValue": model.value,
|
|
5976
|
+
"onUpdate:modelValue": [$event => model.value = $event, onChange],
|
|
5977
|
+
"class": ['v-checkbox-btn', props.class],
|
|
5978
|
+
"style": props.style,
|
|
5979
|
+
"type": "checkbox",
|
|
5980
|
+
"falseIcon": falseIcon.value,
|
|
5981
|
+
"trueIcon": trueIcon.value,
|
|
5982
|
+
"aria-checked": indeterminate.value ? 'mixed' : undefined
|
|
5983
|
+
}), slots);
|
|
5984
|
+
});
|
|
5965
5985
|
return {};
|
|
5966
5986
|
}
|
|
5967
5987
|
});
|
|
@@ -6525,12 +6545,12 @@ const VCheckbox = genericComponent()({
|
|
|
6525
6545
|
const uid = getUid();
|
|
6526
6546
|
const id = computed(() => props.id || `checkbox-${uid}`);
|
|
6527
6547
|
useRender(() => {
|
|
6528
|
-
const [
|
|
6548
|
+
const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
|
|
6529
6549
|
const [inputProps, _1] = VInput.filterProps(props);
|
|
6530
6550
|
const [checkboxProps, _2] = VCheckboxBtn.filterProps(props);
|
|
6531
6551
|
return createVNode(VInput, mergeProps({
|
|
6532
6552
|
"class": ['v-checkbox', props.class]
|
|
6533
|
-
},
|
|
6553
|
+
}, rootAttrs, inputProps, {
|
|
6534
6554
|
"modelValue": model.value,
|
|
6535
6555
|
"onUpdate:modelValue": $event => model.value = $event,
|
|
6536
6556
|
"id": id.value,
|
|
@@ -10858,6 +10878,7 @@ const VSelect = genericComponent()({
|
|
|
10858
10878
|
} = useLocale();
|
|
10859
10879
|
const vTextFieldRef = ref();
|
|
10860
10880
|
const vMenuRef = ref();
|
|
10881
|
+
const vVirtualScrollRef = ref();
|
|
10861
10882
|
const _menu = useProxiedModel(props, 'menu');
|
|
10862
10883
|
const menu = computed({
|
|
10863
10884
|
get: () => _menu.value,
|
|
@@ -10987,6 +11008,14 @@ const VSelect = genericComponent()({
|
|
|
10987
11008
|
vTextFieldRef.value.value = '';
|
|
10988
11009
|
}
|
|
10989
11010
|
}
|
|
11011
|
+
watch(menu, () => {
|
|
11012
|
+
if (!props.hideSelected && menu.value && selections.value.length) {
|
|
11013
|
+
const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
|
|
11014
|
+
IN_BROWSER && window.requestAnimationFrame(() => {
|
|
11015
|
+
index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
|
|
11016
|
+
});
|
|
11017
|
+
}
|
|
11018
|
+
});
|
|
10990
11019
|
useRender(() => {
|
|
10991
11020
|
const hasChips = !!(props.chips || slots.chip);
|
|
10992
11021
|
const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
|
|
@@ -11048,6 +11077,7 @@ const VSelect = genericComponent()({
|
|
|
11048
11077
|
default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
|
|
11049
11078
|
"title": t(props.noDataText)
|
|
11050
11079
|
}, null)), createVNode(VVirtualScroll, {
|
|
11080
|
+
"ref": vVirtualScrollRef,
|
|
11051
11081
|
"renderless": true,
|
|
11052
11082
|
"items": displayItems.value
|
|
11053
11083
|
}, {
|
|
@@ -11308,6 +11338,7 @@ const VAutocomplete = genericComponent()({
|
|
|
11308
11338
|
const isPristine = shallowRef(true);
|
|
11309
11339
|
const listHasFocus = shallowRef(false);
|
|
11310
11340
|
const vMenuRef = ref();
|
|
11341
|
+
const vVirtualScrollRef = ref();
|
|
11311
11342
|
const _menu = useProxiedModel(props, 'menu');
|
|
11312
11343
|
const menu = computed({
|
|
11313
11344
|
get: () => _menu.value,
|
|
@@ -11398,7 +11429,7 @@ const VAutocomplete = genericComponent()({
|
|
|
11398
11429
|
menu.value = false;
|
|
11399
11430
|
}
|
|
11400
11431
|
if (highlightFirst.value && ['Enter', 'Tab'].includes(e.key)) {
|
|
11401
|
-
select(
|
|
11432
|
+
select(displayItems.value[0]);
|
|
11402
11433
|
}
|
|
11403
11434
|
if (e.key === 'ArrowDown' && highlightFirst.value) {
|
|
11404
11435
|
listRef.value?.focus('next');
|
|
@@ -11511,6 +11542,14 @@ const VAutocomplete = genericComponent()({
|
|
|
11511
11542
|
if (val) menu.value = true;
|
|
11512
11543
|
isPristine.value = !val;
|
|
11513
11544
|
});
|
|
11545
|
+
watch(menu, () => {
|
|
11546
|
+
if (!props.hideSelected && menu.value && selections.value.length) {
|
|
11547
|
+
const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
|
|
11548
|
+
IN_BROWSER && window.requestAnimationFrame(() => {
|
|
11549
|
+
index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
|
|
11550
|
+
});
|
|
11551
|
+
}
|
|
11552
|
+
});
|
|
11514
11553
|
useRender(() => {
|
|
11515
11554
|
const hasChips = !!(props.chips || slots.chip);
|
|
11516
11555
|
const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
|
|
@@ -11570,6 +11609,7 @@ const VAutocomplete = genericComponent()({
|
|
|
11570
11609
|
default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
|
|
11571
11610
|
"title": t(props.noDataText)
|
|
11572
11611
|
}, null)), createVNode(VVirtualScroll, {
|
|
11612
|
+
"ref": vVirtualScrollRef,
|
|
11573
11613
|
"renderless": true,
|
|
11574
11614
|
"items": displayItems.value
|
|
11575
11615
|
}, {
|
|
@@ -14841,6 +14881,7 @@ const VCombobox = genericComponent()({
|
|
|
14841
14881
|
const isPristine = shallowRef(true);
|
|
14842
14882
|
const listHasFocus = shallowRef(false);
|
|
14843
14883
|
const vMenuRef = ref();
|
|
14884
|
+
const vVirtualScrollRef = ref();
|
|
14844
14885
|
const _menu = useProxiedModel(props, 'menu');
|
|
14845
14886
|
const menu = computed({
|
|
14846
14887
|
get: () => _menu.value,
|
|
@@ -15074,6 +15115,14 @@ const VCombobox = genericComponent()({
|
|
|
15074
15115
|
search.value = '';
|
|
15075
15116
|
}
|
|
15076
15117
|
});
|
|
15118
|
+
watch(menu, () => {
|
|
15119
|
+
if (!props.hideSelected && menu.value && selections.value.length) {
|
|
15120
|
+
const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
|
|
15121
|
+
IN_BROWSER && window.requestAnimationFrame(() => {
|
|
15122
|
+
index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
|
|
15123
|
+
});
|
|
15124
|
+
}
|
|
15125
|
+
});
|
|
15077
15126
|
useRender(() => {
|
|
15078
15127
|
const hasChips = !!(props.chips || slots.chip);
|
|
15079
15128
|
const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
|
|
@@ -15132,6 +15181,7 @@ const VCombobox = genericComponent()({
|
|
|
15132
15181
|
default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
|
|
15133
15182
|
"title": t(props.noDataText)
|
|
15134
15183
|
}, null)), createVNode(VVirtualScroll, {
|
|
15184
|
+
"ref": vVirtualScrollRef,
|
|
15135
15185
|
"renderless": true,
|
|
15136
15186
|
"items": displayItems.value
|
|
15137
15187
|
}, {
|
|
@@ -17523,7 +17573,7 @@ const VRadioGroup = genericComponent()({
|
|
|
17523
17573
|
const id = computed(() => props.id || `radio-group-${uid}`);
|
|
17524
17574
|
const model = useProxiedModel(props, 'modelValue');
|
|
17525
17575
|
useRender(() => {
|
|
17526
|
-
const [
|
|
17576
|
+
const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
|
|
17527
17577
|
const [inputProps, _1] = VInput.filterProps(props);
|
|
17528
17578
|
const [controlProps, _2] = VSelectionControl.filterProps(props);
|
|
17529
17579
|
const label = slots.label ? slots.label({
|
|
@@ -17535,7 +17585,7 @@ const VRadioGroup = genericComponent()({
|
|
|
17535
17585
|
return createVNode(VInput, mergeProps({
|
|
17536
17586
|
"class": ['v-radio-group', props.class],
|
|
17537
17587
|
"style": props.style
|
|
17538
|
-
},
|
|
17588
|
+
}, rootAttrs, inputProps, {
|
|
17539
17589
|
"modelValue": model.value,
|
|
17540
17590
|
"onUpdate:modelValue": $event => model.value = $event,
|
|
17541
17591
|
"id": id.value
|
|
@@ -18512,6 +18562,7 @@ const VSwitch = genericComponent()({
|
|
|
18512
18562
|
focus,
|
|
18513
18563
|
blur
|
|
18514
18564
|
} = useFocus(props);
|
|
18565
|
+
const control = ref();
|
|
18515
18566
|
const loaderColor = computed(() => {
|
|
18516
18567
|
return typeof props.loading === 'string' && props.loading !== '' ? props.loading : props.color;
|
|
18517
18568
|
});
|
|
@@ -18522,16 +18573,15 @@ const VSwitch = genericComponent()({
|
|
|
18522
18573
|
indeterminate.value = false;
|
|
18523
18574
|
}
|
|
18524
18575
|
}
|
|
18576
|
+
function onTrackClick(e) {
|
|
18577
|
+
e.stopPropagation();
|
|
18578
|
+
e.preventDefault();
|
|
18579
|
+
control.value?.input?.click();
|
|
18580
|
+
}
|
|
18525
18581
|
useRender(() => {
|
|
18526
|
-
const [
|
|
18582
|
+
const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
|
|
18527
18583
|
const [inputProps, _1] = VInput.filterProps(props);
|
|
18528
18584
|
const [controlProps, _2] = VSelectionControl.filterProps(props);
|
|
18529
|
-
const control = ref();
|
|
18530
|
-
function onClick(e) {
|
|
18531
|
-
e.stopPropagation();
|
|
18532
|
-
e.preventDefault();
|
|
18533
|
-
control.value?.input?.click();
|
|
18534
|
-
}
|
|
18535
18585
|
return createVNode(VInput, mergeProps({
|
|
18536
18586
|
"class": ['v-switch', {
|
|
18537
18587
|
'v-switch--inset': props.inset
|
|
@@ -18539,7 +18589,7 @@ const VSwitch = genericComponent()({
|
|
|
18539
18589
|
'v-switch--indeterminate': indeterminate.value
|
|
18540
18590
|
}, loaderClasses.value, props.class],
|
|
18541
18591
|
"style": props.style
|
|
18542
|
-
},
|
|
18592
|
+
}, rootAttrs, inputProps, {
|
|
18543
18593
|
"id": id.value,
|
|
18544
18594
|
"focused": isFocused.value
|
|
18545
18595
|
}), {
|
|
@@ -18569,7 +18619,7 @@ const VSwitch = genericComponent()({
|
|
|
18569
18619
|
...slots,
|
|
18570
18620
|
default: () => createVNode("div", {
|
|
18571
18621
|
"class": "v-switch__track",
|
|
18572
|
-
"onClick":
|
|
18622
|
+
"onClick": onTrackClick
|
|
18573
18623
|
}, null),
|
|
18574
18624
|
input: _ref3 => {
|
|
18575
18625
|
let {
|
|
@@ -21721,6 +21771,98 @@ const VDataTableServer = genericComponent()({
|
|
|
21721
21771
|
}
|
|
21722
21772
|
});
|
|
21723
21773
|
|
|
21774
|
+
// Types
|
|
21775
|
+
|
|
21776
|
+
const makeVDatePickerControlsProps = propsFactory({
|
|
21777
|
+
displayDate: String,
|
|
21778
|
+
disabled: {
|
|
21779
|
+
type: [Boolean, String],
|
|
21780
|
+
default: false
|
|
21781
|
+
},
|
|
21782
|
+
nextIcon: {
|
|
21783
|
+
type: [String],
|
|
21784
|
+
default: '$next'
|
|
21785
|
+
},
|
|
21786
|
+
prevIcon: {
|
|
21787
|
+
type: [String],
|
|
21788
|
+
default: '$prev'
|
|
21789
|
+
},
|
|
21790
|
+
expandIcon: {
|
|
21791
|
+
type: [String],
|
|
21792
|
+
default: '$expand'
|
|
21793
|
+
},
|
|
21794
|
+
collapseIcon: {
|
|
21795
|
+
type: [String],
|
|
21796
|
+
default: '$collapse'
|
|
21797
|
+
},
|
|
21798
|
+
viewMode: {
|
|
21799
|
+
type: String,
|
|
21800
|
+
default: 'month'
|
|
21801
|
+
}
|
|
21802
|
+
}, 'VDatePickerControls');
|
|
21803
|
+
const VDatePickerControls = genericComponent()({
|
|
21804
|
+
name: 'VDatePickerControls',
|
|
21805
|
+
props: makeVDatePickerControlsProps(),
|
|
21806
|
+
emits: {
|
|
21807
|
+
'click:mode': () => true,
|
|
21808
|
+
'click:prev': () => true,
|
|
21809
|
+
'click:next': () => true
|
|
21810
|
+
},
|
|
21811
|
+
setup(props, _ref) {
|
|
21812
|
+
let {
|
|
21813
|
+
emit
|
|
21814
|
+
} = _ref;
|
|
21815
|
+
const modeIcon = computed(() => {
|
|
21816
|
+
return props.viewMode === 'month' ? props.expandIcon : props.collapseIcon;
|
|
21817
|
+
});
|
|
21818
|
+
const disableMode = computed(() => {
|
|
21819
|
+
return Array.isArray(props.disabled) ? props.disabled.includes('mode') : props.disabled;
|
|
21820
|
+
});
|
|
21821
|
+
const disablePrev = computed(() => {
|
|
21822
|
+
return Array.isArray(props.disabled) ? props.disabled.includes('prev') : props.disabled;
|
|
21823
|
+
});
|
|
21824
|
+
const disableNext = computed(() => {
|
|
21825
|
+
return Array.isArray(props.disabled) ? props.disabled.includes('next') : props.disabled;
|
|
21826
|
+
});
|
|
21827
|
+
function onClickPrev() {
|
|
21828
|
+
emit('click:prev');
|
|
21829
|
+
}
|
|
21830
|
+
function onClickNext() {
|
|
21831
|
+
emit('click:next');
|
|
21832
|
+
}
|
|
21833
|
+
function onClickMode() {
|
|
21834
|
+
emit('click:mode');
|
|
21835
|
+
}
|
|
21836
|
+
useRender(() => {
|
|
21837
|
+
return createVNode("div", {
|
|
21838
|
+
"class": "v-date-picker-controls"
|
|
21839
|
+
}, [createVNode("div", {
|
|
21840
|
+
"class": "v-date-picker-controls__date"
|
|
21841
|
+
}, [props.displayDate]), createVNode(VBtn, {
|
|
21842
|
+
"disabled": disableMode.value,
|
|
21843
|
+
"key": "expand-btn",
|
|
21844
|
+
"icon": modeIcon.value,
|
|
21845
|
+
"variant": "text",
|
|
21846
|
+
"onClick": onClickMode
|
|
21847
|
+
}, null), createVNode(VSpacer, null, null), createVNode("div", {
|
|
21848
|
+
"key": "month-buttons",
|
|
21849
|
+
"class": "v-date-picker-controls__month"
|
|
21850
|
+
}, [createVNode(VBtn, {
|
|
21851
|
+
"disabled": disablePrev.value,
|
|
21852
|
+
"icon": props.prevIcon,
|
|
21853
|
+
"variant": "text",
|
|
21854
|
+
"onClick": onClickPrev
|
|
21855
|
+
}, null), createVNode(VBtn, {
|
|
21856
|
+
"disabled": disableNext.value,
|
|
21857
|
+
"icon": props.nextIcon,
|
|
21858
|
+
"variant": "text",
|
|
21859
|
+
"onClick": onClickNext
|
|
21860
|
+
}, null)])]);
|
|
21861
|
+
});
|
|
21862
|
+
return {};
|
|
21863
|
+
}
|
|
21864
|
+
});
|
|
21865
|
+
|
|
21724
21866
|
// Utilities
|
|
21725
21867
|
|
|
21726
21868
|
// Types
|
|
@@ -22289,76 +22431,6 @@ function createDateInput(props, isRange) {
|
|
|
22289
22431
|
};
|
|
22290
22432
|
}
|
|
22291
22433
|
|
|
22292
|
-
const makeVDatePickerControlsProps = propsFactory({
|
|
22293
|
-
nextIcon: {
|
|
22294
|
-
type: [String],
|
|
22295
|
-
default: '$next'
|
|
22296
|
-
},
|
|
22297
|
-
prevIcon: {
|
|
22298
|
-
type: [String],
|
|
22299
|
-
default: '$prev'
|
|
22300
|
-
},
|
|
22301
|
-
expandIcon: {
|
|
22302
|
-
type: [String],
|
|
22303
|
-
default: '$expand'
|
|
22304
|
-
},
|
|
22305
|
-
collapseIcon: {
|
|
22306
|
-
type: [String],
|
|
22307
|
-
default: '$collapse'
|
|
22308
|
-
},
|
|
22309
|
-
range: {
|
|
22310
|
-
default: false,
|
|
22311
|
-
type: [Boolean, String],
|
|
22312
|
-
validator: v => v === false || ['start', 'end'].includes(v)
|
|
22313
|
-
},
|
|
22314
|
-
...omit(makeDateProps(), ['modelValue', 'inputMode'])
|
|
22315
|
-
}, 'VDatePickerControls');
|
|
22316
|
-
const VDatePickerControls = genericComponent()({
|
|
22317
|
-
name: 'VDatePickerControls',
|
|
22318
|
-
props: makeVDatePickerControlsProps(),
|
|
22319
|
-
emits: {
|
|
22320
|
-
...omit(dateEmits, ['update:modelValue', 'update:inputMode'])
|
|
22321
|
-
},
|
|
22322
|
-
setup(props, _ref) {
|
|
22323
|
-
let {
|
|
22324
|
-
emit
|
|
22325
|
-
} = _ref;
|
|
22326
|
-
const adapter = useDate();
|
|
22327
|
-
const monthAndYear = computed(() => {
|
|
22328
|
-
const month = props.range === 'end' ? adapter.addMonths(props.displayDate, 1) : props.displayDate;
|
|
22329
|
-
return adapter.format(month, 'monthAndYear');
|
|
22330
|
-
});
|
|
22331
|
-
useRender(() => {
|
|
22332
|
-
const prevBtn = createVNode(VBtn, {
|
|
22333
|
-
"variant": "text",
|
|
22334
|
-
"icon": props.prevIcon,
|
|
22335
|
-
"onClick": () => emit('update:displayDate', adapter.addMonths(props.displayDate, -1))
|
|
22336
|
-
}, null);
|
|
22337
|
-
const nextBtn = createVNode(VBtn, {
|
|
22338
|
-
"variant": "text",
|
|
22339
|
-
"icon": props.nextIcon,
|
|
22340
|
-
"onClick": () => emit('update:displayDate', adapter.addMonths(props.displayDate, 1))
|
|
22341
|
-
}, null);
|
|
22342
|
-
return createVNode("div", {
|
|
22343
|
-
"class": "v-date-picker-controls"
|
|
22344
|
-
}, [props.viewMode === 'month' && props.range === 'start' && prevBtn, !!props.range && createVNode(VSpacer, {
|
|
22345
|
-
"key": "range-spacer"
|
|
22346
|
-
}, null), createVNode("div", {
|
|
22347
|
-
"class": "v-date-picker-controls__date"
|
|
22348
|
-
}, [monthAndYear.value]), createVNode(VBtn, {
|
|
22349
|
-
"key": "expand-btn",
|
|
22350
|
-
"variant": "text",
|
|
22351
|
-
"icon": props.viewMode === 'month' ? props.expandIcon : props.collapseIcon,
|
|
22352
|
-
"onClick": () => emit('update:viewMode', props.viewMode === 'month' ? 'year' : 'month')
|
|
22353
|
-
}, null), createVNode(VSpacer, null, null), props.viewMode === 'month' && !props.range && createVNode("div", {
|
|
22354
|
-
"class": "v-date-picker-controls__month",
|
|
22355
|
-
"key": "month-buttons"
|
|
22356
|
-
}, [prevBtn, nextBtn]), props.viewMode === 'month' && props.range === 'end' && nextBtn]);
|
|
22357
|
-
});
|
|
22358
|
-
return {};
|
|
22359
|
-
}
|
|
22360
|
-
});
|
|
22361
|
-
|
|
22362
22434
|
// Composables
|
|
22363
22435
|
|
|
22364
22436
|
// Types
|
|
@@ -22415,6 +22487,8 @@ const makeVDatePickerMonthProps = propsFactory({
|
|
|
22415
22487
|
side: {
|
|
22416
22488
|
type: String
|
|
22417
22489
|
},
|
|
22490
|
+
min: [Number, String, Date],
|
|
22491
|
+
max: [Number, String, Date],
|
|
22418
22492
|
...omit(makeDateProps(), ['inputMode', 'viewMode'])
|
|
22419
22493
|
}, 'VDatePickerMonth');
|
|
22420
22494
|
const VDatePickerMonth = genericComponent()({
|
|
@@ -22490,6 +22564,7 @@ const VDatePickerMonth = genericComponent()({
|
|
|
22490
22564
|
const startDate = validDates[0];
|
|
22491
22565
|
const endDate = validDates[1];
|
|
22492
22566
|
return days.map((date, index) => {
|
|
22567
|
+
const isDisabled = !!(props.min && adapter.isAfter(props.min, date) || props.max && adapter.isAfter(date, props.max));
|
|
22493
22568
|
const isStart = startDate && adapter.isSameDay(date, startDate);
|
|
22494
22569
|
const isEnd = endDate && adapter.isSameDay(date, endDate);
|
|
22495
22570
|
const isAdjacent = !adapter.isSameMonth(date, month.value);
|
|
@@ -22500,6 +22575,7 @@ const VDatePickerMonth = genericComponent()({
|
|
|
22500
22575
|
formatted: adapter.format(date, 'keyboardDate'),
|
|
22501
22576
|
year: adapter.getYear(date),
|
|
22502
22577
|
month: adapter.getMonth(date),
|
|
22578
|
+
isDisabled,
|
|
22503
22579
|
isWeekStart: index % 7 === 0,
|
|
22504
22580
|
isWeekEnd: index % 7 === 6,
|
|
22505
22581
|
isSelected: isStart || isEnd,
|
|
@@ -22642,50 +22718,55 @@ const VDatePickerMonth = genericComponent()({
|
|
|
22642
22718
|
"onTouchstart": handleMousedown
|
|
22643
22719
|
}, [!props.hideWeekdays && adapter.getWeekdays().map(weekDay => createVNode("div", {
|
|
22644
22720
|
"class": ['v-date-picker-month__day', 'v-date-picker-month__weekday']
|
|
22645
|
-
}, [weekDay])), daysInMonth.value.map((item, index) =>
|
|
22646
|
-
|
|
22647
|
-
|
|
22648
|
-
|
|
22649
|
-
'v-date-picker-month__day
|
|
22650
|
-
|
|
22651
|
-
|
|
22652
|
-
|
|
22653
|
-
|
|
22654
|
-
|
|
22655
|
-
|
|
22656
|
-
|
|
22657
|
-
|
|
22658
|
-
|
|
22659
|
-
|
|
22660
|
-
"
|
|
22661
|
-
|
|
22662
|
-
|
|
22663
|
-
|
|
22664
|
-
|
|
22665
|
-
|
|
22666
|
-
|
|
22667
|
-
|
|
22668
|
-
|
|
22669
|
-
|
|
22670
|
-
|
|
22671
|
-
|
|
22672
|
-
|
|
22721
|
+
}, [weekDay])), daysInMonth.value.map((item, index) => {
|
|
22722
|
+
const color = item.isSelected || item.isToday ? props.color : item.isHovered || item.isDisabled ? undefined : 'transparent';
|
|
22723
|
+
const variant = item.isDisabled ? 'text' : (item.isToday || item.isHovered) && !item.isSelected ? 'outlined' : 'flat';
|
|
22724
|
+
return createVNode("div", {
|
|
22725
|
+
"class": ['v-date-picker-month__day', {
|
|
22726
|
+
'v-date-picker-month__day--selected': item.isSelected,
|
|
22727
|
+
'v-date-picker-month__day--start': item.isStart,
|
|
22728
|
+
'v-date-picker-month__day--end': item.isEnd,
|
|
22729
|
+
'v-date-picker-month__day--adjacent': item.isAdjacent,
|
|
22730
|
+
'v-date-picker-month__day--hide-adjacent': item.isHidden,
|
|
22731
|
+
'v-date-picker-month__day--week-start': item.isWeekStart,
|
|
22732
|
+
'v-date-picker-month__day--week-end': item.isWeekEnd,
|
|
22733
|
+
'v-date-picker-month__day--hovered': item.isHovered
|
|
22734
|
+
}],
|
|
22735
|
+
"data-v-date": !item.isHidden && !item.isDisabled ? item.isoDate : undefined
|
|
22736
|
+
}, [item.inRange && createVNode("div", {
|
|
22737
|
+
"key": "in-range",
|
|
22738
|
+
"class": ['v-date-picker-month__day--range', backgroundColorClasses.value],
|
|
22739
|
+
"style": backgroundColorStyles.value
|
|
22740
|
+
}, null), item.inHover && !item.isStart && !item.isEnd && !item.isHovered && !item.inRange && createVNode("div", {
|
|
22741
|
+
"key": "in-hover",
|
|
22742
|
+
"class": "v-date-picker-month__day--hover"
|
|
22743
|
+
}, null), (props.showAdjacentMonths || !item.isAdjacent) && createVNode(VBtn, {
|
|
22744
|
+
"active": item.isSelected,
|
|
22745
|
+
"color": color,
|
|
22746
|
+
"disabled": item.isDisabled,
|
|
22747
|
+
"icon": true,
|
|
22748
|
+
"ripple": false,
|
|
22749
|
+
"variant": variant
|
|
22750
|
+
}, {
|
|
22751
|
+
default: () => [item.localized]
|
|
22752
|
+
})]);
|
|
22753
|
+
})])]);
|
|
22673
22754
|
}
|
|
22674
22755
|
});
|
|
22675
22756
|
|
|
22676
22757
|
const makeVDatePickerYearsProps = propsFactory({
|
|
22677
22758
|
color: String,
|
|
22678
|
-
min: Number,
|
|
22679
|
-
max: Number,
|
|
22680
22759
|
height: [String, Number],
|
|
22681
|
-
displayDate: null
|
|
22760
|
+
displayDate: null,
|
|
22761
|
+
min: [Number, String, Date],
|
|
22762
|
+
max: [Number, String, Date]
|
|
22682
22763
|
}, 'VDatePickerYears');
|
|
22683
22764
|
const VDatePickerYears = genericComponent()({
|
|
22684
22765
|
name: 'VDatePickerYears',
|
|
22685
22766
|
props: makeVDatePickerYearsProps(),
|
|
22686
22767
|
emits: {
|
|
22687
22768
|
'update:displayDate': date => true,
|
|
22688
|
-
'
|
|
22769
|
+
'click:mode': () => true
|
|
22689
22770
|
},
|
|
22690
22771
|
setup(props, _ref) {
|
|
22691
22772
|
let {
|
|
@@ -22694,8 +22775,8 @@ const VDatePickerYears = genericComponent()({
|
|
|
22694
22775
|
const adapter = useDate();
|
|
22695
22776
|
const displayYear = computed(() => adapter.getYear(props.displayDate ?? new Date()));
|
|
22696
22777
|
const years = computed(() => {
|
|
22697
|
-
const min = props.min
|
|
22698
|
-
const max = props.max
|
|
22778
|
+
const min = props.min ? adapter.date(props.min).getFullYear() : displayYear.value - 100;
|
|
22779
|
+
const max = props.max ? adapter.date(props.max).getFullYear() : displayYear.value + 50;
|
|
22699
22780
|
return createRange(max - min, min);
|
|
22700
22781
|
});
|
|
22701
22782
|
const yearRef = ref();
|
|
@@ -22711,19 +22792,21 @@ const VDatePickerYears = genericComponent()({
|
|
|
22711
22792
|
}
|
|
22712
22793
|
}, [createVNode("div", {
|
|
22713
22794
|
"class": "v-date-picker-years__content"
|
|
22714
|
-
}, [years.value.map(year =>
|
|
22715
|
-
|
|
22716
|
-
"variant": year === displayYear.value ? 'flat' : 'text',
|
|
22717
|
-
"rounded": "xl",
|
|
22718
|
-
"active": year === displayYear.value,
|
|
22719
|
-
"color": year === displayYear.value ? props.color : undefined,
|
|
22720
|
-
"onClick": () => {
|
|
22795
|
+
}, [years.value.map(year => {
|
|
22796
|
+
function onClick() {
|
|
22721
22797
|
emit('update:displayDate', adapter.setYear(props.displayDate, year));
|
|
22722
|
-
emit('
|
|
22723
|
-
}
|
|
22724
|
-
|
|
22725
|
-
|
|
22726
|
-
|
|
22798
|
+
emit('click:mode');
|
|
22799
|
+
}
|
|
22800
|
+
return createVNode(VBtn, {
|
|
22801
|
+
"ref": year === displayYear.value ? yearRef : undefined,
|
|
22802
|
+
"active": year === displayYear.value,
|
|
22803
|
+
"color": year === displayYear.value ? props.color : undefined,
|
|
22804
|
+
"rounded": "xl",
|
|
22805
|
+
"text": String(year),
|
|
22806
|
+
"variant": year === displayYear.value ? 'flat' : 'text',
|
|
22807
|
+
"onClick": onClick
|
|
22808
|
+
}, null);
|
|
22809
|
+
})])]));
|
|
22727
22810
|
return {};
|
|
22728
22811
|
}
|
|
22729
22812
|
});
|
|
@@ -23008,21 +23091,24 @@ const VDatePicker = genericComponent()({
|
|
|
23008
23091
|
const header = computed(() => model.value.length ? adapter.format(model.value[0], 'normalDateWithWeekday') : t(props.header));
|
|
23009
23092
|
const headerIcon = computed(() => inputMode.value === 'calendar' ? props.keyboardIcon : props.calendarIcon);
|
|
23010
23093
|
const headerTransition = computed(() => `date-picker-header${isReversing.value ? '-reverse' : ''}-transition`);
|
|
23011
|
-
|
|
23012
|
-
|
|
23013
|
-
|
|
23014
|
-
|
|
23015
|
-
|
|
23016
|
-
if (
|
|
23017
|
-
const
|
|
23018
|
-
|
|
23019
|
-
if (props.hideActions) {
|
|
23020
|
-
model.value = newModel;
|
|
23021
|
-
} else {
|
|
23022
|
-
temporaryModel.value = newModel;
|
|
23023
|
-
}
|
|
23094
|
+
const minDate = computed(() => props.min && adapter.isValid(props.min) ? adapter.date(props.min) : null);
|
|
23095
|
+
const maxDate = computed(() => props.max && adapter.isValid(props.max) ? adapter.date(props.max) : null);
|
|
23096
|
+
const disabled = computed(() => {
|
|
23097
|
+
if (!minDate.value && !maxDate.value) return false;
|
|
23098
|
+
const targets = [];
|
|
23099
|
+
if (minDate.value) {
|
|
23100
|
+
const date = adapter.addDays(adapter.startOfMonth(displayDate.value), -1);
|
|
23101
|
+
adapter.isAfter(minDate.value, date) && targets.push('prev');
|
|
23024
23102
|
}
|
|
23025
|
-
|
|
23103
|
+
if (maxDate.value) {
|
|
23104
|
+
const date = adapter.addDays(adapter.endOfMonth(displayDate.value), 1);
|
|
23105
|
+
adapter.isAfter(date, maxDate.value) && targets.push('next');
|
|
23106
|
+
}
|
|
23107
|
+
if (minDate.value?.getFullYear() === maxDate.value?.getFullYear()) {
|
|
23108
|
+
targets.push('mode');
|
|
23109
|
+
}
|
|
23110
|
+
return targets;
|
|
23111
|
+
});
|
|
23026
23112
|
watch(model, val => {
|
|
23027
23113
|
if (!isEqual(val, temporaryModel.value)) {
|
|
23028
23114
|
temporaryModel.value = val;
|
|
@@ -23037,6 +23123,21 @@ const VDatePicker = genericComponent()({
|
|
|
23037
23123
|
isReversing.value = adapter.isBefore(val[0], oldVal[0]);
|
|
23038
23124
|
}
|
|
23039
23125
|
});
|
|
23126
|
+
function updateFromInput(input, index) {
|
|
23127
|
+
const {
|
|
23128
|
+
isValid,
|
|
23129
|
+
date
|
|
23130
|
+
} = adapter;
|
|
23131
|
+
if (isValid(input)) {
|
|
23132
|
+
const newModel = model.value.slice();
|
|
23133
|
+
newModel[index] = date(input);
|
|
23134
|
+
if (props.hideActions) {
|
|
23135
|
+
model.value = newModel;
|
|
23136
|
+
} else {
|
|
23137
|
+
temporaryModel.value = newModel;
|
|
23138
|
+
}
|
|
23139
|
+
}
|
|
23140
|
+
}
|
|
23040
23141
|
function onClickCancel() {
|
|
23041
23142
|
emit('click:cancel');
|
|
23042
23143
|
}
|
|
@@ -23047,6 +23148,15 @@ const VDatePicker = genericComponent()({
|
|
|
23047
23148
|
function onClickAppend() {
|
|
23048
23149
|
inputMode.value = inputMode.value === 'calendar' ? 'keyboard' : 'calendar';
|
|
23049
23150
|
}
|
|
23151
|
+
function onClickNext() {
|
|
23152
|
+
displayDate.value = adapter.addMonths(displayDate.value, 1);
|
|
23153
|
+
}
|
|
23154
|
+
function onClickPrev() {
|
|
23155
|
+
displayDate.value = adapter.addMonths(displayDate.value, -1);
|
|
23156
|
+
}
|
|
23157
|
+
function onClickMode() {
|
|
23158
|
+
viewMode.value = viewMode.value === 'month' ? 'year' : 'month';
|
|
23159
|
+
}
|
|
23050
23160
|
const headerSlotProps = computed(() => ({
|
|
23051
23161
|
header: header.value,
|
|
23052
23162
|
appendIcon: headerIcon.value,
|
|
@@ -23068,10 +23178,11 @@ const VDatePicker = genericComponent()({
|
|
|
23068
23178
|
"key": "header"
|
|
23069
23179
|
}, headerSlotProps.value), null),
|
|
23070
23180
|
default: () => inputMode.value === 'calendar' ? createVNode(Fragment, null, [createVNode(VDatePickerControls, mergeProps(datePickerControlsProps, {
|
|
23071
|
-
"
|
|
23072
|
-
"
|
|
23073
|
-
"
|
|
23074
|
-
"
|
|
23181
|
+
"disabled": disabled.value,
|
|
23182
|
+
"displayDate": adapter.format(displayDate.value, 'monthAndYear'),
|
|
23183
|
+
"onClick:next": onClickNext,
|
|
23184
|
+
"onClick:prev": onClickPrev,
|
|
23185
|
+
"onClick:mode": onClickMode
|
|
23075
23186
|
}), null), createVNode(VFadeTransition, {
|
|
23076
23187
|
"hideOnLeave": true
|
|
23077
23188
|
}, {
|
|
@@ -23081,14 +23192,16 @@ const VDatePicker = genericComponent()({
|
|
|
23081
23192
|
"modelValue": temporaryModel.value,
|
|
23082
23193
|
"onUpdate:modelValue": $event => temporaryModel.value = $event,
|
|
23083
23194
|
"displayDate": displayDate.value,
|
|
23084
|
-
"
|
|
23195
|
+
"min": minDate.value,
|
|
23196
|
+
"max": maxDate.value
|
|
23085
23197
|
}), null) : createVNode(VDatePickerYears, mergeProps({
|
|
23086
23198
|
"key": "date-picker-years"
|
|
23087
23199
|
}, datePickerYearsProps, {
|
|
23088
23200
|
"displayDate": displayDate.value,
|
|
23089
23201
|
"onUpdate:displayDate": $event => displayDate.value = $event,
|
|
23090
|
-
"
|
|
23091
|
-
"
|
|
23202
|
+
"min": minDate.value,
|
|
23203
|
+
"max": maxDate.value,
|
|
23204
|
+
"onClick:mode": onClickMode
|
|
23092
23205
|
}), null)]
|
|
23093
23206
|
})]) : createVNode("div", {
|
|
23094
23207
|
"class": "v-date-picker__input"
|
|
@@ -24431,7 +24544,7 @@ function createVuetify$1() {
|
|
|
24431
24544
|
date
|
|
24432
24545
|
};
|
|
24433
24546
|
}
|
|
24434
|
-
const version$1 = "3.3.
|
|
24547
|
+
const version$1 = "3.3.14";
|
|
24435
24548
|
createVuetify$1.version = version$1;
|
|
24436
24549
|
|
|
24437
24550
|
// Vue's inject() can only be used in setup
|
|
@@ -24445,7 +24558,7 @@ function inject(key) {
|
|
|
24445
24558
|
|
|
24446
24559
|
/* eslint-disable local-rules/sort-imports */
|
|
24447
24560
|
|
|
24448
|
-
const version = "3.3.
|
|
24561
|
+
const version = "3.3.14";
|
|
24449
24562
|
|
|
24450
24563
|
/* eslint-disable local-rules/sort-imports */
|
|
24451
24564
|
|