@progress/kendo-react-barcodes 15.2.0-develop.1 → 15.2.0-develop.3

package/Barcode.d.ts

@@ -6,50 +6,9 @@
  *-------------------------------------------------------------------------------------------
  */
 import { BarcodeProps } from './BarcodeProps';
-import { Surface, Group, ImageExportOptions, SVGExportOptions } from '@progress/kendo-drawing';
+import { BarcodeHandle } from './BarcodeHandle';
 import * as React from 'react';
 /**
  * Represents the KendoReact Barcode component.
  */
-export declare class Barcode extends React.Component<BarcodeProps, {}> {
-    private _baseBarcode;
-    /**
-     * @hidden
-     */
-    get barcodeInstance(): any;
-    /**
-     * Gets the Drawing `Surface` of the Barcode.
-     */
-    get surface(): Surface | null;
-    /**
-     * Gets the DOM element of the Barcode.
-     */
-    get element(): HTMLDivElement | null;
-    /**
-     * @hidden
-     */
-    render(): any;
-    /**
-     * Exports the component as an image. The export operation runs asynchronously and returns a promise.
-     *
-     * @param {ImageExportOptions} options - The parameters for the exported image.
-     * @returns {Promise<string>} - A promise that resolves with a PNG image encoded as a Data URI.
-     */
-    exportImage(options?: ImageExportOptions): Promise<string>;
-    /**
-     * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
-     *
-     * @param options - The parameters for the exported file.
-     * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
-     */
-    exportSVG(options?: SVGExportOptions): Promise<string>;
-    /**
-     * Exports a Barcode component as a Drawing `Scene`.
-     *
-     * @param {any} options - The parameters for the export operation.
-     * @returns {Group} A promise that returns the root `Group` of the scene.
-     */
-    exportVisual(options?: any): Group;
-    private getTarget;
-    private deriveOptionsFromParent;
-}
+export declare const Barcode: React.ForwardRefExoticComponent<BarcodeProps & React.RefAttributes<BarcodeHandle>>;

package/Barcode.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 c=require("react"),i=require("./BaseBarcode.js"),u=require("@progress/kendo-charts"),o=require("@progress/kendo-drawing"),p=require("@progress/kendo-react-common");function d(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const a=d(c);class l extends a.Component{constructor(){super(...arguments),this._baseBarcode=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>Object.assign({},e,{background:this.props.background,border:this.props.border,checksum:this.props.checksum,color:this.props.color,height:this.props.height,padding:this.props.padding,text:this.props.text,type:this.props.type,value:this.props.value,width:this.props.width})}get barcodeInstance(){return this._baseBarcode!==null?this._baseBarcode.barcodeInstance:null}get surface(){return this._baseBarcode!==null?this._baseBarcode.surface:null}get element(){return this._baseBarcode!==null?this._baseBarcode.element:null}render(){const{children:e,className:t,...s}=this.props;return a.createElement(i.BaseBarcode,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:n=>{this._baseBarcode=n},barcodeConstructor:u.Barcode,getTarget:this.getTarget,className:p.classNames("k-barcode",t)},e)}exportImage(e={}){return o.exportImage(this.exportVisual(),e)}exportSVG(e={}){return o.exportSVG(this.exportVisual(),e)}exportVisual(e){return this.barcodeInstance!==null?this.barcodeInstance.exportVisual(e):new o.Group}}exports.Barcode=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react"),B=require("./BaseBarcode.js"),v=require("@progress/kendo-charts"),d=require("@progress/kendo-drawing"),y=require("@progress/kendo-react-common");function I(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const c in e)if(c!=="default"){const s=Object.getOwnPropertyDescriptor(e,c);Object.defineProperty(o,c,s.get?s:{enumerable:!0,get:()=>e[c]})}}return o.default=e,Object.freeze(o)}const n=I(h),m=n.forwardRef((e,o)=>{const{children:c,className:s,...k}=e,u=n.useRef(null),i=n.useRef(e);i.current=e;const a=n.useCallback(t=>{var f;const r=(f=u.current)==null?void 0:f.barcodeInstance;return r!=null?r.exportVisual(t):new d.Group},[]),g=n.useCallback((t={})=>d.exportImage(a(),t),[a]),b=n.useCallback((t={})=>d.exportSVG(a(),t),[a]),l=n.useRef(null);n.useImperativeHandle(l,()=>({get element(){var t,r;return(r=(t=u.current)==null?void 0:t.element)!=null?r:null},get props(){return i.current},get barcodeInstance(){var t,r;return(r=(t=u.current)==null?void 0:t.barcodeInstance)!=null?r:null},get surface(){var t,r;return(r=(t=u.current)==null?void 0:t.surface)!=null?r:null},exportImage:g,exportSVG:b,exportVisual:a}),[g,b,a]),n.useImperativeHandle(o,()=>l.current,[]);const x=()=>l.current,R=t=>({...t,background:e.background,border:e.border,checksum:e.checksum,color:e.color,height:e.height,padding:e.padding,text:e.text,type:e.type,value:e.value,width:e.width});return n.createElement(B.BaseBarcode,{...k,deriveOptionsFromParent:R,ref:u,barcodeConstructor:v.Barcode,getTarget:x,className:y.classNames("k-barcode",s)},c)});m.displayName="KendoReactBarcode";exports.Barcode=m;

package/Barcode.mjs

