vuetify 3.1.14 → 3.1.16

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.
Files changed (113) hide show
  1. package/dist/json/attributes.json +193 -141
  2. package/dist/json/importMap.json +8 -8
  3. package/dist/json/tags.json +13 -0
  4. package/dist/json/web-types.json +513 -282
  5. package/dist/vuetify-labs.css +465 -457
  6. package/dist/vuetify-labs.d.ts +521 -163
  7. package/dist/vuetify-labs.esm.js +272 -179
  8. package/dist/vuetify-labs.esm.js.map +1 -1
  9. package/dist/vuetify-labs.js +272 -179
  10. package/dist/vuetify-labs.min.css +2 -2
  11. package/dist/vuetify.css +17 -9
  12. package/dist/vuetify.d.ts +470 -145
  13. package/dist/vuetify.esm.js +178 -106
  14. package/dist/vuetify.esm.js.map +1 -1
  15. package/dist/vuetify.js +178 -106
  16. package/dist/vuetify.js.map +1 -1
  17. package/dist/vuetify.min.css +2 -2
  18. package/dist/vuetify.min.js +638 -624
  19. package/dist/vuetify.min.js.map +1 -1
  20. package/lib/components/VAutocomplete/VAutocomplete.css +9 -0
  21. package/lib/components/VAutocomplete/VAutocomplete.mjs +50 -6
  22. package/lib/components/VAutocomplete/VAutocomplete.mjs.map +1 -1
  23. package/lib/components/VAutocomplete/VAutocomplete.sass +10 -0
  24. package/lib/components/VAutocomplete/index.d.ts +29 -17
  25. package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs +31 -16
  26. package/lib/components/VBreadcrumbs/VBreadcrumbs.mjs.map +1 -1
  27. package/lib/components/VBreadcrumbs/index.d.ts +3 -3
  28. package/lib/components/VCard/VCard.mjs.map +1 -1
  29. package/lib/components/VCard/index.d.ts +21 -16
  30. package/lib/components/VCheckbox/VCheckbox.mjs +2 -2
  31. package/lib/components/VCheckbox/VCheckbox.mjs.map +1 -1
  32. package/lib/components/VCheckbox/index.d.ts +22 -1
  33. package/lib/components/VCombobox/VCombobox.css +1 -1
  34. package/lib/components/VCombobox/VCombobox.mjs +6 -4
  35. package/lib/components/VCombobox/VCombobox.mjs.map +1 -1
  36. package/lib/components/VCombobox/VCombobox.sass +1 -1
  37. package/lib/components/VCombobox/index.d.ts +29 -17
  38. package/lib/components/VDialog/VDialog.mjs +2 -2
  39. package/lib/components/VDialog/VDialog.mjs.map +1 -1
  40. package/lib/components/VField/VField.css +0 -1
  41. package/lib/components/VField/VField.sass +0 -1
  42. package/lib/components/VField/index.d.ts +6 -0
  43. package/lib/components/VFileInput/VFileInput.mjs +13 -17
  44. package/lib/components/VFileInput/VFileInput.mjs.map +1 -1
  45. package/lib/components/VFileInput/index.d.ts +68 -23
  46. package/lib/components/VInput/VInput.mjs +14 -7
  47. package/lib/components/VInput/VInput.mjs.map +1 -1
  48. package/lib/components/VInput/index.d.ts +22 -1
  49. package/lib/components/VList/VList.mjs +3 -22
  50. package/lib/components/VList/VList.mjs.map +1 -1
  51. package/lib/components/VOverlay/locationStrategies.mjs +9 -4
  52. package/lib/components/VOverlay/locationStrategies.mjs.map +1 -1
  53. package/lib/components/VRadioGroup/VRadioGroup.mjs +2 -2
  54. package/lib/components/VRadioGroup/VRadioGroup.mjs.map +1 -1
  55. package/lib/components/VRadioGroup/index.d.ts +22 -1
  56. package/lib/components/VRangeSlider/VRangeSlider.mjs +2 -2
  57. package/lib/components/VRangeSlider/VRangeSlider.mjs.map +1 -1
  58. package/lib/components/VRangeSlider/index.d.ts +22 -1
  59. package/lib/components/VSelect/VSelect.mjs +6 -0
  60. package/lib/components/VSelect/VSelect.mjs.map +1 -1
  61. package/lib/components/VSelect/index.d.ts +32 -17
  62. package/lib/components/VSlideGroup/VSlideGroup.mjs +2 -2
  63. package/lib/components/VSlideGroup/VSlideGroup.mjs.map +1 -1
  64. package/lib/components/VSlider/VSlider.mjs +2 -2
  65. package/lib/components/VSlider/VSlider.mjs.map +1 -1
  66. package/lib/components/VSlider/index.d.ts +22 -1
  67. package/lib/components/VSwitch/VSwitch.mjs +5 -3
  68. package/lib/components/VSwitch/VSwitch.mjs.map +1 -1
  69. package/lib/components/VSwitch/index.d.ts +43 -1
  70. package/lib/components/VTextField/VTextField.mjs +4 -12
  71. package/lib/components/VTextField/VTextField.mjs.map +1 -1
  72. package/lib/components/VTextField/index.d.ts +70 -22
  73. package/lib/components/VTextarea/VTextarea.mjs +4 -12
  74. package/lib/components/VTextarea/VTextarea.mjs.map +1 -1
  75. package/lib/components/VTextarea/index.d.ts +61 -22
  76. package/lib/components/VTreeview/_mixins.sass +0 -0
  77. package/lib/components/VTreeview/util/filterTreeItems.mjs +0 -0
  78. package/lib/components/VValidation/index.d.ts +10 -1
  79. package/lib/components/index.d.ts +468 -143
  80. package/lib/composables/focus.mjs +3 -2
  81. package/lib/composables/focus.mjs.map +1 -1
  82. package/lib/composables/items.mjs +7 -2
  83. package/lib/composables/items.mjs.map +1 -1
  84. package/lib/entry-bundler.mjs +1 -1
  85. package/lib/framework.mjs +1 -1
  86. package/lib/iconsets/mdi-svg.mjs +2 -2
  87. package/lib/iconsets/mdi-svg.mjs.map +1 -1
  88. package/lib/index.d.ts +2 -2
  89. package/lib/labs/VDataTable/VDataTable.mjs +3 -3
  90. package/lib/labs/VDataTable/VDataTable.mjs.map +1 -1
  91. package/lib/labs/VDataTable/VDataTableFooter.mjs.map +1 -1
  92. package/lib/labs/VDataTable/VDataTableHeaders.mjs +34 -20
  93. package/lib/labs/VDataTable/VDataTableHeaders.mjs.map +1 -1
  94. package/lib/labs/VDataTable/VDataTableRow.mjs +2 -4
  95. package/lib/labs/VDataTable/VDataTableRow.mjs.map +1 -1
  96. package/lib/labs/VDataTable/VDataTableRows.mjs +52 -44
  97. package/lib/labs/VDataTable/VDataTableRows.mjs.map +1 -1
  98. package/lib/labs/VDataTable/VDataTableServer.mjs +3 -2
  99. package/lib/labs/VDataTable/VDataTableServer.mjs.map +1 -1
  100. package/lib/labs/VDataTable/VDataTableVirtual.mjs +0 -1
  101. package/lib/labs/VDataTable/VDataTableVirtual.mjs.map +1 -1
  102. package/lib/labs/VDataTable/composables/options.mjs +2 -1
  103. package/lib/labs/VDataTable/composables/options.mjs.map +1 -1
  104. package/lib/labs/VDataTable/index.d.ts +44 -11
  105. package/lib/labs/VSkeletonLoader/VSkeletonLoader.mjs +1 -0
  106. package/lib/labs/VSkeletonLoader/VSkeletonLoader.mjs.map +1 -1
  107. package/lib/labs/VSkeletonLoader/index.d.ts +9 -9
  108. package/lib/labs/components.d.ts +53 -20
  109. package/lib/locale/el.mjs +0 -0
  110. package/lib/locale/index.mjs +0 -0
  111. package/lib/util/helpers.mjs +26 -0
  112. package/lib/util/helpers.mjs.map +1 -1
  113. package/package.json +3 -3
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Vuetify v3.1.14
2
+ * Vuetify v3.1.16
3
3
  * Forged by John Leider
