@progress/kendo-vue-indicators 5.3.0-dev.202410141143 → 5.3.0-develop.2

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 (93) hide show
  1. package/README.md +24 -28
  2. package/badge/Badge.js +8 -0
  3. package/badge/Badge.mjs +110 -0
  4. package/badge/BadgeContainer.js +8 -0
  5. package/badge/BadgeContainer.mjs +126 -0
  6. package/dist/cdn/js/kendo-vue-indicators.js +8 -1
  7. package/index.d.mts +693 -0
  8. package/index.d.ts +693 -0
  9. package/index.js +8 -0
  10. package/index.mjs +17 -0
  11. package/loader/Loader.js +8 -0
  12. package/loader/Loader.mjs +94 -0
  13. package/package-metadata.js +8 -0
  14. package/package-metadata.mjs +18 -0
  15. package/package.json +22 -43
  16. package/skeleton/Skeleton.js +8 -0
  17. package/skeleton/Skeleton.mjs +66 -0
  18. package/dist/es/additionalTypes.ts +0 -21
  19. package/dist/es/badge/Badge.d.ts +0 -50
  20. package/dist/es/badge/Badge.js +0 -124
  21. package/dist/es/badge/BadgeContainer.d.ts +0 -50
  22. package/dist/es/badge/BadgeContainer.js +0 -145
  23. package/dist/es/badge/BadgeProps.d.ts +0 -192
  24. package/dist/es/badge/BadgeProps.js +0 -1
  25. package/dist/es/loader/Loader.d.ts +0 -57
  26. package/dist/es/loader/Loader.js +0 -112
  27. package/dist/es/loader/LoaderProps.d.ts +0 -43
  28. package/dist/es/loader/LoaderProps.js +0 -1
  29. package/dist/es/loader/models/size.d.ts +0 -11
  30. package/dist/es/loader/models/size.js +0 -1
  31. package/dist/es/loader/models/theme-color.d.ts +0 -18
  32. package/dist/es/loader/models/theme-color.js +0 -1
  33. package/dist/es/loader/models/type.d.ts +0 -10
  34. package/dist/es/loader/models/type.js +0 -1
  35. package/dist/es/main.d.ts +0 -10
  36. package/dist/es/main.js +0 -10
  37. package/dist/es/package-metadata.d.ts +0 -5
  38. package/dist/es/package-metadata.js +0 -11
  39. package/dist/es/skeleton/Skeleton.d.ts +0 -57
  40. package/dist/es/skeleton/Skeleton.js +0 -81
  41. package/dist/es/skeleton/SkeletonProps.d.ts +0 -70
  42. package/dist/es/skeleton/SkeletonProps.js +0 -1
  43. package/dist/esm/additionalTypes.ts +0 -21
  44. package/dist/esm/badge/Badge.d.ts +0 -50
  45. package/dist/esm/badge/Badge.js +0 -124
  46. package/dist/esm/badge/BadgeContainer.d.ts +0 -50
  47. package/dist/esm/badge/BadgeContainer.js +0 -145
  48. package/dist/esm/badge/BadgeProps.d.ts +0 -192
  49. package/dist/esm/badge/BadgeProps.js +0 -1
  50. package/dist/esm/loader/Loader.d.ts +0 -57
  51. package/dist/esm/loader/Loader.js +0 -112
  52. package/dist/esm/loader/LoaderProps.d.ts +0 -43
  53. package/dist/esm/loader/LoaderProps.js +0 -1
  54. package/dist/esm/loader/models/size.d.ts +0 -11
  55. package/dist/esm/loader/models/size.js +0 -1
  56. package/dist/esm/loader/models/theme-color.d.ts +0 -18
  57. package/dist/esm/loader/models/theme-color.js +0 -1
  58. package/dist/esm/loader/models/type.d.ts +0 -10
  59. package/dist/esm/loader/models/type.js +0 -1
  60. package/dist/esm/main.d.ts +0 -10
  61. package/dist/esm/main.js +0 -10
  62. package/dist/esm/package-metadata.d.ts +0 -5
  63. package/dist/esm/package-metadata.js +0 -11
  64. package/dist/esm/package.json +0 -3
  65. package/dist/esm/skeleton/Skeleton.d.ts +0 -57
  66. package/dist/esm/skeleton/Skeleton.js +0 -81
  67. package/dist/esm/skeleton/SkeletonProps.d.ts +0 -70
  68. package/dist/esm/skeleton/SkeletonProps.js +0 -1
  69. package/dist/npm/additionalTypes.ts +0 -21
  70. package/dist/npm/badge/Badge.d.ts +0 -50
  71. package/dist/npm/badge/Badge.js +0 -131
  72. package/dist/npm/badge/BadgeContainer.d.ts +0 -50
  73. package/dist/npm/badge/BadgeContainer.js +0 -152
  74. package/dist/npm/badge/BadgeProps.d.ts +0 -192
  75. package/dist/npm/badge/BadgeProps.js +0 -2
  76. package/dist/npm/loader/Loader.d.ts +0 -57
  77. package/dist/npm/loader/Loader.js +0 -119
  78. package/dist/npm/loader/LoaderProps.d.ts +0 -43
  79. package/dist/npm/loader/LoaderProps.js +0 -2
  80. package/dist/npm/loader/models/size.d.ts +0 -11
  81. package/dist/npm/loader/models/size.js +0 -2
  82. package/dist/npm/loader/models/theme-color.d.ts +0 -18
  83. package/dist/npm/loader/models/theme-color.js +0 -2
  84. package/dist/npm/loader/models/type.d.ts +0 -10
  85. package/dist/npm/loader/models/type.js +0 -2
  86. package/dist/npm/main.d.ts +0 -10
  87. package/dist/npm/main.js +0 -26
  88. package/dist/npm/package-metadata.d.ts +0 -5
  89. package/dist/npm/package-metadata.js +0 -14
  90. package/dist/npm/skeleton/Skeleton.d.ts +0 -57
  91. package/dist/npm/skeleton/Skeleton.js +0 -88
  92. package/dist/npm/skeleton/SkeletonProps.d.ts +0 -70
  93. package/dist/npm/skeleton/SkeletonProps.js +0 -2