@@ -5,92 +5,76 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as r from "react";
-import { BaseBarcode as a } from "./BaseBarcode.mjs";
-import { Barcode as i } from "@progress/kendo-charts";
-import { exportImage as n, exportSVG as p, Group as c } from "@progress/kendo-drawing";
-import { classNames as u } from "@progress/kendo-react-common";
-class g extends r.Component {
-  constructor() {
-    super(...arguments), this._baseBarcode = null, this.getTarget = () => this, this.deriveOptionsFromParent = (e) => Object.assign({}, e, {
-      background: this.props.background,
-      border: this.props.border,
-      checksum: this.props.checksum,
-      color: this.props.color,
-      height: this.props.height,
-      padding: this.props.padding,
-      text: this.props.text,
-      type: this.props.type,
-      value: this.props.value,
-      width: this.props.width
-    });
-  }
-  /**
-   * @hidden
-   */
-  get barcodeInstance() {
-    return this._baseBarcode !== null ? this._baseBarcode.barcodeInstance : null;
-  }
-  /**
-   * Gets the Drawing `Surface` of the Barcode.
-   */
-  get surface() {
-    return this._baseBarcode !== null ? this._baseBarcode.surface : null;
-  }
-  /**
-   * Gets the DOM element of the Barcode.
-   */
-  get element() {
-    return this._baseBarcode !== null ? this._baseBarcode.element : null;
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const { children: e, className: t, ...s } = this.props;
-    return /* @__PURE__ */ r.createElement(
-      a,
-      {
-        ...s,
-        deriveOptionsFromParent: this.deriveOptionsFromParent,
-        ref: (o) => {
-          this._baseBarcode = o;
-        },
-        barcodeConstructor: i,
-        getTarget: this.getTarget,
-        className: u("k-barcode", t)
+import * as a from "react";
+import { BaseBarcode as h } from "./BaseBarcode.mjs";
+import { Barcode as R } from "@progress/kendo-charts";
+import { Group as k, exportImage as B, exportSVG as I } from "@progress/kendo-drawing";
+import { classNames as v } from "@progress/kendo-react-common";
+const V = a.forwardRef((r, m) => {
+  const { children: i, className: g, ...f } = r, c = a.useRef(null), u = a.useRef(r);
+  u.current = r;
+  const n = a.useCallback((e) => {
+    var d;
+    const t = (d = c.current) == null ? void 0 : d.barcodeInstance;
+    return t != null ? t.exportVisual(e) : new k();
+  }, []), l = a.useCallback(
+    (e = {}) => B(n(), e),
+    [n]
+  ), s = a.useCallback(
+    (e = {}) => I(n(), e),
+    [n]
+  ), o = a.useRef(null);
+  a.useImperativeHandle(
+    o,
+    () => ({
+      get element() {
+        var e, t;
+        return (t = (e = c.current) == null ? void 0 : e.element) != null ? t : null;
       },
-      e
-    );
-  }
-  /**
-   * Exports the component as an image. The export operation runs asynchronously and returns a promise.
-   *
-   * @param {ImageExportOptions} options - The parameters for the exported image.
-   * @returns {Promise<string>} - A promise that resolves with a PNG image encoded as a Data URI.
-   */
-  exportImage(e = {}) {
-    return n(this.exportVisual(), e);
-  }
-  /**
-   * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
-   *
-   * @param options - The parameters for the exported file.
-   * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
-   */
-  exportSVG(e = {}) {
-    return p(this.exportVisual(), e);
-  }
-  /**
-   * Exports a Barcode component as a Drawing `Scene`.
-   *
-   * @param {any} options - The parameters for the export operation.
-   * @returns {Group} A promise that returns the root `Group` of the scene.
-   */
-  exportVisual(e) {
-    return this.barcodeInstance !== null ? this.barcodeInstance.exportVisual(e) : new c();
-  }
-}
+      get props() {
+        return u.current;
+      },
+      get barcodeInstance() {
+        var e, t;
+        return (t = (e = c.current) == null ? void 0 : e.barcodeInstance) != null ? t : null;
+      },
+      get surface() {
+        var e, t;
+        return (t = (e = c.current) == null ? void 0 : e.surface) != null ? t : null;
+      },
+      exportImage: l,
+      exportSVG: s,
+      exportVisual: n
+    }),
+    [l, s, n]
+  ), a.useImperativeHandle(m, () => o.current, []);
+  const b = () => o.current, x = (e) => ({
+    ...e,
+    background: r.background,
+    border: r.border,
+    checksum: r.checksum,
+    color: r.color,
+    height: r.height,
+    padding: r.padding,
+    text: r.text,
+    type: r.type,
+    value: r.value,
+    width: r.width
+  });
+  return /* @__PURE__ */ a.createElement(
+    h,
+    {
+      ...f,
+      deriveOptionsFromParent: x,
+      ref: c,
+      barcodeConstructor: R,
+      getTarget: b,
+      className: v("k-barcode", g)
+    },
+    i
+  );
+});
+V.displayName = "KendoReactBarcode";
 export {
-  g as Barcode
+  V as Barcode
 };

package/BarcodeHandle.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { Surface, Group, ImageExportOptions, SVGExportOptions } from '@progress/kendo-drawing';
+import { BarcodeProps } from './BarcodeProps';
+/**
+ * Represents the `ref` of the Barcode component.
+ */
+export interface BarcodeHandle {
+    /** The current root DOM element or `null`. */
+    element: HTMLDivElement | null;
+    /** The props of the Barcode component. */
+    readonly props: Readonly<BarcodeProps>;
+    /**
+     * @hidden
+     */
+    barcodeInstance: any;
+    /**
+     * Gets the Drawing `Surface` of the Barcode.
+     */
+    surface: Surface | null;
+    /**
+     * Exports the component as an image. The export operation runs asynchronously and returns a promise.
+     *
+     * @param options - The parameters for the exported image.
+     * @returns A promise that resolves with a PNG image encoded as a Data URI.
+     */
+    exportImage: (options?: ImageExportOptions) => Promise<string>;
+    /**
+     * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
+     *
+     * @param options - The parameters for the exported file.
+     * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
+     */
+    exportSVG: (options?: SVGExportOptions) => Promise<string>;
+    /**
+     * Exports a Barcode component as a Drawing `Scene`.
+     *
+     * @param options - The parameters for the export operation.
+     * @returns The root `Group` of the scene.
+     */
+    exportVisual: (options?: any) => Group;
+}

package/BaseBarcode.d.ts

@@ -5,80 +5,10 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { default as PropTypes } from 'prop-types';
-import { Surface } from '@progress/kendo-drawing';
 import { BaseBarcodePrivateProps } from './BaseBarcodeProps';
-import { BarcodeContextType } from './BarcodeContext.js';
+import { BaseBarcodeHandle } from './BaseBarcodeHandle';
 import * as React from 'react';
 /**
  * @hidden
  */
-export declare class BaseBarcode extends React.Component<BaseBarcodePrivateProps, {}> {
-    /**
-     * @hidden
-     */
-    static propTypes: {
-        dir: PropTypes.Requireable<string>;
-        renderAs: PropTypes.Requireable<string>;
-    };
-    /**
-     * @hidden
-     */
-    static defaultProps: {
-        renderAs: string;
-    };
-    /**
-     * @hidden
-     */
-    barcodeInstance: any | null;
-    /**
-     * @hidden
-     */
-    surface: Surface | null;
-    /**
-     * @hidden
-     */
-    get element(): HTMLDivElement;
-    protected _element: HTMLDivElement | null;
-    protected contextValue: BarcodeContextType;
-    protected observersStore: any;
-    private readonly showLicenseWatermark;
-    private readonly licenseMessage?;
-    constructor(props: BaseBarcodePrivateProps);
-    /**
-     * @hidden
-     */
-    componentDidMount(): void;
-    /**
-     * @hidden
-     */
-    componentDidUpdate(prevProps: any): void;
-    /**
-     * @hidden
-     */
-    componentWillUnmount(): void;
-    /**
-     * @hidden
-     */
-    render(): any;
-    /**
-     * @hidden
-     */
-    instantiateCoreBarcode(): void;
-    /**
-     * @hidden
-     */
-    refresh(): void;
-    /**
-     * @hidden
-     */
-    getBarcodeOptions(): any;
-    /**
-     * @hidden
-     */
-    trigger(name: string, e: any): void;
-    /**
-     * @hidden
-     */
-    onWindowResize: () => void;
-}
+export declare const BaseBarcode: React.ForwardRefExoticComponent<BaseBarcodePrivateProps & React.RefAttributes<BaseBarcodeHandle>>;

package/BaseBarcode.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 b=require("react"),d=require("prop-types"),v=require("./store/store.js"),f=require("./store/reducer.js"),O=require("./utils/common.js"),w=require("./BarcodeContext.js"),a=require("@progress/kendo-react-common"),l=require("./package-metadata.js");function C(n){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(e,r,t.get?t:{enumerable:!0,get:()=>n[r]})}}return e.default=n,Object.freeze(e)}const o=C(b),i=class i extends o.Component{constructor(e){super(e),this.barcodeInstance=null,this.surface=null,this._element=null,this.observersStore={},this.showLicenseWatermark=!1,this.onWindowResize=()=>{this.barcodeInstance!==null&&(this.barcodeInstance.redraw(),this.trigger("render",{sender:this}))},this.showLicenseWatermark=!a.validatePackage(l.packageMetadata,{component:"Barcode"}),this.licenseMessage=a.getLicenseMessage(l.packageMetadata),this.observersStore=v.createStore(f.observersReducer),this.contextValue={observersStore:this.observersStore}}get element(){return this._element}componentDidMount(){this.instantiateCoreBarcode(),window.addEventListener("resize",this.onWindowResize),this.trigger("render",{sender:this})}componentDidUpdate(e){const{children:r,deriveOptionsFromParent:t,getTarget:s,barcodeConstructor:I,className:y,renderAs:h,...p}=this.props,{children:P,deriveOptionsFromParent:S,getTarget:k,barcodeConstructor:M,className:q,renderAs:u,...g}=e;if(this.barcodeInstance!==null){const m=O.isOptionsChanged(g,p);(h||"svg")!==(u||"svg")?(this.barcodeInstance!==null&&(this.barcodeInstance.destroy(),this.barcodeInstance=null),this.instantiateCoreBarcode()):m&&this.refresh(),this.trigger("render",{sender:this})}}componentWillUnmount(){this.barcodeInstance!==null&&(this.barcodeInstance.destroy(),this.barcodeInstance=null),window.removeEventListener("resize",this.onWindowResize)}render(){const{style:e={},className:r,children:t}=this.props;return o.createElement(w.BarcodeContext.Provider,{value:this.contextValue},o.createElement("div",{style:e,ref:s=>{this._element=s},className:r},t,this.showLicenseWatermark&&o.createElement(a.WatermarkOverlay,{message:this.licenseMessage})))}instantiateCoreBarcode(){const{barcodeConstructor:e}=this.props,r=this.getBarcodeOptions();this.barcodeInstance=new e(this.element,r,t=>{if(process.env.NODE_ENV!=="production")throw t;console.warn(t)})}refresh(){if(this.barcodeInstance!==null){const e=this.getBarcodeOptions();this.barcodeInstance.setOptions(e)}}getBarcodeOptions(){const{renderAs:e,deriveOptionsFromParent:r}=this.props;let t={renderAs:e};return r&&(t=r(t)),t}trigger(e,r){const t=this.observersStore.getState();for(let s=0;s<t.length;s++)t[s].trigger(e,r)}};i.propTypes={dir:d.string,renderAs:d.oneOf(["svg","canvas"])},i.defaultProps={renderAs:"svg"};let c=i;exports.BaseBarcode=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("react"),h=require("prop-types"),x=require("./store/store.js"),z=require("./store/reducer.js"),I=require("./utils/common.js"),L=require("./BarcodeContext.js"),m=require("@progress/kendo-react-common"),P=require("./package-metadata.js");function _(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const a=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(o,s,a.get?a:{enumerable:!0,get:()=>t[s]})}}return o.default=t,Object.freeze(o)}const e=_(F),H={renderAs:"svg"},v=e.forwardRef((t,o)=>{const{renderAs:s=H.renderAs,style:a={},className:w,children:y,barcodeConstructor:M,deriveOptionsFromParent:O,getTarget:i}=t,l=e.useRef(null),r=e.useRef(null),u=e.useRef(null),E=e.useMemo(()=>!m.validatePackage(P.packageMetadata,{component:"Barcode"}),[]),N=e.useMemo(()=>m.getLicenseMessage(P.packageMetadata),[]),f=e.useMemo(()=>x.createStore(z.observersReducer),[]),T=e.useMemo(()=>({observersStore:f}),[f]),b=()=>{let n={renderAs:s};return O&&(n=O(n)),n},R=()=>{const n=b();r.current=new M(l.current,n,c=>{if(process.env.NODE_ENV!=="production")throw c;console.warn(c)})},k=()=>{if(r.current!==null){const n=b();r.current.setOptions(n)}},g=(n,c)=>{const p=f.getState();for(let d=0;d<p.length;d++)p[d].trigger(n,c)},B=()=>{r.current!==null&&(r.current.redraw(),g("render",{sender:i()}))},C=e.useRef(null);return e.useImperativeHandle(C,()=>({get barcodeInstance(){return r.current},get surface(){return null},get element(){return l.current}}),[]),e.useImperativeHandle(o,()=>C.current,[]),e.useEffect(()=>(R(),window.addEventListener("resize",B),g("render",{sender:i()}),()=>{r.current!==null&&(r.current.destroy(),r.current=null),window.removeEventListener("resize",B)}),[]),e.useEffect(()=>{if(u.current===null){u.current=t;return}const{children:n,deriveOptionsFromParent:c,getTarget:p,barcodeConstructor:d,className:W,renderAs:q,...A}=t,{children:G,deriveOptionsFromParent:V,getTarget:K,barcodeConstructor:J,className:Q,renderAs:S,...D}=u.current;if(r.current!==null){const j=I.isOptionsChanged(D,A);(q||"svg")!==(S||"svg")?(r.current!==null&&(r.current.destroy(),r.current=null),R()):j&&k(),g("render",{sender:i()})}u.current=t}),e.createElement(L.BarcodeContext.Provider,{value:T},e.createElement("div",{style:a,ref:l,className:w},y,E&&e.createElement(m.WatermarkOverlay,{message:N})))});v.propTypes={dir:h.string,renderAs:h.oneOf(["svg","canvas"])};v.displayName="KendoReactBaseBarcode";exports.BaseBarcode=v;