4
4
  * Released under the MIT License.
5
5
  */
@@ -356,6 +356,32 @@ function callEvent(handler) {
356
356
  handler(...args);
357
357
  }
358
358
  }
359
+ function focusableChildren(el) {
360
+ const targets = ['button', '[href]', 'input:not([type="hidden"])', 'select', 'textarea', '[tabindex]'].map(s => `${s}:not([tabindex="-1"]):not([disabled])`).join(', ');
361
+ return [...el.querySelectorAll(targets)];
362
+ }
363
+ function focusChild(el, location) {
364
+ const focusable = focusableChildren(el);
365
+ const idx = focusable.indexOf(document.activeElement);
366
+ if (!location) {
367
+ if (!el.contains(document.activeElement)) {
368
+ focusable[0]?.focus();
369
+ }
370
+ } else if (location === 'first') {
371
+ focusable[0]?.focus();
372
+ } else if (location === 'last') {
373
+ focusable.at(-1)?.focus();
374
+ } else {
375
+ let _el;
376
+ let idxx = idx;
377
+ const inc = location === 'next' ? 1 : -1;
378
+ do {
379
+ idxx += inc;
380
+ _el = focusable[idxx];
381
+ } while ((!_el || _el.offsetParent == null) && idxx < focusable.length && idxx >= 0);
382
+ if (_el) _el.focus();else focusChild(el, location === 'next' ? 'first' : 'last');
383
+ }
384
+ }
359
385
 
360
386
  const block = ['top', 'bottom'];
361
387
  const inline = ['start', 'end', 'left', 'right'];
@@ -5289,7 +5315,8 @@ const VFieldLabel = genericComponent()({
5289
5315
 
5290
5316
  // Composables
5291
5317
  const makeFocusProps = propsFactory({
5292
- focused: Boolean
5318
+ focused: Boolean,
5319
+ 'onUpdate:focused': EventProp()
5293
5320
  }, 'focus');
5294
5321
  function useFocus(props) {
5295
5322
  let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
@@ -5878,6 +5905,8 @@ const makeVInputProps = propsFactory({
5878
5905
  appendIcon: IconValue,
5879
5906
  prependIcon: IconValue,
5880
5907
  hideDetails: [Boolean, String],
5908
+ hint: String,
5909
+ persistentHint: Boolean,
5881
5910
  messages: {
5882
5911
  type: [Array, String],
5883
5912
  default: () => []
@@ -5941,10 +5970,19 @@ const VInput = genericComponent()({
5941
5970
  resetValidation,
5942
5971
  validate
5943
5972
  }));
5973
+ const messages = computed(() => {
5974
+ if (errorMessages.value.length > 0) {
5975
+ return errorMessages.value;
5976
+ } else if (props.hint && (props.persistentHint || props.focused)) {
5977
+ return props.hint;
5978
+ } else {
5979
+ return props.messages;
5980
+ }
5981
+ });
5944
5982
  useRender(() => {
5945
5983
  const hasPrepend = !!(slots.prepend || props.prependIcon);
5946
5984
  const hasAppend = !!(slots.append || props.appendIcon);
5947
- const hasMessages = !!(props.messages?.length || errorMessages.value.length);
5985
+ const hasMessages = messages.value.length > 0;
5948
5986
  const hasDetails = !props.hideDetails || props.hideDetails === 'auto' && (hasMessages || !!slots.details);
5949
5987
  return createVNode("div", {
5950
5988
  "class": ['v-input', `v-input--${props.direction}`, densityClasses.value, validationClasses.value]
@@ -5967,7 +6005,7 @@ const VInput = genericComponent()({
5967
6005
  }, [createVNode(VMessages, {
5968
6006
  "id": messagesId.value,
5969
6007
  "active": hasMessages,
5970
- "messages": errorMessages.value.length > 0 ? errorMessages.value : props.messages
6008
+ "messages": messages.value
5971
6009
  }, {
5972
6010
  message: slots.message
5973
6011
  }), slots.details?.(slotProps.value)])]);
@@ -5979,10 +6017,6 @@ const VInput = genericComponent()({
5979
6017
  };
5980
6018
  }
5981
6019
  });
5982
- function filterInputProps(props) {
5983
- const keys = Object.keys(VInput.props).filter(k => !isOn(k));
5984
- return pick(props, keys);
5985
- }
5986
6020
 
5987
6021
  const VCounter = genericComponent()({
5988
6022
  name: 'VCounter',
@@ -6108,8 +6142,6 @@ const makeVTextFieldProps = propsFactory({
6108
6142
  autofocus: Boolean,
6109
6143
  counter: [Boolean, Number, String],
6110
6144
  counterValue: Function,
6111
- hint: String,
6112
- persistentHint: Boolean,
6113
6145
  prefix: String,
6114
6146
  placeholder: String,
6115
6147
  persistentPlaceholder: Boolean,
@@ -6164,9 +6196,6 @@ const VTextField = genericComponent()({
6164
6196
  const vFieldRef = ref();
6165
6197
  const inputRef = ref();
6166
6198
  const isActive = computed(() => activeTypes.includes(props.type) || props.persistentPlaceholder || isFocused.value);
6167
- const messages = computed(() => {
6168
- return props.messages.length ? props.messages : isFocused.value || props.persistentHint ? props.hint : '';
6169
- });
6170
6199
  function onFocus() {
6171
6200
  if (inputRef.value !== document.activeElement) {
6172
6201
  inputRef.value?.focus();
@@ -6209,7 +6238,7 @@ const VTextField = genericComponent()({
6209
6238
  const [{
6210
6239
  modelValue: _,
6211
6240
  ...inputProps
6212
- }] = filterInputProps(props);
6241
+ }] = VInput.filterProps(props);
6213
6242
  const [fieldProps] = filterFieldProps(props);
6214
6243
  return createVNode(VInput, mergeProps({
6215
6244
  "ref": vInputRef,
@@ -6219,12 +6248,9 @@ const VTextField = genericComponent()({
6219
6248
  'v-text-field--prefixed': props.prefix,
6220
6249
  'v-text-field--suffixed': props.suffix,
6221
6250
  'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant)
6222
- }],
6223
- "onClick:prepend": props['onClick:prepend'],
6224
- "onClick:append": props['onClick:append']
6251
+ }]
6225
6252
  }, rootAttrs, inputProps, {
6226
- "focused": isFocused.value,
6227
- "messages": messages.value
6253
+ "focused": isFocused.value
6228
6254
  }), {
6229
6255
  ...slots,
6230
6256
  default: _ref2 => {
@@ -6633,7 +6659,7 @@ const VCheckbox = genericComponent()({
6633
6659
  const id = computed(() => props.id || `checkbox-${uid}`);
6634
6660
  useRender(() => {
6635
6661
  const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
6636
- const [inputProps, _1] = filterInputProps(props);
6662
+ const [inputProps, _1] = VInput.filterProps(props);
6637
6663
  const [checkboxProps, _2] = VCheckboxBtn.filterProps(props);
6638
6664
  return createVNode(VInput, mergeProps({
6639
6665
  "class": "v-checkbox"
@@ -8045,7 +8071,12 @@ function transformItems$1(props, items) {
8045
8071
  function useItems(props) {
8046
8072
  const items = computed(() => transformItems$1(props, props.items));
8047
8073
  function transformIn(value) {
8048
- return value.map(item => transformItem$1(props, item));
8074
+ return value.map(v => {
8075
+ const existingItem = items.value.find(item => deepEqual(v, item.value));
8076
+ // Nullish existingItem means value is a custom input value from combobox
8077
+ // In this case, use transformItem to create an InternalItem based on value
8078
+ return existingItem ?? transformItem$1(props, v);
8079
+ });
8049
8080
  }
8050
8081
  function transformOut(value) {
8051
8082
  return value.map(_ref => {
@@ -8218,27 +8249,8 @@ const VList = genericComponent()({
8218
8249
  e.preventDefault();
8219
8250
  }
8220
8251
  function focus(location) {
8221
- if (!contentRef.value) return;
8222
- const targets = ['button', '[href]', 'input', 'select', 'textarea', '[tabindex]'].map(s => `${s}:not([tabindex="-1"])`).join(', ');
8223
- const focusable = [...contentRef.value.querySelectorAll(targets)].filter(el => !el.hasAttribute('disabled'));
8224
- const idx = focusable.indexOf(document.activeElement);
8225
- if (!location) {
8226
- if (!contentRef.value.contains(document.activeElement)) {
8227
- focusable[0]?.focus();
8228
- }
8229
- } else if (location === 'first') {
8230
- focusable[0]?.focus();
8231
- } else if (location === 'last') {
8232
- focusable.at(-1)?.focus();
8233
- } else {
8234
- let el;
8235
- let idxx = idx;
8236
- const inc = location === 'next' ? 1 : -1;
8237
- do {
8238
- idxx += inc;
8239
- el = focusable[idxx];
8240
- } while ((!el || el.offsetParent == null) && idxx < focusable.length && idxx >= 0);
8241
- if (el) el.focus();else focus(location === 'next' ? 'first' : 'last');
8252
+ if (contentRef.value) {
8253
+ return focusChild(contentRef.value, location);
8242
8254
  }
8243
8255
  }
8244
8256
  useRender(() => {
@@ -8723,7 +8735,7 @@ function staticLocationStrategy() {
8723
8735
  }
8724
8736
 
8725
8737
  /** Get size of element ignoring max-width/max-height */
8726
- function getIntrinsicSize(el) {
8738
+ function getIntrinsicSize(el, isRtl) {
8727
8739
  // const scrollables = new Map<Element, [number, number]>()
8728
8740
  // el.querySelectorAll('*').forEach(el => {
8729
8741
  // const x = el.scrollLeft
@@ -8740,7 +8752,11 @@ function getIntrinsicSize(el) {
8740
8752
 
8741
8753
  /* eslint-disable-next-line sonarjs/prefer-immediate-return */
8742
8754
  const contentBox = nullifyTransforms(el);
8743
- contentBox.x -= parseFloat(el.style.left || 0);
8755
+ if (isRtl) {
8756
+ contentBox.x += parseFloat(el.style.right || 0);
8757
+ } else {
8758
+ contentBox.x -= parseFloat(el.style.left || 0);
8759
+ }
8744
8760
  contentBox.y -= parseFloat(el.style.top || 0);
8745
8761
 
8746
8762
  // el.style.maxWidth = initialMaxWidth
@@ -8821,7 +8837,7 @@ function connectedLocationStrategy(data, props, contentStyles) {
8821
8837
  });
8822
8838
  if (!data.activatorEl.value || !data.contentEl.value) return;
8823
8839
  const targetBox = data.activatorEl.value.getBoundingClientRect();
8824
- const contentBox = getIntrinsicSize(data.contentEl.value);
8840
+ const contentBox = getIntrinsicSize(data.contentEl.value, data.isRtl.value);
8825
8841
  const scrollParents = getScrollParents(data.contentEl.value);
8826
8842
  const viewportMargin = 12;
8827
8843
  if (!scrollParents.length) {
@@ -8997,7 +9013,8 @@ function connectedLocationStrategy(data, props, contentStyles) {
8997
9013
  transformOrigin: `${placement.origin.side} ${placement.origin.align}`,
8998
9014
  // transform: `translate(${pixelRound(x)}px, ${pixelRound(y)}px)`,
8999
9015
  top: convertToUnit(pixelRound(y)),
9000
- left: convertToUnit(pixelRound(x)),
9016
+ left: data.isRtl.value ? undefined : convertToUnit(pixelRound(x)),
9017
+ right: data.isRtl.value ? convertToUnit(pixelRound(-x)) : undefined,
9001
9018
  minWidth: convertToUnit(axis === 'y' ? Math.min(minWidth.value, targetBox.width) : minWidth.value),
9002
9019
  maxWidth: convertToUnit(pixelCeil(clamp(available.x, minWidth.value === Infinity ? 0 : minWidth.value, maxWidth.value))),
9003
9020
  maxHeight: convertToUnit(pixelCeil(clamp(available.y, minHeight.value === Infinity ? 0 : minHeight.value, maxHeight.value)))
@@ -9892,6 +9909,7 @@ const VSelect = genericComponent()({
9892
9909
  })
9893
9910
  },
9894
9911
  emits: {
9912
+ 'update:focused': focused => true,
9895
9913
  'update:modelValue': val => true,
9896
9914
  'update:menu': val => true
9897
9915
  },
@@ -10008,6 +10026,9 @@ const VSelect = genericComponent()({
10008
10026
  menu.value = false;
10009
10027
  }
10010
10028
  }
10029
+ function onFocusin(e) {
10030
+ isFocused.value = true;
10031
+ }
10011
10032
  function onFocusout(e) {
10012
10033
  if (e.relatedTarget == null) {
10013
10034
  vTextFieldRef.value?.focus();
@@ -10062,6 +10083,7 @@ const VSelect = genericComponent()({
10062
10083
  "selected": selected.value,
10063
10084
  "selectStrategy": props.multiple ? 'independent' : 'single-independent',
10064
10085
  "onMousedown": e => e.preventDefault(),
10086
+ "onFocusin": onFocusin,
10065
10087
  "onFocusout": onFocusout
10066
10088
  }, {
10067
10089
  default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
@@ -10140,6 +10162,7 @@ const VSelect = genericComponent()({
10140
10162
  });
10141
10163
  });
10142
10164
  return forwardRefs({
10165
+ isFocused,
10143
10166
  menu,
10144
10167
  select
10145
10168
  }, vTextFieldRef);
@@ -10278,6 +10301,7 @@ const VAutocomplete = genericComponent()({
10278
10301
  })
10279
10302
  },
10280
10303
  emits: {
10304
+ 'update:focused': focused => true,
10281
10305
  'update:search': val => true,
10282
10306
  'update:modelValue': val => true,
10283
10307
  'update:menu': val => true
@@ -10301,11 +10325,17 @@ const VAutocomplete = genericComponent()({
10301
10325
  _menu.value = v;
10302
10326
  }
10303
10327
  });
10328
+ const selectionIndex = ref(-1);
10329
+ const color = computed(() => vTextFieldRef.value?.color);
10304
10330
  const {
10305
10331
  items,
10306
10332
  transformIn,
10307
10333
  transformOut
10308
10334
  } = useItems(props);
10335
+ const {
10336
+ textColorClasses,
10337
+ textColorStyles
10338
+ } = useTextColor(color);
10309
10339
  const search = useProxiedModel(props, 'search', '');
10310
10340
  const model = useProxiedModel(props, 'modelValue', [], v => transformIn(wrapInArray(v)), v => {
10311
10341
  const transformed = transformOut(v);
@@ -10328,6 +10358,7 @@ const VAutocomplete = genericComponent()({
10328
10358
  return filteredItems.value;
10329
10359
  });
10330
10360
  const selected = computed(() => selections.value.map(selection => selection.props.value));
10361
+ const selection = computed(() => selections.value[selectionIndex.value]);
10331
10362
  const listRef = ref();
10332
10363
  function onClear(e) {
10333
10364
  if (props.openOnClear) {
@@ -10341,7 +10372,9 @@ const VAutocomplete = genericComponent()({
10341
10372
  }
10342
10373
  function onKeydown(e) {
10343
10374
  if (props.readonly || form?.isReadonly.value) return;
10344
- if (['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
10375
+ const selectionStart = vTextFieldRef.value.selectionStart;
10376
+ const length = selected.value.length;
10377
+ if (selectionIndex.value > -1 || ['Enter', 'ArrowDown', 'ArrowUp'].includes(e.key)) {
10345
10378
  e.preventDefault();
10346
10379
  }
10347
10380
  if (['Enter', 'ArrowDown'].includes(e.key)) {
@@ -10358,6 +10391,38 @@ const VAutocomplete = genericComponent()({
10358
10391
  } else if (e.key === 'ArrowUp') {
10359
10392
  listRef.value?.focus('prev');
10360
10393
  }
10394
+ if (!props.multiple) return;
10395
+ if (['Backspace', 'Delete'].includes(e.key)) {
10396
+ if (selectionIndex.value < 0) {
10397
+ if (e.key === 'Backspace' && !search.value) {
10398
+ selectionIndex.value = length - 1;
10399
+ }
10400
+ return;
10401
+ }
10402
+ const originalSelectionIndex = selectionIndex.value;
10403
+ if (selection.value) select(selection.value);
10404
+ selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
10405
+ }
10406
+ if (e.key === 'ArrowLeft') {
10407
+ if (selectionIndex.value < 0 && selectionStart > 0) return;
10408
+ const prev = selectionIndex.value > -1 ? selectionIndex.value - 1 : length - 1;
10409
+ if (selections.value[prev]) {
10410
+ selectionIndex.value = prev;
10411
+ } else {
10412
+ selectionIndex.value = -1;
10413
+ vTextFieldRef.value.setSelectionRange(search.value?.length, search.value?.length);
10414
+ }
10415
+ }
10416
+ if (e.key === 'ArrowRight') {
10417
+ if (selectionIndex.value < 0) return;
10418
+ const next = selectionIndex.value + 1;
10419
+ if (selections.value[next]) {
10420
+ selectionIndex.value = next;
10421
+ } else {
10422
+ selectionIndex.value = -1;
10423
+ vTextFieldRef.value.setSelectionRange(0, 0);
10424
+ }
10425
+ }
10361
10426
  }
10362
10427
  function onInput(e) {
10363
10428
  search.value = e.target.value;
@@ -10379,7 +10444,6 @@ const VAutocomplete = genericComponent()({
10379
10444
  const index = selected.value.findIndex(selection => props.valueComparator(selection, item.value));
10380
10445
  if (index === -1) {
10381
10446
  model.value = [...model.value, item];
10382
- search.value = '';
10383
10447
  } else {
10384
10448
  const value = [...model.value];
10385
10449
  value.splice(index, 1);
@@ -10424,12 +10488,15 @@ const VAutocomplete = genericComponent()({
10424
10488
  "onUpdate:modelValue": v => {
10425
10489
  if (v == null) model.value = [];
10426
10490
  },
10491
+ "focused": isFocused.value,
10492
+ "onUpdate:focused": $event => isFocused.value = $event,
10427
10493
  "validationValue": model.externalValue,
10428
10494
  "dirty": isDirty,
10429
10495
  "onInput": onInput,
10430
10496
  "class": ['v-autocomplete', {
10431
10497
  'v-autocomplete--active-menu': menu.value,
10432
10498
  'v-autocomplete--chips': !!props.chips,
10499
+ 'v-autocomplete--selecting-index': selectionIndex.value > -1,
10433
10500
  [`v-autocomplete--${props.multiple ? 'multiple' : 'single'}`]: true,
10434
10501
  'v-autocomplete--selection-slot': !!slots.selection
10435
10502
  }],
@@ -10438,8 +10505,6 @@ const VAutocomplete = genericComponent()({
10438
10505
  "placeholder": isDirty ? undefined : props.placeholder,
10439
10506
  "onClick:clear": onClear,
10440
10507
  "onMousedown:control": onMousedownControl,
10441
- "onFocus": () => isFocused.value = true,
10442
- "onBlur": () => isFocused.value = false,
10443
10508
  "onKeydown": onKeydown
10444
10509
  }), {
10445
10510
  ...slots,
@@ -10504,7 +10569,8 @@ const VAutocomplete = genericComponent()({
10504
10569
  };
10505
10570
  return createVNode("div", {
10506
10571
  "key": item.value,
10507
- "class": "v-autocomplete__selection"
10572
+ "class": ['v-autocomplete__selection', index === selectionIndex.value && ['v-autocomplete__selection--selected', textColorClasses.value]],
10573
+ "style": index === selectionIndex.value ? textColorStyles.value : {}
10508
10574
  }, [hasChips ? !slots.chip ? createVNode(VChip, mergeProps({
10509
10575
  "key": "chip",
10510
10576
  "closable": props.closableChips,
@@ -10995,6 +11061,17 @@ const VBreadcrumbs = genericComponent()({
10995
11061
  disabled: toRef(props, 'disabled')
10996
11062
  }
10997
11063
  });
11064
+ const items = computed(() => props.items.map(item => {
11065
+ return typeof item === 'string' ? {
11066
+ item: {
11067
+ title: item
11068
+ },
11069
+ raw: item
11070
+ } : {
11071
+ item,
11072
+ raw: item
11073
+ };
11074
+ }));
10998
11075
  useRender(() => {
10999
11076
  const hasPrepend = !!(slots.prepend || props.icon);
11000
11077
  return createVNode(props.tag, {
@@ -11017,22 +11094,26 @@ const VBreadcrumbs = genericComponent()({
11017
11094
  start: true
11018
11095
  }
11019
11096
  }
11020
- }, slots.prepend)]), props.items.map((item, index, array) => createVNode(Fragment, null, [createVNode(VBreadcrumbsItem, mergeProps({
11021
- "key": index,
11022
- "disabled": index >= array.length - 1
11023
- }, typeof item === 'string' ? {
11024
- title: item
11025
- } : item), {
11026
- default: slots.title ? () => slots.title?.({
11027
- item,
11028
- index
11029
- }) : undefined
11030
- }), index < array.length - 1 && createVNode(VBreadcrumbsDivider, null, {
11031
- default: slots.divider ? () => slots.divider?.({
11097
+ }, slots.prepend)]), items.value.map((_ref2, index, array) => {
11098
+ let {
11032
11099
  item,
11033
- index
11034
- }) : undefined
11035
- })])), slots.default?.()]
11100
+ raw
11101
+ } = _ref2;
11102
+ return createVNode(Fragment, null, [createVNode(VBreadcrumbsItem, mergeProps({
11103
+ "key": item.title,
11104
+ "disabled": index >= array.length - 1
11105
+ }, item), {
11106
+ default: slots.title ? () => slots.title?.({
11107
+ item: raw,
11108
+ index
11109
+ }) : undefined
11110
+ }), index < array.length - 1 && createVNode(VBreadcrumbsDivider, null, {
11111
+ default: slots.divider ? () => slots.divider?.({
11112
+ item: raw,
11113
+ index
11114
+ }) : undefined
11115
+ })]);
11116
+ }), slots.default?.()]
11036
11117
  });
11037
11118
  });
11038
11119
  return {};
@@ -12899,7 +12980,7 @@ const VSlider = genericComponent()({
12899
12980
  } = useFocus(props);
12900
12981
  const trackStop = computed(() => position(model.value));
12901
12982
  useRender(() => {
12902
- const [inputProps, _] = filterInputProps(props);
12983
+ const [inputProps, _] = VInput.filterProps(props);
12903
12984
  const hasPrepend = !!(props.label || slots.label || slots.prepend);
12904
12985
  return createVNode(VInput, mergeProps({
12905
12986
  "class": ['v-slider', {
@@ -13563,6 +13644,7 @@ const VCombobox = genericComponent()({
13563
13644
  })
13564
13645
  },
13565
13646
  emits: {
13647
+ 'update:focused': focused => true,
13566
13648
  'update:modelValue': val => true,
13567
13649
  'update:search': val => true,
13568
13650
  'update:menu': val => true
@@ -13700,8 +13782,9 @@ const VCombobox = genericComponent()({
13700
13782
  }
13701
13783
  return;
13702
13784
  }
13703
- select(selection.value);
13704
- nextTick(() => !selection.value && (selectionIndex.value = length - 2));
13785
+ const originalSelectionIndex = selectionIndex.value;
13786
+ if (selection.value) select(selection.value);
13787
+ selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
13705
13788
  }
13706
13789
  if (e.key === 'ArrowLeft') {
13707
13790
  if (selectionIndex.value < 0 && selectionStart > 0) return;
@@ -13786,6 +13869,8 @@ const VCombobox = genericComponent()({
13786
13869
  "onUpdate:modelValue": [$event => search.value = $event, v => {
13787
13870
  if (v == null) model.value = [];
13788
13871
  }],
13872
+ "focused": isFocused.value,
13873
+ "onUpdate:focused": $event => isFocused.value = $event,
13789
13874
  "validationValue": model.externalValue,
13790
13875
  "dirty": isDirty,
13791
13876
  "class": ['v-combobox', {
@@ -13799,8 +13884,6 @@ const VCombobox = genericComponent()({
13799
13884
  "placeholder": isDirty ? undefined : props.placeholder,
13800
13885
  "onClick:clear": onClear,
13801
13886
  "onMousedown:control": onMousedownControl,
13802
- "onFocus": () => isFocused.value = true,
13803
- "onBlur": () => isFocused.value = false,
13804
13887
  "onKeydown": onKeydown
13805
13888
  }), {
13806
13889
  ...slots,
@@ -13952,7 +14035,7 @@ const VDialog = genericComponent()({
13952
14035
  ![document, overlay.value.contentEl].includes(after) &&
13953
14036
  // It isn't inside the dialog body
13954
14037
  !overlay.value.contentEl.contains(after)) {
13955
- const focusable = [...overlay.value.contentEl.querySelectorAll('button, [href], input:not([type="hidden"]), select, textarea, [tabindex]:not([tabindex="-1"])')].filter(el => !el.hasAttribute('disabled') && !el.matches('[tabindex="-1"]'));
14038
+ const focusable = focusableChildren(overlay.value.contentEl);
13956
14039
  if (!focusable.length) return;
13957
14040
  const firstElement = focusable[0];
13958
14041
  const lastElement = focusable[focusable.length - 1];
@@ -14252,8 +14335,6 @@ const VFileInput = genericComponent()({
14252
14335
  default: '$vuetify.fileInput.counter'
14253
14336
  },
14254
14337
  multiple: Boolean,
14255
- hint: String,
14256
- persistentHint: Boolean,
14257
14338
  showSize: {
14258
14339
  type: [Boolean, Number],
14259
14340
  default: false,
@@ -14278,6 +14359,7 @@ const VFileInput = genericComponent()({
14278
14359
  emits: {
14279
14360
  'click:control': e => true,
14280
14361
  'mousedown:control': e => true,
14362
+ 'update:focused': focused => true,
14281
14363
  'update:modelValue': files => true
14282
14364
  },
14283
14365
  setup(props, _ref) {
@@ -14290,6 +14372,11 @@ const VFileInput = genericComponent()({
14290
14372
  t
14291
14373
  } = useLocale();
14292
14374
  const model = useProxiedModel(props, 'modelValue');
14375
+ const {
14376
+ isFocused,
14377
+ focus,
14378
+ blur
14379
+ } = useFocus(props);
14293
14380
  const base = computed(() => typeof props.showSize !== 'boolean' ? props.showSize : undefined);
14294
14381
  const totalBytes = computed(() => (model.value ?? []).reduce((bytes, _ref2) => {
14295
14382
  let {
@@ -14311,21 +14398,14 @@ const VFileInput = genericComponent()({
14311
14398
  });
14312
14399
  const vInputRef = ref();
14313
14400
  const vFieldRef = ref();
14314
- const isFocused = ref(false);
14315
14401
  const inputRef = ref();
14316
- const messages = computed(() => {
14317
- return props.messages.length ? props.messages : props.persistentHint ? props.hint : '';
14318
- });
14319
14402
  function onFocus() {
14320
14403
  if (inputRef.value !== document.activeElement) {
14321
14404
  inputRef.value?.focus();
14322
14405
  }
14323
- if (!isFocused.value) {
14324
- isFocused.value = true;
14325
- }
14406
+ if (!isFocused.value) focus();
14326
14407
  }
14327
14408
  function onClickPrepend(e) {
14328
- callEvent(props['onClick:prepend'], e);
14329
14409
  onControlClick(e);
14330
14410
  }
14331
14411
  function onControlMousedown(e) {
@@ -14356,18 +14436,16 @@ const VFileInput = genericComponent()({
14356
14436
  const [{
14357
14437
  modelValue: _,
14358
14438
  ...inputProps
14359
- }] = filterInputProps(props);
14439
+ }] = VInput.filterProps(props);
14360
14440
  const [fieldProps] = filterFieldProps(props);
14361
14441
  return createVNode(VInput, mergeProps({
14362
14442
  "ref": vInputRef,
14363
14443
  "modelValue": model.value,
14364
14444
  "onUpdate:modelValue": $event => model.value = $event,
14365
14445
  "class": "v-file-input",
14366
- "onClick:prepend": onClickPrepend,
14367
- "onClick:append": props['onClick:append']
14446
+ "onClick:prepend": onClickPrepend
14368
14447
  }, rootAttrs, inputProps, {
14369
- "focused": isFocused.value,
14370
- "messages": messages.value
14448
+ "focused": isFocused.value
14371
14449
  }), {
14372
14450
  ...slots,
14373
14451
  default: _ref3 => {
@@ -14419,7 +14497,7 @@ const VFileInput = genericComponent()({
14419
14497
  model.value = [...(target.files ?? [])];
14420
14498
  },
14421
14499
  "onFocus": onFocus,
14422
- "onBlur": () => isFocused.value = false
14500
+ "onBlur": blur
14423
14501
  }, slotProps, inputAttrs), null), createVNode("div", {
14424
14502
  "class": fieldClass
14425
14503
  }, [!!model.value?.length && (slots.selection ? slots.selection({
@@ -16114,7 +16192,7 @@ const VRadioGroup = genericComponent()({
16114
16192
  const model = useProxiedModel(props, 'modelValue');
16115
16193
  useRender(() => {
16116
16194
  const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
16117
- const [inputProps, _1] = filterInputProps(props);
16195
+ const [inputProps, _1] = VInput.filterProps(props);
16118
16196
  const [controlProps, _2] = VSelectionControl.filterProps(props);
16119
16197
  const label = slots.label ? slots.label({
16120
16198
  label: props.label,
@@ -16242,7 +16320,7 @@ const VRangeSlider = genericComponent()({
16242
16320
  const trackStart = computed(() => position(model.value[0]));
16243
16321
  const trackStop = computed(() => position(model.value[1]));
16244
16322
  useRender(() => {
16245
- const [inputProps, _] = filterInputProps(props);
16323
+ const [inputProps, _] = VInput.filterProps(props);
16246
16324
  const hasPrepend = !!(props.label || slots.label || slots.prepend);
16247
16325
  return createVNode(VInput, mergeProps({
16248
16326
  "class": ['v-slider', 'v-range-slider', {
@@ -16802,7 +16880,7 @@ const VSlideGroup = genericComponent()({
16802
16880
  function focus(location) {
16803
16881
  if (!contentRef.value) return;
16804
16882
  if (!location) {
16805
- const focusable = [...contentRef.value.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')].filter(el => !el.hasAttribute('disabled'));
16883
+ const focusable = focusableChildren(contentRef.value);
16806
16884
  focusable[0]?.focus();
16807
16885
  } else if (location === 'next') {
16808
16886
  const el = contentRef.value.querySelector(':focus')?.nextElementSibling;
@@ -17116,10 +17194,12 @@ const VSwitch = genericComponent()({
17116
17194
  }
17117
17195
  useRender(() => {
17118
17196
  const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
17119
- const [inputProps, _1] = filterInputProps(props);
17197
+ const [inputProps, _1] = VInput.filterProps(props);
17120
17198
  const [controlProps, _2] = VSelectionControl.filterProps(props);
17121
17199
  const control = ref();
17122
- function onClick() {
17200
+ function onClick(e) {
17201
+ e.stopPropagation();
17202
+ e.preventDefault();
17123
17203
  control.value?.input?.click();
17124
17204
  }
17125
17205
  return createVNode(VInput, mergeProps({
@@ -17481,8 +17561,6 @@ const VTextarea = genericComponent()({
17481
17561
  autofocus: Boolean,
17482
17562
  counter: [Boolean, Number, String],
17483
17563
  counterValue: Function,
17484
- hint: String,
17485
- persistentHint: Boolean,
17486
17564
  prefix: String,
17487
17565
  placeholder: String,
17488
17566
  persistentPlaceholder: Boolean,
@@ -17537,9 +17615,6 @@ const VTextarea = genericComponent()({
17537
17615
  const controlHeight = ref('');
17538
17616
  const textareaRef = ref();
17539
17617
  const isActive = computed(() => isFocused.value || props.persistentPlaceholder);
17540
- const messages = computed(() => {
17541
- return props.messages.length ? props.messages : isFocused.value || props.persistentHint ? props.hint : '';
17542
- });
17543
17618
  function onFocus() {
17544
17619
  if (textareaRef.value !== document.activeElement) {
17545
17620
  textareaRef.value?.focus();
@@ -17611,7 +17686,7 @@ const VTextarea = genericComponent()({
17611
17686
  const [{
17612
17687
  modelValue: _,
17613
17688
  ...inputProps
17614
- }] = filterInputProps(props);
17689
+ }] = VInput.filterProps(props);
17615
17690
  const [fieldProps] = filterFieldProps(props);
17616
17691
  return createVNode(VInput, mergeProps({
17617
17692
  "ref": vInputRef,
@@ -17625,12 +17700,9 @@ const VTextarea = genericComponent()({
17625
17700
  'v-textarea--auto-grow': props.autoGrow,
17626
17701
  'v-textarea--no-resize': props.noResize || props.autoGrow,
17627
17702
  'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant)
17628
- }],
17629
- "onClick:prepend": props['onClick:prepend'],
17630
- "onClick:append": props['onClick:append']
17703
+ }]
17631
17704
  }, rootAttrs, inputProps, {
17632
- "focused": isFocused.value,
17633
- "messages": messages.value
17705
+ "focused": isFocused.value
17634
17706
  }), {
17635
17707
  ...slots,
17636
17708
  default: _ref2 => {
@@ -18403,7 +18475,7 @@ function createVuetify$1() {
18403
18475
  locale
18404
18476
  };
18405
18477
  }
18406
- const version$1 = "3.1.14";
18478
+ const version$1 = "3.1.16";
18407
18479
  createVuetify$1.version = version$1;
18408
18480
 
18409
18481
  // Vue's inject() can only be used in setup
@@ -18423,7 +18495,7 @@ const createVuetify = function () {
18423
18495
  ...options
18424
18496
  });
18425
18497
  };
18426
- const version = "3.1.14";
18498
+ const version = "3.1.16";
18427
18499
  createVuetify.version = version;
18428
18500
 
18429
18501
  export { components, createVuetify, directives, useDisplay, useLayout, useLocale, useRtl, useTheme, version };