@progress/kendo-vue-layout 6.4.0-develop.3 → 6.4.0-develop.5

package/README.md

@@ -21,6 +21,7 @@ Among the many features which the Kendo UI for Vue Layout deliver are:
 * [AppBar component](https://www.telerik.com/kendo-vue-ui/components/layout/appbar/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
 * [Avatar component](https://www.telerik.com/kendo-vue-ui/components/layout/avatar/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
 * [BottomNavigation component](https://www.telerik.com/kendo-vue-ui/components/layout/bottomnavigation/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
+* [Breadcrumb component](https://www.telerik.com/kendo-vue-ui/components/layout/breadcrumb/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
 * [Card component](https://www.telerik.com/kendo-vue-ui/components/layout/card/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
 * [ContextMenu component](https://www.telerik.com/kendo-vue-ui/components/layout/context-menu/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)
 * [Drawer component](https://www.telerik.com/kendo-vue-ui/components/layout/drawer/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-vue-trial-npm-layout)

package/breadcrumb/Breadcrumb.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 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 d=require("vue"),w=require("../package-metadata.js"),r=require("@progress/kendo-vue-common"),I=require("./BreadcrumbOrderedList.js"),f=require("./BreadcrumbListItem.js"),x=require("./BreadcrumbDelimiter.js"),g=require("./BreadcrumbLink.js");function R(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!d.isVNode(e)}const F=d.defineComponent({name:"KendoBreadcrumb",emits:{select:null,keydown:null},props:{id:String,tabIndex:Number,disabled:Boolean,collapseMode:{type:String,default:"auto",validator:function(e){return["auto","wrap","none"].includes(e)}},ariaLabel:{type:String,default:"Breadcrumb"},breadcrumbOrderedList:[Object,Function,String],breadcrumbListItem:[Object,Function,String],breadcrumbDelimiter:[Object,Function,String],breadcrumbLink:[Object,Function,String],dataItems:{type:Array,default:[]},size:{type:String,default:"medium"},dir:{type:String,default:void 0},valueField:{type:String,default:"id"},textField:{type:String,default:"text"},svgIconField:{type:String,default:"svgIcon"},iconField:{type:String,default:"icon"},onSelect:Function,onKeydown:Function},created(){this.observer=null,r.validatePackage(w.packageMetadata)},data(){return{currentDir:"ltr",localData:[...this.dataItems],listItems:[],itemsData:[],addDelimiter:!1}},computed:{itemClasses(){const{disabled:e,size:i,collapseMode:a}=this.$props;return{"k-breadcrumb":!0,"k-rtl":this.currentDir==="rtl","k-disabled":e,"k-breadcrumb-md":!i,"k-breadcrumb-wrap":a==="wrap",[`k-breadcrumb-${r.kendoThemeMaps.sizeMap[i]||i}`]:i}}},setup(){return{breadcrumbRef:d.ref(null)}},mounted(){this.currentDir=r.getDir(this.$el,this.$props.dir),this.listItems=this.breadcrumbRef.querySelectorAll("li"),this.itemsData=Array.from(this.listItems).map((e,i)=>({id:i,name:e.innerText,width:e.offsetWidth,visible:!0})),this.resizeObserver=r.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),this.breadcrumbRef&&this.resizeObserver&&(this.resizeObserver.observe(this.breadcrumbRef),this.$nextTick(()=>{this.calculateMedia()}))},unmounted(){document!=null&&document.body&&this.resizeObserver&&this.resizeObserver.disconnect()},render(){let e;const{id:i,dir:a,tabIndex:t,collapseMode:l,disabled:u,ariaLabel:y,valueField:o,svgIconField:m,iconField:b,textField:n}=this.$props,S=r.templateRendering.call(this,this.$props.breadcrumbDelimiter,r.getListeners.call(this)),c=this.$props.breadcrumbDelimiter?r.getTemplate.call(this,{h:d.h,template:S,additionalProps:{dir:this.currentDir,tabIndex:t}}):d.createVNode(x.BreadcrumbDelimiter,{dir:this.currentDir,tabIndex:t},null),D=r.templateRendering.call(this,this.$props.breadcrumbLink,r.getListeners.call(this)),L=d.createVNode(g.BreadcrumbLink,{id:this.localData[0][o],isLast:this.localData.length-1===0,isFirst:!0,tabIndex:t,svgIcon:this.localData[0][m]||void 0,icon:this.localData[0][b]||void 0,text:this.localData[0][n]?String(this.localData[0][n]):void 0,disabled:this.localData[0].disabled,onSelect:this.handleSelect,onKeydown:this.handleKeyDown},null),p=r.getTemplate.call(this,{h:d.h,template:D,defaultRendering:L,additionalProps:{id:this.localData[0][o],isLast:this.localData.length-1===0,isFirst:!0,tabIndex:t,svgIcon:this.localData[0][m]||void 0,icon:this.localData[0][b]||void 0,text:this.localData[0][n]?String(this.localData[0][n]):void 0,disabled:this.localData[0].disabled,onSelect:this.handleSelect,onKeydown:this.handleKeyDown},defaultSlots:c});return d.createVNode("nav",{id:i,ref:s=>this.breadcrumbRef=s,tabindex:r.getTabIndex(t,u),dir:this.currentDir,"aria-label":y,class:this.itemClasses},[l==="wrap"&&d.createVNode(I.BreadcrumbOrderedList,{rootItem:!0,dir:a,tabIndex:t},{default:()=>[d.createVNode(f.BreadcrumbListItem,{key:this.localData[0][o],isFirstItem:!0,isLastItem:this.dataItems.length-1===0},{default:()=>[p,this.localData.length>1&&c,this.addDelimiter&&l==="auto"&&c]})]}),d.createVNode(I.BreadcrumbOrderedList,{dir:a,tabIndex:t,collapseMode:this.$props.collapseMode},R(e=this.localData.map((s,h)=>{if(h===0&&l!=="wrap")return d.createVNode(f.BreadcrumbListItem,{key:this.localData[0][o],isFirstItem:!0,isLastItem:this.localData.length-1===0},{default:()=>[p,c,this.addDelimiter&&l==="auto"&&c]});if(h>0){const k=d.createVNode(g.BreadcrumbLink,{id:s[o],isLast:this.localData.length-1===h,isFirst:!1,tabIndex:t,svgIcon:s[m]||void 0,icon:s[b]||void 0,text:s[n]?String(s[n]):void 0,disabled:s.disabled,onSelect:this.handleSelect,onKeydown:this.handleKeyDown},null),v=r.getTemplate.call(this,{h:d.h,template:D,defaultRendering:k,additionalProps:{id:s[o],isLast:this.localData.length-1===h,isFirst:!1,tabIndex:t,svgIcon:s[m]||void 0,icon:s[b]||void 0,text:s[n]?String(s[n]):void 0,disabled:s.disabled,onSelect:this.handleSelect,onKeydown:this.handleKeyDown}});return d.createVNode(f.BreadcrumbListItem,{key:s[o],isFirstItem:!1,isLastItem:this.localData.length-1===h},{default:()=>[v,h!==this.localData.length-1&&c]})}}))?e:{default:()=>[e]})])},methods:{getLastHiddenItemWidth(){const e=this.itemsData.slice().reverse().findIndex(i=>i.id!==0&&i.visible===!1);if(e!==-1){const i=this.itemsData.length-1-e,a=this.itemsData[i].width;return[i,a]}return[-1,0]},calculateMedia(){if(this.breadcrumbRef.offsetWidth){this.listItems=this.breadcrumbRef.querySelectorAll("li");let e=this.itemsData.reduce((t,l)=>l.visible?t+l.width:t,0);for(;this.breadcrumbRef.offsetWidth+1<e&&this.collapseMode==="auto";){const t=this.itemsData.findIndex(u=>u.id!==0&&u.visible===!0);this.itemsData[t].visible=!1,this.listItems[t].style.display="none";const l=this.itemsData[t].width;e=e-l,this.addDelimiter=!0}let[i,a]=this.getLastHiddenItemWidth();if(i!==-1)for(;this.breadcrumbRef.offsetWidth-1>e+a&&this.addDelimiter&&(this.itemsData[i].visible=!0,this.listItems[i].style.display="",e=e+a,this.addDelimiter=this.itemsData.findIndex(t=>t.visible===!1)!==-1,[i,a]=this.getLastHiddenItemWidth(),i!==-1););(this.collapseMode==="wrap"||this.collapseMode==="none")&&(this.listItems.forEach(t=>{t.style.display=""}),this.itemsData.forEach(t=>{t.visible=!0}))}},handleSelect(e){const i=this.dataItems.findIndex(t=>t.id===e.id),a=this.dataItems.slice(0,i+1);this.localData=a,this.itemsData=a,this.$emit("select",{event:e,id:e.id})},handleKeyDown(e){if(e.event.key==="Enter"){const i=this.dataItems.findIndex(t=>t.id===e.id),a=this.dataItems.slice(0,i+1);this.localData=a,this.itemsData=a}this.$emit("keydown",{event:e,id:e.id})}}});exports.Breadcrumb=F;

package/breadcrumb/Breadcrumb.mjs

@@ -0,0 +1,297 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as R, ref as O, h as b, createVNode as l, isVNode as M } from "vue";
+import { packageMetadata as $ } from "../package-metadata.mjs";
+import { validatePackage as K, kendoThemeMaps as W, getDir as z, canUseDOM as B, templateRendering as g, getListeners as y, getTemplate as f, getTabIndex as j } from "@progress/kendo-vue-common";
+import { BreadcrumbOrderedList as S } from "./BreadcrumbOrderedList.mjs";
+import { BreadcrumbListItem as p } from "./BreadcrumbListItem.mjs";
+import { BreadcrumbDelimiter as H } from "./BreadcrumbDelimiter.mjs";
+import { BreadcrumbLink as w } from "./BreadcrumbLink.mjs";
+function T(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !M(e);
+}
+const _ = /* @__PURE__ */ R({
+  name: "KendoBreadcrumb",
+  emits: {
+    select: null,
+    keydown: null
+  },
+  props: {
+    id: String,
+    tabIndex: Number,
+    disabled: Boolean,
+    collapseMode: {
+      type: String,
+      default: "auto",
+      validator: function(e) {
+        return ["auto", "wrap", "none"].includes(e);
+      }
+    },
+    ariaLabel: {
+      type: String,
+      default: "Breadcrumb"
+    },
+    breadcrumbOrderedList: [Object, Function, String],
+    breadcrumbListItem: [Object, Function, String],
+    breadcrumbDelimiter: [Object, Function, String],
+    breadcrumbLink: [Object, Function, String],
+    dataItems: {
+      type: Array,
+      default: []
+    },
+    size: {
+      type: String,
+      default: "medium"
+    },
+    dir: {
+      type: String,
+      default: void 0
+    },
+    valueField: {
+      type: String,
+      default: "id"
+    },
+    textField: {
+      type: String,
+      default: "text"
+    },
+    svgIconField: {
+      type: String,
+      default: "svgIcon"
+    },
+    iconField: {
+      type: String,
+      default: "icon"
+    },
+    onSelect: Function,
+    onKeydown: Function
+  },
+  created() {
+    this.observer = null, K($);
+  },
+  data() {
+    return {
+      currentDir: "ltr",
+      localData: [...this.dataItems],
+      listItems: [],
+      itemsData: [],
+      addDelimiter: !1
+    };
+  },
+  computed: {
+    itemClasses() {
+      const {
+        disabled: e,
+        size: i,
+        collapseMode: a
+      } = this.$props;
+      return {
+        "k-breadcrumb": !0,
+        "k-rtl": this.currentDir === "rtl",
+        "k-disabled": e,
+        "k-breadcrumb-md": !i,
+        "k-breadcrumb-wrap": a === "wrap",
+        [`k-breadcrumb-${W.sizeMap[i] || i}`]: i
+      };
+    }
+  },
+  setup() {
+    return {
+      breadcrumbRef: O(null)
+    };
+  },
+  mounted() {
+    this.currentDir = z(this.$el, this.$props.dir), this.listItems = this.breadcrumbRef.querySelectorAll("li"), this.itemsData = Array.from(this.listItems).map((e, i) => ({
+      id: i,
+      name: e.innerText,
+      width: e.offsetWidth,
+      visible: !0
+    })), this.resizeObserver = B && window.ResizeObserver && new ResizeObserver(this.calculateMedia), this.breadcrumbRef && this.resizeObserver && (this.resizeObserver.observe(this.breadcrumbRef), this.$nextTick(() => {
+      this.calculateMedia();
+    }));
+  },
+  unmounted() {
+    document != null && document.body && this.resizeObserver && this.resizeObserver.disconnect();
+  },
+  render() {
+    let e;
+    const {
+      id: i,
+      dir: a,
+      tabIndex: t,
+      collapseMode: d,
+      disabled: h,
+      ariaLabel: x,
+      valueField: n,
+      svgIconField: u,
+      iconField: m,
+      textField: r
+    } = this.$props, v = g.call(this, this.$props.breadcrumbDelimiter, y.call(this)), o = this.$props.breadcrumbDelimiter ? f.call(this, {
+      h: b,
+      template: v,
+      additionalProps: {
+        dir: this.currentDir,
+        tabIndex: t
+      }
+    }) : l(H, {
+      dir: this.currentDir,
+      tabIndex: t
+    }, null), D = g.call(this, this.$props.breadcrumbLink, y.call(this)), k = l(w, {
+      id: this.localData[0][n],
+      isLast: this.localData.length - 1 === 0,
+      isFirst: !0,
+      tabIndex: t,
+      svgIcon: this.localData[0][u] || void 0,
+      icon: this.localData[0][m] || void 0,
+      text: this.localData[0][r] ? String(this.localData[0][r]) : void 0,
+      disabled: this.localData[0].disabled,
+      onSelect: this.handleSelect,
+      onKeydown: this.handleKeyDown
+    }, null), I = f.call(this, {
+      h: b,
+      template: D,
+      defaultRendering: k,
+      additionalProps: {
+        id: this.localData[0][n],
+        isLast: this.localData.length - 1 === 0,
+        isFirst: !0,
+        tabIndex: t,
+        svgIcon: this.localData[0][u] || void 0,
+        icon: this.localData[0][m] || void 0,
+        text: this.localData[0][r] ? String(this.localData[0][r]) : void 0,
+        disabled: this.localData[0].disabled,
+        onSelect: this.handleSelect,
+        onKeydown: this.handleKeyDown
+      },
+      defaultSlots: o
+    });
+    return l("nav", {
+      id: i,
+      ref: (s) => this.breadcrumbRef = s,
+      tabindex: j(t, h),
+      dir: this.currentDir,
+      "aria-label": x,
+      class: this.itemClasses
+    }, [d === "wrap" && l(S, {
+      rootItem: !0,
+      dir: a,
+      tabIndex: t
+    }, {
+      default: () => [l(p, {
+        key: this.localData[0][n],
+        isFirstItem: !0,
+        isLastItem: this.dataItems.length - 1 === 0
+      }, {
+        default: () => [I, this.localData.length > 1 && o, this.addDelimiter && d === "auto" && o]
+      })]
+    }), l(S, {
+      dir: a,
+      tabIndex: t,
+      collapseMode: this.$props.collapseMode
+    }, T(e = this.localData.map((s, c) => {
+      if (c === 0 && d !== "wrap")
+        return l(p, {
+          key: this.localData[0][n],
+          isFirstItem: !0,
+          isLastItem: this.localData.length - 1 === 0
+        }, {
+          default: () => [I, o, this.addDelimiter && d === "auto" && o]
+        });
+      if (c > 0) {
+        const L = l(w, {
+          id: s[n],
+          isLast: this.localData.length - 1 === c,
+          isFirst: !1,
+          tabIndex: t,
+          svgIcon: s[u] || void 0,
+          icon: s[m] || void 0,
+          text: s[r] ? String(s[r]) : void 0,
+          disabled: s.disabled,
+          onSelect: this.handleSelect,
+          onKeydown: this.handleKeyDown
+        }, null), F = f.call(this, {
+          h: b,
+          template: D,
+          defaultRendering: L,
+          additionalProps: {
+            id: s[n],
+            isLast: this.localData.length - 1 === c,
+            isFirst: !1,
+            tabIndex: t,
+            svgIcon: s[u] || void 0,
+            icon: s[m] || void 0,
+            text: s[r] ? String(s[r]) : void 0,
+            disabled: s.disabled,
+            onSelect: this.handleSelect,
+            onKeydown: this.handleKeyDown
+          }
+        });
+        return l(p, {
+          key: s[n],
+          isFirstItem: !1,
+          isLastItem: this.localData.length - 1 === c
+        }, {
+          default: () => [F, c !== this.localData.length - 1 && o]
+        });
+      }
+    })) ? e : {
+      default: () => [e]
+    })]);
+  },
+  methods: {
+    getLastHiddenItemWidth() {
+      const e = this.itemsData.slice().reverse().findIndex((i) => i.id !== 0 && i.visible === !1);
+      if (e !== -1) {
+        const i = this.itemsData.length - 1 - e, a = this.itemsData[i].width;
+        return [i, a];
+      }
+      return [-1, 0];
+    },
+    calculateMedia() {
+      if (this.breadcrumbRef.offsetWidth) {
+        this.listItems = this.breadcrumbRef.querySelectorAll("li");
+        let e = this.itemsData.reduce((t, d) => d.visible ? t + d.width : t, 0);
+        for (; this.breadcrumbRef.offsetWidth + 1 < e && this.collapseMode === "auto"; ) {
+          const t = this.itemsData.findIndex((h) => h.id !== 0 && h.visible === !0);
+          this.itemsData[t].visible = !1, this.listItems[t].style.display = "none";
+          const d = this.itemsData[t].width;
+          e = e - d, this.addDelimiter = !0;
+        }
+        let [i, a] = this.getLastHiddenItemWidth();
+        if (i !== -1)
+          for (; this.breadcrumbRef.offsetWidth - 1 > e + a && this.addDelimiter && (this.itemsData[i].visible = !0, this.listItems[i].style.display = "", e = e + a, this.addDelimiter = this.itemsData.findIndex((t) => t.visible === !1) !== -1, [i, a] = this.getLastHiddenItemWidth(), i !== -1); )
+            ;
+        (this.collapseMode === "wrap" || this.collapseMode === "none") && (this.listItems.forEach((t) => {
+          t.style.display = "";
+        }), this.itemsData.forEach((t) => {
+          t.visible = !0;
+        }));
+      }
+    },
+    handleSelect(e) {
+      const i = this.dataItems.findIndex((t) => t.id === e.id), a = this.dataItems.slice(0, i + 1);
+      this.localData = a, this.itemsData = a, this.$emit("select", {
+        event: e,
+        id: e.id
+      });
+    },
+    handleKeyDown(e) {
+      if (e.event.key === "Enter") {
+        const i = this.dataItems.findIndex((t) => t.id === e.id), a = this.dataItems.slice(0, i + 1);
+        this.localData = a, this.itemsData = a;
+      }
+      this.$emit("keydown", {
+        event: e,
+        id: e.id
+      });
+    }
+  }
+});
+export {
+  _ as Breadcrumb
+};

package/breadcrumb/BreadcrumbDelimiter.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 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=require("vue"),o=require("@progress/kendo-vue-common"),r=require("@progress/kendo-svg-icons"),d=e.defineComponent({name:"KendoBreadcrumbDelimiter",props:{id:String,dir:String,tabIndex:Number},render(){const{id:n,dir:i,tabIndex:t}=this.$props;return e.createVNode(o.Icon,{id:n,"aria-hidden":!0,tabIndex:t||0,size:"small",icon:i==="rtl"?r.chevronLeftIcon:r.chevronRightIcon,class:"k-breadcrumb-delimiter-icon"},null)}});exports.BreadcrumbDelimiter=d;

package/breadcrumb/BreadcrumbDelimiter.mjs

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as n, createVNode as o } from "vue";
+import { Icon as t } from "@progress/kendo-vue-common";
+import { chevronLeftIcon as d, chevronRightIcon as m } from "@progress/kendo-svg-icons";
+const p = /* @__PURE__ */ n({
+  name: "KendoBreadcrumbDelimiter",
+  props: {
+    id: String,
+    dir: String,
+    tabIndex: Number
+  },
+  render() {
+    const {
+      id: r,
+      dir: e,
+      tabIndex: i
+    } = this.$props;
+    return o(t, {
+      id: r,
+      "aria-hidden": !0,
+      tabIndex: i || 0,
+      size: "small",
+      icon: e === "rtl" ? d : m,
+      class: "k-breadcrumb-delimiter-icon"
+    }, null);
+  }
+});
+export {
+  p as BreadcrumbDelimiter
+};

package/breadcrumb/BreadcrumbLink.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 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 i=require("vue"),s=require("@progress/kendo-vue-common"),u=i.defineComponent({name:"KendoBreadcrumbLink",props:{id:String,tabIndex:Number,dir:String,disabled:Boolean,text:String,svgIcon:Object,icon:Object,ariaCurrent:Boolean,isLast:Boolean,isFirst:Boolean,onSelect:Function},emits:["select","keydown"],computed:{itemClasses(){const{isFirst:e,svgIcon:t,text:n,disabled:r}=this.$props;return{"k-breadcrumb-root-link":e,"k-breadcrumb-link":!e,"k-breadcrumb-icontext-link":t&&n,"k-breadcrumb-icon-link":t!==void 0&&!n,"k-disabled":r}}},created(){this.currentDir=void 0},mounted(){this.currentDir=s.getDir(this.$el,this.$props.dir)},setup(){return{linkRef:i.ref(null)}},render(){const{ariaCurrent:e,isLast:t,id:n,svgIcon:r,icon:c,text:o,tabIndex:l,disabled:d}=this.$props;return i.createVNode("a",{href:"#","aria-current":e||t&&"page","aria-disabled":d||t,id:n,ref:this.linkRef,dir:this.currentDir,tabindex:s.getTabIndex(l,d),class:this.itemClasses,onClick:a=>{a.preventDefault(),this.handleSelect(a)},onKeydown:this.handleKeyDown},[c||"",r&&i.createVNode(s.Icon,{class:"k-svg-icon",icon:r},null),o&&i.createVNode("span",{class:"k-breadcrumb-item-text"},[o])])},methods:{focus(){this.$el&&this.$el.focus()},handleSelect(e){this.$emit("select",{event:e,id:this.$props.id})},handleKeyDown(e){this.$emit("keydown",{event:e,id:this.$props.id})}}});exports.BreadcrumbLink=u;

package/breadcrumb/BreadcrumbLink.mjs

@@ -0,0 +1,105 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as l, ref as u, createVNode as r } from "vue";
+import { getDir as b, getTabIndex as h, Icon as m } from "@progress/kendo-vue-common";
+const f = /* @__PURE__ */ l({
+  name: "KendoBreadcrumbLink",
+  props: {
+    id: String,
+    tabIndex: Number,
+    dir: String,
+    disabled: Boolean,
+    text: String,
+    svgIcon: Object,
+    icon: Object,
+    ariaCurrent: Boolean,
+    isLast: Boolean,
+    isFirst: Boolean,
+    onSelect: Function
+  },
+  emits: ["select", "keydown"],
+  computed: {
+    itemClasses() {
+      const {
+        isFirst: e,
+        svgIcon: i,
+        text: t,
+        disabled: n
+      } = this.$props;
+      return {
+        "k-breadcrumb-root-link": e,
+        "k-breadcrumb-link": !e,
+        "k-breadcrumb-icontext-link": i && t,
+        "k-breadcrumb-icon-link": i !== void 0 && !t,
+        "k-disabled": n
+      };
+    }
+  },
+  created() {
+    this.currentDir = void 0;
+  },
+  mounted() {
+    this.currentDir = b(this.$el, this.$props.dir);
+  },
+  setup() {
+    return {
+      linkRef: u(null)
+    };
+  },
+  render() {
+    const {
+      ariaCurrent: e,
+      isLast: i,
+      id: t,
+      svgIcon: n,
+      icon: a,
+      text: s,
+      tabIndex: c,
+      disabled: o
+    } = this.$props;
+    return r("a", {
+      href: "#",
+      "aria-current": e || i && "page",
+      "aria-disabled": o || i,
+      id: t,
+      ref: this.linkRef,
+      dir: this.currentDir,
+      tabindex: h(c, o),
+      class: this.itemClasses,
+      onClick: (d) => {
+        d.preventDefault(), this.handleSelect(d);
+      },
+      onKeydown: this.handleKeyDown
+    }, [a || "", n && r(m, {
+      class: "k-svg-icon",
+      icon: n
+    }, null), s && r("span", {
+      class: "k-breadcrumb-item-text"
+    }, [s])]);
+  },
+  methods: {
+    focus() {
+      this.$el && this.$el.focus();
+    },
+    handleSelect(e) {
+      this.$emit("select", {
+        event: e,
+        id: this.$props.id
+      });
+    },
+    handleKeyDown(e) {
+      this.$emit("keydown", {
+        event: e,
+        id: this.$props.id
+      });
+    }
+  }
+});
+export {
+  f as BreadcrumbLink
+};

package/breadcrumb/BreadcrumbListItem.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 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 t=require("vue"),s=require("@progress/kendo-vue-common"),i=t.defineComponent({name:"KendoBreadcrumbListItem",props:{id:String,isFirstItem:Boolean,isLastItem:Boolean},computed:{itemClasses(){const{isFirstItem:e,isLastItem:r}=this.$props;return{"k-breadcrumb-item":!0,"k-breadcrumb-root-item":e,"k-breadcrumb-last-item":r}}},render(){const e=s.getDefaultSlots(this);return t.createVNode("li",{id:this.$props.id,class:this.itemClasses},[e])}});exports.BreadcrumbListItem=i;

package/breadcrumb/BreadcrumbListItem.mjs

@@ -0,0 +1,40 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as r, createVNode as s } from "vue";
+import { getDefaultSlots as i } from "@progress/kendo-vue-common";
+const a = /* @__PURE__ */ r({
+  name: "KendoBreadcrumbListItem",
+  props: {
+    id: String,
+    isFirstItem: Boolean,
+    isLastItem: Boolean
+  },
+  computed: {
+    itemClasses() {
+      const {
+        isFirstItem: t,
+        isLastItem: e
+      } = this.$props;
+      return {
+        "k-breadcrumb-item": !0,
+        "k-breadcrumb-root-item": t,
+        "k-breadcrumb-last-item": e
+      };
+    }
+  },
+  render() {
+    const t = i(this);
+    return s("li", {
+      id: this.$props.id,
+      class: this.itemClasses
+    }, [t]);
+  }
+});
+export {
+  a as BreadcrumbListItem
+};

package/breadcrumb/BreadcrumbOrderedList.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 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 n=require("vue"),o=require("@progress/kendo-vue-common"),i=n.defineComponent({name:"KendoBreadcrumbOrderedList",props:{rootItem:Boolean,id:String,dir:String,tabIndex:Number,disabled:Boolean,collapseMode:{type:String,validator:function(e){return["auto","wrap","none"].includes(e)}}},computed:{itemClasses(){const{rootItem:e,disabled:t,collapseMode:r}=this.$props;return{"k-breadcrumb-root-item-container":e,"k-breadcrumb-container":!e,"k-disabled":t,"!k-flex-wrap":r==="wrap","k-flex-none":r==="none"}}},created(){this.currentDir=void 0},mounted(){this.currentDir=o.getDir(this.$el,this.$props.dir)},render(){const e=o.getDefaultSlots(this),{id:t,disabled:r,tabIndex:d}=this.$props;return n.createVNode("ol",{id:t,dir:this.currentDir,tabindex:o.getTabIndex(d,r),class:this.itemClasses},[e])}});exports.BreadcrumbOrderedList=i;

package/breadcrumb/BreadcrumbOrderedList.mjs

@@ -0,0 +1,63 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as i, createVNode as n } from "vue";
+import { getDir as d, getDefaultSlots as s, getTabIndex as a } from "@progress/kendo-vue-common";
+const p = /* @__PURE__ */ i({
+  name: "KendoBreadcrumbOrderedList",
+  props: {
+    rootItem: Boolean,
+    id: String,
+    dir: String,
+    tabIndex: Number,
+    disabled: Boolean,
+    collapseMode: {
+      type: String,
+      validator: function(e) {
+        return ["auto", "wrap", "none"].includes(e);
+      }
+    }
+  },
+  computed: {
+    itemClasses() {
+      const {
+        rootItem: e,
+        disabled: t,
+        collapseMode: r
+      } = this.$props;
+      return {
+        "k-breadcrumb-root-item-container": e,
+        "k-breadcrumb-container": !e,
+        "k-disabled": t,
+        "!k-flex-wrap": r === "wrap",
+        "k-flex-none": r === "none"
+      };
+    }
+  },
+  created() {
+    this.currentDir = void 0;
+  },
+  mounted() {
+    this.currentDir = d(this.$el, this.$props.dir);
+  },
+  render() {
+    const e = s(this), {
+      id: t,
+      disabled: r,
+      tabIndex: o
+    } = this.$props;
+    return n("ol", {
+      id: t,
+      dir: this.currentDir,
+      tabindex: a(o, r),
+      class: this.itemClasses
+    }, [e]);
+  }
+});
+export {
+  p as BreadcrumbOrderedList
+};

package/card/Avatar.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 o=require("vue"),d=require("./interfaces/Enums.js"),s=require("../package-metadata.js"),t=require("@progress/kendo-vue-common"),l=o.defineComponent({name:"KendoAvatar",props:{type:{type:String,default:d.avatarType.TEXT,validator:function(e){return["text","image","icon"].includes(e)}},border:Boolean,rounded:{type:String,default:"medium",validator:function(e){return["small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return["solid","outline"].includes(e)}},size:{type:String,default:"medium",validator:function(e){return["small","medium","large"].includes(e)}},themeColor:{type:String,default:"primary",validator:function(e){return["primary","secondary","tertiary","info","success","warning","error","dark","light","inverse","inherit"].includes(e)}}},created(){t.validatePackage(s.packageMetadata)},computed:{wrapperClass(){const{border:e,type:u,size:a,rounded:n,fillMode:r,themeColor:i}=this.$props;return{"k-avatar-bordered":e,"k-avatar":!0,[`k-avatar-${t.kendoThemeMaps.sizeMap[a]||a}`]:a,[`k-rounded-${t.kendoThemeMaps.roundedMap[n]||n}`]:n,[`k-avatar-${r}`]:r,[`k-avatar-${r}-${i}`]:!!(r&&i)}},innerClass(){return{[`k-avatar-${this.$props.type}`]:this.$props.type}}},render(){const e=t.getDefaultSlots(this);return o.createVNode("div",{class:this.wrapperClass},[o.createVNode("span",{class:this.innerClass},[e])])}});exports.Avatar=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),d=require("./interfaces/Enums.js"),s=require("../package-metadata.js"),t=require("@progress/kendo-vue-common"),l=o.defineComponent({name:"KendoAvatar",props:{type:{type:String,default:d.avatarType.TEXT,validator:function(e){return["text","image","icon"].includes(e)}},border:Boolean,rounded:{type:String,default:"medium",validator:function(e){return["small","medium","large","full"].includes(e)}},fillMode:{type:String,default:"solid",validator:function(e){return["solid","outline"].includes(e)}},size:{type:String,default:"medium",validator:function(e){return["small","medium","large",null].includes(e)}},themeColor:{type:String,default:"primary",validator:function(e){return["primary","secondary","tertiary","info","success","warning","error","dark","light","inverse","inherit"].includes(e)}}},created(){t.validatePackage(s.packageMetadata)},computed:{wrapperClass(){const{border:e,type:u,size:a,rounded:n,fillMode:r,themeColor:i}=this.$props;return{"k-avatar-bordered":e,"k-avatar":!0,[`k-avatar-${t.kendoThemeMaps.sizeMap[a]||a}`]:a,[`k-rounded-${t.kendoThemeMaps.roundedMap[n]||n}`]:n,[`k-avatar-${r}`]:r,[`k-avatar-${r}-${i}`]:!!(r&&i)}},innerClass(){return{[`k-avatar-${this.$props.type}`]:this.$props.type}}},render(){const e=t.getDefaultSlots(this);return o.createVNode("div",{class:this.wrapperClass},[o.createVNode("span",{class:this.innerClass},[e])])}});exports.Avatar=l;

package/card/Avatar.mjs

@@ -5,10 +5,10 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { defineComponent as d, createVNode as o } from "vue";
+import { defineComponent as d, createVNode as n } from "vue";
 import { avatarType as l } from "./interfaces/Enums.mjs";
 import { packageMetadata as s } from "../package-metadata.mjs";
-import { validatePackage as u, kendoThemeMaps as n, getDefaultSlots as p } from "@progress/kendo-vue-common";
+import { validatePackage as u, kendoThemeMaps as o, getDefaultSlots as p } from "@progress/kendo-vue-common";
 const g = /* @__PURE__ */ d({
   name: "KendoAvatar",
   props: {
@@ -38,7 +38,7 @@ const g = /* @__PURE__ */ d({
       type: String,
       default: "medium",
       validator: function(e) {
-        return ["small", "medium", "large"].includes(e);
+        return ["small", "medium", "large", null].includes(e);
       }
     },
     themeColor: {
@@ -65,8 +65,8 @@ const g = /* @__PURE__ */ d({
       return {
         "k-avatar-bordered": e,
         "k-avatar": !0,
-        [`k-avatar-${n.sizeMap[t] || t}`]: t,
-        [`k-rounded-${n.roundedMap[a] || a}`]: a,
+        [`k-avatar-${o.sizeMap[t] || t}`]: t,
+        [`k-rounded-${o.roundedMap[a] || a}`]: a,
         [`k-avatar-${r}`]: r,
         [`k-avatar-${r}-${i}`]: !!(r && i)
       };
@@ -79,9 +79,9 @@ const g = /* @__PURE__ */ d({
   },
   render() {
     const e = p(this);
-    return o("div", {
+    return n("div", {
       class: this.wrapperClass
-    }, [o("span", {
+    }, [n("span", {
       class: this.innerClass
     }, [e])]);
   }