package/BaseBarcode.mjs

@@ -5,128 +5,97 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as n from "react";
-import i from "prop-types";
-import { createStore as g } from "./store/store.mjs";
-import { observersReducer as v } from "./store/reducer.mjs";
-import { isOptionsChanged as u } from "./utils/common.mjs";
-import { BarcodeContext as b } from "./BarcodeContext.mjs";
-import { validatePackage as f, getLicenseMessage as O, WatermarkOverlay as w } from "@progress/kendo-react-common";
-import { packageMetadata as a } from "./package-metadata.mjs";
-const o = class o extends n.Component {
-  constructor(e) {
-    super(e), this.barcodeInstance = null, this.surface = null, this._element = null, this.observersStore = {}, this.showLicenseWatermark = !1, this.onWindowResize = () => {
-      this.barcodeInstance !== null && (this.barcodeInstance.redraw(), this.trigger("render", { sender: this }));
-    }, this.showLicenseWatermark = !f(a, { component: "Barcode" }), this.licenseMessage = O(a), this.observersStore = g(v), this.contextValue = {
-      observersStore: this.observersStore
-    };
-  }
-  /**
-   * @hidden
-   */
-  get element() {
-    return this._element;
-  }
-  /**
-   * @hidden
-   */
-  componentDidMount() {
-    this.instantiateCoreBarcode(), window.addEventListener("resize", this.onWindowResize), this.trigger("render", { sender: this });
-  }
-  /**
-   * @hidden
-   */
-  componentDidUpdate(e) {
-    const {
-      children: r,
-      deriveOptionsFromParent: t,
-      getTarget: s,
-      barcodeConstructor: C,
-      className: I,
-      renderAs: d,
-      ...h
-    } = this.props, {
-      children: P,
-      deriveOptionsFromParent: W,
-      getTarget: E,
-      barcodeConstructor: S,
-      className: k,
-      renderAs: l,
-      ...p
-    } = e;
-    if (this.barcodeInstance !== null) {
-      const m = u(p, h);
-      (d || "svg") !== (l || "svg") ? (this.barcodeInstance !== null && (this.barcodeInstance.destroy(), this.barcodeInstance = null), this.instantiateCoreBarcode()) : m && this.refresh(), this.trigger("render", { sender: this });
-    }
-  }
-  /**
-   * @hidden
-   */
-  componentWillUnmount() {
-    this.barcodeInstance !== null && (this.barcodeInstance.destroy(), this.barcodeInstance = null), window.removeEventListener("resize", this.onWindowResize);
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const { style: e = {}, className: r, children: t } = this.props;
-    return /* @__PURE__ */ n.createElement(b.Provider, { value: this.contextValue }, /* @__PURE__ */ n.createElement(
-      "div",
-      {
-        style: e,
-        ref: (s) => {
-          this._element = s;
-        },
-        className: r
-      },
-      t,
-      this.showLicenseWatermark && /* @__PURE__ */ n.createElement(w, { message: this.licenseMessage })
-    ));
-  }
-  /**
-   * @hidden
-   */
-  instantiateCoreBarcode() {
-    const { barcodeConstructor: e } = this.props, r = this.getBarcodeOptions();
-    this.barcodeInstance = new e(this.element, r, (t) => {
+import * as e from "react";
+import O from "prop-types";
+import { createStore as I } from "./store/store.mjs";
+import { observersReducer as L } from "./store/reducer.mjs";
+import { isOptionsChanged as z } from "./utils/common.mjs";
+import { BarcodeContext as H } from "./BarcodeContext.mjs";
+import { validatePackage as S, getLicenseMessage as W, WatermarkOverlay as G } from "@progress/kendo-react-common";
+import { packageMetadata as R } from "./package-metadata.mjs";
+const V = {
+  renderAs: "svg"
+}, b = e.forwardRef((s, h) => {
+  const {
+    renderAs: C = V.renderAs,
+    style: B = {},
+    className: w,
+    children: P,
+    barcodeConstructor: E,
+    deriveOptionsFromParent: m,
+    getTarget: a
+  } = s, u = e.useRef(null), r = e.useRef(null), o = e.useRef(null), A = e.useMemo(() => !S(R, { component: "Barcode" }), []), N = e.useMemo(() => W(R), []), i = e.useMemo(() => I(L), []), y = e.useMemo(() => ({ observersStore: i }), [i]), f = () => {
+    let t = { renderAs: C };
+    return m && (t = m(t)), t;
+  }, p = () => {
+    const t = f();
+    r.current = new E(u.current, t, (n) => {
       if (process.env.NODE_ENV !== "production")
-        throw t;
-      console.warn(t);
+        throw n;
+      console.warn(n);
     });
-  }
-  /**
-   * @hidden
-   */
-  refresh() {
-    if (this.barcodeInstance !== null) {
-      const e = this.getBarcodeOptions();
-      this.barcodeInstance.setOptions(e);
+  }, M = () => {
+    if (r.current !== null) {
+      const t = f();
+      r.current.setOptions(t);
     }
-  }
-  /**
-   * @hidden
-   */
-  getBarcodeOptions() {
-    const { renderAs: e, deriveOptionsFromParent: r } = this.props;
-    let t = { renderAs: e };
-    return r && (t = r(t)), t;
-  }
-  /**
-   * @hidden
-   */
-  trigger(e, r) {
-    const t = this.observersStore.getState();
-    for (let s = 0; s < t.length; s++)
-      t[s].trigger(e, r);
-  }
-};
-o.propTypes = {
-  dir: i.string,
-  renderAs: i.oneOf(["svg", "canvas"])
-}, o.defaultProps = {
-  renderAs: "svg"
+  }, d = (t, n) => {
+    const l = i.getState();
+    for (let c = 0; c < l.length; c++)
+      l[c].trigger(t, n);
+  }, v = () => {
+    r.current !== null && (r.current.redraw(), d("render", { sender: a() }));
+  }, g = e.useRef(null);
+  return e.useImperativeHandle(
+    g,
+    () => ({
+      get barcodeInstance() {
+        return r.current;
+      },
+      get surface() {
+        return null;
+      },
+      get element() {
+        return u.current;
+      }
+    }),
+    []
+  ), e.useImperativeHandle(h, () => g.current, []), e.useEffect(() => (p(), window.addEventListener("resize", v), d("render", { sender: a() }), () => {
+    r.current !== null && (r.current.destroy(), r.current = null), window.removeEventListener("resize", v);
+  }), []), e.useEffect(() => {
+    if (o.current === null) {
+      o.current = s;
+      return;
+    }
+    const {
+      children: t,
+      deriveOptionsFromParent: n,
+      getTarget: l,
+      barcodeConstructor: c,
+      className: K,
+      renderAs: T,
+      ...F
+    } = s, {
+      children: _,
+      deriveOptionsFromParent: j,
+      getTarget: q,
+      barcodeConstructor: J,
+      className: Q,
+      renderAs: k,
+      ...x
+    } = o.current;
+    if (r.current !== null) {
+      const D = z(x, F);
+      (T || "svg") !== (k || "svg") ? (r.current !== null && (r.current.destroy(), r.current = null), p()) : D && M(), d("render", { sender: a() });
+    }
+    o.current = s;
+  }), /* @__PURE__ */ e.createElement(H.Provider, { value: y }, /* @__PURE__ */ e.createElement("div", { style: B, ref: u, className: w }, P, A && /* @__PURE__ */ e.createElement(G, { message: N })));
+});
+b.propTypes = {
+  dir: O.string,
+  renderAs: O.oneOf(["svg", "canvas"])
 };
-let c = o;
+b.displayName = "KendoReactBaseBarcode";
 export {
-  c as BaseBarcode
+  b as BaseBarcode
 };

package/BaseBarcodeHandle.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { Surface } from '@progress/kendo-drawing';
+/**
+ * @hidden
+ */
+export interface BaseBarcodeHandle {
+    /** @hidden */
+    barcodeInstance: any;
+    /** @hidden */
+    surface: Surface | null;
+    /** @hidden */
+    element: HTMLDivElement | null;
+}

package/QRCode.d.ts

@@ -6,50 +6,9 @@
  *-------------------------------------------------------------------------------------------
  */
 import { QRCodeProps } from './QRCodeProps';
-import { Surface, Group, ImageExportOptions, SVGExportOptions } from '@progress/kendo-drawing';
+import { QRCodeHandle } from './QRCodeHandle';
 import * as React from 'react';
 /**
  * Represents the KendoReact QRCode component.
  */
-export declare class QRCode extends React.Component<QRCodeProps, {}> {
-    private _baseBarcode;
-    /**
-     * @hidden
-     */
-    get barcodeInstance(): any;
-    /**
-     * Gets the Drawing `Surface` of the Barcode.
-     */
-    get surface(): Surface | null;
-    /**
-     * Gets the DOM element of the Barcode.
-     */
-    get element(): HTMLDivElement | null;
-    /**
-     * @hidden
-     */
-    render(): any;
-    /**
-     * Exports the component as an image. The export operation runs asynchronously and returns a promise.
-     *
-     * @param {ImageExportOptions} options - The parameters for the exported image.
-     * @returns {Promise<string>} - A promise that resolves with a PNG image encoded as a Data URI.
-     */
-    exportImage(options?: ImageExportOptions): Promise<string>;
-    /**
-     * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
-     *
-     * @param options - The parameters for the exported file.
-     * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
-     */
-    exportSVG(options?: SVGExportOptions): Promise<string>;
-    /**
-     * Exports a Barcode component as a Drawing `Scene`.
-     *
-     * @param {any} options - The parameters for the export operation.
-     * @returns {Group} A promise that returns the root `Group` of the scene.
-     */
-    exportVisual(options?: any): Group;
-    private getTarget;
-    private deriveOptionsFromParent;
-}
+export declare const QRCode: React.ForwardRefExoticComponent<QRCodeProps & React.RefAttributes<QRCodeHandle>>;

package/QRCode.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 i=require("react"),c=require("./BaseBarcode.js"),u=require("@progress/kendo-charts"),o=require("@progress/kendo-drawing"),d=require("@progress/kendo-react-common");function l(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const n=l(i),p="#000",h="#fff",b="L";class g extends n.Component{constructor(){super(...arguments),this._baseBarcode=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>Object.assign({},e,{background:this.props.background||h,border:this.props.border,color:this.props.color||p,encoding:this.props.encoding,errorCorrection:this.props.errorCorrection||b,overlay:this.props.overlay||{},padding:this.props.padding,renderAs:this.props.renderAs,size:this.props.size,value:this.props.value})}get barcodeInstance(){return this._baseBarcode!==null?this._baseBarcode.barcodeInstance:null}get surface(){return this._baseBarcode!==null?this._baseBarcode.surface:null}get element(){return this._baseBarcode!==null?this._baseBarcode.element:null}render(){const{children:e,className:t,...s}=this.props;return n.createElement(c.BaseBarcode,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:a=>{this._baseBarcode=a},barcodeConstructor:u.QRCode,getTarget:this.getTarget,className:d.classNames("k-qrcode",t)},e)}exportImage(e={}){return o.exportImage(this.exportVisual(),e)}exportSVG(e={}){return o.exportSVG(this.exportVisual(),e)}exportVisual(e){return this.barcodeInstance!==null?this.barcodeInstance.exportVisual(e):new o.Group}}exports.QRCode=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),v=require("./BaseBarcode.js"),x=require("@progress/kendo-charts"),d=require("@progress/kendo-drawing"),E=require("@progress/kendo-react-common");function I(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const s=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(a,o,s.get?s:{enumerable:!0,get:()=>e[o]})}}return a.default=e,Object.freeze(a)}const n=I(k),y="#000",q="#fff",B="L",b=n.forwardRef((e,a)=>{const{children:o,className:s,...m}=e,u=n.useRef(null),i=n.useRef(e);i.current=e;const c=n.useCallback(r=>{var R;const t=(R=u.current)==null?void 0:R.barcodeInstance;return t!=null?t.exportVisual(r):new d.Group},[]),g=n.useCallback((r={})=>d.exportImage(c(),r),[c]),f=n.useCallback((r={})=>d.exportSVG(c(),r),[c]),l=n.useRef(null);n.useImperativeHandle(l,()=>({get element(){var r,t;return(t=(r=u.current)==null?void 0:r.element)!=null?t:null},get props(){return i.current},get barcodeInstance(){var r,t;return(t=(r=u.current)==null?void 0:r.barcodeInstance)!=null?t:null},get surface(){var r,t;return(t=(r=u.current)==null?void 0:r.surface)!=null?t:null},exportImage:g,exportSVG:f,exportVisual:c}),[g,f,c]),n.useImperativeHandle(a,()=>l.current,[]);const C=()=>l.current,O=r=>({...r,background:e.background||q,border:e.border,color:e.color||y,encoding:e.encoding,errorCorrection:e.errorCorrection||B,overlay:e.overlay||{},padding:e.padding,renderAs:e.renderAs,size:e.size,value:e.value});return n.createElement(v.BaseBarcode,{...m,deriveOptionsFromParent:O,ref:u,barcodeConstructor:x.QRCode,getTarget:C,className:E.classNames("k-qrcode",s)},o)});b.displayName="KendoReactQRCode";exports.QRCode=b;

package/QRCode.mjs

@@ -5,93 +5,76 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as e from "react";
-import { BaseBarcode as a } from "./BaseBarcode.mjs";
-import { QRCode as n } from "@progress/kendo-charts";
-import { exportImage as i, exportSVG as c, Group as p } from "@progress/kendo-drawing";
-import { classNames as d } from "@progress/kendo-react-common";
-const u = "#000", l = "#fff", h = "L";
-class _ extends e.Component {
-  constructor() {
-    super(...arguments), this._baseBarcode = null, this.getTarget = () => this, this.deriveOptionsFromParent = (r) => Object.assign({}, r, {
-      background: this.props.background || l,
-      border: this.props.border,
-      color: this.props.color || u,
-      encoding: this.props.encoding,
-      errorCorrection: this.props.errorCorrection || h,
-      overlay: this.props.overlay || {},
-      padding: this.props.padding,
-      renderAs: this.props.renderAs,
-      size: this.props.size,
-      value: this.props.value
-    });
-  }
-  /**
-   * @hidden
-   */
-  get barcodeInstance() {
-    return this._baseBarcode !== null ? this._baseBarcode.barcodeInstance : null;
-  }
-  /**
-   * Gets the Drawing `Surface` of the Barcode.
-   */
-  get surface() {
-    return this._baseBarcode !== null ? this._baseBarcode.surface : null;
-  }
-  /**
-   * Gets the DOM element of the Barcode.
-   */
-  get element() {
-    return this._baseBarcode !== null ? this._baseBarcode.element : null;
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const { children: r, className: t, ...s } = this.props;
-    return /* @__PURE__ */ e.createElement(
-      a,
-      {
-        ...s,
-        deriveOptionsFromParent: this.deriveOptionsFromParent,
-        ref: (o) => {
-          this._baseBarcode = o;
-        },
-        barcodeConstructor: n,
-        getTarget: this.getTarget,
-        className: d("k-qrcode", t)
+import * as n from "react";
+import { BaseBarcode as b } from "./BaseBarcode.mjs";
+import { QRCode as x } from "@progress/kendo-charts";
+import { Group as E, exportImage as I, exportSVG as v } from "@progress/kendo-drawing";
+import { classNames as O } from "@progress/kendo-react-common";
+const k = "#000", A = "#fff", N = "L", V = n.forwardRef((r, i) => {
+  const { children: m, className: f, ...R } = r, a = n.useRef(null), u = n.useRef(r);
+  u.current = r;
+  const o = n.useCallback((e) => {
+    var d;
+    const t = (d = a.current) == null ? void 0 : d.barcodeInstance;
+    return t != null ? t.exportVisual(e) : new E();
+  }, []), s = n.useCallback(
+    (e = {}) => I(o(), e),
+    [o]
+  ), l = n.useCallback(
+    (e = {}) => v(o(), e),
+    [o]
+  ), c = n.useRef(null);
+  n.useImperativeHandle(
+    c,
+    () => ({
+      get element() {
+        var e, t;
+        return (t = (e = a.current) == null ? void 0 : e.element) != null ? t : null;
       },
-      r
-    );
-  }
-  /**
-   * Exports the component as an image. The export operation runs asynchronously and returns a promise.
-   *
-   * @param {ImageExportOptions} options - The parameters for the exported image.
-   * @returns {Promise<string>} - A promise that resolves with a PNG image encoded as a Data URI.
-   */
-  exportImage(r = {}) {
-    return i(this.exportVisual(), r);
-  }
-  /**
-   * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
-   *
-   * @param options - The parameters for the exported file.
-   * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
-   */
-  exportSVG(r = {}) {
-    return c(this.exportVisual(), r);
-  }
-  /**
-   * Exports a Barcode component as a Drawing `Scene`.
-   *
-   * @param {any} options - The parameters for the export operation.
-   * @returns {Group} A promise that returns the root `Group` of the scene.
-   */
-  exportVisual(r) {
-    return this.barcodeInstance !== null ? this.barcodeInstance.exportVisual(r) : new p();
-  }
-}
+      get props() {
+        return u.current;
+      },
+      get barcodeInstance() {
+        var e, t;
+        return (t = (e = a.current) == null ? void 0 : e.barcodeInstance) != null ? t : null;
+      },
+      get surface() {
+        var e, t;
+        return (t = (e = a.current) == null ? void 0 : e.surface) != null ? t : null;
+      },
+      exportImage: s,
+      exportSVG: l,
+      exportVisual: o
+    }),
+    [s, l, o]
+  ), n.useImperativeHandle(i, () => c.current, []);
+  const g = () => c.current, C = (e) => ({
+    ...e,
+    background: r.background || A,
+    border: r.border,
+    color: r.color || k,
+    encoding: r.encoding,
+    errorCorrection: r.errorCorrection || N,
+    overlay: r.overlay || {},
+    padding: r.padding,
+    renderAs: r.renderAs,
+    size: r.size,
+    value: r.value
+  });
+  return /* @__PURE__ */ n.createElement(
+    b,
+    {
+      ...R,
+      deriveOptionsFromParent: C,
+      ref: a,
+      barcodeConstructor: x,
+      getTarget: g,
+      className: O("k-qrcode", f)
+    },
+    m
+  );
+});
+V.displayName = "KendoReactQRCode";
 export {
-  _ as QRCode
+  V as QRCode
 };

package/QRCodeHandle.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { Surface, Group, ImageExportOptions, SVGExportOptions } from '@progress/kendo-drawing';
+import { QRCodeProps } from './QRCodeProps';
+/**
+ * Represents the `ref` of the QRCode component.
+ */
+export interface QRCodeHandle {
+    /** The current root DOM element or `null`. */
+    element: HTMLDivElement | null;
+    /** The props of the QRCode component. */
+    readonly props: Readonly<QRCodeProps>;
+    /**
+     * @hidden
+     */
+    barcodeInstance: any;
+    /**
+     * Gets the Drawing `Surface` of the QRCode.
+     */
+    surface: Surface | null;
+    /**
+     * Exports the component as an image. The export operation runs asynchronously and returns a promise.
+     *
+     * @param options - The parameters for the exported image.
+     * @returns A promise that resolves with a PNG image encoded as a Data URI.
+     */
+    exportImage: (options?: ImageExportOptions) => Promise<string>;
+    /**
+     * Exports the component as an SVG document. The export operation runs asynchronously and returns a promise.
+     *
+     * @param options - The parameters for the exported file.
+     * @returns A promise that resolves with an SVG document that is encoded as a Data URI.
+     */
+    exportSVG: (options?: SVGExportOptions) => Promise<string>;
+    /**
+     * Exports a QRCode component as a Drawing `Scene`.
+     *
+     * @param options - The parameters for the export operation.
+     * @returns The root `Group` of the scene.
+     */
+    exportVisual: (options?: any) => Group;
+}

package/common/barcodes.d.ts

@@ -5,7 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { Barcode } from './../Barcode.js';
-import { QRCode } from './../QRCode.js';
-type Barcodes = Barcode | QRCode;
+import { BarcodeHandle } from './../BarcodeHandle';
+import { QRCodeHandle } from './../QRCodeHandle';
+type Barcodes = BarcodeHandle | QRCodeHandle;
 export { Barcodes };

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

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-charts"),require("@progress/kendo-drawing")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-charts","@progress/kendo-drawing"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactBarcodes={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoCharts,e.KendoDrawing)}(this,function(e,t,r,s,n,o){"use strict";function a(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(r){if("default"!==r){var s=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,s.get?s:{enumerable:!0,get:function(){return e[r]}})}}),t.default=e,Object.freeze(t)}var i=a(t);const c=1e3/60,d=(e,t)=>{if(!t.type)return[];switch(t.type){case"add":return[...e,t.payload];case"remove":return e.filter(e=>e!==t.payload);default:return e}},l=e=>"object"==typeof e,p=(e,t)=>{if(Object.keys(e).length!==Object.keys(t).length)return!0;for(const r in e)if(e.hasOwnProperty(r)){const s=e[r],n=t[r];if(l(s)&&l(n)?p(s,n):s!==n)return!0}return!1},h=(e,t)=>{if(!e||!t||(e=[].concat(e),t=[].concat(t),e.length!==t.length))return!0;for(let r=0;r<e.length;r++)if(p(e[r],t[r]))return!0;return!1},u=i.createContext(null);u.displayName="BarcodeContext";const g=Object.freeze({name:"@progress/kendo-react-barcodes",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.2.0-develop.1",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),b=class extends i.Component{constructor(e){super(e),this.barcodeInstance=null,this.surface=null,this._element=null,this.observersStore={},this.showLicenseWatermark=!1,this.onWindowResize=()=>{null!==this.barcodeInstance&&(this.barcodeInstance.redraw(),this.trigger("render",{sender:this}))},this.showLicenseWatermark=!s.validatePackage(g,{component:"Barcode"}),this.licenseMessage=s.getLicenseMessage(g),this.observersStore=(e=>{let t,r,n=[];const o=o=>{t=e(t,o),s.canUseDOM&&(window.clearTimeout(r),r=window.setTimeout(()=>n.forEach(e=>e()),c))};return o({}),{getState:()=>t,dispatch:o,subscribe:e=>(n.push(e),()=>n=n.filter(t=>t!==e))}})(d),this.contextValue={observersStore:this.observersStore}}get element(){return this._element}componentDidMount(){this.instantiateCoreBarcode(),window.addEventListener("resize",this.onWindowResize),this.trigger("render",{sender:this})}componentDidUpdate(e){const{children:t,deriveOptionsFromParent:r,getTarget:s,barcodeConstructor:n,className:o,renderAs:a,...i}=this.props,{children:c,deriveOptionsFromParent:d,getTarget:l,barcodeConstructor:p,className:u,renderAs:g,...b}=e;if(null!==this.barcodeInstance){const e=h(b,i);(a||"svg")!==(g||"svg")?(null!==this.barcodeInstance&&(this.barcodeInstance.destroy(),this.barcodeInstance=null),this.instantiateCoreBarcode()):e&&this.refresh(),this.trigger("render",{sender:this})}}componentWillUnmount(){null!==this.barcodeInstance&&(this.barcodeInstance.destroy(),this.barcodeInstance=null),window.removeEventListener("resize",this.onWindowResize)}render(){const{style:e={},className:t,children:r}=this.props;return i.createElement(u.Provider,{value:this.contextValue},i.createElement("div",{style:e,ref:e=>{this._element=e},className:t},r,this.showLicenseWatermark&&i.createElement(s.WatermarkOverlay,{message:this.licenseMessage})))}instantiateCoreBarcode(){const{barcodeConstructor:e}=this.props,t=this.getBarcodeOptions();this.barcodeInstance=new e(this.element,t,e=>{if("production"!==process.env.NODE_ENV)throw e;console.warn(e)})}refresh(){if(null!==this.barcodeInstance){const e=this.getBarcodeOptions();this.barcodeInstance.setOptions(e)}}getBarcodeOptions(){const{renderAs:e,deriveOptionsFromParent:t}=this.props;let r={renderAs:e};return t&&(r=t(r)),r}trigger(e,t){const r=this.observersStore.getState();for(let s=0;s<r.length;s++)r[s].trigger(e,t)}};b.propTypes={dir:r.string,renderAs:r.oneOf(["svg","canvas"])},b.defaultProps={renderAs:"svg"};let m=b;class f extends i.Component{constructor(){super(...arguments),this._baseBarcode=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>Object.assign({},e,{background:this.props.background,border:this.props.border,checksum:this.props.checksum,color:this.props.color,height:this.props.height,padding:this.props.padding,text:this.props.text,type:this.props.type,value:this.props.value,width:this.props.width})}get barcodeInstance(){return null!==this._baseBarcode?this._baseBarcode.barcodeInstance:null}get surface(){return null!==this._baseBarcode?this._baseBarcode.surface:null}get element(){return null!==this._baseBarcode?this._baseBarcode.element:null}render(){const{children:e,className:t,...r}=this.props;return i.createElement(m,{...r,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseBarcode=e},barcodeConstructor:n.Barcode,getTarget:this.getTarget,className:s.classNames("k-barcode",t)},e)}exportImage(e={}){return o.exportImage(this.exportVisual(),e)}exportSVG(e={}){return o.exportSVG(this.exportVisual(),e)}exportVisual(e){return null!==this.barcodeInstance?this.barcodeInstance.exportVisual(e):new o.Group}}class v extends i.Component{constructor(){super(...arguments),this._baseBarcode=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>Object.assign({},e,{background:this.props.background||"#fff",border:this.props.border,color:this.props.color||"#000",encoding:this.props.encoding,errorCorrection:this.props.errorCorrection||"L",overlay:this.props.overlay||{},padding:this.props.padding,renderAs:this.props.renderAs,size:this.props.size,value:this.props.value})}get barcodeInstance(){return null!==this._baseBarcode?this._baseBarcode.barcodeInstance:null}get surface(){return null!==this._baseBarcode?this._baseBarcode.surface:null}get element(){return null!==this._baseBarcode?this._baseBarcode.element:null}render(){const{children:e,className:t,...r}=this.props;return i.createElement(m,{...r,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseBarcode=e},barcodeConstructor:n.QRCode,getTarget:this.getTarget,className:s.classNames("k-qrcode",t)},e)}exportImage(e={}){return o.exportImage(this.exportVisual(),e)}exportSVG(e={}){return o.exportSVG(this.exportVisual(),e)}exportVisual(e){return null!==this.barcodeInstance?this.barcodeInstance.exportVisual(e):new o.Group}}e.Barcode=f,e.QRCode=v});
+!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-charts"),require("@progress/kendo-drawing")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-charts","@progress/kendo-drawing"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactBarcodes={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoCharts,e.KendoDrawing)}(this,function(e,r,t,n,o,c){"use strict";function a(e){var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,Object.freeze(r)}var s=a(r);const u=1e3/60,l=(e,r)=>{if(!r.type)return[];switch(r.type){case"add":return[...e,r.payload];case"remove":return e.filter(e=>e!==r.payload);default:return e}},d=e=>"object"==typeof e,i=(e,r)=>{if(Object.keys(e).length!==Object.keys(r).length)return!0;for(const t in e)if(e.hasOwnProperty(t)){const n=e[t],o=r[t];if(d(n)&&d(o)?i(n,o):n!==o)return!0}return!1},p=(e,r)=>{if(!e||!r||(e=[].concat(e),r=[].concat(r),e.length!==r.length))return!0;for(let t=0;t<e.length;t++)if(i(e[t],r[t]))return!0;return!1},f=s.createContext(null);f.displayName="BarcodeContext";const g=Object.freeze({name:"@progress/kendo-react-barcodes",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.2.0-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),m={renderAs:"svg"},v=s.forwardRef((e,r)=>{const{renderAs:t=m.renderAs,style:o={},className:c,children:a,barcodeConstructor:d,deriveOptionsFromParent:i,getTarget:v}=e,b=s.useRef(null),h=s.useRef(null),y=s.useRef(null),k=s.useMemo(()=>!n.validatePackage(g,{component:"Barcode"}),[]),w=s.useMemo(()=>n.getLicenseMessage(g),[]),R=s.useMemo(()=>(e=>{let r,t,o=[];const c=c=>{r=e(r,c),n.canUseDOM&&(window.clearTimeout(t),t=window.setTimeout(()=>o.forEach(e=>e()),u))};return c({}),{getState:()=>r,dispatch:c,subscribe:e=>(o.push(e),()=>o=o.filter(r=>r!==e))}})(l),[]),C=s.useMemo(()=>({observersStore:R}),[R]),O=()=>{let e={renderAs:t};return i&&(e=i(e)),e},I=()=>{const e=O();h.current=new d(b.current,e,e=>{if("production"!==process.env.NODE_ENV)throw e;console.warn(e)})},N=(e,r)=>{const t=R.getState();for(let n=0;n<t.length;n++)t[n].trigger(e,r)},x=()=>{null!==h.current&&(h.current.redraw(),N("render",{sender:v()}))},E=s.useRef(null);return s.useImperativeHandle(E,()=>({get barcodeInstance(){return h.current},get surface(){return null},get element(){return b.current}}),[]),s.useImperativeHandle(r,()=>E.current,[]),s.useEffect(()=>(I(),window.addEventListener("resize",x),N("render",{sender:v()}),()=>{null!==h.current&&(h.current.destroy(),h.current=null),window.removeEventListener("resize",x)}),[]),s.useEffect(()=>{if(null===y.current)return void(y.current=e);const{children:r,deriveOptionsFromParent:t,getTarget:n,barcodeConstructor:o,className:c,renderAs:a,...s}=e,{children:u,deriveOptionsFromParent:l,getTarget:d,barcodeConstructor:i,className:f,renderAs:g,...m}=y.current;if(null!==h.current){const e=p(m,s);(a||"svg")!==(g||"svg")?(null!==h.current&&(h.current.destroy(),h.current=null),I()):e&&(()=>{if(null!==h.current){const e=O();h.current.setOptions(e)}})(),N("render",{sender:v()})}y.current=e}),s.createElement(f.Provider,{value:C},s.createElement("div",{style:o,ref:b,className:c},a,k&&s.createElement(n.WatermarkOverlay,{message:w})))});v.propTypes={dir:t.string,renderAs:t.oneOf(["svg","canvas"])},v.displayName="KendoReactBaseBarcode";const b=s.forwardRef((e,r)=>{const{children:t,className:a,...u}=e,l=s.useRef(null),d=s.useRef(e);d.current=e;const i=s.useCallback(e=>{var r;const t=null==(r=l.current)?void 0:r.barcodeInstance;return null!=t?t.exportVisual(e):new c.Group},[]),p=s.useCallback((e={})=>c.exportImage(i(),e),[i]),f=s.useCallback((e={})=>c.exportSVG(i(),e),[i]),g=s.useRef(null);s.useImperativeHandle(g,()=>({get element(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.element)?r:null},get props(){return d.current},get barcodeInstance(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.barcodeInstance)?r:null},get surface(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.surface)?r:null},exportImage:p,exportSVG:f,exportVisual:i}),[p,f,i]),s.useImperativeHandle(r,()=>g.current,[]);return s.createElement(v,{...u,deriveOptionsFromParent:r=>({...r,background:e.background,border:e.border,checksum:e.checksum,color:e.color,height:e.height,padding:e.padding,text:e.text,type:e.type,value:e.value,width:e.width}),ref:l,barcodeConstructor:o.Barcode,getTarget:()=>g.current,className:n.classNames("k-barcode",a)},t)});b.displayName="KendoReactBarcode";const h=s.forwardRef((e,r)=>{const{children:t,className:a,...u}=e,l=s.useRef(null),d=s.useRef(e);d.current=e;const i=s.useCallback(e=>{var r;const t=null==(r=l.current)?void 0:r.barcodeInstance;return null!=t?t.exportVisual(e):new c.Group},[]),p=s.useCallback((e={})=>c.exportImage(i(),e),[i]),f=s.useCallback((e={})=>c.exportSVG(i(),e),[i]),g=s.useRef(null);s.useImperativeHandle(g,()=>({get element(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.element)?r:null},get props(){return d.current},get barcodeInstance(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.barcodeInstance)?r:null},get surface(){var e,r;return null!=(r=null==(e=l.current)?void 0:e.surface)?r:null},exportImage:p,exportSVG:f,exportVisual:i}),[p,f,i]),s.useImperativeHandle(r,()=>g.current,[]);return s.createElement(v,{...u,deriveOptionsFromParent:r=>({...r,background:e.background||"#fff",border:e.border,color:e.color||"#000",encoding:e.encoding,errorCorrection:e.errorCorrection||"L",overlay:e.overlay||{},padding:e.padding,renderAs:e.renderAs,size:e.size,value:e.value}),ref:l,barcodeConstructor:o.QRCode,getTarget:()=>g.current,className:n.classNames("k-qrcode",a)},t)});h.displayName="KendoReactQRCode",e.Barcode=b,e.QRCode=h});