@@ -1,57 +0,0 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
3
- declare type DefaultData<V> = object | ((this: V) => {});
4
- declare type DefaultMethods<V> = {
5
- [key: string]: (this: V, ...args: any[]) => any;
6
- };
7
- import { SkeletonProps } from './SkeletonProps';
8
- /**
9
- * @hidden
10
- */
11
- export interface SkeletonHandle {
12
- /**
13
- * The Skeleton element.
14
- */
15
- element: HTMLSpanElement | null;
16
- /**
17
- * Focus the Skeleton.
18
- */
19
- focus: () => void;
20
- }
21
- /**
22
- * @hidden
23
- */
24
- export interface SkeletonState {
25
- }
26
- /**
27
- * @hidden
28
- */
29
- export interface SkeletonComputed {
30
- [key: string]: any;
31
- skeletonClasses: object;
32
- }
33
- /**
34
- * @hidden
35
- */
36
- export interface SkeletonMethods {
37
- [key: string]: any;
38
- }
39
- /**
40
- * @hidden
41
- */
42
- export interface SkeletonData {
43
- }
44
- /**
45
- * @hidden
46
- */
47
- export interface SkeletonAll extends Vue, SkeletonMethods, SkeletonData, SkeletonComputed, SkeletonState {
48
- }
49
- /**
50
- * @hidden
51
- */
52
- declare let SkeletonVue2: ComponentOptions<SkeletonAll, DefaultData<SkeletonData>, DefaultMethods<SkeletonAll>, SkeletonComputed, RecordPropsDefinition<SkeletonProps>>;
53
- /**
54
- * @hidden
55
- */
56
- declare const Skeleton: DefineComponent<SkeletonProps, any, SkeletonData, SkeletonComputed, SkeletonMethods, {}, {}, {}, string, SkeletonProps, SkeletonProps, {}>;
57
- export { Skeleton, SkeletonVue2 };
@@ -1,81 +0,0 @@
1
- // @ts-ignore
2
- import * as Vue from 'vue';
3
- var allVue = Vue;
4
- var gh = allVue.h;
5
- var isV3 = allVue.version && allVue.version[0] === '3';
6
- import { validatePackage, isObject } from '@progress/kendo-vue-common';
7
- import { packageMetadata } from '../package-metadata';
8
- /**
9
- * @hidden
10
- */
11
- var SkeletonVue2 = {
12
- name: 'KendoSkeleton',
13
- props: {
14
- animation: {
15
- type: [Object, Boolean],
16
- default: function _default() {
17
- return {
18
- type: 'pulse'
19
- };
20
- },
21
- validator: function validator(value) {
22
- return value === false || ['wave', 'pulse'].includes(value.type);
23
- }
24
- },
25
- shape: {
26
- type: String,
27
- default: 'text',
28
- validator: function validator(value) {
29
- return ['circle', 'rectangle', 'text'].includes(value);
30
- }
31
- },
32
- ariaBusy: {
33
- type: Boolean,
34
- default: undefined
35
- },
36
- role: {
37
- type: String,
38
- default: undefined
39
- }
40
- },
41
- created: function created() {
42
- validatePackage(packageMetadata);
43
- },
44
- computed: {
45
- skeletonClasses: function skeletonClasses() {
46
- return {
47
- 'k-skeleton': true,
48
- 'k-skeleton-circle': this.shape === 'circle',
49
- 'k-skeleton-rect': this.shape === 'rectangle',
50
- 'k-skeleton-text': this.shape === 'text',
51
- 'k-skeleton-pulse': isObject(this.animation) && this.animation.type === 'pulse',
52
- 'k-skeleton-wave': isObject(this.animation) && this.animation.type === 'wave' || this.animation === true
53
- };
54
- }
55
- },
56
- // @ts-ignore
57
- setup: !isV3 ? undefined : function () {
58
- var v3 = !!isV3;
59
- return {
60
- v3: v3
61
- };
62
- },
63
- // @ts-ignore
64
- render: function render(createElement) {
65
- var h = gh || createElement;
66
- return h("span", {
67
- role: this.$props.role,
68
- attrs: this.v3 ? undefined : {
69
- role: this.$props.role,
70
- ariaBusy: this.$props.ariaBusy
71
- },
72
- "class": this.skeletonClasses,
73
- ariaBusy: this.$props.ariaBusy
74
- });
75
- }
76
- };
77
- /**
78
- * @hidden
79
- */
80
- var Skeleton = SkeletonVue2;
81
- export { Skeleton, SkeletonVue2 };
@@ -1,70 +0,0 @@
1
- /**
2
- * Represents the props of the [Kendo Ui for Vue Skeleton component]({% slug overview_skeleton %}).
3
- */
4
- export interface SkeletonProps {
5
- /**
6
- * Specifies the animation settings of the Skeleton.
7
- *
8
- * The possible keys are:
9
- * * `type`&mdash;Defines the type of the Skeleton animation.
10
- * * `wave`&mdash;Shows wave animation effect.
11
- * * `pulse`(Default)&mdash;Shows pulse animation effect.
12
- *
13
- * To disable the animation, set the property to `false`.
14
- *
15
- */
16
- animation?: boolean | SkeletonAnimation;
17
- /**
18
- * Specifies the shape of the Skeleton.
19
- *
20
- * The possible values are:
21
- * * `circle`&mdash;Renders a circular Skeleton.
22
- * * `text`(Default)&mdash;Renders a line Skeleton.
23
- * * `rectangle`&mdash;Renders a rectangular Skeleton.
24
- *
25
- */
26
- shape?: SkeletonShape | string;
27
- /**
28
- * Specifies the ariaBusy attribute of the Skeleton.
29
- *
30
- * The Skeleton component does not have accessibility on its own as it is only a visual indicator.
31
- * It should be integrated within an element that refers to the loading state.
32
- * When integrating the Skeleton on a page, you might want to define an `ariaBusy` attribute and
33
- * this property gives you this option.
34
- *
35
- * By default the `ariaBusy` attribute is not rendered.
36
- */
37
- ariaBusy?: boolean | undefined;
38
- /**
39
- * Specifies the role attribute of the Skeleton.
40
- *
41
- * The Skeleton component does not have accessibility on its own as it is only a visual indicator.
42
- * It should be integrated within an element that refers to the loading state.
43
- * When integrating the Skeleton on a page, you might want to define a `role` attribute and
44
- * this property gives you this option.
45
- *
46
- * By default the `role` attribute is not rendered.
47
- *
48
- * The recommended value of the attribute is `alert`
49
- */
50
- role?: string | undefined;
51
- }
52
- /**
53
- * Specifies the shape of the Skeleton.
54
- *
55
- * The possible values are:
56
- * * `circle`&mdash;Renders a circular Skeleton.
57
- * * `text`(Default)&mdash;Renders a line Skeleton.
58
- * * `rectangle`&mdash;Renders a rectangular Skeleton.
59
- *
60
- */
61
- export declare type SkeletonShape = 'circle' | 'text' | 'rectangle';
62
- /**
63
- * Specifies the animation settings of the Skeleton.
64
- */
65
- export interface SkeletonAnimation {
66
- /**
67
- * Specifies the type of the Skeleton animation. Defaults to `pulse`.
68
- */
69
- type?: 'wave' | 'pulse';
70
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,21 +0,0 @@
1
- // @ts-ignore
2
- import { DefineComponent } from 'vue';
3
- // @ts-ignore
4
- import * as Vue from 'vue';
5
-
6
- /**
7
- * @hidden
8
- */
9
- // @ts-ignore
10
- type Vue2type = Vue.default;
11
-
12
- /**
13
- * @hidden
14
- */
15
- // @ts-ignore
16
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
17
- /**
18
- * @hidden
19
- */
20
- // @ts-ignore
21
- export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };
@@ -1,50 +0,0 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
3
- declare type DefaultData<V> = object | ((this: V) => {});
4
- declare type DefaultMethods<V> = {
5
- [key: string]: (this: V, ...args: any[]) => any;
6
- };
7
- import { BadgeProps } from './BadgeProps';
8
- /**
9
- * @hidden
10
- */
11
- export interface BadgeState {
12
- }
13
- /**
14
- * @hidden
15
- */
16
- export interface BadgeComputed {
17
- [key: string]: any;
18
- badgeClasses: object;
19
- }
20
- /**
21
- * @hidden
22
- */
23
- export interface BadgeMethods {
24
- [key: string]: any;
25
- }
26
- /**
27
- * @hidden
28
- */
29
- export interface BadgeData {
30
- currentDir?: string;
31
- }
32
- /**
33
- * @hidden
34
- */
35
- export interface BadgeAll extends Vue, BadgeMethods, BadgeData, BadgeComputed, BadgeState {
36
- }
37
- /**
38
- * @hidden
39
- */
40
- declare let BadgeVue2: ComponentOptions<BadgeAll, DefaultData<BadgeData>, DefaultMethods<BadgeAll>, BadgeComputed, RecordPropsDefinition<BadgeProps>>;
41
- /**
42
- * Represents the [Kendo UI for Vue Badge component]({% slug api_indicators_badgeprops %}).
43
- *
44
- * @example
45
- * ```jsx
46
- * <Badge>99+</Badge>
47
- * ```
48
- */
49
- declare const Badge: DefineComponent<BadgeProps, any, BadgeData, BadgeComputed, BadgeMethods, {}, {}, {}, string, BadgeProps, BadgeProps, {}>;
50
- export { Badge, BadgeVue2 };
@@ -1,124 +0,0 @@
1
- // @ts-ignore
2
- import * as Vue from 'vue';
3
- var allVue = Vue;
4
- var gh = allVue.h;
5
- var isV3 = allVue.version && allVue.version[0] === '3';
6
- import { getDefaultSlots, getDir, kendoThemeMaps } from '@progress/kendo-vue-common';
7
- import { validatePackage } from '@progress/kendo-vue-common';
8
- import { packageMetadata } from '../package-metadata.js';
9
- /**
10
- * @hidden
11
- */
12
- var BadgeVue2 = {
13
- name: 'KendoBadge',
14
- props: {
15
- dir: String,
16
- align: {
17
- type: Object,
18
- default: function _default() {
19
- return {
20
- vertical: 'top',
21
- horizontal: 'end'
22
- };
23
- }
24
- },
25
- size: {
26
- type: String,
27
- default: 'medium',
28
- validator: function validator(value) {
29
- return ['small', 'medium', 'large'].includes(value);
30
- }
31
- },
32
- fillMode: {
33
- type: String,
34
- default: 'solid',
35
- validator: function validator(value) {
36
- return ['solid', 'outline'].includes(value);
37
- }
38
- },
39
- themeColor: {
40
- type: String,
41
- default: 'primary',
42
- validator: function validator(value) {
43
- return ['primary', 'secondary', 'tertiary', 'info', 'success', 'warning', 'error', 'dark', 'light', 'inverse'].includes(value);
44
- }
45
- },
46
- rounded: {
47
- type: String,
48
- default: 'medium',
49
- validator: function validator(value) {
50
- return [null, 'small', 'medium', 'large', 'full'].includes(value);
51
- }
52
- },
53
- position: {
54
- type: String,
55
- default: 'edge',
56
- validator: function validator(value) {
57
- return ['edge', 'outside', 'inside'].includes(value);
58
- }
59
- },
60
- cutoutBorder: Boolean
61
- },
62
- created: function created() {
63
- validatePackage(packageMetadata);
64
- this.currentDir = undefined;
65
- },
66
- mounted: function mounted() {
67
- this.currentDir = getDir(this.$el, this.$props.dir);
68
- },
69
- computed: {
70
- badgeClasses: function badgeClasses() {
71
- var _a;
72
- var _b = this.$props,
73
- size = _b.size,
74
- fillMode = _b.fillMode,
75
- cutoutBorder = _b.cutoutBorder,
76
- position = _b.position,
77
- align = _b.align,
78
- themeColor = _b.themeColor,
79
- rounded = _b.rounded;
80
- return _a = {
81
- 'k-badge': true,
82
- 'k-badge-sm': size === 'small',
83
- 'k-badge-md': size === 'medium',
84
- 'k-badge-lg': size === 'large'
85
- }, _a["k-badge-".concat(fillMode)] = fillMode, _a["k-badge-".concat(fillMode, "-").concat(themeColor)] = Boolean(fillMode && themeColor), _a["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-badge-border-cutout'] = cutoutBorder, _a["k-badge-".concat(position)] = position, _a['k-top-start'] = align.vertical === 'top' && align.horizontal === 'start', _a['k-top-end'] = align.vertical === 'top' && align.horizontal === 'end', _a['k-bottom-start'] = align.vertical === 'bottom' && align.horizontal === 'start', _a['k-bottom-end'] = align.vertical === 'bottom' && align.horizontal === 'end', _a;
86
- }
87
- },
88
- // @ts-ignore
89
- setup: !isV3 ? undefined : function () {
90
- var v3 = !!isV3;
91
- return {
92
- v3: v3
93
- };
94
- },
95
- // @ts-ignore
96
- render: function render(createElement) {
97
- var h = gh || createElement;
98
- var defaultSlot = getDefaultSlots(this);
99
- return h("span", {
100
- "class": this.badgeClasses,
101
- dir: this.currentDir,
102
- attrs: this.v3 ? undefined : {
103
- dir: this.currentDir
104
- }
105
- }, [defaultSlot]);
106
- },
107
- methods: {
108
- focusElement: function focusElement() {
109
- if (this.$el) {
110
- this.$el.focus();
111
- }
112
- }
113
- }
114
- };
115
- /**
116
- * Represents the [Kendo UI for Vue Badge component]({% slug api_indicators_badgeprops %}).
117
- *
118
- * @example
119
- * ```jsx
120
- * <Badge>99+</Badge>
121
- * ```
122
- */
123
- var Badge = BadgeVue2;
124
- export { Badge, BadgeVue2 };
@@ -1,50 +0,0 @@
1
- import { DefineComponent } from '../additionalTypes';
2
- import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
3
- declare type DefaultData<V> = object | ((this: V) => {});
4
- declare type DefaultMethods<V> = {
5
- [key: string]: (this: V, ...args: any[]) => any;
6
- };
7
- import { BadgeContainerProps } from './BadgeProps';
8
- /**
9
- * @hidden
10
- */
11
- export interface BadgeContainerState {
12
- }
13
- /**
14
- * @hidden
15
- */
16
- export interface BadgeContainerComputed {
17
- [key: string]: any;
18
- badgeContainerClasses: object;
19
- }
20
- /**
21
- * @hidden
22
- */
23
- export interface BadgeContainerMethods {
24
- [key: string]: any;
25
- }
26
- /**
27
- * @hidden
28
- */
29
- export interface BadgeContainerData {
30
- currentDir?: string;
31
- }
32
- /**
33
- * @hidden
34
- */
35
- export interface BadgeContainerAll extends Vue, BadgeContainerMethods, BadgeContainerData, BadgeContainerComputed, BadgeContainerState {
36
- }
37
- /**
38
- * @hidden
39
- */
40
- declare let BadgeContainerVue2: ComponentOptions<BadgeContainerAll, DefaultData<BadgeContainerData>, DefaultMethods<BadgeContainerAll>, BadgeContainerComputed, RecordPropsDefinition<BadgeContainerProps>>;
41
- /**
42
- * Represents the [Kendo UI for Vue BadgeContainer component]({% slug api_indicators_badgeprops %}).
43
- *
44
- * @example
45
- * ```jsx
46
- * <BadgeContainer>99+</BadgeContainer>
47
- * ```
48
- */
49
- declare const BadgeContainer: DefineComponent<BadgeContainerProps, any, BadgeContainerData, BadgeContainerComputed, BadgeContainerMethods, {}, {}, {}, string, BadgeContainerProps, BadgeContainerProps, {}>;
50
- export { BadgeContainer, BadgeContainerVue2 };
@@ -1,145 +0,0 @@
1
- // @ts-ignore
2
- import * as Vue from 'vue';
3
- var allVue = Vue;
4
- var gh = allVue.h;
5
- var isV3 = allVue.version && allVue.version[0] === '3';
6
- import { getDefaultSlots, getDir, getListeners, getTemplate, kendoThemeMaps, templateRendering } from '@progress/kendo-vue-common';
7
- import { validatePackage } from '@progress/kendo-vue-common';
8
- import { packageMetadata } from '../package-metadata.js';
9
- /**
10
- * @hidden
11
- */
12
- var BadgeContainerVue2 = {
13
- name: 'KendoBadgeContainer',
14
- props: {
15
- dir: String,
16
- align: {
17
- type: Object,
18
- default: function _default() {
19
- return {
20
- vertical: 'top',
21
- horizontal: 'end'
22
- };
23
- }
24
- },
25
- size: {
26
- type: String,
27
- default: 'medium',
28
- validator: function validator(value) {
29
- return ['small', 'medium', 'large'].includes(value);
30
- }
31
- },
32
- fillMode: {
33
- type: String,
34
- default: 'solid',
35
- validator: function validator(value) {
36
- return ['solid', 'outline'].includes(value);
37
- }
38
- },
39
- themeColor: {
40
- type: String,
41
- default: 'primary',
42
- validator: function validator(value) {
43
- return ['primary', 'secondary', 'tertiary', 'info', 'success', 'warning', 'error', 'dark', 'light', 'inverse'].includes(value);
44
- }
45
- },
46
- rounded: {
47
- type: String,
48
- default: 'medium',
49
- validator: function validator(value) {
50
- return [null, 'small', 'medium', 'large', 'full'].includes(value);
51
- }
52
- },
53
- position: {
54
- type: String,
55
- default: 'edge',
56
- validator: function validator(value) {
57
- return ['edge', 'outside', 'inside'].includes(value);
58
- }
59
- },
60
- cutoutBorder: Boolean,
61
- content: [String, Function, Object]
62
- },
63
- created: function created() {
64
- validatePackage(packageMetadata);
65
- this.currentDir = undefined;
66
- },
67
- mounted: function mounted() {
68
- this.currentDir = getDir(this.$el, this.$props.dir);
69
- },
70
- computed: {
71
- badgeContainerClasses: function badgeContainerClasses() {
72
- return {
73
- 'k-badge-container': true
74
- };
75
- },
76
- badgeClasses: function badgeClasses() {
77
- var _a;
78
- var _b = this.$props,
79
- size = _b.size,
80
- fillMode = _b.fillMode,
81
- cutoutBorder = _b.cutoutBorder,
82
- position = _b.position,
83
- align = _b.align,
84
- themeColor = _b.themeColor,
85
- rounded = _b.rounded;
86
- return _a = {
87
- 'k-badge': true,
88
- 'k-badge-sm': size === 'small',
89
- 'k-badge-md': size === 'medium',
90
- 'k-badge-lg': size === 'large'
91
- }, _a["k-badge-".concat(fillMode)] = fillMode, _a["k-badge-".concat(fillMode, "-").concat(themeColor)] = Boolean(fillMode && themeColor), _a["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-badge-border-cutout'] = cutoutBorder, _a["k-badge-".concat(position)] = position, _a['k-top-start'] = align.vertical === 'top' && align.horizontal === 'start', _a['k-top-end'] = align.vertical === 'top' && align.horizontal === 'end', _a['k-bottom-start'] = align.vertical === 'bottom' && align.horizontal === 'start', _a['k-bottom-end'] = align.vertical === 'bottom' && align.horizontal === 'end', _a;
92
- }
93
- },
94
- // @ts-ignore
95
- setup: !isV3 ? undefined : function () {
96
- var v3 = !!isV3;
97
- return {
98
- v3: v3
99
- };
100
- },
101
- // @ts-ignore
102
- render: function render(createElement) {
103
- var h = gh || createElement;
104
- var defaultSlot = getDefaultSlots(this);
105
- var content = templateRendering.call(this, this.content, getListeners.call(this));
106
- var contentElement = getTemplate.call(this, {
107
- h: h,
108
- template: content,
109
- additionalProps: this.$props
110
- });
111
- return h("span", {
112
- "class": this.badgeContainerClasses,
113
- style: {
114
- display: 'inline-block'
115
- },
116
- dir: this.currentDir,
117
- attrs: this.v3 ? undefined : {
118
- dir: this.currentDir
119
- }
120
- }, [defaultSlot, h("span", {
121
- "class": this.badgeClasses,
122
- dir: this.currentDir,
123
- attrs: this.v3 ? undefined : {
124
- dir: this.currentDir
125
- }
126
- }, [contentElement])]);
127
- },
128
- methods: {
129
- focusElement: function focusElement() {
130
- if (this.$el) {
131
- this.$el.focus();
132
- }
133
- }
134
- }
135
- };
136
- /**
137
- * Represents the [Kendo UI for Vue BadgeContainer component]({% slug api_indicators_badgeprops %}).
138
- *
139
- * @example
140
- * ```jsx
141
- * <BadgeContainer>99+</BadgeContainer>
142
- * ```
143
- */
144
- var BadgeContainer = BadgeContainerVue2;
145
- export { BadgeContainer, BadgeContainerVue2 };