@progress/kendo-react-progressbars 12.0.2-develop.1 → 12.0.2-develop.3

package/dist/cdn/js/kendo-react-progressbars.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-animation")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-animation"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactProgressbars={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactAnimation)}(this,(function(e,r,a,s,t){"use strict";function n(e){var r=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var s=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(r,a,s.get?s:{enumerable:!0,get:function(){return e[a]}})}})),r.default=e,Object.freeze(r)}var l=n(r);const o=(e,r,a)=>{const s=Math.abs((r-e)/100);return Math.abs((a-e)/s)},i=(e,r,a,s)=>{const t=Math.max(a,.01),n=100/t*100;e.current&&r.current&&(e.current.style.width=s?"100%":`${t}%`,r.current.style.width=s?"100%":`${n}%`,e.current.style.height=s?`${t}%`:"100%",r.current.style.height=s?`${n}%`:"100%")},c=(e,r,a)=>Math.max((a-e)/(r-e),1e-5),u=Object.freeze({name:"@progress/kendo-react-progressbars",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.0.2-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),m=l.forwardRef(((e,r)=>{const a=!s.validatePackage(u,{component:"ChunkProgressBar"}),t=s.getLicenseMessage(u),{chunkCount:n=d.chunkCount,className:o,disabled:i=d.disabled,orientation:m,min:b=d.min,max:p=d.max,reverse:g=d.reverse,style:k,tabIndex:v,emptyStyle:f,emptyClassName:y,progressStyle:h,progressClassName:N}=e,C=l.useRef(null),E=l.useCallback((()=>{C.current&&C.current.focus()}),[]);l.useImperativeHandle(r,(()=>({element:C.current,focus:E})));const x=e.value||d.value,R=null===e.value,I=s.useRtl(C,e.dir),S="vertical"===m,w={className:s.classNames("k-progressbar k-chunk-progressbar",{"k-progressbar-horizontal":!S,"k-progressbar-vertical":S,"k-progressbar-reverse":g,"k-progressbar-indeterminate":R,"k-disabled":i},o),ref:C,dir:I,tabIndex:s.getTabIndex(v,i),role:"progressbar","aria-label":e.ariaLabel,"aria-valuemin":b,"aria-valuemax":p,"aria-valuenow":R?void 0:x,"aria-disabled":i,style:k},O=({count:e})=>{const r=[],a=100/e+"%",t=c(b,p,x),n=Math.floor(t*e),o=Array(e).fill(!1);for(let e=0;e<n;e++)o[e]=!0;for(let t=0;t<e;++t){const n=o[t],i=n?N:y,c={width:S?void 0:a,height:S?a:void 0,...n?h:f};r.push(l.createElement("li",{key:t,className:s.classNames("k-progressbar-chunk",{"k-first":0===t,"k-last":t===e-1,"k-selected":n},i),style:c}))}return l.createElement(l.Fragment,null,r)};return l.createElement(l.Fragment,null,l.createElement("div",{...w},l.createElement("ul",{className:"k-progressbar-chunks k-reset"},l.createElement(O,{count:n}))),a&&l.createElement(s.WatermarkOverlay,{message:t}))}));m.propTypes={chunkCount:a.number,ariaLabel:a.string,disabled:a.bool,reverse:a.bool,max:a.number,min:a.number,value:a.number,tabIndex:a.number,emptyStyle:a.object,emptyClassName:a.string,progressStyle:a.object,progressClassName:a.string};const d={chunkCount:5,min:0,max:100,value:0,disabled:!1,reverse:!1};m.displayName="KendoChunkProgressBar";const b=l.forwardRef(((e,r)=>{const{animation:a=p.animation,disabled:n=p.disabled,reverse:c=p.reverse,orientation:u,labelVisible:m=p.labelVisible,labelPlacement:d,max:b=p.max,min:g=p.min,tabIndex:k,className:v,style:f,emptyStyle:y,emptyClassName:h,progressStyle:N,progressClassName:C}=e,E=l.useRef(null),x=l.useRef(null),R=l.useRef(null),I=l.useCallback((()=>{E.current&&E.current.focus()}),[]);l.useImperativeHandle(r,(()=>({element:E.current,progressStatusElement:x.current,progressStatusWrapElement:R.current,focus:I})));const S=e.value||p.value,w=(e=>{const r=l.useRef(void 0);return l.useEffect((()=>{r.current=e})),r.current})(S),O=null===e.value,P=s.useRtl(E,e.dir),j="vertical"===u,T=(e=>{const r=e.toString().split(".");return 1===r.length?`${r[0]}`:`${r[0]}.${r[1].substr(0,3)}`})(S),K={value:S},$=m?e.label?l.createElement("span",{className:"k-progress-status"},l.createElement(e.label,{...K})):l.createElement("span",{className:"k-progress-status"},T):void 0,M={className:s.classNames("k-progressbar",{"k-progressbar-horizontal":!j,"k-progressbar-vertical":j,"k-progressbar-reverse":c,"k-progressbar-indeterminate":O,"k-disabled":n},v),ref:E,dir:P,tabIndex:s.getTabIndex(k,n),role:"progressbar","aria-label":e.ariaLabel,"aria-valuemin":g,"aria-valuemax":b,"aria-valuenow":O?void 0:S,"aria-disabled":n,style:f},A=s.classNames("k-progress-status-wrap",{"k-progress-start":"start"===d,"k-progress-center":"center"===d,"k-progress-end":"end"===d||void 0===d}),B="boolean"!=typeof a&&void 0!==a?a.duration:a?400:0,D=l.useCallback((()=>{const e=o(g,b,w);i(x,R,e,j)}),[j,b,g,w]),L=l.useCallback((e=>{const r=o(g,b,w+(S-w)*e);i(x,R,r,j)}),[g,b,w,S,j]),V=l.useCallback((()=>{const e=o(g,b,S);i(x,R,e,j)}),[j,b,g,S]);return t.useAnimation({duration:B,onStart:D,onUpdate:L,onEnd:V},[S,B]),l.createElement("div",{...M},l.createElement("span",{className:A+(h?" "+h:""),style:y},$),l.createElement("div",{className:"k-progressbar-value k-selected",style:N,ref:x},l.createElement("span",{className:A+(C?" "+C:""),ref:R},$)))}));b.propTypes={animation:a.any,ariaLabel:a.string,disabled:a.bool,reverse:a.bool,label:a.any,labelVisible:a.bool,labelPlacement:a.oneOf(["start","center","end"]),max:a.number,min:a.number,value:a.number,tabIndex:a.number,emptyStyle:a.object,emptyClassName:a.string,progressStyle:a.object,progressClassName:a.string};const p={animation:!1,min:0,max:100,value:0,disabled:!1,reverse:!1,labelVisible:!0};b.displayName="KendoProgressBar",e.ChunkProgressBar=m,e.ProgressBar=b}));
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-animation")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-animation"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactProgressbars={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactAnimation)}(this,(function(e,r,a,s,t){"use strict";function n(e){var r=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var s=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(r,a,s.get?s:{enumerable:!0,get:function(){return e[a]}})}})),r.default=e,Object.freeze(r)}var l=n(r);const o=(e,r,a)=>{const s=Math.abs((r-e)/100);return Math.abs((a-e)/s)},i=(e,r,a,s)=>{const t=Math.max(a,.01),n=100/t*100;e.current&&r.current&&(e.current.style.width=s?"100%":`${t}%`,r.current.style.width=s?"100%":`${n}%`,e.current.style.height=s?`${t}%`:"100%",r.current.style.height=s?`${n}%`:"100%")},c=(e,r,a)=>Math.max((a-e)/(r-e),1e-5),u=Object.freeze({name:"@progress/kendo-react-progressbars",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"12.0.2-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),m=l.forwardRef(((e,r)=>{const a=!s.validatePackage(u,{component:"ChunkProgressBar"}),t=s.getLicenseMessage(u),{chunkCount:n=d.chunkCount,className:o,disabled:i=d.disabled,orientation:m,min:b=d.min,max:p=d.max,reverse:g=d.reverse,style:k,tabIndex:v,emptyStyle:f,emptyClassName:y,progressStyle:h,progressClassName:N}=e,C=l.useRef(null),E=l.useCallback((()=>{C.current&&C.current.focus()}),[]);l.useImperativeHandle(r,(()=>({element:C.current,focus:E})));const x=e.value||d.value,R=null===e.value,I=s.useRtl(C,e.dir),S="vertical"===m,w={className:s.classNames("k-progressbar k-chunk-progressbar",{"k-progressbar-horizontal":!S,"k-progressbar-vertical":S,"k-progressbar-reverse":g,"k-progressbar-indeterminate":R,"k-disabled":i},o),ref:C,dir:I,tabIndex:s.getTabIndex(v,i),role:"progressbar","aria-label":e.ariaLabel,"aria-valuemin":b,"aria-valuemax":p,"aria-valuenow":R?void 0:x,"aria-disabled":i,style:k},O=({count:e})=>{const r=[],a=100/e+"%",t=c(b,p,x),n=Math.floor(t*e),o=Array(e).fill(!1);for(let e=0;e<n;e++)o[e]=!0;for(let t=0;t<e;++t){const n=o[t],i=n?N:y,c={width:S?void 0:a,height:S?a:void 0,...n?h:f};r.push(l.createElement("li",{key:t,className:s.classNames("k-progressbar-chunk",{"k-first":0===t,"k-last":t===e-1,"k-selected":n},i),style:c}))}return l.createElement(l.Fragment,null,r)};return l.createElement(l.Fragment,null,l.createElement("div",{...w},l.createElement("ul",{className:"k-progressbar-chunks k-reset"},l.createElement(O,{count:n}))),a&&l.createElement(s.WatermarkOverlay,{message:t}))}));m.propTypes={chunkCount:a.number,ariaLabel:a.string,disabled:a.bool,reverse:a.bool,max:a.number,min:a.number,value:a.number,tabIndex:a.number,emptyStyle:a.object,emptyClassName:a.string,progressStyle:a.object,progressClassName:a.string};const d={chunkCount:5,min:0,max:100,value:0,disabled:!1,reverse:!1};m.displayName="KendoChunkProgressBar";const b=l.forwardRef(((e,r)=>{const{animation:a=p.animation,disabled:n=p.disabled,reverse:c=p.reverse,orientation:u,labelVisible:m=p.labelVisible,labelPlacement:d,max:b=p.max,min:g=p.min,tabIndex:k,className:v,style:f,emptyStyle:y,emptyClassName:h,progressStyle:N,progressClassName:C}=e,E=l.useRef(null),x=l.useRef(null),R=l.useRef(null),I=l.useCallback((()=>{E.current&&E.current.focus()}),[]);l.useImperativeHandle(r,(()=>({element:E.current,progressStatusElement:x.current,progressStatusWrapElement:R.current,focus:I})));const S=e.value||p.value,w=(e=>{const r=l.useRef(void 0);return l.useEffect((()=>{r.current=e})),r.current})(S),O=null===e.value,P=s.useRtl(E,e.dir),j="vertical"===u,T=(e=>{const r=e.toString().split(".");return 1===r.length?`${r[0]}`:`${r[0]}.${r[1].substr(0,3)}`})(S),K={value:S},$=m?e.label?l.createElement("span",{className:"k-progress-status"},l.createElement(e.label,{...K})):l.createElement("span",{className:"k-progress-status"},T):void 0,M={className:s.classNames("k-progressbar",{"k-progressbar-horizontal":!j,"k-progressbar-vertical":j,"k-progressbar-reverse":c,"k-progressbar-indeterminate":O,"k-disabled":n},v),ref:E,dir:P,tabIndex:s.getTabIndex(k,n),role:"progressbar","aria-label":e.ariaLabel,"aria-valuemin":g,"aria-valuemax":b,"aria-valuenow":O?void 0:S,"aria-disabled":n,style:f},A=s.classNames("k-progress-status-wrap",{"k-progress-start":"start"===d,"k-progress-center":"center"===d,"k-progress-end":"end"===d||void 0===d}),B="boolean"!=typeof a&&void 0!==a?a.duration:a?400:0,D=l.useCallback((()=>{const e=o(g,b,w);i(x,R,e,j)}),[j,b,g,w]),L=l.useCallback((e=>{const r=o(g,b,w+(S-w)*e);i(x,R,r,j)}),[g,b,w,S,j]),V=l.useCallback((()=>{const e=o(g,b,S);i(x,R,e,j)}),[j,b,g,S]);return t.useAnimation({duration:B,onStart:D,onUpdate:L,onEnd:V},[S,B]),l.createElement("div",{...M},l.createElement("span",{className:A+(h?" "+h:""),style:y},$),l.createElement("div",{className:"k-progressbar-value k-selected",style:N,ref:x},l.createElement("span",{className:A+(C?" "+C:""),ref:R},$)))}));b.propTypes={animation:a.any,ariaLabel:a.string,disabled:a.bool,reverse:a.bool,label:a.any,labelVisible:a.bool,labelPlacement:a.oneOf(["start","center","end"]),max:a.number,min:a.number,value:a.number,tabIndex:a.number,emptyStyle:a.object,emptyClassName:a.string,progressStyle:a.object,progressClassName:a.string};const p={animation:!1,min:0,max:100,value:0,disabled:!1,reverse:!1,labelVisible:!0};b.displayName="KendoProgressBar",e.ChunkProgressBar=m,e.ProgressBar=b}));

package/index.d.mts

@@ -27,7 +27,9 @@ declare interface BaseProps {
      * Set to `null` to enable the indeterminate state of the progress bar.
      * See examples ([here]({% slug overview_progressbar %})) and ([here]({% slug overview_chunkprogressbar %})).
      *
-     * Example:
+     * @default 0
+     *
+     * @example
      * ```jsx
      * <ProgressBar value={50} />
      * ```
@@ -36,7 +38,9 @@ declare interface BaseProps {
     /**
      * Specifies the minimum value of the progress bar. Defaults to `0`.
      *
-     * Example:
+     * @default 0
+     *
+     * @example
      * ```jsx
      * <ProgressBar min={0} />
      * ```
@@ -45,7 +49,9 @@ declare interface BaseProps {
     /**
      * Specifies the maximum value of the progress bar. Defaults to `100`.
      *
-     * Example:
+     * @default 100
+     *
+     * @example
      * ```jsx
      * <ProgressBar max={100} />
      * ```
@@ -54,7 +60,7 @@ declare interface BaseProps {
     /**
      * Sets the `dir` HTML attribute to switch between LTR and RTL directions.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar dir="rtl" />
      * ```
@@ -63,7 +69,7 @@ declare interface BaseProps {
     /**
      * Provides an accessible label for the component.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar ariaLabel="Loading progress" />
      * ```
@@ -73,7 +79,7 @@ declare interface BaseProps {
      * Determines whether the progress bar is in a disabled state.
      * See examples ([here]({% slug progressbar_disabled %})) and ([here]({% slug chunkprogressbar_disabled %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar disabled={true} />
      * ```
@@ -83,7 +89,9 @@ declare interface BaseProps {
      * Specifies the orientation of the progress bar. Can be `horizontal` or `vertical`. Defaults to `horizontal`.
      * See examples ([here]({% slug progressbar_orientation %})) and ([here]({% slug chunkprogressbar_orientation %})).
      *
-     * Example:
+     * @default "horizontal"
+     *
+     * @example
      * ```jsx
      * <ProgressBar orientation="vertical" />
      * ```
@@ -93,7 +101,9 @@ declare interface BaseProps {
      * If set to `true`, reverses the direction of the progress bar. Defaults to `false`.
      * See examples ([here]({% slug progressbar_direction %})) and ([here]({% slug chunkprogressbar_direction %})).
      *
-     * Example:
+     * @default false
+     *
+     * @example
      * ```jsx
      * <ProgressBar reverse={true} />
      * ```
@@ -102,7 +112,7 @@ declare interface BaseProps {
     /**
      * Adds a list of CSS classes to the progress bar element.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar className="custom-progress-bar" />
      * ```
@@ -111,7 +121,7 @@ declare interface BaseProps {
     /**
      * Applies additional CSS styles to the progress bar.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar style={{ backgroundColor: 'red' }} />
      * ```
@@ -121,7 +131,7 @@ declare interface BaseProps {
      * Specifies the styles applied to the inner element representing the empty portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar emptyStyle={{ backgroundColor: 'lightgray' }} />
      * ```
@@ -131,7 +141,7 @@ declare interface BaseProps {
      * Adds additional CSS classes to the inner element representing the empty portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar emptyClassName="custom-empty-class" />
      * ```
@@ -141,7 +151,7 @@ declare interface BaseProps {
      * Specifies the styles applied to the inner element representing the full portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar progressStyle={{ backgroundColor: 'green' }} />
      * ```
@@ -151,7 +161,7 @@ declare interface BaseProps {
      * Adds additional CSS classes to the inner element representing the full portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar progressClassName="custom-progress-class" />
      * ```
@@ -160,7 +170,7 @@ declare interface BaseProps {
     /**
      * Sets the `tabIndex` attribute of the progress bar for keyboard navigation.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar tabIndex={0} />
      * ```
@@ -204,6 +214,8 @@ export declare interface ChunkProgressBarProps extends BaseProps {
      * Defines the number of chunks into which the ChunkProgressBar is divided. Defaults to `5`.
      * Each chunk visually represents a portion of the progress bar.
      *
+     * @default 5
+     *
      * @example
      * ```jsx
      * <ChunkProgressBar chunkCount={10} />
@@ -242,6 +254,8 @@ export declare const ProgressBar: React_2.ForwardRefExoticComponent<ProgressBarP
 export declare interface ProgressBarAnimation {
     /**
      * Specifies the duration of the ProgressBar animation. Defaults to `400`.
+     *
+     * @default 400
      */
     duration: number;
 }
@@ -277,6 +291,8 @@ export declare interface ProgressBarProps extends BaseProps {
      * If set to a boolean, it enables or disables the default animation.
      * If set to a `ProgressBarAnimation` object, it allows customization of the slide animation duration in milliseconds.
      *
+     * @default false
+     *
      * @example
      * ```jsx
      * <ProgressBar animation={{ duration: 500 }} />
@@ -296,6 +312,8 @@ export declare interface ProgressBarProps extends BaseProps {
     /**
      * Determines whether the progress status label is visible. Defaults to `true`.
      *
+     * @default true
+     *
      * @example
      * ```jsx
      * <ProgressBar labelVisible={false} />
@@ -305,6 +323,8 @@ export declare interface ProgressBarProps extends BaseProps {
     /**
      * Specifies the position of the progress status label. Defaults to `end` ([see example]({% slug progressbar_label %})).
      *
+     * @default "end"
+     *
      * @example
      * ```jsx
      * <ProgressBar labelPlacement="center" />

package/index.d.ts

@@ -27,7 +27,9 @@ declare interface BaseProps {
      * Set to `null` to enable the indeterminate state of the progress bar.
      * See examples ([here]({% slug overview_progressbar %})) and ([here]({% slug overview_chunkprogressbar %})).
      *
-     * Example:
+     * @default 0
+     *
+     * @example
      * ```jsx
      * <ProgressBar value={50} />
      * ```
@@ -36,7 +38,9 @@ declare interface BaseProps {
     /**
      * Specifies the minimum value of the progress bar. Defaults to `0`.
      *
-     * Example:
+     * @default 0
+     *
+     * @example
      * ```jsx
      * <ProgressBar min={0} />
      * ```
@@ -45,7 +49,9 @@ declare interface BaseProps {
     /**
      * Specifies the maximum value of the progress bar. Defaults to `100`.
      *
-     * Example:
+     * @default 100
+     *
+     * @example
      * ```jsx
      * <ProgressBar max={100} />
      * ```
@@ -54,7 +60,7 @@ declare interface BaseProps {
     /**
      * Sets the `dir` HTML attribute to switch between LTR and RTL directions.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar dir="rtl" />
      * ```
@@ -63,7 +69,7 @@ declare interface BaseProps {
     /**
      * Provides an accessible label for the component.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar ariaLabel="Loading progress" />
      * ```
@@ -73,7 +79,7 @@ declare interface BaseProps {
      * Determines whether the progress bar is in a disabled state.
      * See examples ([here]({% slug progressbar_disabled %})) and ([here]({% slug chunkprogressbar_disabled %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar disabled={true} />
      * ```
@@ -83,7 +89,9 @@ declare interface BaseProps {
      * Specifies the orientation of the progress bar. Can be `horizontal` or `vertical`. Defaults to `horizontal`.
      * See examples ([here]({% slug progressbar_orientation %})) and ([here]({% slug chunkprogressbar_orientation %})).
      *
-     * Example:
+     * @default "horizontal"
+     *
+     * @example
      * ```jsx
      * <ProgressBar orientation="vertical" />
      * ```
@@ -93,7 +101,9 @@ declare interface BaseProps {
      * If set to `true`, reverses the direction of the progress bar. Defaults to `false`.
      * See examples ([here]({% slug progressbar_direction %})) and ([here]({% slug chunkprogressbar_direction %})).
      *
-     * Example:
+     * @default false
+     *
+     * @example
      * ```jsx
      * <ProgressBar reverse={true} />
      * ```
@@ -102,7 +112,7 @@ declare interface BaseProps {
     /**
      * Adds a list of CSS classes to the progress bar element.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar className="custom-progress-bar" />
      * ```
@@ -111,7 +121,7 @@ declare interface BaseProps {
     /**
      * Applies additional CSS styles to the progress bar.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar style={{ backgroundColor: 'red' }} />
      * ```
@@ -121,7 +131,7 @@ declare interface BaseProps {
      * Specifies the styles applied to the inner element representing the empty portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar emptyStyle={{ backgroundColor: 'lightgray' }} />
      * ```
@@ -131,7 +141,7 @@ declare interface BaseProps {
      * Adds additional CSS classes to the inner element representing the empty portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar emptyClassName="custom-empty-class" />
      * ```
@@ -141,7 +151,7 @@ declare interface BaseProps {
      * Specifies the styles applied to the inner element representing the full portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar progressStyle={{ backgroundColor: 'green' }} />
      * ```
@@ -151,7 +161,7 @@ declare interface BaseProps {
      * Adds additional CSS classes to the inner element representing the full portion of the progress bar.
      * See examples ([here]({% slug progressbar_appearance %})) and ([here]({% slug chunkprogressbar_appearance %})).
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar progressClassName="custom-progress-class" />
      * ```
@@ -160,7 +170,7 @@ declare interface BaseProps {
     /**
      * Sets the `tabIndex` attribute of the progress bar for keyboard navigation.
      *
-     * Example:
+     * @example
      * ```jsx
      * <ProgressBar tabIndex={0} />
      * ```
@@ -204,6 +214,8 @@ export declare interface ChunkProgressBarProps extends BaseProps {
      * Defines the number of chunks into which the ChunkProgressBar is divided. Defaults to `5`.
      * Each chunk visually represents a portion of the progress bar.
      *
+     * @default 5
+     *
      * @example
      * ```jsx
      * <ChunkProgressBar chunkCount={10} />
@@ -242,6 +254,8 @@ export declare const ProgressBar: React_2.ForwardRefExoticComponent<ProgressBarP
 export declare interface ProgressBarAnimation {
     /**
      * Specifies the duration of the ProgressBar animation. Defaults to `400`.
+     *
+     * @default 400
      */
     duration: number;
 }
@@ -277,6 +291,8 @@ export declare interface ProgressBarProps extends BaseProps {
      * If set to a boolean, it enables or disables the default animation.
      * If set to a `ProgressBarAnimation` object, it allows customization of the slide animation duration in milliseconds.
      *
+     * @default false
+     *
      * @example
      * ```jsx
      * <ProgressBar animation={{ duration: 500 }} />
@@ -296,6 +312,8 @@ export declare interface ProgressBarProps extends BaseProps {
     /**
      * Determines whether the progress status label is visible. Defaults to `true`.
      *
+     * @default true
+     *
      * @example
      * ```jsx
      * <ProgressBar labelVisible={false} />
@@ -305,6 +323,8 @@ export declare interface ProgressBarProps extends BaseProps {
     /**
      * Specifies the position of the progress status label. Defaults to `end` ([see example]({% slug progressbar_label %})).
      *
+     * @default "end"
+     *
      * @example
      * ```jsx
      * <ProgressBar labelPlacement="center" />

package/package-metadata.js

@@ -5,4 +5,4 @@
  * 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=Object.freeze({name:"@progress/kendo-react-progressbars",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1756966888,version:"12.0.2-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-progressbars",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1757419390,version:"12.0.2-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;

package/package-metadata.mjs

@@ -10,8 +10,8 @@ const e = Object.freeze({
   productName: "KendoReact",
   productCode: "KENDOUIREACT",
   productCodes: ["KENDOUIREACT"],
-  publishDate: 1756966888,
-  version: "12.0.2-develop.1",
+  publishDate: 1757419390,
+  version: "12.0.2-develop.3",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
 });
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-progressbars",
-  "version": "12.0.2-develop.1",
+  "version": "12.0.2-develop.3",
   "description": "React ProgressBars offer a customizable interface for users to track and display the progress of a task. KendoReact ProgressBars package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,8 +26,8 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.7.0",
-    "@progress/kendo-react-animation": "12.0.2-develop.1",
-    "@progress/kendo-react-common": "12.0.2-develop.1",
+    "@progress/kendo-react-animation": "12.0.2-develop.3",
+    "@progress/kendo-react-common": "12.0.2-develop.3",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
   },
@@ -56,7 +56,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1756966888,
+      "publishDate": 1757419390,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },