@vuetify/nightly 4.0.0-dev-20230206.0 → 4.0.0-dev-20230211.0

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 (25) hide show
  1. package/CHANGELOG.md +7 -2
  2. package/dist/json/importMap.json +98 -98
  3. package/dist/json/web-types.json +1 -1
  4. package/dist/vuetify-labs.css +208 -199
  5. package/dist/vuetify-labs.d.ts +54 -0
  6. package/dist/vuetify-labs.esm.js +50 -14
  7. package/dist/vuetify-labs.esm.js.map +1 -1
  8. package/dist/vuetify-labs.js +50 -14
  9. package/dist/vuetify-labs.min.css +2 -2
  10. package/dist/vuetify.css +156 -156
  11. package/dist/vuetify.d.ts +26 -26
  12. package/dist/vuetify.esm.js +3 -3
  13. package/dist/vuetify.js +3 -3
  14. package/dist/vuetify.min.css +2 -2
  15. package/dist/vuetify.min.js +3 -3
  16. package/lib/entry-bundler.mjs +1 -1
  17. package/lib/framework.mjs +1 -1
  18. package/lib/index.d.ts +26 -26
  19. package/lib/labs/VDataTable/VDataTableFooter.css +9 -0
  20. package/lib/labs/VDataTable/VDataTableFooter.mjs +51 -13
  21. package/lib/labs/VDataTable/VDataTableFooter.mjs.map +1 -1
  22. package/lib/labs/VDataTable/VDataTableFooter.sass +7 -0
  23. package/lib/labs/VDataTable/index.d.ts +54 -0
  24. package/lib/labs/components.d.ts +54 -0
  25. package/package.json +1 -1
package/dist/vuetify.min.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Vuetify v4.0.0-dev-20230206.0
2
+ * Vuetify v4.0.0-dev-20230211.0
3
3
  * Forged by John Leider
4
4
  * Released under the MIT License.
5
5
  */
@@ -1575,8 +1575,8 @@ e.mount=function(){const a=l(...arguments)
1575
1575
  return t.nextTick((()=>c.update())),e.mount=l,a}}Le.reset(),("boolean"!=typeof __VUE_OPTIONS_API__||__VUE_OPTIONS_API__)&&e.mixin({computed:{$vuetify(){return t.reactive({defaults:Js.call(this,Pe),display:Js.call(this,Bn),theme:Js.call(this,vt),icons:Js.call(this,Ul),locale:Js.call(this,Bt)})}}})}
1576
1576
  return{install:f,defaults:u,display:c,theme:d,icons:v,locale:p}}function Js(e){var t,l
1577
1577
  const a=this.$,o=(null==(t=a.parent)?void 0:t.provides)??(null==(l=a.vnode.appContext)?void 0:l.provides)
1578
- if(o&&e in o)return o[e]}Zs.version="4.0.0-dev-20230206.0"
1578
+ if(o&&e in o)return o[e]}Zs.version="4.0.0-dev-20230211.0"
1579
1579
  const Qs=function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}
1580
- return Zs({components:Hs,directives:Ks,...e})},eu="4.0.0-dev-20230206.0"
1580
+ return Zs({components:Hs,directives:Ks,...e})},eu="4.0.0-dev-20230211.0"
1581
1581
  Qs.version=eu,e.components=Hs,e.createVuetify=Qs,e.directives=Ks,e.useDisplay=Tn,e.useLayout=tt,e.useLocale=At,e.useRtl=Rt,e.useTheme=ht,e.version=eu,Object.defineProperty(e,"__esModule",{value:!0})}))
1582
1582
  //# sourceMappingURL=vuetify.min.js.map
package/lib/entry-bundler.mjs CHANGED
@@ -10,7 +10,7 @@ export const createVuetify = function () {
10
10
  ...options
11
11
  });
12
12
  };
13
- export const version = "4.0.0-dev-20230206.0";
13
+ export const version = "4.0.0-dev-20230211.0";
14
14
  createVuetify.version = version;
15
15
  export { components, directives };
16
16
  export * from "./composables/index.mjs";
package/lib/framework.mjs CHANGED
@@ -89,7 +89,7 @@ export function createVuetify() {
89
89
  locale
90
90
  };
91
91
  }
92
- export const version = "4.0.0-dev-20230206.0";
92
+ export const version = "4.0.0-dev-20230211.0";
93
93
  createVuetify.version = version;
94
94
 
95
95
  // Vue's inject() can only be used in setup
package/lib/index.d.ts CHANGED
@@ -315,21 +315,18 @@ declare module '@vue/runtime-core' {
315
315
 
316
316
  export interface GlobalComponents {
317
317
  VDefaultsProvider: typeof import('vuetify/components')['VDefaultsProvider']
318
- VForm: typeof import('vuetify/components')['VForm']
319
318
  VContainer: typeof import('vuetify/components')['VContainer']
320
319
  VCol: typeof import('vuetify/components')['VCol']
321
320
  VRow: typeof import('vuetify/components')['VRow']
322
321
  VSpacer: typeof import('vuetify/components')['VSpacer']
323
322
  VHover: typeof import('vuetify/components')['VHover']
324
- VLayout: typeof import('vuetify/components')['VLayout']
325
- VLayoutItem: typeof import('vuetify/components')['VLayoutItem']
326
- VLazy: typeof import('vuetify/components')['VLazy']
323
+ VForm: typeof import('vuetify/components')['VForm']
327
324
  VLocaleProvider: typeof import('vuetify/components')['VLocaleProvider']
328
325
  VNoSsr: typeof import('vuetify/components')['VNoSsr']
329
- VParallax: typeof import('vuetify/components')['VParallax']
330
326
  VRadio: typeof import('vuetify/components')['VRadio']
331
327
  VRangeSlider: typeof import('vuetify/components')['VRangeSlider']
332
328
  VResponsive: typeof import('vuetify/components')['VResponsive']
329
+ VParallax: typeof import('vuetify/components')['VParallax']
333
330
  VThemeProvider: typeof import('vuetify/components')['VThemeProvider']
334
331
  VValidation: typeof import('vuetify/components')['VValidation']
335
332
  VFabTransition: typeof import('vuetify/components')['VFabTransition']
@@ -354,35 +351,35 @@ declare module '@vue/runtime-core' {
354
351
  VAppBarTitle: typeof import('vuetify/components')['VAppBarTitle']
355
352
  VAlert: typeof import('vuetify/components')['VAlert']
356
353
  VAlertTitle: typeof import('vuetify/components')['VAlertTitle']
357
- VAutocomplete: typeof import('vuetify/components')['VAutocomplete']
358
354
  VAvatar: typeof import('vuetify/components')['VAvatar']
359
- VBadge: typeof import('vuetify/components')['VBadge']
360
- VBanner: typeof import('vuetify/components')['VBanner']
361
- VBannerActions: typeof import('vuetify/components')['VBannerActions']
362
- VBannerText: typeof import('vuetify/components')['VBannerText']
355
+ VAutocomplete: typeof import('vuetify/components')['VAutocomplete']
363
356
  VBottomNavigation: typeof import('vuetify/components')['VBottomNavigation']
357
+ VBadge: typeof import('vuetify/components')['VBadge']
364
358
  VBreadcrumbs: typeof import('vuetify/components')['VBreadcrumbs']
365
359
  VBreadcrumbsItem: typeof import('vuetify/components')['VBreadcrumbsItem']
366
360
  VBreadcrumbsDivider: typeof import('vuetify/components')['VBreadcrumbsDivider']
361
+ VBanner: typeof import('vuetify/components')['VBanner']
362
+ VBannerActions: typeof import('vuetify/components')['VBannerActions']
363
+ VBannerText: typeof import('vuetify/components')['VBannerText']
367
364
  VBtn: typeof import('vuetify/components')['VBtn']
368
- VBtnGroup: typeof import('vuetify/components')['VBtnGroup']
369
- VBtnToggle: typeof import('vuetify/components')['VBtnToggle']
370
365
  VCard: typeof import('vuetify/components')['VCard']
371
366
  VCardActions: typeof import('vuetify/components')['VCardActions']
372
367
  VCardItem: typeof import('vuetify/components')['VCardItem']
373
368
  VCardSubtitle: typeof import('vuetify/components')['VCardSubtitle']
374
369
  VCardText: typeof import('vuetify/components')['VCardText']
375
370
  VCardTitle: typeof import('vuetify/components')['VCardTitle']
371
+ VBtnToggle: typeof import('vuetify/components')['VBtnToggle']
372
+ VBtnGroup: typeof import('vuetify/components')['VBtnGroup']
376
373
  VCarousel: typeof import('vuetify/components')['VCarousel']
377
374
  VCarouselItem: typeof import('vuetify/components')['VCarouselItem']
378
375
  VCheckbox: typeof import('vuetify/components')['VCheckbox']
379
376
  VCheckboxBtn: typeof import('vuetify/components')['VCheckboxBtn']
380
377
  VChip: typeof import('vuetify/components')['VChip']
381
- VChipGroup: typeof import('vuetify/components')['VChipGroup']
382
378
  VCode: typeof import('vuetify/components')['VCode']
379
+ VChipGroup: typeof import('vuetify/components')['VChipGroup']
383
380
  VColorPicker: typeof import('vuetify/components')['VColorPicker']
384
- VCombobox: typeof import('vuetify/components')['VCombobox']
385
381
  VCounter: typeof import('vuetify/components')['VCounter']
382
+ VCombobox: typeof import('vuetify/components')['VCombobox']
386
383
  VDialog: typeof import('vuetify/components')['VDialog']
387
384
  VDivider: typeof import('vuetify/components')['VDivider']
388
385
  VExpansionPanels: typeof import('vuetify/components')['VExpansionPanels']
@@ -399,20 +396,11 @@ declare module '@vue/runtime-core' {
399
396
  VLigatureIcon: typeof import('vuetify/components')['VLigatureIcon']
400
397
  VClassIcon: typeof import('vuetify/components')['VClassIcon']
401
398
  VImg: typeof import('vuetify/components')['VImg']
402
- VInput: typeof import('vuetify/components')['VInput']
403
399
  VItemGroup: typeof import('vuetify/components')['VItemGroup']
404
400
  VItem: typeof import('vuetify/components')['VItem']
401
+ VInput: typeof import('vuetify/components')['VInput']
405
402
  VKbd: typeof import('vuetify/components')['VKbd']
406
403
  VLabel: typeof import('vuetify/components')['VLabel']
407
- VList: typeof import('vuetify/components')['VList']
408
- VListGroup: typeof import('vuetify/components')['VListGroup']
409
- VListImg: typeof import('vuetify/components')['VListImg']
410
- VListItem: typeof import('vuetify/components')['VListItem']
411
- VListItemAction: typeof import('vuetify/components')['VListItemAction']
412
- VListItemMedia: typeof import('vuetify/components')['VListItemMedia']
413
- VListItemSubtitle: typeof import('vuetify/components')['VListItemSubtitle']
414
- VListItemTitle: typeof import('vuetify/components')['VListItemTitle']
415
- VListSubheader: typeof import('vuetify/components')['VListSubheader']
416
404
  VMain: typeof import('vuetify/components')['VMain']
417
405
  VMenu: typeof import('vuetify/components')['VMenu']
418
406
  VMessages: typeof import('vuetify/components')['VMessages']
@@ -423,8 +411,8 @@ declare module '@vue/runtime-core' {
423
411
  VProgressLinear: typeof import('vuetify/components')['VProgressLinear']
424
412
  VRadioGroup: typeof import('vuetify/components')['VRadioGroup']
425
413
  VRating: typeof import('vuetify/components')['VRating']
426
- VSelect: typeof import('vuetify/components')['VSelect']
427
414
  VSelectionControl: typeof import('vuetify/components')['VSelectionControl']
415
+ VSelect: typeof import('vuetify/components')['VSelect']
428
416
  VSelectionControlGroup: typeof import('vuetify/components')['VSelectionControlGroup']
429
417
  VSheet: typeof import('vuetify/components')['VSheet']
430
418
  VSlideGroup: typeof import('vuetify/components')['VSlideGroup']
@@ -440,11 +428,23 @@ declare module '@vue/runtime-core' {
440
428
  VTextField: typeof import('vuetify/components')['VTextField']
441
429
  VTimeline: typeof import('vuetify/components')['VTimeline']
442
430
  VTimelineItem: typeof import('vuetify/components')['VTimelineItem']
431
+ VTooltip: typeof import('vuetify/components')['VTooltip']
443
432
  VToolbar: typeof import('vuetify/components')['VToolbar']
444
433
  VToolbarTitle: typeof import('vuetify/components')['VToolbarTitle']
445
434
  VToolbarItems: typeof import('vuetify/components')['VToolbarItems']
446
- VTooltip: typeof import('vuetify/components')['VTooltip']
447
435
  VWindow: typeof import('vuetify/components')['VWindow']
448
436
  VWindowItem: typeof import('vuetify/components')['VWindowItem']
437
+ VLazy: typeof import('vuetify/components')['VLazy']
438
+ VLayout: typeof import('vuetify/components')['VLayout']
439
+ VLayoutItem: typeof import('vuetify/components')['VLayoutItem']
440
+ VList: typeof import('vuetify/components')['VList']
441
+ VListGroup: typeof import('vuetify/components')['VListGroup']
442
+ VListImg: typeof import('vuetify/components')['VListImg']
443
+ VListItem: typeof import('vuetify/components')['VListItem']
444
+ VListItemAction: typeof import('vuetify/components')['VListItemAction']
445
+ VListItemMedia: typeof import('vuetify/components')['VListItemMedia']
446
+ VListItemSubtitle: typeof import('vuetify/components')['VListItemSubtitle']
447
+ VListItemTitle: typeof import('vuetify/components')['VListItemTitle']
448
+ VListSubheader: typeof import('vuetify/components')['VListSubheader']
449
449
  }
450
450
  }
package/lib/labs/VDataTable/VDataTableFooter.css CHANGED
@@ -19,4 +19,13 @@
19
19
  .v-data-table-footer__info {
20
20
  display: flex;
21
21
  padding-inline-end: 24px;
22
+ }
23
+
24
+ .v-data-table-footer__pagination {
25
+ display: flex;
26
+ align-items: center;
27
+ }
28
+
29
+ .v-data-table-footer__page {
30
+ padding: 0 8px;
22
31
  }
package/lib/labs/VDataTable/VDataTableFooter.mjs CHANGED
@@ -1,11 +1,13 @@
1
- import { createVNode as _createVNode, createTextVNode as _createTextVNode } from "vue";
1
+ import { createVNode as _createVNode } from "vue";
2
2
  // Styles
3
3
  import "./VDataTableFooter.css";
4
4
 
5
5
  // Components
6
6
  import { VBtn } from "../../components/VBtn/index.mjs";
7
7
  import { VSelect } from "../../components/VSelect/index.mjs"; // Composables
8
- import { usePagination } from "./composables/paginate.mjs"; // Utilities
8
+ import { usePagination } from "./composables/paginate.mjs";
9
+ import { useLocale } from "../entry-bundler.mjs"; // Utilities
10
+ import { computed } from 'vue';
9
11
  import { defineComponent } from "../../util/index.mjs"; // Types
10
12
  export const VDataTableFooter = defineComponent({
11
13
  name: 'VDataTableFooter',
@@ -26,6 +28,30 @@ export const VDataTableFooter = defineComponent({
26
28
  type: String,
27
29
  default: '$last'
28
30
  },
31
+ itemsPerPageText: {
32
+ type: String,
33
+ default: '$vuetify.dataFooter.itemsPerPageText'
34
+ },
35
+ pageText: {
36
+ type: String,
37
+ default: '$vuetify.dataFooter.pageText'
38
+ },
39
+ firstPageLabel: {
40
+ type: String,
41
+ default: '$vuetify.dataFooter.firstPage'
42
+ },
43
+ prevPageLabel: {
44
+ type: String,
45
+ default: '$vuetify.dataFooter.prevPage'
46
+ },
47
+ nextPageLabel: {
48
+ type: String,
49
+ default: '$vuetify.dataFooter.nextPage'
50
+ },
51
+ lastPageLabel: {
52
+ type: String,
53
+ default: '$vuetify.dataFooter.lastPage'
54
+ },
29
55
  itemsPerPageOptions: {
30
56
  type: Array,
31
57
  default: () => [{
@@ -42,7 +68,7 @@ export const VDataTableFooter = defineComponent({
42
68
  title: '100'
43
69
  }, {
44
70
  value: -1,
45
- title: 'All'
71
+ title: '$vuetify.dataFooter.itemsPerPageAll'
46
72
  }]
47
73
  },
48
74
  showCurrentPage: Boolean
@@ -51,6 +77,9 @@ export const VDataTableFooter = defineComponent({
51
77
  let {
52
78
  slots
53
79
  } = _ref;
80
+ const {
81
+ t
82
+ } = useLocale();
54
83
  const {
55
84
  page,
56
85
  pageCount,
@@ -59,14 +88,18 @@ export const VDataTableFooter = defineComponent({
59
88
  itemsLength,
60
89
  itemsPerPage
61
90
  } = usePagination();
91
+ const itemsPerPageOptions = computed(() => props.itemsPerPageOptions.map(option => ({
92
+ ...option,
93
+ title: t(option.title)
94
+ })));
62
95
  return () => {
63
96
  var _slots$prepend;
64
97
  return _createVNode("div", {
65
98
  "class": "v-data-table-footer"
66
99
  }, [(_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots), _createVNode("div", {
67
100
  "class": "v-data-table-footer__items-per-page"
68
- }, [_createVNode("span", null, [_createTextVNode("Items per page:")]), _createVNode(VSelect, {
69
- "items": props.itemsPerPageOptions,
101
+ }, [_createVNode("span", null, [t(props.itemsPerPageText)]), _createVNode(VSelect, {
102
+ "items": itemsPerPageOptions.value,
70
103
  "modelValue": itemsPerPage.value,
71
104
  "onUpdate:modelValue": v => itemsPerPage.value = Number(v),
72
105
  "density": "compact",
@@ -74,30 +107,35 @@ export const VDataTableFooter = defineComponent({
74
107
  "hide-details": true
75
108
  }, null)]), _createVNode("div", {
76
109
  "class": "v-data-table-footer__info"
77
- }, [_createVNode("div", null, [!itemsLength.value ? 0 : startIndex.value + 1, _createTextVNode(" - "), stopIndex.value, _createTextVNode(" of "), itemsLength.value])]), _createVNode("div", {
110
+ }, [_createVNode("div", null, [t(props.pageText, !itemsLength.value ? 0 : startIndex.value + 1, stopIndex.value, itemsLength.value)])]), _createVNode("div", {
78
111
  "class": "v-data-table-footer__pagination"
79
112
  }, [_createVNode(VBtn, {
80
113
  "icon": props.firstIcon,
81
114
  "variant": "plain",
82
115
  "onClick": () => page.value = 1,
83
- "disabled": page.value === 1
116
+ "disabled": page.value === 1,
117
+ "aria-label": t(props.firstPageLabel)
84
118
  }, null), _createVNode(VBtn, {
85
119
  "icon": props.prevIcon,
86
120
  "variant": "plain",
87
121
  "onClick": () => page.value = Math.max(1, page.value - 1),
88
- "disabled": page.value === 1
89
- }, null), props.showCurrentPage && _createVNode("div", {
90
- "key": "page"
91
- }, [_createTextVNode("page.value")]), _createVNode(VBtn, {
122
+ "disabled": page.value === 1,
123
+ "aria-label": t(props.prevPageLabel)
124
+ }, null), props.showCurrentPage && _createVNode("span", {
125
+ "key": "page",
126
+ "class": "v-data-table-footer__page"
127
+ }, [page.value]), _createVNode(VBtn, {
92
128
  "icon": props.nextIcon,
93
129
  "variant": "plain",
94
130
  "onClick": () => page.value = Math.min(pageCount.value, page.value + 1),
95
- "disabled": page.value === pageCount.value
131
+ "disabled": page.value === pageCount.value,
132
+ "aria-label": t(props.nextPageLabel)
96
133
  }, null), _createVNode(VBtn, {
97
134
  "icon": props.lastIcon,
98
135
  "variant": "plain",
99
136
  "onClick": () => page.value = pageCount.value,
100
- "disabled": page.value === pageCount.value
137
+ "disabled": page.value === pageCount.value,
138
+ "aria-label": t(props.lastPageLabel)
101
139
  }, null)])]);
102
140
  };
103
141
  }
package/lib/labs/VDataTable/VDataTableFooter.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"VDataTableFooter.mjs","names":["VBtn","VSelect","usePagination","defineComponent","VDataTableFooter","name","props","prevIcon","type","String","default","nextIcon","firstIcon","lastIcon","itemsPerPageOptions","Array","value","title","showCurrentPage","Boolean","setup","slots","page","pageCount","startIndex","stopIndex","itemsLength","itemsPerPage","prepend","v","Number","Math","max","min"],"sources":["../../../src/labs/VDataTable/VDataTableFooter.tsx"],"sourcesContent":["// Styles\nimport './VDataTableFooter.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\nimport { VSelect } from '@/components/VSelect'\n\n// Composables\nimport { usePagination } from './composables/paginate'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { InternalItem } from '@/composables/items'\n\nexport const VDataTableFooter = defineComponent({\n name: 'VDataTableFooter',\n\n props: {\n prevIcon: {\n type: String,\n default: '$prev',\n },\n nextIcon: {\n type: String,\n default: '$next',\n },\n firstIcon: {\n type: String,\n default: '$first',\n },\n lastIcon: {\n type: String,\n default: '$last',\n },\n itemsPerPageOptions: {\n type: Array as PropType<InternalItem[]>,\n default: () => ([\n { value: 10, title: '10' },\n { value: 25, title: '25' },\n { value: 50, title: '50' },\n { value: 100, title: '100' },\n { value: -1, title: 'All' },\n ]),\n },\n showCurrentPage: Boolean,\n },\n\n setup (props, { slots }) {\n const { page, pageCount, startIndex, stopIndex, itemsLength, itemsPerPage } = usePagination()\n\n return () => (\n <div\n class=\"v-data-table-footer\"\n >\n { slots.prepend?.() }\n <div class=\"v-data-table-footer__items-per-page\">\n <span>Items per page:</span>\n <VSelect\n items={ props.itemsPerPageOptions }\n modelValue={ itemsPerPage.value }\n onUpdate:modelValue={ v => itemsPerPage.value = Number(v) }\n density=\"compact\"\n variant=\"outlined\"\n hide-details\n />\n </div>\n <div class=\"v-data-table-footer__info\">\n <div>{ !itemsLength.value ? 0 : startIndex.value + 1 } - { stopIndex.value } of { itemsLength.value }</div>\n </div>\n <div class=\"v-data-table-footer__pagination\">\n <VBtn\n icon={ props.firstIcon }\n variant=\"plain\"\n onClick={ () => page.value = 1 }\n disabled={ page.value === 1 }\n />\n <VBtn\n icon={ props.prevIcon }\n variant=\"plain\"\n onClick={ () => page.value = Math.max(1, page.value - 1) }\n disabled={ page.value === 1 }\n />\n { props.showCurrentPage && (\n <div key=\"page\">page.value</div>\n ) }\n <VBtn\n icon={ props.nextIcon }\n variant=\"plain\"\n onClick={ () => page.value = Math.min(pageCount.value, page.value + 1) }\n disabled={ page.value === pageCount.value }\n />\n <VBtn\n icon={ props.lastIcon }\n variant=\"plain\"\n onClick={ () => page.value = pageCount.value }\n disabled={ page.value === pageCount.value }\n />\n </div>\n </div>\n )\n },\n})\n"],"mappings":"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"}
1
+ {"version":3,"file":"VDataTableFooter.mjs","names":["VBtn","VSelect","usePagination","useLocale","computed","defineComponent","VDataTableFooter","name","props","prevIcon","type","String","default","nextIcon","firstIcon","lastIcon","itemsPerPageText","pageText","firstPageLabel","prevPageLabel","nextPageLabel","lastPageLabel","itemsPerPageOptions","Array","value","title","showCurrentPage","Boolean","setup","slots","t","page","pageCount","startIndex","stopIndex","itemsLength","itemsPerPage","map","option","prepend","v","Number","Math","max","min"],"sources":["../../../src/labs/VDataTable/VDataTableFooter.tsx"],"sourcesContent":["// Styles\nimport './VDataTableFooter.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\nimport { VSelect } from '@/components/VSelect'\n\n// Composables\nimport { usePagination } from './composables/paginate'\nimport { useLocale } from '../entry-bundler'\n\n// Utilities\nimport { computed } from 'vue'\nimport { defineComponent } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { InternalItem } from '@/composables/items'\n\nexport const VDataTableFooter = defineComponent({\n name: 'VDataTableFooter',\n\n props: {\n prevIcon: {\n type: String,\n default: '$prev',\n },\n nextIcon: {\n type: String,\n default: '$next',\n },\n firstIcon: {\n type: String,\n default: '$first',\n },\n lastIcon: {\n type: String,\n default: '$last',\n },\n itemsPerPageText: {\n type: String,\n default: '$vuetify.dataFooter.itemsPerPageText',\n },\n pageText: {\n type: String,\n default: '$vuetify.dataFooter.pageText',\n },\n firstPageLabel: {\n type: String,\n default: '$vuetify.dataFooter.firstPage',\n },\n prevPageLabel: {\n type: String,\n default: '$vuetify.dataFooter.prevPage',\n },\n nextPageLabel: {\n type: String,\n default: '$vuetify.dataFooter.nextPage',\n },\n lastPageLabel: {\n type: String,\n default: '$vuetify.dataFooter.lastPage',\n },\n itemsPerPageOptions: {\n type: Array as PropType<InternalItem[]>,\n default: () => ([\n { value: 10, title: '10' },\n { value: 25, title: '25' },\n { value: 50, title: '50' },\n { value: 100, title: '100' },\n { value: -1, title: '$vuetify.dataFooter.itemsPerPageAll' },\n ]),\n },\n showCurrentPage: Boolean,\n },\n\n setup (props, { slots }) {\n const { t } = useLocale()\n const { page, pageCount, startIndex, stopIndex, itemsLength, itemsPerPage } = usePagination()\n\n const itemsPerPageOptions = computed(() => props.itemsPerPageOptions.map(option => ({\n ...option,\n title: t(option.title),\n })))\n\n return () => (\n <div\n class=\"v-data-table-footer\"\n >\n { slots.prepend?.() }\n <div class=\"v-data-table-footer__items-per-page\">\n <span>{ t(props.itemsPerPageText) }</span>\n <VSelect\n items={ itemsPerPageOptions.value }\n modelValue={ itemsPerPage.value }\n onUpdate:modelValue={ v => itemsPerPage.value = Number(v) }\n density=\"compact\"\n variant=\"outlined\"\n hide-details\n />\n </div>\n <div class=\"v-data-table-footer__info\">\n <div>\n { t(props.pageText, !itemsLength.value ? 0 : startIndex.value + 1, stopIndex.value, itemsLength.value) }\n </div>\n </div>\n <div class=\"v-data-table-footer__pagination\">\n <VBtn\n icon={ props.firstIcon }\n variant=\"plain\"\n onClick={ () => page.value = 1 }\n disabled={ page.value === 1 }\n aria-label={ t(props.firstPageLabel) }\n />\n <VBtn\n icon={ props.prevIcon }\n variant=\"plain\"\n onClick={ () => page.value = Math.max(1, page.value - 1) }\n disabled={ page.value === 1 }\n aria-label={ t(props.prevPageLabel) }\n />\n { props.showCurrentPage && (\n <span key=\"page\" class=\"v-data-table-footer__page\">{ page.value }</span>\n ) }\n <VBtn\n icon={ props.nextIcon }\n variant=\"plain\"\n onClick={ () => page.value = Math.min(pageCount.value, page.value + 1) }\n disabled={ page.value === pageCount.value }\n aria-label={ t(props.nextPageLabel) }\n />\n <VBtn\n icon={ props.lastIcon }\n variant=\"plain\"\n onClick={ () => page.value = pageCount.value }\n disabled={ page.value === pageCount.value }\n aria-label={ t(props.lastPageLabel) }\n />\n </div>\n </div>\n )\n },\n})\n"],"mappings":"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"}
package/lib/labs/VDataTable/VDataTableFooter.sass CHANGED
@@ -21,3 +21,10 @@
21
21
  .v-data-table-footer__info
22
22
  display: flex
23
23
  padding-inline-end: 24px
24
+
25
+ .v-data-table-footer__pagination
26
+ display: flex
27
+ align-items: center
28
+
29
+ .v-data-table-footer__page
30
+ padding: 0 8px
package/lib/labs/VDataTable/index.d.ts CHANGED
@@ -730,6 +730,30 @@ declare const VDataTableFooter: vue.DefineComponent<{
730
730
  type: StringConstructor;
731
731
  default: string;
732
732
  };
733
+ itemsPerPageText: {
734
+ type: StringConstructor;
735
+ default: string;
736
+ };
737
+ pageText: {
738
+ type: StringConstructor;
739
+ default: string;
740
+ };
741
+ firstPageLabel: {
742
+ type: StringConstructor;
743
+ default: string;
744
+ };
745
+ prevPageLabel: {
746
+ type: StringConstructor;
747
+ default: string;
748
+ };
749
+ nextPageLabel: {
750
+ type: StringConstructor;
751
+ default: string;
752
+ };
753
+ lastPageLabel: {
754
+ type: StringConstructor;
755
+ default: string;
756
+ };
733
757
  itemsPerPageOptions: {
734
758
  type: PropType<InternalItem<any>[]>;
735
759
  default: () => {
@@ -755,6 +779,30 @@ declare const VDataTableFooter: vue.DefineComponent<{
755
779
  type: StringConstructor;
756
780
  default: string;
757
781
  };
782
+ itemsPerPageText: {
783
+ type: StringConstructor;
784
+ default: string;
785
+ };
786
+ pageText: {
787
+ type: StringConstructor;
788
+ default: string;
789
+ };
790
+ firstPageLabel: {
791
+ type: StringConstructor;
792
+ default: string;
793
+ };
794
+ prevPageLabel: {
795
+ type: StringConstructor;
796
+ default: string;
797
+ };
798
+ nextPageLabel: {
799
+ type: StringConstructor;
800
+ default: string;
801
+ };
802
+ lastPageLabel: {
803
+ type: StringConstructor;
804
+ default: string;
805
+ };
758
806
  itemsPerPageOptions: {
759
807
  type: PropType<InternalItem<any>[]>;
760
808
  default: () => {
@@ -764,10 +812,16 @@ declare const VDataTableFooter: vue.DefineComponent<{
764
812
  };
765
813
  showCurrentPage: BooleanConstructor;
766
814
  }>>, {
815
+ itemsPerPageText: string;
816
+ pageText: string;
767
817
  nextIcon: string;
768
818
  prevIcon: string;
769
819
  firstIcon: string;
770
820
  lastIcon: string;
821
+ firstPageLabel: string;
822
+ prevPageLabel: string;
823
+ nextPageLabel: string;
824
+ lastPageLabel: string;
771
825
  itemsPerPageOptions: InternalItem<any>[];
772
826
  showCurrentPage: boolean;
773
827
  }>;
package/lib/labs/components.d.ts CHANGED
@@ -730,6 +730,30 @@ declare const VDataTableFooter: vue.DefineComponent<{
730
730
  type: StringConstructor;
731
731
  default: string;
732
732
  };
733
+ itemsPerPageText: {
734
+ type: StringConstructor;
735
+ default: string;
736
+ };
737
+ pageText: {
738
+ type: StringConstructor;
739
+ default: string;
740
+ };
741
+ firstPageLabel: {
742
+ type: StringConstructor;
743
+ default: string;
744
+ };
745
+ prevPageLabel: {
746
+ type: StringConstructor;
747
+ default: string;
748
+ };
749
+ nextPageLabel: {
750
+ type: StringConstructor;
751
+ default: string;
752
+ };
753
+ lastPageLabel: {
754
+ type: StringConstructor;
755
+ default: string;
756
+ };
733
757
  itemsPerPageOptions: {
734
758
  type: PropType<InternalItem<any>[]>;
735
759
  default: () => {
@@ -755,6 +779,30 @@ declare const VDataTableFooter: vue.DefineComponent<{
755
779
  type: StringConstructor;
756
780
  default: string;
757
781
  };
782
+ itemsPerPageText: {
783
+ type: StringConstructor;
784
+ default: string;
785
+ };
786
+ pageText: {
787
+ type: StringConstructor;
788
+ default: string;
789
+ };
790
+ firstPageLabel: {
791
+ type: StringConstructor;
792
+ default: string;
793
+ };
794
+ prevPageLabel: {
795
+ type: StringConstructor;
796
+ default: string;
797
+ };
798
+ nextPageLabel: {
799
+ type: StringConstructor;
800
+ default: string;
801
+ };
802
+ lastPageLabel: {
803
+ type: StringConstructor;
804
+ default: string;
805
+ };
758
806
  itemsPerPageOptions: {
759
807
  type: PropType<InternalItem<any>[]>;
760
808
  default: () => {
@@ -764,10 +812,16 @@ declare const VDataTableFooter: vue.DefineComponent<{
764
812
  };
765
813
  showCurrentPage: BooleanConstructor;
766
814
  }>>, {
815
+ itemsPerPageText: string;
816
+ pageText: string;
767
817
  nextIcon: string;
768
818
  prevIcon: string;
769
819
  firstIcon: string;
770
820
  lastIcon: string;
821
+ firstPageLabel: string;
822
+ prevPageLabel: string;
823
+ nextPageLabel: string;
824
+ lastPageLabel: string;
771
825
  itemsPerPageOptions: InternalItem<any>[];
772
826
  showCurrentPage: boolean;
773
827
  }>;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@vuetify/nightly",
3
3
  "description": "Vue Material Component Framework",
4
- "version": "4.0.0-dev-20230206.0",
4
+ "version": "4.0.0-dev-20230211.0",
5
5
  "author": {
6
6
  "name": "John Leider",
7
7
  "email": "john@vuetifyjs.com"