vuetify 3.9.5 → 3.9.7
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 +3244 -3236
- package/dist/json/importMap-labs.json +28 -28
- package/dist/json/importMap.json +162 -162
- package/dist/json/tags.json +2 -0
- package/dist/json/web-types.json +6419 -6311
- package/dist/vuetify-labs.cjs +183 -127
- package/dist/vuetify-labs.css +3841 -3706
- package/dist/vuetify-labs.d.ts +173 -75
- package/dist/vuetify-labs.esm.js +183 -127
- package/dist/vuetify-labs.esm.js.map +1 -1
- package/dist/vuetify-labs.js +183 -127
- package/dist/vuetify-labs.min.css +2 -2
- package/dist/vuetify.cjs +78 -44
- package/dist/vuetify.cjs.map +1 -1
- package/dist/vuetify.css +2171 -2039
- package/dist/vuetify.d.ts +70 -70
- package/dist/vuetify.esm.js +78 -44
- package/dist/vuetify.esm.js.map +1 -1
- package/dist/vuetify.js +78 -44
- package/dist/vuetify.js.map +1 -1
- package/dist/vuetify.min.css +2 -2
- package/dist/vuetify.min.js +67 -60
- package/dist/vuetify.min.js.map +1 -1
- package/lib/components/VAlert/VAlert.css +12 -0
- package/lib/components/VAlert/VAlert.sass +13 -0
- package/lib/components/VAutocomplete/VAutocomplete.css +2 -1
- package/lib/components/VAutocomplete/VAutocomplete.sass +3 -2
- package/lib/components/VBtn/VBtn.css +10 -0
- package/lib/components/VBtn/VBtn.sass +9 -0
- package/lib/components/VCard/VCard.css +11 -0
- package/lib/components/VCard/VCard.sass +9 -0
- package/lib/components/VChip/VChip.css +6 -0
- package/lib/components/VChip/VChip.sass +5 -0
- package/lib/components/VChipGroup/VChipGroup.css +25 -0
- package/lib/components/VChipGroup/VChipGroup.sass +23 -0
- package/lib/components/VCombobox/VCombobox.css +2 -1
- package/lib/components/VCombobox/VCombobox.sass +3 -2
- package/lib/components/VDatePicker/VDatePicker.js +10 -4
- package/lib/components/VDatePicker/VDatePicker.js.map +1 -1
- package/lib/components/VDatePicker/VDatePickerYears.js +18 -8
- package/lib/components/VDatePicker/VDatePickerYears.js.map +1 -1
- package/lib/components/VFileInput/VFileInput.js +4 -2
- package/lib/components/VFileInput/VFileInput.js.map +1 -1
- package/lib/components/VList/VListItem.css +30 -0
- package/lib/components/VList/VListItem.d.ts +3 -3
- package/lib/components/VList/VListItem.sass +29 -0
- package/lib/components/VNumberInput/VNumberInput.js +6 -6
- package/lib/components/VNumberInput/VNumberInput.js.map +1 -1
- package/lib/components/VOtpInput/VOtpInput.js +9 -2
- package/lib/components/VOtpInput/VOtpInput.js.map +1 -1
- package/lib/components/VProgressLinear/VProgressLinear.css +3 -3
- package/lib/components/VProgressLinear/VProgressLinear.js +5 -6
- package/lib/components/VProgressLinear/VProgressLinear.js.map +1 -1
- package/lib/components/VProgressLinear/VProgressLinear.sass +3 -3
- package/lib/components/VSelect/VSelect.css +5 -1
- package/lib/components/VSelect/VSelect.sass +6 -2
- package/lib/components/VSlideGroup/VSlideGroup.js +5 -4
- package/lib/components/VSlideGroup/VSlideGroup.js.map +1 -1
- package/lib/components/VSnackbar/VSnackbar.css +5 -0
- package/lib/components/VSnackbar/VSnackbar.sass +3 -0
- package/lib/components/VSparkline/VBarline.js +2 -2
- package/lib/components/VSparkline/VBarline.js.map +1 -1
- package/lib/components/VSparkline/VTrendline.js +3 -0
- package/lib/components/VSparkline/VTrendline.js.map +1 -1
- package/lib/components/VTextField/VTextField.js +2 -2
- package/lib/components/VTextField/VTextField.js.map +1 -1
- package/lib/components/VTextarea/VTextarea.js +4 -2
- package/lib/components/VTextarea/VTextarea.js.map +1 -1
- package/lib/components/VTimeline/VTimeline.css +22 -0
- package/lib/components/VTimeline/VTimeline.sass +12 -0
- package/lib/components/VTreeview/VTreeviewItem.css +13 -8
- package/lib/components/VTreeview/VTreeviewItem.d.ts +9 -9
- package/lib/components/VTreeview/VTreeviewItem.sass +12 -8
- package/lib/composables/filter.js +3 -1
- package/lib/composables/filter.js.map +1 -1
- package/lib/composables/nested/nested.d.ts +1 -1
- package/lib/composables/nested/nested.js +5 -2
- package/lib/composables/nested/nested.js.map +1 -1
- package/lib/composables/rounded.js +3 -3
- package/lib/composables/rounded.js.map +1 -1
- package/lib/directives/touch/index.js +2 -2
- package/lib/directives/touch/index.js.map +1 -1
- package/lib/entry-bundler.js +1 -1
- package/lib/framework.d.ts +58 -58
- package/lib/framework.js +1 -1
- package/lib/labs/VDateInput/VDateInput.d.ts +78 -3
- package/lib/labs/VDateInput/VDateInput.js +3 -1
- package/lib/labs/VDateInput/VDateInput.js.map +1 -1
- package/lib/labs/VIconBtn/VIconBtn.js +1 -1
- package/lib/labs/VIconBtn/VIconBtn.js.map +1 -1
- package/lib/labs/VPie/VPie.css +3 -0
- package/lib/labs/VPie/VPie.js +71 -29
- package/lib/labs/VPie/VPie.js.map +1 -1
- package/lib/labs/VPie/VPie.sass +3 -0
- package/lib/labs/VPie/VPieSegment.d.ts +25 -2
- package/lib/labs/VPie/VPieSegment.js +11 -6
- package/lib/labs/VPie/VPieSegment.js.map +1 -1
- package/lib/labs/VPie/VPieTooltip.d.ts +10 -0
- package/lib/labs/VPie/VPieTooltip.js +4 -22
- package/lib/labs/VPie/VPieTooltip.js.map +1 -1
- package/lib/labs/VPie/types.d.ts +1 -0
- package/lib/labs/VPie/types.js.map +1 -1
- package/lib/labs/VVideo/VVideo.css +4 -4
- package/lib/labs/VVideo/VVideo.js +24 -33
- package/lib/labs/VVideo/VVideo.js.map +1 -1
- package/lib/labs/VVideo/VVideo.sass +4 -4
- package/package.json +2 -2
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { PropType } from 'vue';
|
|
2
|
+
import type { VDatePickerSlots } from "../../components/VDatePicker/VDatePicker.js";
|
|
2
3
|
import type { StrategyProps } from "../../components/VOverlay/locationStrategies.js";
|
|
3
4
|
import type { VTextFieldSlots } from "../../components/VTextField/VTextField.js";
|
|
4
5
|
import type { GenericProps } from "../../util/index.js";
|
|
@@ -7,7 +8,7 @@ export type VDateInputActionsSlot = {
|
|
|
7
8
|
cancel: () => void;
|
|
8
9
|
isPristine: boolean;
|
|
9
10
|
};
|
|
10
|
-
export type VDateInputSlots = Omit<VTextFieldSlots, 'default'> & {
|
|
11
|
+
export type VDateInputSlots = Omit<VTextFieldSlots, 'default'> & Pick<VDatePickerSlots, 'title' | 'header' | 'day' | 'month' | 'year'> & {
|
|
11
12
|
actions: VDateInputActionsSlot;
|
|
12
13
|
default: never;
|
|
13
14
|
};
|
|
@@ -2917,7 +2918,7 @@ export declare const VDateInput: {
|
|
|
2917
2918
|
'update:focused': (val: boolean) => true;
|
|
2918
2919
|
'update:modelValue': (val: unknown) => true;
|
|
2919
2920
|
'update:menu': (val: boolean) => true;
|
|
2920
|
-
}, "multiple" | "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:loader" | "v-slot:actions" | "v-slot:label" | "v-slot:message" | "v-slot:details" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:counter" | "save">, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
|
2921
|
+
}, "multiple" | "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:loader" | "v-slot:actions" | "v-slot:title" | "v-slot:label" | "v-slot:message" | "v-slot:details" | "v-slot:header" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:counter" | "save" | "v-slot:day" | "v-slot:month" | "v-slot:year">, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
|
|
2921
2922
|
flat: boolean;
|
|
2922
2923
|
reverse: boolean;
|
|
2923
2924
|
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
|
@@ -2992,6 +2993,43 @@ export declare const VDateInput: {
|
|
|
2992
2993
|
counter: (arg: import("../../components/VCounter/VCounter.js").VCounterSlot) => import("vue").VNode[];
|
|
2993
2994
|
'prepend-inner': (arg: import("../../components/VField/VField.js").DefaultInputSlot) => import("vue").VNode[];
|
|
2994
2995
|
'append-inner': (arg: import("../../components/VField/VField.js").DefaultInputSlot) => import("vue").VNode[];
|
|
2996
|
+
header: (arg: {
|
|
2997
|
+
header: string;
|
|
2998
|
+
transition: string;
|
|
2999
|
+
}) => import("vue").VNode[];
|
|
3000
|
+
title: () => import("vue").VNode[];
|
|
3001
|
+
day: (arg: {
|
|
3002
|
+
props: {
|
|
3003
|
+
onClick: () => void;
|
|
3004
|
+
};
|
|
3005
|
+
item: any;
|
|
3006
|
+
i: number;
|
|
3007
|
+
}) => import("vue").VNode[];
|
|
3008
|
+
month: (arg: {
|
|
3009
|
+
month: {
|
|
3010
|
+
text: string;
|
|
3011
|
+
value: number;
|
|
3012
|
+
};
|
|
3013
|
+
i: number;
|
|
3014
|
+
props: {
|
|
3015
|
+
onClick: () => void;
|
|
3016
|
+
};
|
|
3017
|
+
}) => import("vue").VNode[];
|
|
3018
|
+
year: (arg: {
|
|
3019
|
+
year: {
|
|
3020
|
+
text: string;
|
|
3021
|
+
value: number;
|
|
3022
|
+
};
|
|
3023
|
+
i: number;
|
|
3024
|
+
props: {
|
|
3025
|
+
active: boolean;
|
|
3026
|
+
color?: string;
|
|
3027
|
+
rounded: boolean;
|
|
3028
|
+
text: string;
|
|
3029
|
+
variant: "flat" | "text";
|
|
3030
|
+
onClick: () => void;
|
|
3031
|
+
};
|
|
3032
|
+
}) => import("vue").VNode[];
|
|
2995
3033
|
actions: (arg: VDateInputActionsSlot) => import("vue").VNode[];
|
|
2996
3034
|
default: () => import("vue").VNode[];
|
|
2997
3035
|
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
|
|
@@ -7238,7 +7276,7 @@ export declare const VDateInput: {
|
|
|
7238
7276
|
'update:focused': (val: boolean) => true;
|
|
7239
7277
|
'update:modelValue': (val: unknown) => true;
|
|
7240
7278
|
'update:menu': (val: boolean) => true;
|
|
7241
|
-
}, "multiple" | "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:loader" | "v-slot:actions" | "v-slot:label" | "v-slot:message" | "v-slot:details" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:counter" | "save">, string, {
|
|
7279
|
+
}, "multiple" | "$children" | "v-slots" | "v-slot:default" | "modelValue" | "update:modelValue" | "v-slot:prepend" | "v-slot:append" | "v-slot:loader" | "v-slot:actions" | "v-slot:title" | "v-slot:label" | "v-slot:message" | "v-slot:details" | "v-slot:header" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:counter" | "save" | "v-slot:day" | "v-slot:month" | "v-slot:year">, string, {
|
|
7242
7280
|
flat: boolean;
|
|
7243
7281
|
reverse: boolean;
|
|
7244
7282
|
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
|
@@ -7313,6 +7351,43 @@ export declare const VDateInput: {
|
|
|
7313
7351
|
counter: (arg: import("../../components/VCounter/VCounter.js").VCounterSlot) => import("vue").VNode[];
|
|
7314
7352
|
'prepend-inner': (arg: import("../../components/VField/VField.js").DefaultInputSlot) => import("vue").VNode[];
|
|
7315
7353
|
'append-inner': (arg: import("../../components/VField/VField.js").DefaultInputSlot) => import("vue").VNode[];
|
|
7354
|
+
header: (arg: {
|
|
7355
|
+
header: string;
|
|
7356
|
+
transition: string;
|
|
7357
|
+
}) => import("vue").VNode[];
|
|
7358
|
+
title: () => import("vue").VNode[];
|
|
7359
|
+
day: (arg: {
|
|
7360
|
+
props: {
|
|
7361
|
+
onClick: () => void;
|
|
7362
|
+
};
|
|
7363
|
+
item: any;
|
|
7364
|
+
i: number;
|
|
7365
|
+
}) => import("vue").VNode[];
|
|
7366
|
+
month: (arg: {
|
|
7367
|
+
month: {
|
|
7368
|
+
text: string;
|
|
7369
|
+
value: number;
|
|
7370
|
+
};
|
|
7371
|
+
i: number;
|
|
7372
|
+
props: {
|
|
7373
|
+
onClick: () => void;
|
|
7374
|
+
};
|
|
7375
|
+
}) => import("vue").VNode[];
|
|
7376
|
+
year: (arg: {
|
|
7377
|
+
year: {
|
|
7378
|
+
text: string;
|
|
7379
|
+
value: number;
|
|
7380
|
+
};
|
|
7381
|
+
i: number;
|
|
7382
|
+
props: {
|
|
7383
|
+
active: boolean;
|
|
7384
|
+
color?: string;
|
|
7385
|
+
rounded: boolean;
|
|
7386
|
+
text: string;
|
|
7387
|
+
variant: "flat" | "text";
|
|
7388
|
+
onClick: () => void;
|
|
7389
|
+
};
|
|
7390
|
+
}) => import("vue").VNode[];
|
|
7316
7391
|
actions: (arg: VDateInputActionsSlot) => import("vue").VNode[];
|
|
7317
7392
|
default: () => import("vue").VNode[];
|
|
7318
7393
|
}>>, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new <T, Multiple extends boolean | "range" | number | (string & {}) = false, TModel = Multiple extends string | number | true ? T[] : T>(props: {
|
|
@@ -13,7 +13,7 @@ import { forwardRefs } from "../../composables/forwardRefs.js";
|
|
|
13
13
|
import { useLocale } from "../../composables/locale.js";
|
|
14
14
|
import { useProxiedModel } from "../../composables/proxiedModel.js"; // Utilities
|
|
15
15
|
import { computed, ref, shallowRef, watch } from 'vue';
|
|
16
|
-
import { genericComponent, omit, propsFactory, useRender, wrapInArray } from "../../util/index.js"; // Types
|
|
16
|
+
import { genericComponent, omit, pick, propsFactory, useRender, wrapInArray } from "../../util/index.js"; // Types
|
|
17
17
|
// Types
|
|
18
18
|
export const makeVDateInputProps = propsFactory({
|
|
19
19
|
displayFormat: {
|
|
@@ -186,6 +186,7 @@ export const VDateInput = genericComponent()({
|
|
|
186
186
|
useRender(() => {
|
|
187
187
|
const confirmEditProps = VConfirmEdit.filterProps(props);
|
|
188
188
|
const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'location', 'rounded']));
|
|
189
|
+
const datePickerSlots = pick(slots, ['title', 'header', 'day', 'month', 'year']);
|
|
189
190
|
const textFieldProps = VTextField.filterProps(omit(props, ['placeholder']));
|
|
190
191
|
return _createVNode(VTextField, _mergeProps({
|
|
191
192
|
"ref": vTextFieldRef
|
|
@@ -248,6 +249,7 @@ export const VDateInput = genericComponent()({
|
|
|
248
249
|
"onUpdate:modelValue": value => onUpdateModel(value),
|
|
249
250
|
"onMousedown": e => e.preventDefault()
|
|
250
251
|
}), {
|
|
252
|
+
...datePickerSlots,
|
|
251
253
|
actions: !props.hideActions ? () => slots.actions?.({
|
|
252
254
|
save,
|
|
253
255
|
cancel,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VDateInput.js","names":["makeVConfirmEditProps","VConfirmEdit","makeVDatePickerProps","VDatePicker","VMenu","makeVTextFieldProps","VTextField","useDate","createDateRange","makeDateFormatProps","useDateFormat","makeDisplayProps","useDisplay","makeFocusProps","forwardRefs","useLocale","useProxiedModel","computed","ref","shallowRef","watch","genericComponent","omit","propsFactory","useRender","wrapInArray","makeVDateInputProps","displayFormat","type","Function","String","default","undefined","location","menu","Boolean","updateOn","Array","mobile","hideActions","prependIcon","hideHeader","showAdjacentMonths","VDateInput","name","props","emits","save","value","cancel","val","setup","_ref","emit","slots","t","current","currentLocale","adapter","isValid","parseDate","formatDate","parserFormat","emptyModelValue","multiple","model","isArray","map","item","toJsDate","date","isEditingInput","isFocused","focused","vTextFieldRef","disabledActions","format","display","length","start","end","inputmode","isInteractive","disabled","readonly","isReadonly","onKeydown","e","key","includes","onUserInput","target","onClick","preventDefault","stopPropagation","onCancel","onSave","onUpdateDisplayModel","onBlur","_ref2","trim","parts","split","every","stop","toSorted","a","b","isAfter","confirmEditProps","filterProps","datePickerProps","textFieldProps","_createVNode","_mergeProps","class","style","placeholder","event","_createElementVNode","_Fragment","$event","_ref3","actions","proxyModel","isPristine","onUpdateModel"],"sources":["../../../src/labs/VDateInput/VDateInput.tsx"],"sourcesContent":["// Components\nimport { makeVConfirmEditProps, VConfirmEdit } from '@/components/VConfirmEdit/VConfirmEdit'\nimport { makeVDatePickerProps, VDatePicker } from '@/components/VDatePicker/VDatePicker'\nimport { VMenu } from '@/components/VMenu/VMenu'\nimport { makeVTextFieldProps, VTextField } from '@/components/VTextField/VTextField'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { createDateRange } from '@/composables/date/date'\nimport { makeDateFormatProps, useDateFormat } from '@/composables/dateFormat'\nimport { makeDisplayProps, useDisplay } from '@/composables/display'\nimport { makeFocusProps } from '@/composables/focus'\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport { genericComponent, omit, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { StrategyProps } from '@/components/VOverlay/locationStrategies'\nimport type { VTextFieldSlots } from '@/components/VTextField/VTextField'\nimport type { GenericProps } from '@/util'\n\n// Types\nexport type VDateInputActionsSlot = {\n save: () => void\n cancel: () => void\n isPristine: boolean\n}\n\nexport type VDateInputSlots = Omit<VTextFieldSlots, 'default'> & {\n actions: VDateInputActionsSlot\n default: never\n}\n\nexport const makeVDateInputProps = propsFactory({\n displayFormat: {\n type: [Function, String] as PropType<string | ((date: unknown) => any)>,\n default: undefined,\n },\n location: {\n type: String as PropType<StrategyProps['location']>,\n default: 'bottom start',\n },\n menu: Boolean,\n updateOn: {\n type: Array as PropType<('blur' | 'enter')[]>,\n default: () => ['blur', 'enter'],\n },\n\n ...makeDateFormatProps(),\n ...makeDisplayProps({\n mobile: null,\n }),\n ...makeFocusProps(),\n ...makeVConfirmEditProps({\n hideActions: true,\n }),\n ...makeVTextFieldProps({\n prependIcon: '$calendar',\n }),\n ...omit(makeVDatePickerProps({\n hideHeader: true,\n showAdjacentMonths: true,\n }), ['active', 'location', 'rounded']),\n}, 'VDateInput')\n\nexport const VDateInput = genericComponent<new <\n T,\n Multiple extends boolean | 'range' | number | (string & {}) = false,\n TModel = Multiple extends true | number | string\n ? T[]\n : T,\n> (\n props: {\n modelValue?: TModel\n onSave?: (value: TModel) => void\n 'onUpdate:modelValue'?: (value: TModel) => void\n multiple?: Multiple\n },\n slots: VDateInputSlots\n) => GenericProps<typeof props, typeof slots>>()({\n name: 'VDateInput',\n\n props: makeVDateInputProps(),\n\n emits: {\n save: (value: unknown) => true,\n cancel: () => true,\n 'update:focused': (val: boolean) => true,\n 'update:modelValue': (val: unknown) => true,\n 'update:menu': (val: boolean) => true,\n },\n\n setup (props, { emit, slots }) {\n const { t, current: currentLocale } = useLocale()\n const adapter = useDate()\n const { isValid, parseDate, formatDate, parserFormat } = useDateFormat(props, currentLocale)\n const { mobile } = useDisplay(props)\n\n const emptyModelValue = () => props.multiple ? [] : null\n\n const model = useProxiedModel(\n props,\n 'modelValue',\n emptyModelValue(),\n val => Array.isArray(val) ? val.map(item => adapter.toJsDate(item)) : val ? adapter.toJsDate(val) : val,\n val => Array.isArray(val) ? val.map(item => adapter.date(item)) : val ? adapter.date(val) : val\n )\n\n const menu = useProxiedModel(props, 'menu')\n const isEditingInput = shallowRef(false)\n const isFocused = shallowRef(props.focused)\n const vTextFieldRef = ref<VTextField>()\n const disabledActions = ref<typeof VConfirmEdit['props']['disabled']>(['save'])\n\n function format (date: unknown) {\n if (typeof props.displayFormat === 'function') {\n return props.displayFormat(date)\n }\n if (props.displayFormat) {\n return adapter.format(date, props.displayFormat ?? 'keyboardDate')\n }\n return formatDate(date)\n }\n\n const display = computed(() => {\n const value = wrapInArray(model.value)\n\n if (!value.length) return null\n\n if (props.multiple === true) {\n return t('$vuetify.datePicker.itemsSelected', value.length)\n }\n\n if (props.multiple === 'range') {\n const start = value[0]\n const end = value[value.length - 1]\n\n if (!adapter.isValid(start) || !adapter.isValid(end)) return ''\n\n return `${format(adapter.date(start))} - ${format(adapter.date(end))}`\n }\n\n return adapter.isValid(model.value) ? format(adapter.date(model.value)) : ''\n })\n\n const inputmode = computed(() => {\n if (!mobile.value) return undefined\n if (isEditingInput.value) return 'text'\n\n return 'none'\n })\n\n const isInteractive = computed(() => !props.disabled && !props.readonly)\n\n const isReadonly = computed(() => {\n if (!props.updateOn.length) return true\n\n return !(mobile.value && isEditingInput.value) && props.readonly\n })\n\n watch(menu, val => {\n if (val) return\n\n isEditingInput.value = false\n disabledActions.value = ['save']\n })\n\n function onKeydown (e: KeyboardEvent) {\n if (e.key !== 'Enter') return\n\n if (!menu.value || !isFocused.value) {\n menu.value = true\n }\n\n if (props.updateOn.includes('enter')) {\n onUserInput(e.target as HTMLInputElement)\n }\n }\n\n function onClick (e: MouseEvent) {\n e.preventDefault()\n e.stopPropagation()\n\n if (menu.value && mobile.value) {\n isEditingInput.value = true\n } else {\n menu.value = true\n }\n }\n\n function onCancel () {\n emit('cancel')\n menu.value = false\n isEditingInput.value = false\n }\n\n function onSave (value: string) {\n emit('save', value)\n menu.value = false\n }\n\n function onUpdateDisplayModel (value: unknown) {\n if (value != null) return\n\n model.value = emptyModelValue()\n }\n\n function onBlur (e: FocusEvent) {\n if (props.updateOn.includes('blur')) {\n onUserInput(e.target as HTMLInputElement)\n }\n\n // When in mobile mode and editing is done (due to keyboard dismissal), close the menu\n if (mobile.value && isEditingInput.value && !isFocused.value) {\n menu.value = false\n isEditingInput.value = false\n }\n }\n\n function onUserInput ({ value }: HTMLInputElement) {\n if (!value.trim()) {\n model.value = emptyModelValue()\n } else if (!props.multiple) {\n if (isValid(value)) {\n model.value = parseDate(value)\n }\n } else {\n const parts = value.trim().split(/\\D+-\\D+|[^\\d\\-/.]+/)\n if (parts.every(isValid)) {\n if (props.multiple === 'range') {\n const [start, stop] = parts.map(parseDate).toSorted((a, b) => adapter.isAfter(a, b) ? 1 : -1)\n model.value = createDateRange(adapter, start, stop)\n } else {\n model.value = parts.map(parseDate)\n }\n }\n }\n }\n\n useRender(() => {\n const confirmEditProps = VConfirmEdit.filterProps(props)\n const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'location', 'rounded']))\n const textFieldProps = VTextField.filterProps(omit(props, ['placeholder']))\n\n return (\n <VTextField\n ref={ vTextFieldRef }\n { ...textFieldProps }\n class={ props.class }\n style={ props.style }\n modelValue={ display.value }\n inputmode={ inputmode.value }\n placeholder={ props.placeholder ?? parserFormat.value }\n readonly={ isReadonly.value }\n onKeydown={ isInteractive.value ? onKeydown : undefined }\n focused={ menu.value || isFocused.value }\n onBlur={ onBlur }\n validationValue={ model.value }\n onClick:control={ isInteractive.value ? onClick : undefined }\n onClick:prepend={ isInteractive.value ? onClick : undefined }\n onUpdate:modelValue={ onUpdateDisplayModel }\n onUpdate:focused={ event => isFocused.value = event }\n >\n {{\n ...slots,\n default: () => (\n <>\n <VMenu\n v-model={ menu.value }\n activator=\"parent\"\n minWidth=\"0\"\n eager={ isFocused.value }\n location={ props.location }\n closeOnContentClick={ false }\n openOnClick={ false }\n >\n <VConfirmEdit\n { ...confirmEditProps }\n v-model={ model.value }\n disabled={ disabledActions.value }\n onSave={ onSave }\n onCancel={ onCancel }\n >\n {{\n default: ({ actions, model: proxyModel, save, cancel, isPristine }) => {\n function onUpdateModel (value: string) {\n if (!props.hideActions) {\n proxyModel.value = value\n } else {\n model.value = value\n\n if (!props.multiple) {\n menu.value = false\n }\n }\n\n emit('save', value)\n\n disabledActions.value = []\n }\n\n return (\n <VDatePicker\n { ...datePickerProps }\n modelValue={ props.hideActions ? model.value : proxyModel.value }\n onUpdate:modelValue={ value => onUpdateModel(value) }\n onMousedown={ (e: MouseEvent) => e.preventDefault() }\n >\n {{\n actions: !props.hideActions ? () => slots.actions?.({ save, cancel, isPristine }) ?? actions() : undefined,\n }}\n </VDatePicker>\n )\n },\n }}\n </VConfirmEdit>\n </VMenu>\n\n { slots.default?.() }\n </>\n ),\n }}\n </VTextField>\n )\n })\n\n return forwardRefs({}, vTextFieldRef)\n },\n})\n\nexport type VDateInput = InstanceType<typeof VDateInput>\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"VDateInput.js","names":["makeVConfirmEditProps","VConfirmEdit","makeVDatePickerProps","VDatePicker","VMenu","makeVTextFieldProps","VTextField","useDate","createDateRange","makeDateFormatProps","useDateFormat","makeDisplayProps","useDisplay","makeFocusProps","forwardRefs","useLocale","useProxiedModel","computed","ref","shallowRef","watch","genericComponent","omit","pick","propsFactory","useRender","wrapInArray","makeVDateInputProps","displayFormat","type","Function","String","default","undefined","location","menu","Boolean","updateOn","Array","mobile","hideActions","prependIcon","hideHeader","showAdjacentMonths","VDateInput","name","props","emits","save","value","cancel","val","setup","_ref","emit","slots","t","current","currentLocale","adapter","isValid","parseDate","formatDate","parserFormat","emptyModelValue","multiple","model","isArray","map","item","toJsDate","date","isEditingInput","isFocused","focused","vTextFieldRef","disabledActions","format","display","length","start","end","inputmode","isInteractive","disabled","readonly","isReadonly","onKeydown","e","key","includes","onUserInput","target","onClick","preventDefault","stopPropagation","onCancel","onSave","onUpdateDisplayModel","onBlur","_ref2","trim","parts","split","every","stop","toSorted","a","b","isAfter","confirmEditProps","filterProps","datePickerProps","datePickerSlots","textFieldProps","_createVNode","_mergeProps","class","style","placeholder","event","_createElementVNode","_Fragment","$event","_ref3","actions","proxyModel","isPristine","onUpdateModel"],"sources":["../../../src/labs/VDateInput/VDateInput.tsx"],"sourcesContent":["// Components\nimport { makeVConfirmEditProps, VConfirmEdit } from '@/components/VConfirmEdit/VConfirmEdit'\nimport { makeVDatePickerProps, VDatePicker } from '@/components/VDatePicker/VDatePicker'\nimport { VMenu } from '@/components/VMenu/VMenu'\nimport { makeVTextFieldProps, VTextField } from '@/components/VTextField/VTextField'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { createDateRange } from '@/composables/date/date'\nimport { makeDateFormatProps, useDateFormat } from '@/composables/dateFormat'\nimport { makeDisplayProps, useDisplay } from '@/composables/display'\nimport { makeFocusProps } from '@/composables/focus'\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport { genericComponent, omit, pick, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { VDatePickerSlots } from '@/components/VDatePicker/VDatePicker'\nimport type { StrategyProps } from '@/components/VOverlay/locationStrategies'\nimport type { VTextFieldSlots } from '@/components/VTextField/VTextField'\nimport type { GenericProps } from '@/util'\n\n// Types\nexport type VDateInputActionsSlot = {\n save: () => void\n cancel: () => void\n isPristine: boolean\n}\n\nexport type VDateInputSlots = Omit<VTextFieldSlots, 'default'> &\n Pick<VDatePickerSlots, 'title' | 'header' | 'day' | 'month' | 'year'> & {\n actions: VDateInputActionsSlot\n default: never\n }\n\nexport const makeVDateInputProps = propsFactory({\n displayFormat: {\n type: [Function, String] as PropType<string | ((date: unknown) => any)>,\n default: undefined,\n },\n location: {\n type: String as PropType<StrategyProps['location']>,\n default: 'bottom start',\n },\n menu: Boolean,\n updateOn: {\n type: Array as PropType<('blur' | 'enter')[]>,\n default: () => ['blur', 'enter'],\n },\n\n ...makeDateFormatProps(),\n ...makeDisplayProps({\n mobile: null,\n }),\n ...makeFocusProps(),\n ...makeVConfirmEditProps({\n hideActions: true,\n }),\n ...makeVTextFieldProps({\n prependIcon: '$calendar',\n }),\n ...omit(makeVDatePickerProps({\n hideHeader: true,\n showAdjacentMonths: true,\n }), ['active', 'location', 'rounded']),\n}, 'VDateInput')\n\nexport const VDateInput = genericComponent<new <\n T,\n Multiple extends boolean | 'range' | number | (string & {}) = false,\n TModel = Multiple extends true | number | string\n ? T[]\n : T,\n> (\n props: {\n modelValue?: TModel\n onSave?: (value: TModel) => void\n 'onUpdate:modelValue'?: (value: TModel) => void\n multiple?: Multiple\n },\n slots: VDateInputSlots\n) => GenericProps<typeof props, typeof slots>>()({\n name: 'VDateInput',\n\n props: makeVDateInputProps(),\n\n emits: {\n save: (value: unknown) => true,\n cancel: () => true,\n 'update:focused': (val: boolean) => true,\n 'update:modelValue': (val: unknown) => true,\n 'update:menu': (val: boolean) => true,\n },\n\n setup (props, { emit, slots }) {\n const { t, current: currentLocale } = useLocale()\n const adapter = useDate()\n const { isValid, parseDate, formatDate, parserFormat } = useDateFormat(props, currentLocale)\n const { mobile } = useDisplay(props)\n\n const emptyModelValue = () => props.multiple ? [] : null\n\n const model = useProxiedModel(\n props,\n 'modelValue',\n emptyModelValue(),\n val => Array.isArray(val) ? val.map(item => adapter.toJsDate(item)) : val ? adapter.toJsDate(val) : val,\n val => Array.isArray(val) ? val.map(item => adapter.date(item)) : val ? adapter.date(val) : val\n )\n\n const menu = useProxiedModel(props, 'menu')\n const isEditingInput = shallowRef(false)\n const isFocused = shallowRef(props.focused)\n const vTextFieldRef = ref<VTextField>()\n const disabledActions = ref<typeof VConfirmEdit['props']['disabled']>(['save'])\n\n function format (date: unknown) {\n if (typeof props.displayFormat === 'function') {\n return props.displayFormat(date)\n }\n if (props.displayFormat) {\n return adapter.format(date, props.displayFormat ?? 'keyboardDate')\n }\n return formatDate(date)\n }\n\n const display = computed(() => {\n const value = wrapInArray(model.value)\n\n if (!value.length) return null\n\n if (props.multiple === true) {\n return t('$vuetify.datePicker.itemsSelected', value.length)\n }\n\n if (props.multiple === 'range') {\n const start = value[0]\n const end = value[value.length - 1]\n\n if (!adapter.isValid(start) || !adapter.isValid(end)) return ''\n\n return `${format(adapter.date(start))} - ${format(adapter.date(end))}`\n }\n\n return adapter.isValid(model.value) ? format(adapter.date(model.value)) : ''\n })\n\n const inputmode = computed(() => {\n if (!mobile.value) return undefined\n if (isEditingInput.value) return 'text'\n\n return 'none'\n })\n\n const isInteractive = computed(() => !props.disabled && !props.readonly)\n\n const isReadonly = computed(() => {\n if (!props.updateOn.length) return true\n\n return !(mobile.value && isEditingInput.value) && props.readonly\n })\n\n watch(menu, val => {\n if (val) return\n\n isEditingInput.value = false\n disabledActions.value = ['save']\n })\n\n function onKeydown (e: KeyboardEvent) {\n if (e.key !== 'Enter') return\n\n if (!menu.value || !isFocused.value) {\n menu.value = true\n }\n\n if (props.updateOn.includes('enter')) {\n onUserInput(e.target as HTMLInputElement)\n }\n }\n\n function onClick (e: MouseEvent) {\n e.preventDefault()\n e.stopPropagation()\n\n if (menu.value && mobile.value) {\n isEditingInput.value = true\n } else {\n menu.value = true\n }\n }\n\n function onCancel () {\n emit('cancel')\n menu.value = false\n isEditingInput.value = false\n }\n\n function onSave (value: string) {\n emit('save', value)\n menu.value = false\n }\n\n function onUpdateDisplayModel (value: unknown) {\n if (value != null) return\n\n model.value = emptyModelValue()\n }\n\n function onBlur (e: FocusEvent) {\n if (props.updateOn.includes('blur')) {\n onUserInput(e.target as HTMLInputElement)\n }\n\n // When in mobile mode and editing is done (due to keyboard dismissal), close the menu\n if (mobile.value && isEditingInput.value && !isFocused.value) {\n menu.value = false\n isEditingInput.value = false\n }\n }\n\n function onUserInput ({ value }: HTMLInputElement) {\n if (!value.trim()) {\n model.value = emptyModelValue()\n } else if (!props.multiple) {\n if (isValid(value)) {\n model.value = parseDate(value)\n }\n } else {\n const parts = value.trim().split(/\\D+-\\D+|[^\\d\\-/.]+/)\n if (parts.every(isValid)) {\n if (props.multiple === 'range') {\n const [start, stop] = parts.map(parseDate).toSorted((a, b) => adapter.isAfter(a, b) ? 1 : -1)\n model.value = createDateRange(adapter, start, stop)\n } else {\n model.value = parts.map(parseDate)\n }\n }\n }\n }\n\n useRender(() => {\n const confirmEditProps = VConfirmEdit.filterProps(props)\n const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'location', 'rounded']))\n const datePickerSlots = pick(slots, ['title', 'header', 'day', 'month', 'year'])\n const textFieldProps = VTextField.filterProps(omit(props, ['placeholder']))\n\n return (\n <VTextField\n ref={ vTextFieldRef }\n { ...textFieldProps }\n class={ props.class }\n style={ props.style }\n modelValue={ display.value }\n inputmode={ inputmode.value }\n placeholder={ props.placeholder ?? parserFormat.value }\n readonly={ isReadonly.value }\n onKeydown={ isInteractive.value ? onKeydown : undefined }\n focused={ menu.value || isFocused.value }\n onBlur={ onBlur }\n validationValue={ model.value }\n onClick:control={ isInteractive.value ? onClick : undefined }\n onClick:prepend={ isInteractive.value ? onClick : undefined }\n onUpdate:modelValue={ onUpdateDisplayModel }\n onUpdate:focused={ event => isFocused.value = event }\n >\n {{\n ...slots,\n default: () => (\n <>\n <VMenu\n v-model={ menu.value }\n activator=\"parent\"\n minWidth=\"0\"\n eager={ isFocused.value }\n location={ props.location }\n closeOnContentClick={ false }\n openOnClick={ false }\n >\n <VConfirmEdit\n { ...confirmEditProps }\n v-model={ model.value }\n disabled={ disabledActions.value }\n onSave={ onSave }\n onCancel={ onCancel }\n >\n {{\n default: ({ actions, model: proxyModel, save, cancel, isPristine }) => {\n function onUpdateModel (value: string) {\n if (!props.hideActions) {\n proxyModel.value = value\n } else {\n model.value = value\n\n if (!props.multiple) {\n menu.value = false\n }\n }\n\n emit('save', value)\n\n disabledActions.value = []\n }\n\n return (\n <VDatePicker\n { ...datePickerProps }\n modelValue={ props.hideActions ? model.value : proxyModel.value }\n onUpdate:modelValue={ value => onUpdateModel(value) }\n onMousedown={ (e: MouseEvent) => e.preventDefault() }\n >\n {{\n ...datePickerSlots,\n actions: !props.hideActions ? () => slots.actions?.({ save, cancel, isPristine }) ?? actions() : undefined,\n }}\n </VDatePicker>\n )\n },\n }}\n </VConfirmEdit>\n </VMenu>\n\n { slots.default?.() }\n </>\n ),\n }}\n </VTextField>\n )\n })\n\n return forwardRefs({}, vTextFieldRef)\n },\n})\n\nexport type VDateInput = InstanceType<typeof VDateInput>\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VIconBtn.js","names":["VDefaultsProvider","VIcon","VProgressCircular","makeBorderProps","useBorder","makeComponentProps","makeElevationProps","useElevation","makeIconSizeProps","useIconSizes","useProxiedModel","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","toDisplayString","convertToUnit","genericComponent","propsFactory","useRender","makeVIconBtnProps","active","type","Boolean","default","undefined","activeColor","String","activeIcon","Function","Object","activeVariant","baseVariant","disabled","height","Number","width","hideOverlay","icon","iconColor","loading","opacity","readonly","rotate","size","sizes","Array","text","tag","variant","VIconBtn","name","props","emits","value","setup","_ref","attrs","slots","isActive","themeClasses","borderClasses","elevationClasses","roundedClasses","colorClasses","colorStyles","variantClasses","color","btnSizeMap","Map","onClick","href","_btnSize","hasNamedSize","has","btnSize","get","btnHeight","btnWidth","iconSize","iconSizes","iconProps","_createVNode","_normalizeClass","class","_normalizeStyle","style","_createElementVNode","_mergeProps","loader"],"sources":["../../../src/labs/VIconBtn/VIconBtn.tsx"],"sourcesContent":["// Styles\nimport './VIconBtn.scss'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VProgressCircular } from '@/components/VProgressCircular'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeIconSizeProps, useIconSizes } from '@/composables/iconSizes'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { toDisplayString } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { IconValue } from '@/composables/icons'\nimport type { Variant } from '@/composables/variant'\n\nexport type VIconBtnSlots = {\n default: never\n loader: never\n}\n\nexport type VIconBtnSizes = 'x-small' | 'small' | 'default' | 'large' | 'x-large'\n\nexport const makeVIconBtnProps = propsFactory({\n active: {\n type: Boolean,\n default: undefined,\n },\n activeColor: String,\n activeIcon: [String, Function, Object] as PropType<IconValue>,\n activeVariant: String as PropType<Variant>,\n baseVariant: {\n type: String as PropType<Variant>,\n default: 'tonal',\n },\n disabled: Boolean,\n height: [Number, String],\n width: [Number, String],\n hideOverlay: Boolean,\n icon: [String, Function, Object] as PropType<IconValue>,\n iconColor: String,\n loading: Boolean,\n opacity: [Number, String],\n readonly: Boolean,\n rotate: [Number, String],\n size: {\n type: [Number, String] as PropType<VIconBtnSizes | number | string>,\n default: 'default',\n },\n sizes: {\n type: Array as PropType<[VIconBtnSizes, number][]>,\n default: () => ([\n ['x-small', 16],\n ['small', 24],\n ['default', 40],\n ['large', 48],\n ['x-large', 56],\n ]),\n },\n text: {\n type: [String, Number, Boolean],\n default: undefined,\n },\n\n ...makeBorderProps(),\n ...makeComponentProps(),\n ...makeElevationProps(),\n ...makeIconSizeProps(),\n ...makeRoundedProps(),\n ...makeTagProps({ tag: 'button' }),\n ...makeThemeProps(),\n ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VIconBtn')\n\nexport const VIconBtn = genericComponent<VIconBtnSlots>()({\n name: 'VIconBtn',\n\n props: makeVIconBtnProps(),\n\n emits: {\n 'update:active': (value: boolean) => true,\n },\n\n setup (props, { attrs, slots }) {\n const isActive = useProxiedModel(props, 'active')\n\n const { themeClasses } = provideTheme(props)\n const { borderClasses } = useBorder(props)\n const { elevationClasses } = useElevation(props)\n const { roundedClasses } = useRounded(props)\n\n const { colorClasses, colorStyles, variantClasses } = useVariant(() => ({\n color: (() => {\n if (props.disabled) return undefined\n if (!isActive.value) return props.color\n // Use an inline fallback as opposed to setting a default color\n // because non-toggle buttons are default flat whereas toggle\n // buttons are default tonal and active flat. The exact use\n // case for this is a toggle button with no active color.\n return props.activeColor ?? props.color ?? 'surface-variant'\n })(),\n variant: (() => {\n if (isActive.value === undefined) return props.variant\n if (isActive.value) return props.activeVariant ?? props.variant\n return props.baseVariant ?? props.variant\n })(),\n }))\n\n const btnSizeMap = new Map(props.sizes)\n\n function onClick () {\n if (\n props.disabled ||\n props.readonly ||\n isActive.value === undefined ||\n (props.tag === 'a' && attrs.href)\n ) return\n\n isActive.value = !isActive.value\n }\n\n useRender(() => {\n const icon = isActive.value ? props.activeIcon ?? props.icon : props.icon\n\n const _btnSize = props.size as VIconBtnSizes\n const hasNamedSize = btnSizeMap.has(_btnSize)\n const btnSize = hasNamedSize ? btnSizeMap.get(_btnSize) : _btnSize\n const btnHeight = props.height ?? btnSize\n const btnWidth = props.width ?? btnSize\n const { iconSize } = useIconSizes(props, () => new Map(props.iconSizes).get(_btnSize))\n\n const iconProps = {\n icon,\n size: iconSize.value,\n iconColor: props.iconColor,\n opacity: props.opacity,\n }\n\n return (\n <props.tag\n type={ props.tag === 'button' ? 'button' : undefined }\n class={[\n {\n 'v-icon-btn': true,\n 'v-icon-btn--active': isActive.value,\n 'v-icon-btn--disabled': props.disabled,\n 'v-icon-btn--loading': props.loading,\n 'v-icon-btn--readonly': props.readonly,\n [`v-icon-btn--${props.size}`]: true,\n },\n themeClasses.value,\n colorClasses.value,\n borderClasses.value,\n elevationClasses.value,\n roundedClasses.value,\n variantClasses.value,\n props.class,\n ]}\n style={[\n {\n '--v-icon-btn-rotate': convertToUnit(props.rotate, 'deg'),\n '--v-icon-btn-height': convertToUnit(btnHeight),\n '--v-icon-btn-width': convertToUnit(btnWidth),\n },\n colorStyles.value,\n props.style,\n ]}\n tabindex={ props.disabled || props.readonly ? -1 : 0 }\n onClick={ onClick }\n >\n { genOverlays(!props.hideOverlay, 'v-icon-btn') }\n\n <div class=\"v-icon-btn__content\" data-no-activator=\"\">\n { (!slots.default && icon) ? (\n <VIcon\n key=\"content-icon\"\n { ...iconProps }\n />\n ) : (\n <VDefaultsProvider\n key=\"content-defaults\"\n disabled={ !icon }\n defaults={{ VIcon: { ...iconProps } }}\n v-slots={{\n default: () => slots.default?.() ?? toDisplayString(props.text),\n }}\n />\n )}\n </div>\n\n { !!props.loading && (\n <span key=\"loader\" class=\"v-icon-btn__loader\">\n { slots.loader?.() ?? (\n <VProgressCircular\n color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n indeterminate=\"disable-shrink\"\n width=\"2\"\n size={ iconSize.value }\n />\n )}\n </span>\n )}\n </props.tag>\n )\n })\n\n return {}\n },\n})\n\nexport type VIconBtn = InstanceType<typeof VIconBtn>\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"VIconBtn.js","names":["VDefaultsProvider","VIcon","VProgressCircular","makeBorderProps","useBorder","makeComponentProps","makeElevationProps","useElevation","makeIconSizeProps","useIconSizes","useProxiedModel","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","genOverlays","makeVariantProps","useVariant","toDisplayString","convertToUnit","genericComponent","propsFactory","useRender","makeVIconBtnProps","active","type","Boolean","default","undefined","activeColor","String","activeIcon","Function","Object","activeVariant","baseVariant","disabled","height","Number","width","hideOverlay","icon","iconColor","loading","opacity","readonly","rotate","size","sizes","Array","text","tag","variant","VIconBtn","name","props","emits","value","setup","_ref","attrs","slots","isActive","themeClasses","borderClasses","elevationClasses","roundedClasses","colorClasses","colorStyles","variantClasses","color","btnSizeMap","Map","onClick","href","_btnSize","hasNamedSize","has","btnSize","get","btnHeight","btnWidth","iconSize","iconSizes","iconProps","_createVNode","_normalizeClass","class","_normalizeStyle","style","_createElementVNode","_mergeProps","loader"],"sources":["../../../src/labs/VIconBtn/VIconBtn.tsx"],"sourcesContent":["// Styles\nimport './VIconBtn.scss'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VProgressCircular } from '@/components/VProgressCircular'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeIconSizeProps, useIconSizes } from '@/composables/iconSizes'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\n\n// Utilities\nimport { toDisplayString } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { IconValue } from '@/composables/icons'\nimport type { Variant } from '@/composables/variant'\n\nexport type VIconBtnSlots = {\n default: never\n loader: never\n}\n\nexport type VIconBtnSizes = 'x-small' | 'small' | 'default' | 'large' | 'x-large'\n\nexport const makeVIconBtnProps = propsFactory({\n active: {\n type: Boolean,\n default: undefined,\n },\n activeColor: String,\n activeIcon: [String, Function, Object] as PropType<IconValue>,\n activeVariant: String as PropType<Variant>,\n baseVariant: {\n type: String as PropType<Variant>,\n default: 'tonal',\n },\n disabled: Boolean,\n height: [Number, String],\n width: [Number, String],\n hideOverlay: Boolean,\n icon: [String, Function, Object] as PropType<IconValue>,\n iconColor: String,\n loading: Boolean,\n opacity: [Number, String],\n readonly: Boolean,\n rotate: [Number, String],\n size: {\n type: [Number, String] as PropType<VIconBtnSizes | number | string>,\n default: 'default',\n },\n sizes: {\n type: Array as PropType<[VIconBtnSizes, number][]>,\n default: () => ([\n ['x-small', 16],\n ['small', 24],\n ['default', 40],\n ['large', 48],\n ['x-large', 56],\n ]),\n },\n text: {\n type: [String, Number, Boolean],\n default: undefined,\n },\n\n ...makeBorderProps(),\n ...makeComponentProps(),\n ...makeElevationProps(),\n ...makeIconSizeProps(),\n ...makeRoundedProps(),\n ...makeTagProps({ tag: 'button' }),\n ...makeThemeProps(),\n ...makeVariantProps({ variant: 'flat' } as const),\n}, 'VIconBtn')\n\nexport const VIconBtn = genericComponent<VIconBtnSlots>()({\n name: 'VIconBtn',\n\n props: makeVIconBtnProps(),\n\n emits: {\n 'update:active': (value: boolean) => true,\n },\n\n setup (props, { attrs, slots }) {\n const isActive = useProxiedModel(props, 'active')\n\n const { themeClasses } = provideTheme(props)\n const { borderClasses } = useBorder(props)\n const { elevationClasses } = useElevation(props)\n const { roundedClasses } = useRounded(props)\n\n const { colorClasses, colorStyles, variantClasses } = useVariant(() => ({\n color: (() => {\n if (props.disabled) return undefined\n if (!isActive.value) return props.color\n // Use an inline fallback as opposed to setting a default color\n // because non-toggle buttons are default flat whereas toggle\n // buttons are default tonal and active flat. The exact use\n // case for this is a toggle button with no active color.\n return props.activeColor ?? props.color ?? 'surface-variant'\n })(),\n variant: (() => {\n if (isActive.value === undefined) return props.variant\n if (isActive.value) return props.activeVariant ?? props.variant\n return props.baseVariant ?? props.variant\n })(),\n }))\n\n const btnSizeMap = new Map(props.sizes)\n\n function onClick () {\n if (\n props.disabled ||\n props.readonly ||\n isActive.value === undefined ||\n (props.tag === 'a' && attrs.href)\n ) return\n\n isActive.value = !isActive.value\n }\n\n useRender(() => {\n const icon = isActive.value ? props.activeIcon ?? props.icon : props.icon\n\n const _btnSize = props.size as VIconBtnSizes\n const hasNamedSize = btnSizeMap.has(_btnSize)\n const btnSize = hasNamedSize ? btnSizeMap.get(_btnSize) : _btnSize\n const btnHeight = props.height ?? btnSize\n const btnWidth = props.width ?? btnSize\n const { iconSize } = useIconSizes(props, () => new Map(props.iconSizes).get(_btnSize))\n\n const iconProps = {\n icon,\n size: iconSize.value,\n color: props.iconColor,\n opacity: props.opacity,\n }\n\n return (\n <props.tag\n type={ props.tag === 'button' ? 'button' : undefined }\n class={[\n {\n 'v-icon-btn': true,\n 'v-icon-btn--active': isActive.value,\n 'v-icon-btn--disabled': props.disabled,\n 'v-icon-btn--loading': props.loading,\n 'v-icon-btn--readonly': props.readonly,\n [`v-icon-btn--${props.size}`]: true,\n },\n themeClasses.value,\n colorClasses.value,\n borderClasses.value,\n elevationClasses.value,\n roundedClasses.value,\n variantClasses.value,\n props.class,\n ]}\n style={[\n {\n '--v-icon-btn-rotate': convertToUnit(props.rotate, 'deg'),\n '--v-icon-btn-height': convertToUnit(btnHeight),\n '--v-icon-btn-width': convertToUnit(btnWidth),\n },\n colorStyles.value,\n props.style,\n ]}\n tabindex={ props.disabled || props.readonly ? -1 : 0 }\n onClick={ onClick }\n >\n { genOverlays(!props.hideOverlay, 'v-icon-btn') }\n\n <div class=\"v-icon-btn__content\" data-no-activator=\"\">\n { (!slots.default && icon) ? (\n <VIcon\n key=\"content-icon\"\n { ...iconProps }\n />\n ) : (\n <VDefaultsProvider\n key=\"content-defaults\"\n disabled={ !icon }\n defaults={{ VIcon: { ...iconProps } }}\n v-slots={{\n default: () => slots.default?.() ?? toDisplayString(props.text),\n }}\n />\n )}\n </div>\n\n { !!props.loading && (\n <span key=\"loader\" class=\"v-icon-btn__loader\">\n { slots.loader?.() ?? (\n <VProgressCircular\n color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n indeterminate=\"disable-shrink\"\n width=\"2\"\n size={ iconSize.value }\n />\n )}\n </span>\n )}\n </props.tag>\n )\n })\n\n return {}\n },\n})\n\nexport type VIconBtn = InstanceType<typeof VIconBtn>\n"],"mappings":"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","ignoreList":[]}
|
package/lib/labs/VPie/VPie.css
CHANGED
package/lib/labs/VPie/VPie.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createElementVNode as _createElementVNode, createVNode as _createVNode, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, mergeProps as _mergeProps } from "vue";
|
|
1
|
+
import { createElementVNode as _createElementVNode, createVNode as _createVNode, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, mergeProps as _mergeProps, withDirectives as _withDirectives } from "vue";
|
|
2
2
|
// Styles
|
|
3
3
|
import "./VPie.css";
|
|
4
4
|
|
|
@@ -10,7 +10,8 @@ import { VChip } from "../../components/VChip/index.js";
|
|
|
10
10
|
import { VChipGroup } from "../../components/VChipGroup/index.js";
|
|
11
11
|
import { VDefaultsProvider } from "../../components/VDefaultsProvider/index.js"; // Composables
|
|
12
12
|
import { useColor } from "../../composables/color.js";
|
|
13
|
-
import { makeDensityProps } from "../../composables/density.js"; //
|
|
13
|
+
import { makeDensityProps } from "../../composables/density.js"; // Directives
|
|
14
|
+
import vClickOutside from "../../directives/click-outside/index.js"; // Utilities
|
|
14
15
|
import { computed, shallowRef, toRef, watch } from 'vue';
|
|
15
16
|
import { formatTextTemplate } from "./utils.js";
|
|
16
17
|
import { convertToUnit, genericComponent, pick, propsFactory } from "../../util/index.js"; // Types
|
|
@@ -56,6 +57,9 @@ export const makeVPieProps = propsFactory({
|
|
|
56
57
|
}, 'VPie');
|
|
57
58
|
export const VPie = genericComponent()({
|
|
58
59
|
name: 'VPie',
|
|
60
|
+
directives: {
|
|
61
|
+
vClickOutside
|
|
62
|
+
},
|
|
59
63
|
props: makeVPieProps(),
|
|
60
64
|
setup(props, _ref) {
|
|
61
65
|
let {
|
|
@@ -107,7 +111,7 @@ export const VPie = genericComponent()({
|
|
|
107
111
|
const visibleItems = computed(() => {
|
|
108
112
|
// hidden items get (value: 0) to trigger disappearing animation
|
|
109
113
|
return arcs.value.map(item => {
|
|
110
|
-
return
|
|
114
|
+
return isVisible(item) ? item : {
|
|
111
115
|
...item,
|
|
112
116
|
value: 0
|
|
113
117
|
};
|
|
@@ -133,11 +137,11 @@ export const VPie = genericComponent()({
|
|
|
133
137
|
const paletteItem = props.palette[index % props.palette.length];
|
|
134
138
|
return typeof paletteItem === 'object' ? paletteItem.pattern : undefined;
|
|
135
139
|
}
|
|
136
|
-
function
|
|
140
|
+
function isVisible(item) {
|
|
137
141
|
return visibleItemsKeys.value.includes(item.key);
|
|
138
142
|
}
|
|
139
143
|
function toggle(item) {
|
|
140
|
-
if (
|
|
144
|
+
if (isVisible(item)) {
|
|
141
145
|
visibleItemsKeys.value = visibleItemsKeys.value.filter(x => x !== item.key);
|
|
142
146
|
} else {
|
|
143
147
|
visibleItemsKeys.value = [...visibleItemsKeys.value, item.key];
|
|
@@ -145,24 +149,55 @@ export const VPie = genericComponent()({
|
|
|
145
149
|
}
|
|
146
150
|
const tooltipItem = shallowRef(null);
|
|
147
151
|
const tooltipVisible = shallowRef(false);
|
|
152
|
+
const tooltipTarget = shallowRef([0, 0]);
|
|
148
153
|
let mouseLeaveTimeout = null;
|
|
149
|
-
function
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
+
function setItemActive(item, active) {
|
|
155
|
+
arcs.value.forEach(a => a.isActive = a.key === item.key && active);
|
|
156
|
+
if (props.tooltip) {
|
|
157
|
+
setTooltip(item, active);
|
|
158
|
+
}
|
|
154
159
|
}
|
|
155
|
-
function
|
|
156
|
-
if (!props.tooltip) return;
|
|
160
|
+
function setTooltip(item, active) {
|
|
157
161
|
clearTimeout(mouseLeaveTimeout);
|
|
158
|
-
|
|
159
|
-
tooltipVisible.value =
|
|
160
|
-
|
|
161
|
-
|
|
162
|
+
if (active) {
|
|
163
|
+
tooltipVisible.value = true;
|
|
164
|
+
tooltipItem.value = item;
|
|
165
|
+
} else {
|
|
162
166
|
mouseLeaveTimeout = setTimeout(() => {
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
167
|
+
tooltipVisible.value = false;
|
|
168
|
+
|
|
169
|
+
// intentionally reusing timeout here
|
|
170
|
+
mouseLeaveTimeout = setTimeout(() => {
|
|
171
|
+
tooltipItem.value = null;
|
|
172
|
+
}, 500);
|
|
173
|
+
}, 100);
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
let frame = -1;
|
|
177
|
+
function onSvgMousemove(_ref2) {
|
|
178
|
+
let {
|
|
179
|
+
clientX,
|
|
180
|
+
clientY
|
|
181
|
+
} = _ref2;
|
|
182
|
+
cancelAnimationFrame(frame);
|
|
183
|
+
frame = requestAnimationFrame(() => {
|
|
184
|
+
tooltipTarget.value = [clientX, clientY];
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
function onSvgTouchstart(_ref3) {
|
|
188
|
+
let {
|
|
189
|
+
touches
|
|
190
|
+
} = _ref3;
|
|
191
|
+
if (!touches) return;
|
|
192
|
+
const {
|
|
193
|
+
clientX,
|
|
194
|
+
clientY
|
|
195
|
+
} = touches[0];
|
|
196
|
+
tooltipTarget.value = [clientX, clientY];
|
|
197
|
+
}
|
|
198
|
+
function onSvgClickOutside() {
|
|
199
|
+
arcs.value.forEach(a => a.isActive = false);
|
|
200
|
+
tooltipVisible.value = false;
|
|
166
201
|
}
|
|
167
202
|
return () => {
|
|
168
203
|
const segmentProps = pick(props, ['animation', 'gap', 'rounded', 'hideSlice', 'reveal', 'innerCut', 'hoverScale']);
|
|
@@ -176,7 +211,8 @@ export const VPie = genericComponent()({
|
|
|
176
211
|
titleFormat: typeof props.tooltip === 'object' ? props.tooltip.titleFormat : '[title]',
|
|
177
212
|
subtitleFormat: typeof props.tooltip === 'object' ? props.tooltip.subtitleFormat : '[value]',
|
|
178
213
|
transition: typeof props.tooltip === 'object' ? props.tooltip.transition : defaultTooltipTransition,
|
|
179
|
-
offset: typeof props.tooltip === 'object' ? props.tooltip.offset : 16
|
|
214
|
+
offset: typeof props.tooltip === 'object' ? props.tooltip.offset : 16,
|
|
215
|
+
target: tooltipTarget.value
|
|
180
216
|
};
|
|
181
217
|
const legendDefaults = {
|
|
182
218
|
VChipGroup: {
|
|
@@ -194,10 +230,10 @@ export const VPie = genericComponent()({
|
|
|
194
230
|
size: typeof props.tooltip === 'object' ? props.tooltip.avatarSize : 28
|
|
195
231
|
}
|
|
196
232
|
};
|
|
197
|
-
const avatarSlot =
|
|
233
|
+
const avatarSlot = _ref4 => {
|
|
198
234
|
let {
|
|
199
235
|
item
|
|
200
|
-
} =
|
|
236
|
+
} = _ref4;
|
|
201
237
|
return _createVNode(VAvatar, {
|
|
202
238
|
"color": item.color,
|
|
203
239
|
"start": true
|
|
@@ -228,18 +264,24 @@ export const VPie = genericComponent()({
|
|
|
228
264
|
}, [_createElementVNode("div", {
|
|
229
265
|
"class": _normalizeClass(['v-pie__content-underlay', colorClasses.value]),
|
|
230
266
|
"style": _normalizeStyle(colorStyles.value)
|
|
231
|
-
}, null), _createElementVNode("svg", {
|
|
267
|
+
}, null), _withDirectives(_createElementVNode("svg", {
|
|
232
268
|
"xmlns": "http://www.w3.org/2000/svg",
|
|
233
|
-
"viewBox": "0 0 100 100"
|
|
269
|
+
"viewBox": "0 0 100 100",
|
|
270
|
+
"class": "v-pie__segments",
|
|
271
|
+
"onMousemove": onSvgMousemove,
|
|
272
|
+
"onTouchstart": onSvgTouchstart
|
|
234
273
|
}, [arcs.value.map((item, index) => _createVNode(VPieSegment, _mergeProps(segmentProps, {
|
|
235
274
|
"key": item.key,
|
|
275
|
+
"active": item.isActive,
|
|
236
276
|
"color": item.color,
|
|
237
|
-
"value":
|
|
277
|
+
"value": isVisible(item) ? arcSize(item.value) : 0,
|
|
238
278
|
"rotate": arcOffset(index),
|
|
239
279
|
"pattern": item.pattern,
|
|
240
|
-
"
|
|
241
|
-
"
|
|
242
|
-
}), null))]),
|
|
280
|
+
"onUpdate:active": val => setItemActive(item, val),
|
|
281
|
+
"onTouchend": () => setItemActive(item, true)
|
|
282
|
+
}), null))]), [[vClickOutside, {
|
|
283
|
+
handler: onSvgClickOutside
|
|
284
|
+
}]]), _createElementVNode("div", {
|
|
243
285
|
"class": "v-pie__center-content",
|
|
244
286
|
"style": {
|
|
245
287
|
transform: `translate(-50%, -50%)
|
|
@@ -255,7 +297,7 @@ export const VPie = genericComponent()({
|
|
|
255
297
|
default: () => [_createElementVNode("div", {
|
|
256
298
|
"class": "v-pie__legend"
|
|
257
299
|
}, [slots.legend?.({
|
|
258
|
-
isActive,
|
|
300
|
+
isActive: isVisible,
|
|
259
301
|
toggle,
|
|
260
302
|
items: arcs.value,
|
|
261
303
|
total: total.value
|