@progress/kendo-vue-progressbars 5.3.0-dev.202410141143 → 5.3.0-develop.1

package/index.d.ts

@@ -0,0 +1,397 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ComponentOptionsMixin } from 'vue';
+import { ComponentProvideOptions } from 'vue';
+import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
+import { PropType } from 'vue';
+import { PublicProps } from 'vue';
+
+/**
+ * @hidden
+ */
+declare interface BaseProps {
+    /**
+     * Sets one of the two visually distinct types of progress bar.
+     *
+     * @hidden
+     */
+    type?: 'linear' | 'circular';
+    /**
+     * Sets the value of the progress bar. Has to be between `min` and `max` values. Defaults to `0`.
+     * Set `null` to enable the indeterminate state of the progress bar.
+     * See examples ([here]({% slug overview_progressbar %})).
+     */
+    value?: number | null;
+    /**
+     * The minimum value of the progress bar. Defaults to `0`.
+     */
+    min?: number;
+    /**
+     * The maximum value of the progress bar. Defaults to `100`.
+     */
+    max?: number;
+    /**
+     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
+     */
+    dir?: string;
+    /**
+     * The accessible label of the component.
+     */
+    ariaLabel?: string;
+    /**
+     * Sets the disabled state of the progress bar.
+     * See examples ([here]({% slug progressbar_disabled %})).
+     */
+    disabled?: boolean;
+    /**
+     * Defines the orientation of the progress bar.
+     * See examples ([here]({% slug progressbar_orientation %})) .
+     * Defaults to `horizontal`.
+     */
+    orientation?: 'horizontal' | 'vertical' | string;
+    /**
+     * If set to `true`, the progress bar will be reversed.
+     * See examples ([here]({% slug progressbar_direction %})).
+     * Defaults to `false`.
+     */
+    reverse?: boolean;
+    /**
+     * Specifies a list of CSS classes that will be added to the progress bar element.
+     */
+    className?: string;
+    /**
+     * The styles that are applied to the inner element which represents the empty portion of the progress bar.
+     * See examples ([here]({% slug progressbar_appearance %})).
+     */
+    emptyStyle?: object;
+    /**
+     * Sets additional classes to the inner element which represents the empty portion of the progress bar.
+     * See examples ([here]({% slug progressbar_appearance %})).
+     */
+    emptyClassName?: string;
+    /**
+     * The styles that are applied to the inner element which represents the full portion of the progress bar.
+     * See examples ([here]({% slug progressbar_appearance %})).
+     */
+    progressStyle?: object;
+    /**
+     * Sets additional classes to the inner element which represents the full portion of the progress bar.
+     * See examples ([here]({% slug progressbar_appearance %})).
+     */
+    progressClassName?: string;
+    /**
+     * Sets the `tabIndex` property of the progress bar.
+     */
+    tabIndex?: number;
+}
+
+/**
+ * @hidden
+ */
+export declare const ChunkProgressBar: DefineComponent<ExtractPropTypes<    {
+chunkCount: {
+type: PropType<number>;
+default: number;
+};
+ariaLabel: PropType<string>;
+disabled: PropType<boolean>;
+reverse: {
+type: PropType<boolean>;
+default: boolean;
+};
+max: {
+type: PropType<number>;
+default: number;
+};
+min: {
+type: PropType<number>;
+default: number;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+tabIndex: PropType<number>;
+emptyStyle: PropType<object>;
+emptyClassName: PropType<string>;
+progressStyle: PropType<object>;
+progressClassName: PropType<string>;
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>, {}, {
+currentDir: any;
+}, {}, {
+focusElement(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+chunkCount: {
+type: PropType<number>;
+default: number;
+};
+ariaLabel: PropType<string>;
+disabled: PropType<boolean>;
+reverse: {
+type: PropType<boolean>;
+default: boolean;
+};
+max: {
+type: PropType<number>;
+default: number;
+};
+min: {
+type: PropType<number>;
+default: number;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+tabIndex: PropType<number>;
+emptyStyle: PropType<object>;
+emptyClassName: PropType<string>;
+progressStyle: PropType<object>;
+progressClassName: PropType<string>;
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>> & Readonly<{}>, {
+reverse: boolean;
+value: number;
+max: number;
+min: number;
+orientation: string;
+chunkCount: number;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Represents the props of the [Kendo UI for Vue ChunkProgressBar component]({% slug overview_chunkprogressbar %}).
+ */
+export declare interface ChunkProgressBarProps extends BaseProps {
+    /**
+     * Sets the number of chunks into which the ChunkProgressBar will be split. Defaults to `5`.
+     */
+    chunkCount?: number;
+}
+
+/**
+ * An interface for the ProgressBar label.
+ */
+export declare interface LabelProps {
+    /**
+     * Represents the current value of the ProgressBar.
+     */
+    value?: number | null;
+}
+
+/**
+ * @hidden
+ */
+export declare const ProgressBar: DefineComponent<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean | ProgressBarAnimation>;
+default: boolean;
+};
+disabled: {
+type: PropType<boolean>;
+default: boolean;
+};
+reverse: {
+type: PropType<boolean>;
+default: boolean;
+};
+label: PropType<any>;
+labelRender: PropType<any>;
+labelVisible: {
+type: PropType<boolean>;
+default: boolean;
+};
+labelPlacement: {
+type: PropType<any>;
+default: any;
+validator: (value: string) => any;
+};
+dir: {
+type: PropType<string>;
+default: any;
+};
+max: {
+type: PropType<number>;
+default: number;
+};
+min: {
+type: PropType<number>;
+default: number;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+tabIndex: PropType<number>;
+emptyStyle: PropType<object>;
+emptyClassName: PropType<string>;
+progressStyle: PropType<object>;
+progressClassName: PropType<string>;
+ariaLabel: PropType<string>;
+}>, {}, {
+currentDir: any;
+}, {
+wrapperClass(): ProgressBarComputed['wrapperClass'];
+isVertical(): ProgressBarComputed['isVertical'];
+animationDuration(): ProgressBarComputed['animationDuration'];
+}, {
+focus(): void;
+progressStatusElement(): any;
+progressStatusWrapElement(): any;
+handleStart(): void;
+handleUpdate(progress: number): void;
+handleEnd(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean | ProgressBarAnimation>;
+default: boolean;
+};
+disabled: {
+type: PropType<boolean>;
+default: boolean;
+};
+reverse: {
+type: PropType<boolean>;
+default: boolean;
+};
+label: PropType<any>;
+labelRender: PropType<any>;
+labelVisible: {
+type: PropType<boolean>;
+default: boolean;
+};
+labelPlacement: {
+type: PropType<any>;
+default: any;
+validator: (value: string) => any;
+};
+dir: {
+type: PropType<string>;
+default: any;
+};
+max: {
+type: PropType<number>;
+default: number;
+};
+min: {
+type: PropType<number>;
+default: number;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+tabIndex: PropType<number>;
+emptyStyle: PropType<object>;
+emptyClassName: PropType<string>;
+progressStyle: PropType<object>;
+progressClassName: PropType<string>;
+ariaLabel: PropType<string>;
+}>> & Readonly<{}>, {
+reverse: boolean;
+value: number;
+animation: boolean | ProgressBarAnimation;
+labelVisible: boolean;
+labelPlacement: any;
+disabled: boolean;
+dir: string;
+max: number;
+min: number;
+orientation: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Specifies the animation settings of the ProgressBar.
+ */
+export declare interface ProgressBarAnimation {
+    /**
+     * Specifies the duration of the ProgressBar animation. Defaults to `400`.
+     */
+    duration: number;
+}
+
+/**
+ * @hidden
+ */
+export declare interface ProgressBarComputed {
+    [key: string]: any;
+    wrapperClass: object;
+    isVertical: boolean;
+    animationDuration: number;
+}
+
+/**
+ * The ProgressBar ref.
+ */
+export declare interface ProgressBarHandle {
+    /**
+     * The ProgressBar element.
+     */
+    element: HTMLDivElement | null;
+    /**
+     * The progress status element.
+     */
+    progressStatusElement: HTMLDivElement | null;
+    /**
+     * The progress status wrap element.
+     */
+    progressStatusWrapElement: HTMLSpanElement | null;
+    /**
+     * Focus the ProgressBar.
+     */
+    focus: () => void;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue ProgressBar component]({% slug overview_progressbar %}).
+ */
+export declare interface ProgressBarProps extends BaseProps {
+    /**
+     * Specifies the animation settings of the ProgressBar. Defaults to `false`.
+     * If boolean, enables or disables the default animation.
+     * Use ProgressBarAnimation to set slide animation with customizable duration option. Accepts a number in milliseconds.
+     */
+    animation?: boolean | ProgressBarAnimation;
+    /**
+     * Overrides the default label ([see example]({% slug progressbar_label %})).
+     */
+    label?: any;
+    /**
+     * Overrides the default label template ([see example]({% slug progressbar_label %})).
+     */
+    labelRender?: any;
+    /**
+     * Sets the visibility of the progress status label. Defaults to `true`.
+     */
+    labelVisible?: boolean;
+    /**
+     * Sets the position of the progress status label. Defaults to `end` ([see example]({% slug progressbar_label %})).
+     */
+    labelPlacement?: 'start' | 'center' | 'end' | any;
+}
+
+export { }

package/index.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./progressbar/ProgressBar.js"),e=require("./chunkprogressbar/ChunkProgressBar.js");exports.ProgressBar=r.ProgressBar;exports.ChunkProgressBar=e.ChunkProgressBar;

package/index.mjs

@@ -0,0 +1,13 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ProgressBar as e } from "./progressbar/ProgressBar.mjs";
+import { ChunkProgressBar as a } from "./chunkprogressbar/ChunkProgressBar.mjs";
+export {
+  a as ChunkProgressBar,
+  e as ProgressBar
+};

package/package-metadata.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-vue-progressbars",productName:"Kendo UI for Vue",productCodes:["KENDOUIVUE","KENDOUICOMPLETE"],publishDate:1636730390,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"};exports.packageMetadata=e;

package/package-metadata.mjs

@@ -0,0 +1,18 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+const e = {
+  name: "@progress/kendo-vue-progressbars",
+  productName: "Kendo UI for Vue",
+  productCodes: ["KENDOUIVUE", "KENDOUICOMPLETE"],
+  publishDate: 1731077551,
+  version: "",
+  licensingDocsUrl: "https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning"
+};
+export {
+  e as packageMetadata
+};

package/package.json

@@ -1,67 +1,45 @@
 {
   "name": "@progress/kendo-vue-progressbars",
-  "description": "Kendo UI for Vue ProgressBars package",
-  "version": "5.3.0-dev.202410141143",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/telerik/kendo-vue.git"
-  },
-  "main": "dist/npm/main.js",
-  "types": "dist/npm/main.d.ts",
-  "module": "dist/es/main.js",
-  "jsnext:main": "dist/es/main.js",
+  "version": "5.3.0-develop.1",
+  "description": "TODO",
+  "author": "Progress",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "homepage": "https://www.telerik.com/kendo-vue-ui",
+  "main": "./index.js",
+  "types": "./index.d.ts",
   "exports": {
-    "node": "./dist/esm/main.js",
-    "import": "./dist/es/main.js",
-    "require": "./dist/npm/main.js",
-    "default": "./dist/npm/main.js"
+    ".": {
+      "import": "./index.mjs",
+      "require": "./index.js"
+    }
   },
-  "scripts": {
-    "build-package": "gulp build-package",
-    "start": "gulp start --notsc",
-    "test": "cd ../../ && npm run test -- --testPathPattern=/packages/progressbars/.*",
-    "e2e": "cd ../../ && npx jest --maxWorkers=4 --config jest.config.e2e.js packages/progressbars"
+  "sideEffects": false,
+  "peerDependencies": {
+    "@progress/kendo-licensing": "^1.3.4",
+    "@progress/kendo-vue-common": "5.3.0-develop.1",
+    "@progress/kendo-vue-animation": "5.3.0-develop.1",
+    "vue": "^3.0.2"
   },
-  "homepage": "https://www.telerik.com/kendo-vue-ui/",
+  "dependencies": {},
   "keywords": [
     "Kendo UI",
     "Vue",
     "Progress",
-    "ProgressBars",
-    "ProgressBar",
-    "ChunkProgressBar",
-    "Kendo UI for Vue",
-    "vuejs",
+    "Progressbars",
     "UI",
     "components",
     "Vue component",
     "Telerik"
   ],
-  "peerDependencies": {
-    "@progress/kendo-licensing": "^1.3.0",
-    "@progress/kendo-vue-animation": "^5.0.0",
-    "vue": "^2.6.12 || ^3.0.2"
-  },
-  "devDependencies": {
-    "@progress/kendo-drawing": "^1.20.1",
-    "@progress/kendo-licensing": "^1.3.0",
-    "@progress/kendo-vue-animation": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-buttons": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-dropdowns": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-form": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-inputs": "5.3.0-dev.202410141143",
-    "@progress/kendo-vue-intl": "5.3.0-dev.202410141143"
-  },
-  "dependencies": {
-    "@progress/kendo-vue-common": "5.3.0-dev.202410141143"
-  },
   "@progress": {
-    "friendlyName": "ProgressBars",
+    "friendlyName": "Progressbars",
     "framework": "Kendo UI for Vue"
   },
-  "author": "Progress",
-  "license": "SEE LICENSE IN LICENSE.md",
   "publishConfig": {
     "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/telerik/kendo-react.git"
   }
-}
+}

package/progressbar/ProgressBar.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),p=require("@progress/kendo-vue-animation"),t=require("@progress/kendo-vue-common"),r=require("../common/utils.js"),m=require("../common/constants.js"),P=require("../package-metadata.js"),$=a.defineComponent({name:"KendoProgressBar",props:{animation:{type:[Boolean,Object],default:!1},disabled:{type:Boolean,default:!1},reverse:{type:Boolean,default:!1},label:String,labelRender:[String,Object,Function],labelVisible:{type:Boolean,default:!0},labelPlacement:{type:String,default:void 0,validator:function(e){return["start","center","end"].includes(e)}},dir:{type:String,default:void 0},max:{type:Number,default:100},min:{type:Number,default:0},value:{type:Number,default:0},orientation:{type:String,default:"horizontal",validator:function(e){return["horizontal","vertical"].includes(e)}},tabIndex:Number,emptyStyle:Object,emptyClassName:String,progressStyle:Object,progressClassName:String,ariaLabel:String},created(){t.validatePackage(P.packageMetadata),this.currentDir=this.$props.dir},mounted(){this._progressStatus=t.getRef(this,"progressStatus"),this._progressStatusWrap=t.getRef(this,"progressStatusWrap"),this.currentDir=this.$props.dir!==void 0?this.$props.dir:t.isRtl(this.$el)?"rtl":"ltr",this.animationFrame=p.animate({duration:this.animationDuration,onStart:this.handleStart,onUpdate:this.handleUpdate,onEnd:this.handleEnd})},unmounted(){p.cancelAnimation(this.animationFrame)},data(){return{currentDir:void 0}},watch:{value:function(e,s){this.prevValue=s,this.animationFrame=p.animate({duration:this.animationDuration,onStart:this.handleStart,onUpdate:this.handleUpdate,onEnd:this.handleEnd})}},computed:{wrapperClass(){const{disabled:e,reverse:s,orientation:n,value:o}=this.$props,i=n==="vertical";return{"k-progressbar":!0,"k-progressbar-horizontal":!i,"k-progressbar-vertical":i,"k-progressbar-reverse":s,"k-progressbar-indeterminate":o===null,"k-disabled":e}},isVertical(){return this.orientation==="vertical"},animationDuration(){const{animation:e}=this.$props;return typeof e!="boolean"&&e!==void 0?e.duration:e?m.DEFAULT_ANIMATION_DURATION:m.NO_ANIMATION}},render(){const{disabled:e,labelVisible:s,labelPlacement:n,max:o,min:i,tabIndex:d,emptyStyle:b,emptyClassName:u,progressStyle:f,progressClassName:c}=this.$props,l=this.$props.value||0,S=this.$props.value===null,v=r.truncateNumber(l),y={value:l},N=this.$props.labelRender?t.templateRendering.call(this,this.$props.labelRender,t.getListeners.call(this)):void 0,k=a.h("span",{class:"k-progress-status"},v),V=t.getTemplate.call(this,{h:a.h,template:N,defaultRendering:k,additionalProps:y}),h=s?this.$props.label?a.createVNode("span",{class:"k-progress-status"},[this.$props.label]):V:void 0,g=t.classNames("k-progress-status-wrap",{"k-progress-start":n==="start","k-progress-center":n==="center","k-progress-end":n==="end"||n===void 0});return a.createVNode("div",{class:this.wrapperClass,dir:this.currentDir,tabindex:t.getTabIndex(d,e),role:"progressbar","aria-valuemin":i,"aria-valuemax":o,"aria-valuenow":S?void 0:l,"aria-disabled":e,"aria-label":this.$props.ariaLabel},[a.createVNode("span",{class:g+(u?" "+u:""),style:b},[h]),a.createVNode("div",{class:"k-progressbar-value k-selected",style:f,ref:t.setRef(this,"progressStatus")},[a.createVNode("span",{class:g+(c?" "+c:""),ref:t.setRef(this,"progressStatusWrap")},[h])])])},methods:{focus(){this.$el&&this.$el.focus()},progressStatusElement(){return this._progressStatus},progressStatusWrapElement(){return this._progressStatusWrap},handleStart(){const e=r.calculatePercentage(this.min,this.max,this.prevValue);r.updateProgress(this._progressStatus,this._progressStatusWrap,e,this.isVertical)},handleUpdate(e){const s=r.calculatePercentage(this.min,this.max,this.prevValue+(this.value-this.prevValue)*e);r.updateProgress(this._progressStatus,this._progressStatusWrap,s,this.isVertical)},handleEnd(){const e=r.calculatePercentage(this.min,this.max,this.value);r.updateProgress(this._progressStatus,this._progressStatusWrap,e,this.isVertical)}}});exports.ProgressBar=$;