package/index.d.mts

@@ -6,8 +6,10 @@
  *-------------------------------------------------------------------------------------------
  */
 import { Barcode } from './Barcode.js';
+import { BarcodeHandle } from './BarcodeHandle';
 import { BarcodeProps } from './BarcodeProps';
 import { QRCode } from './QRCode.js';
+import { QRCodeHandle } from './QRCodeHandle';
 import { QRCodeProps } from './QRCodeProps';
 export * from './types';
-export { Barcode, BarcodeProps, QRCode, QRCodeProps };
+export { Barcode, BarcodeHandle, BarcodeProps, QRCode, QRCodeHandle, QRCodeProps };

package/index.d.ts

@@ -6,8 +6,10 @@
  *-------------------------------------------------------------------------------------------
  */
 import { Barcode } from './Barcode.js';
+import { BarcodeHandle } from './BarcodeHandle';
 import { BarcodeProps } from './BarcodeProps';
 import { QRCode } from './QRCode.js';
+import { QRCodeHandle } from './QRCodeHandle';
 import { QRCodeProps } from './QRCodeProps';
 export * from './types';
-export { Barcode, BarcodeProps, QRCode, QRCodeProps };
+export { Barcode, BarcodeHandle, BarcodeProps, QRCode, QRCodeHandle, QRCodeProps };

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-barcodes",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1784273818,version:"15.2.0-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-barcodes",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1785775471,version:"15.2.0-develop.3",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = Object.freeze({
     productName: 'KendoReact',
     productCode: 'KENDOUIREACT',
     productCodes: ['KENDOUIREACT'],
-    publishDate: 1784273818,
-    version: '15.2.0-develop.1',
+    publishDate: 1785775471,
+    version: '15.2.0-develop.3',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-barcodes",
-  "version": "15.2.0-develop.1",
+  "version": "15.2.0-develop.3",
   "description": "React Barcodes provide a set of React components to build beautiful and customizable barcodes. KendoReact Barcodes package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -25,11 +25,11 @@
   },
   "sideEffects": false,
   "peerDependencies": {
-    "@progress/kendo-charts": "2.12.2",
+    "@progress/kendo-charts": "2.13.0",
     "@progress/kendo-drawing": "^1.21.2",
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-react-common": "15.2.0-develop.1",
-    "@progress/kendo-react-intl": "15.2.0-develop.1",
+    "@progress/kendo-react-common": "15.2.0-develop.3",
+    "@progress/kendo-react-intl": "15.2.0-develop.3",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
@@ -56,7 +56,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1784273818,
+      "publishDate": 1785775471,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },