@vuetify/nightly 3.3.12-dev.2023-08-17 → 3.3.12-dev.2023-08-18

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 (41) hide show
  1. package/CHANGELOG.md +5 -2
  2. package/dist/json/attributes.json +20 -4
  3. package/dist/json/importMap.json +42 -42
  4. package/dist/json/tags.json +4 -0
  5. package/dist/json/web-types.json +47 -11
  6. package/dist/vuetify-labs.css +923 -923
  7. package/dist/vuetify-labs.d.ts +56 -1
  8. package/dist/vuetify-labs.esm.js +43 -17
  9. package/dist/vuetify-labs.esm.js.map +1 -1
  10. package/dist/vuetify-labs.js +43 -17
  11. package/dist/vuetify-labs.min.css +2 -2
  12. package/dist/vuetify.css +217 -217
  13. package/dist/vuetify.d.ts +67 -12
  14. package/dist/vuetify.esm.js +43 -17
  15. package/dist/vuetify.esm.js.map +1 -1
  16. package/dist/vuetify.js +43 -17
  17. package/dist/vuetify.js.map +1 -1
  18. package/dist/vuetify.min.css +2 -2
  19. package/dist/vuetify.min.js +282 -277
  20. package/dist/vuetify.min.js.map +1 -1
  21. package/lib/components/VBanner/VBanner.mjs +5 -3
  22. package/lib/components/VBanner/VBanner.mjs.map +1 -1
  23. package/lib/components/VBanner/index.d.mts +10 -0
  24. package/lib/components/VNavigationDrawer/VNavigationDrawer.mjs +5 -3
  25. package/lib/components/VNavigationDrawer/VNavigationDrawer.mjs.map +1 -1
  26. package/lib/components/VNavigationDrawer/index.d.mts +10 -0
  27. package/lib/components/VSlideGroup/VSlideGroup.mjs +5 -3
  28. package/lib/components/VSlideGroup/VSlideGroup.mjs.map +1 -1
  29. package/lib/components/VSlideGroup/index.d.mts +10 -0
  30. package/lib/components/VTabs/index.d.mts +10 -0
  31. package/lib/components/index.d.mts +28 -0
  32. package/lib/composables/directiveComponent.mjs +69 -0
  33. package/lib/composables/directiveComponent.mjs.map +1 -0
  34. package/lib/composables/display.mjs +23 -3
  35. package/lib/composables/display.mjs.map +1 -1
  36. package/lib/composables/theme.mjs +7 -7
  37. package/lib/composables/theme.mjs.map +1 -1
  38. package/lib/entry-bundler.mjs +1 -1
  39. package/lib/framework.mjs +1 -1
  40. package/lib/index.d.mts +43 -12
  41. package/package.json +1 -1
package/dist/vuetify.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Vuetify v3.3.12-dev.2023-08-17
2
+ * Vuetify v3.3.12-dev.2023-08-18
3
3
  * Forged by John Leider
4
4
  * Released under the MIT License.
5
5
  */
@@ -17618,6 +17618,61 @@ html.overflow-y-hidden {
17618
17618
  }
17619
17619
  .v-banner--two-line .v-banner-text, .v-banner--three-line .v-banner-text {
17620
17620
  align-self: flex-start;
17621
+ }.v-bottom-navigation {
17622
+ display: flex;
17623
+ max-width: 100%;
17624
+ overflow: hidden;
17625
+ position: absolute;
17626
+ transition: transform, color 0.2s, 0.2s cubic-bezier(0.4, 0, 0.2, 1);
17627
+ border-color: rgba(var(--v-border-color), var(--v-border-opacity));
17628
+ border-style: solid;
17629
+ border-width: 0;
17630
+ border-radius: 0;
17631
+ background: rgb(var(--v-theme-surface));
17632
+ color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
17633
+ }
17634
+ .v-bottom-navigation--border {
17635
+ border-width: thin;
17636
+ box-shadow: none;
17637
+ }
17638
+ .v-bottom-navigation--active {
17639
+ box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.12));
17640
+ }
17641
+
17642
+ .v-bottom-navigation__content {
17643
+ display: flex;
17644
+ flex: none;
17645
+ font-size: 0.75rem;
17646
+ justify-content: center;
17647
+ transition: inherit;
17648
+ width: 100%;
17649
+ }
17650
+ .v-bottom-navigation .v-bottom-navigation__content > .v-btn {
17651
+ font-size: inherit;
17652
+ height: 100%;
17653
+ max-width: 168px;
17654
+ min-width: 80px;
17655
+ text-transform: none;
17656
+ transition: inherit;
17657
+ width: auto;
17658
+ border-radius: 0;
17659
+ }
17660
+ .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__content,
17661
+ .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
17662
+ transition: inherit;
17663
+ }
17664
+ .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
17665
+ font-size: 1.5rem;
17666
+ }
17667
+ .v-bottom-navigation--grow .v-bottom-navigation__content > .v-btn {
17668
+ flex-grow: 1;
17669
+ }
17670
+ .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content > span {
17671
+ transition: inherit;
17672
+ opacity: 0;
17673
+ }
17674
+ .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content {
17675
+ transform: translateY(0.5rem);
17621
17676
  }.v-breadcrumbs {
17622
17677
  display: flex;
17623
17678
  align-items: center;
@@ -17676,61 +17731,6 @@ html.overflow-y-hidden {
17676
17731
  display: inline-block;
17677
17732
  padding: 0 8px;
17678
17733
  vertical-align: middle;
17679
- }.v-bottom-navigation {
17680
- display: flex;
17681
- max-width: 100%;
17682
- overflow: hidden;
17683
- position: absolute;
17684
- transition: transform, color 0.2s, 0.2s cubic-bezier(0.4, 0, 0.2, 1);
17685
- border-color: rgba(var(--v-border-color), var(--v-border-opacity));
17686
- border-style: solid;
17687
- border-width: 0;
17688
- border-radius: 0;
17689
- background: rgb(var(--v-theme-surface));
17690
- color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
17691
- }
17692
- .v-bottom-navigation--border {
17693
- border-width: thin;
17694
- box-shadow: none;
17695
- }
17696
- .v-bottom-navigation--active {
17697
- box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.12));
17698
- }
17699
-
17700
- .v-bottom-navigation__content {
17701
- display: flex;
17702
- flex: none;
17703
- font-size: 0.75rem;
17704
- justify-content: center;
17705
- transition: inherit;
17706
- width: 100%;
17707
- }
17708
- .v-bottom-navigation .v-bottom-navigation__content > .v-btn {
17709
- font-size: inherit;
17710
- height: 100%;
17711
- max-width: 168px;
17712
- min-width: 80px;
17713
- text-transform: none;
17714
- transition: inherit;
17715
- width: auto;
17716
- border-radius: 0;
17717
- }
17718
- .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__content,
17719
- .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
17720
- transition: inherit;
17721
- }
17722
- .v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
17723
- font-size: 1.5rem;
17724
- }
17725
- .v-bottom-navigation--grow .v-bottom-navigation__content > .v-btn {
17726
- flex-grow: 1;
17727
- }
17728
- .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content > span {
17729
- transition: inherit;
17730
- opacity: 0;
17731
- }
17732
- .v-bottom-navigation--shift .v-bottom-navigation__content .v-btn:not(.v-btn--selected) .v-btn__content {
17733
- transform: translateY(0.5rem);
17734
17734
  }/** if false, disabled buttons will be greyed out */
17735
17735
  .v-btn {
17736
17736
  align-items: center;
@@ -19978,6 +19978,35 @@ html.overflow-y-hidden {
19978
19978
  flex: 0 1 auto;
19979
19979
  font-size: 12px;
19980
19980
  transition-duration: 150ms;
19981
+ }.v-divider {
19982
+ display: block;
19983
+ flex: 1 1 100%;
19984
+ height: 0px;
19985
+ max-height: 0px;
19986
+ opacity: var(--v-border-opacity);
19987
+ transition: inherit;
19988
+ border-style: solid;
19989
+ border-width: thin 0 0 0;
19990
+ }
19991
+ .v-divider--vertical {
19992
+ align-self: stretch;
19993
+ border-width: 0 thin 0 0;
19994
+ display: inline-flex;
19995
+ height: inherit;
19996
+ margin-left: -1px;
19997
+ max-height: 100%;
19998
+ max-width: 0px;
19999
+ vertical-align: text-bottom;
20000
+ width: 0px;
20001
+ }
20002
+ .v-divider--inset:not(.v-divider--vertical) {
20003
+ max-width: calc(100% - 72px);
20004
+ margin-inline-start: 72px;
20005
+ }
20006
+ .v-divider--inset.v-divider--vertical {
20007
+ margin-bottom: 8px;
20008
+ margin-top: 8px;
20009
+ max-height: calc(100% - 16px);
19981
20010
  }.v-dialog {
19982
20011
  align-items: center;
19983
20012
  justify-content: center;
@@ -20063,35 +20092,6 @@ html.overflow-y-hidden {
20063
20092
  -webkit-backface-visibility: hidden;
20064
20093
  backface-visibility: hidden;
20065
20094
  overflow-y: auto;
20066
- }.v-divider {
20067
- display: block;
20068
- flex: 1 1 100%;
20069
- height: 0px;
20070
- max-height: 0px;
20071
- opacity: var(--v-border-opacity);
20072
- transition: inherit;
20073
- border-style: solid;
20074
- border-width: thin 0 0 0;
20075
- }
20076
- .v-divider--vertical {
20077
- align-self: stretch;
20078
- border-width: 0 thin 0 0;
20079
- display: inline-flex;
20080
- height: inherit;
20081
- margin-left: -1px;
20082
- max-height: 100%;
20083
- max-width: 0px;
20084
- vertical-align: text-bottom;
20085
- width: 0px;
20086
- }
20087
- .v-divider--inset:not(.v-divider--vertical) {
20088
- max-width: calc(100% - 72px);
20089
- margin-inline-start: 72px;
20090
- }
20091
- .v-divider--inset.v-divider--vertical {
20092
- margin-bottom: 8px;
20093
- margin-top: 8px;
20094
- max-height: calc(100% - 16px);
20095
20095
  }.v-expansion-panel {
20096
20096
  background-color: rgb(var(--v-theme-surface));
20097
20097
  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
@@ -21863,108 +21863,6 @@ html.v-overlay-scroll-blocked {
21863
21863
  }
21864
21864
  .v-parallax--active > .v-img__img {
21865
21865
  will-change: transform;
21866
- }.v-progress-circular {
21867
- align-items: center;
21868
- display: inline-flex;
21869
- justify-content: center;
21870
- position: relative;
21871
- vertical-align: middle;
21872
- }
21873
- .v-progress-circular > svg {
21874
- width: 100%;
21875
- height: 100%;
21876
- margin: auto;
21877
- position: absolute;
21878
- top: 0;
21879
- bottom: 0;
21880
- left: 0;
21881
- right: 0;
21882
- z-index: 0;
21883
- }
21884
-
21885
- .v-progress-circular__content {
21886
- align-items: center;
21887
- display: flex;
21888
- justify-content: center;
21889
- }
21890
-
21891
- .v-progress-circular__underlay {
21892
- color: rgba(var(--v-border-color), var(--v-border-opacity));
21893
- stroke: currentColor;
21894
- z-index: 1;
21895
- }
21896
-
21897
- .v-progress-circular__overlay {
21898
- stroke: currentColor;
21899
- transition: all 0.2s ease-in-out, stroke-width 0s;
21900
- z-index: 2;
21901
- }
21902
-
21903
- .v-progress-circular--size-x-small {
21904
- height: 16px;
21905
- width: 16px;
21906
- }
21907
- .v-progress-circular--size-small {
21908
- height: 24px;
21909
- width: 24px;
21910
- }
21911
- .v-progress-circular--size-default {
21912
- height: 32px;
21913
- width: 32px;
21914
- }
21915
- .v-progress-circular--size-large {
21916
- height: 48px;
21917
- width: 48px;
21918
- }
21919
- .v-progress-circular--size-x-large {
21920
- height: 64px;
21921
- width: 64px;
21922
- }
21923
-
21924
- .v-progress-circular--indeterminate > svg {
21925
- animation: progress-circular-rotate 1.4s linear infinite;
21926
- transform-origin: center center;
21927
- transition: all 0.2s ease-in-out;
21928
- }
21929
- .v-progress-circular--indeterminate .v-progress-circular__overlay {
21930
- animation: progress-circular-dash 1.4s ease-in-out infinite, progress-circular-rotate 1.4s linear infinite;
21931
- stroke-dasharray: 25, 200;
21932
- stroke-dashoffset: 0;
21933
- stroke-linecap: round;
21934
- transform-origin: center center;
21935
- transform: rotate(-90deg);
21936
- }
21937
-
21938
- .v-progress-circular--disable-shrink > svg {
21939
- animation-duration: 0.7s;
21940
- }
21941
- .v-progress-circular--disable-shrink .v-progress-circular__overlay {
21942
- animation: none;
21943
- }
21944
-
21945
- .v-progress-circular--indeterminate:not(.v-progress-circular--visible) > svg,
21946
- .v-progress-circular--indeterminate:not(.v-progress-circular--visible) .v-progress-circular__overlay {
21947
- animation-play-state: paused !important;
21948
- }
21949
-
21950
- @keyframes progress-circular-dash {
21951
- 0% {
21952
- stroke-dasharray: 1, 200;
21953
- stroke-dashoffset: 0px;
21954
- }
21955
- 50% {
21956
- stroke-dasharray: 100, 200;
21957
- stroke-dashoffset: -15px;
21958
- }
21959
- 100% {
21960
- stroke-dasharray: 100, 200;
21961
- stroke-dashoffset: -124px;
21962
- }
21963
- }
21964
- @keyframes progress-circular-rotate {
21965
- 100% {
21966
- transform: rotate(270deg);
21967
- }
21968
21866
  }.v-progress-linear {
21969
21867
  background: transparent;
21970
21868
  overflow: hidden;
@@ -23021,6 +22919,45 @@ html.v-overlay-scroll-blocked {
23021
22919
  .v-table--fixed-footer > .v-table__wrapper > table > tfoot > tr > td,
23022
22920
  .v-table--fixed-footer > .v-table__wrapper > table > tfoot > tr > th {
23023
22921
  border-top: 0px !important;
22922
+ }.v-textarea .v-field {
22923
+ --v-textarea-control-height: var(--v-input-control-height);
22924
+ }
22925
+ .v-textarea .v-field__field {
22926
+ --v-input-control-height: var(--v-textarea-control-height);
22927
+ }
22928
+ .v-textarea .v-field__input {
22929
+ flex: 1 1 auto;
22930
+ outline: none;
22931
+ -webkit-mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
22932
+ mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
22933
+ }
22934
+ .v-textarea .v-field__input.v-textarea__sizer {
22935
+ visibility: hidden;
22936
+ position: absolute;
22937
+ top: 0;
22938
+ left: 0;
22939
+ height: 0 !important;
22940
+ min-height: 0 !important;
22941
+ pointer-events: none;
22942
+ }
22943
+ .v-textarea--no-resize .v-field__input {
22944
+ resize: none;
22945
+ }
22946
+ .v-textarea .v-field--no-label textarea,
22947
+ .v-textarea .v-field--active textarea {
22948
+ opacity: 1;
22949
+ }
22950
+ .v-textarea textarea {
22951
+ opacity: 0;
22952
+ flex: 1;
22953
+ min-width: 0;
22954
+ transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
22955
+ }
22956
+ .v-textarea textarea:focus, .v-textarea textarea:active {
22957
+ outline: none;
22958
+ }
22959
+ .v-textarea textarea:invalid {
22960
+ box-shadow: none;
23024
22961
  }/* region BLOCK */
23025
22962
  .v-text-field input {
23026
22963
  color: inherit;
@@ -23791,45 +23728,108 @@ html.v-overlay-scroll-blocked {
23791
23728
  }
23792
23729
  .v-window-y-reverse-transition-leave-to {
23793
23730
  transform: translateY(100%);
23794
- }.v-textarea .v-field {
23795
- --v-textarea-control-height: var(--v-input-control-height);
23796
- }
23797
- .v-textarea .v-field__field {
23798
- --v-input-control-height: var(--v-textarea-control-height);
23799
- }
23800
- .v-textarea .v-field__input {
23801
- flex: 1 1 auto;
23802
- outline: none;
23803
- -webkit-mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
23804
- mask-image: linear-gradient(to bottom, transparent, transparent calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) - 6px), black calc(var(--v-field-padding-top, 0) + var(--v-input-padding-top, 0) + 4px));
23731
+ }.v-progress-circular {
23732
+ align-items: center;
23733
+ display: inline-flex;
23734
+ justify-content: center;
23735
+ position: relative;
23736
+ vertical-align: middle;
23805
23737
  }
23806
- .v-textarea .v-field__input.v-textarea__sizer {
23807
- visibility: hidden;
23738
+ .v-progress-circular > svg {
23739
+ width: 100%;
23740
+ height: 100%;
23741
+ margin: auto;
23808
23742
  position: absolute;
23809
23743
  top: 0;
23744
+ bottom: 0;
23810
23745
  left: 0;
23811
- height: 0 !important;
23812
- min-height: 0 !important;
23813
- pointer-events: none;
23746
+ right: 0;
23747
+ z-index: 0;
23814
23748
  }
23815
- .v-textarea--no-resize .v-field__input {
23816
- resize: none;
23749
+
23750
+ .v-progress-circular__content {
23751
+ align-items: center;
23752
+ display: flex;
23753
+ justify-content: center;
23817
23754
  }
23818
- .v-textarea .v-field--no-label textarea,
23819
- .v-textarea .v-field--active textarea {
23820
- opacity: 1;
23755
+
23756
+ .v-progress-circular__underlay {
23757
+ color: rgba(var(--v-border-color), var(--v-border-opacity));
23758
+ stroke: currentColor;
23759
+ z-index: 1;
23821
23760
  }
23822
- .v-textarea textarea {
23823
- opacity: 0;
23824
- flex: 1;
23825
- min-width: 0;
23826
- transition: 0.15s opacity cubic-bezier(0.4, 0, 0.2, 1);
23761
+
23762
+ .v-progress-circular__overlay {
23763
+ stroke: currentColor;
23764
+ transition: all 0.2s ease-in-out, stroke-width 0s;
23765
+ z-index: 2;
23827
23766
  }
23828
- .v-textarea textarea:focus, .v-textarea textarea:active {
23829
- outline: none;
23767
+
23768
+ .v-progress-circular--size-x-small {
23769
+ height: 16px;
23770
+ width: 16px;
23830
23771
  }
23831
- .v-textarea textarea:invalid {
23832
- box-shadow: none;
23772
+ .v-progress-circular--size-small {
23773
+ height: 24px;
23774
+ width: 24px;
23775
+ }
23776
+ .v-progress-circular--size-default {
23777
+ height: 32px;
23778
+ width: 32px;
23779
+ }
23780
+ .v-progress-circular--size-large {
23781
+ height: 48px;
23782
+ width: 48px;
23783
+ }
23784
+ .v-progress-circular--size-x-large {
23785
+ height: 64px;
23786
+ width: 64px;
23787
+ }
23788
+
23789
+ .v-progress-circular--indeterminate > svg {
23790
+ animation: progress-circular-rotate 1.4s linear infinite;
23791
+ transform-origin: center center;
23792
+ transition: all 0.2s ease-in-out;
23793
+ }
23794
+ .v-progress-circular--indeterminate .v-progress-circular__overlay {
23795
+ animation: progress-circular-dash 1.4s ease-in-out infinite, progress-circular-rotate 1.4s linear infinite;
23796
+ stroke-dasharray: 25, 200;
23797
+ stroke-dashoffset: 0;
23798
+ stroke-linecap: round;
23799
+ transform-origin: center center;
23800
+ transform: rotate(-90deg);
23801
+ }
23802
+
23803
+ .v-progress-circular--disable-shrink > svg {
23804
+ animation-duration: 0.7s;
23805
+ }
23806
+ .v-progress-circular--disable-shrink .v-progress-circular__overlay {
23807
+ animation: none;
23808
+ }
23809
+
23810
+ .v-progress-circular--indeterminate:not(.v-progress-circular--visible) > svg,
23811
+ .v-progress-circular--indeterminate:not(.v-progress-circular--visible) .v-progress-circular__overlay {
23812
+ animation-play-state: paused !important;
23813
+ }
23814
+
23815
+ @keyframes progress-circular-dash {
23816
+ 0% {
23817
+ stroke-dasharray: 1, 200;
23818
+ stroke-dashoffset: 0px;
23819
+ }
23820
+ 50% {
23821
+ stroke-dasharray: 100, 200;
23822
+ stroke-dashoffset: -15px;
23823
+ }
23824
+ 100% {
23825
+ stroke-dasharray: 100, 200;
23826
+ stroke-dashoffset: -124px;
23827
+ }
23828
+ }
23829
+ @keyframes progress-circular-rotate {
23830
+ 100% {
23831
+ transform: rotate(270deg);
23832
+ }
23833
23833
  }.v-color-picker-canvas {
23834
23834
  display: flex;
23835
23835
  position: relative;