primevue 3.29.2 → 3.30.0

package/breadcrumb/breadcrumb.js

@@ -1,248 +1,226 @@
 this.primevue = this.primevue || {};
-this.primevue.breadcrumb = (function (BaseComponent, ChevronRightIcon, vue) {
+this.primevue.breadcrumb = (function (ChevronRightIcon, BaseComponent, usestyle, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
     var ChevronRightIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRightIcon);
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 
-    var script$1 = {
-        name: 'BreadcrumbItem',
-        extends: BaseComponent__default["default"],
-        props: {
-            item: null,
-            templates: null,
-            exact: null,
-            index: null
+    var styles = "\n.p-breadcrumb {\n    overflow-x: auto;\n}\n\n.p-breadcrumb .p-breadcrumb-list {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n}\n\n.p-breadcrumb .p-menuitem-text {\n    line-height: 1;\n}\n\n.p-breadcrumb .p-menuitem-link {\n    text-decoration: none;\n    display: flex;\n    align-items: center;\n}\n\n.p-breadcrumb .p-menuitem-separator {\n    display: flex;\n    align-items: center;\n}\n\n.p-breadcrumb::-webkit-scrollbar {\n    display: none;\n}\n";
+    var classes = {
+      root: 'p-breadcrumb p-component',
+      menu: 'p-breadcrumb-list',
+      home: 'p-breadcrumb-home',
+      separator: 'p-menuitem-separator',
+      menuitem: function menuitem(_ref) {
+        var instance = _ref.instance;
+        return ['p-menuitem', {
+          'p-disabled': instance.disabled()
+        }];
+      },
+      action: function action(_ref2) {
+        var props = _ref2.props,
+          isActive = _ref2.isActive,
+          isExactActive = _ref2.isExactActive;
+        return ['p-menuitem-link', {
+          'router-link-active': isActive,
+          'router-link-active-exact': props.exact && isExactActive
+        }];
+      },
+      icon: 'p-menuitem-icon',
+      label: 'p-menuitem-text'
+    };
+    var _useStyle = usestyle.useStyle(styles, {
+        name: 'breadcrumb',
+        manual: true
+      }),
+      loadStyle = _useStyle.load;
+    var script$2 = {
+      name: 'BaseBreadcrumb',
+      "extends": BaseComponent__default["default"],
+      props: {
+        model: {
+          type: Array,
+          "default": null
         },
-        methods: {
-            onClick(event, navigate) {
-                if (this.item.command) {
-                    this.item.command({
-                        originalEvent: event,
-                        item: this.item
-                    });
-                }
-
-                if (this.item.to && navigate) {
-                    navigate(event);
-                }
-            },
-            containerClass() {
-                return ['p-menuitem', { 'p-disabled': this.disabled() }, this.item.class];
-            },
-            linkClass(routerProps) {
-                return [
-                    'p-menuitem-link',
-                    {
-                        'router-link-active': routerProps && routerProps.isActive,
-                        'router-link-active-exact': this.exact && routerProps && routerProps.isExactActive
-                    }
-                ];
-            },
-            visible() {
-                return typeof this.item.visible === 'function' ? this.item.visible() : this.item.visible !== false;
-            },
-            disabled() {
-                return typeof this.item.disabled === 'function' ? this.item.disabled() : this.item.disabled;
-            },
-            label() {
-                return typeof this.item.label === 'function' ? this.item.label() : this.item.label;
-            },
-            isCurrentUrl() {
-                const { to, url } = this.item;
-                let lastPath = this.$router ? this.$router.currentRoute.path : '';
-
-                return to === lastPath || url === lastPath ? 'page' : undefined;
-            }
+        home: {
+          type: null,
+          "default": null
+        },
+        exact: {
+          type: Boolean,
+          "default": true
         }
+      },
+      css: {
+        classes: classes,
+        loadStyle: loadStyle
+      },
+      provide: function provide() {
+        return {
+          $parentInstance: this
+        };
+      }
     };
 
-    const _hoisted_1 = ["href", "aria-current", "onClick"];
-    const _hoisted_2 = ["href", "target", "aria-current"];
+    var script$1 = {
+      name: 'BreadcrumbItem',
+      hostName: 'Breadcrumb',
+      "extends": BaseComponent__default["default"],
+      props: {
+        item: null,
+        templates: null,
+        exact: null,
+        index: null
+      },
+      methods: {
+        onClick: function onClick(event, navigate) {
+          if (this.item.command) {
+            this.item.command({
+              originalEvent: event,
+              item: this.item
+            });
+          }
+          if (this.item.to && navigate) {
+            navigate(event);
+          }
+        },
+        visible: function visible() {
+          return typeof this.item.visible === 'function' ? this.item.visible() : this.item.visible !== false;
+        },
+        disabled: function disabled() {
+          return typeof this.item.disabled === 'function' ? this.item.disabled() : this.item.disabled;
+        },
+        label: function label() {
+          return typeof this.item.label === 'function' ? this.item.label() : this.item.label;
+        },
+        isCurrentUrl: function isCurrentUrl() {
+          var _this$item = this.item,
+            to = _this$item.to,
+            url = _this$item.url;
+          var lastPath = this.$router ? this.$router.currentRoute.path : '';
+          return to === lastPath || url === lastPath ? 'page' : undefined;
+        }
+      }
+    };
 
+    var _hoisted_1 = ["href", "aria-current", "onClick"];
+    var _hoisted_2 = ["href", "target", "aria-current"];
     function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-      const _component_router_link = vue.resolveComponent("router-link");
-
-      return ($options.visible())
-        ? (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
+      var _component_router_link = vue.resolveComponent("router-link");
+      return $options.visible() ? (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
+        key: 0,
+        "class": [_ctx.cx('menuitem'), $props.item["class"]]
+      }, _ctx.ptm('menuitem')), [!$props.templates || !$props.templates.item ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+        key: 0
+      }, [$props.item.to ? (vue.openBlock(), vue.createBlock(_component_router_link, {
+        key: 0,
+        to: $props.item.to,
+        custom: ""
+      }, {
+        "default": vue.withCtx(function (_ref) {
+          var navigate = _ref.navigate,
+            href = _ref.href,
+            isActive = _ref.isActive,
+            isExactActive = _ref.isExactActive;
+          return [vue.createElementVNode("a", vue.mergeProps({
+            href: href,
+            "class": _ctx.cx('action', {
+              isActive: isActive,
+              isExactActive: isExactActive
+            }),
+            "aria-current": $options.isCurrentUrl(),
+            onClick: function onClick($event) {
+              return $options.onClick($event, navigate);
+            }
+          }, _ctx.ptm('action')), [$props.templates.itemicon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.itemicon), {
             key: 0,
-            class: $options.containerClass()
-          }, _ctx.ptm('menuitem')), [
-            (!$props.templates || !$props.templates.item)
-              ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-                  ($props.item.to)
-                    ? (vue.openBlock(), vue.createBlock(_component_router_link, {
-                        key: 0,
-                        to: $props.item.to,
-                        custom: ""
-                      }, {
-                        default: vue.withCtx(({ navigate, href, isActive, isExactActive }) => [
-                          vue.createElementVNode("a", vue.mergeProps({
-                            href: href,
-                            class: $options.linkClass({ isActive, isExactActive }),
-                            "aria-current": $options.isCurrentUrl(),
-                            onClick: $event => ($options.onClick($event, navigate))
-                          }, _ctx.ptm('action')), [
-                            ($props.templates.itemicon)
-                              ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.itemicon), {
-                                  key: 0,
-                                  item: $props.item,
-                                  class: "p-menuitem-icon"
-                                }, null, 8, ["item"]))
-                              : ($props.item.icon)
-                                ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
-                                    key: 1,
-                                    class: ['p-menuitem-icon', $props.item.icon]
-                                  }, _ctx.ptm('icon')), null, 16))
-                                : vue.createCommentVNode("", true),
-                            ($props.item.label)
-                              ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
-                                  key: 2,
-                                  class: "p-menuitem-text"
-                                }, _ctx.ptm('label')), vue.toDisplayString($options.label()), 17))
-                              : vue.createCommentVNode("", true)
-                          ], 16, _hoisted_1)
-                        ]),
-                        _: 1
-                      }, 8, ["to"]))
-                    : (vue.openBlock(), vue.createElementBlock("a", vue.mergeProps({
-                        key: 1,
-                        href: $props.item.url || '#',
-                        class: $options.linkClass(),
-                        target: $props.item.target,
-                        "aria-current": $options.isCurrentUrl(),
-                        onClick: _cache[0] || (_cache[0] = (...args) => ($options.onClick && $options.onClick(...args)))
-                      }, _ctx.ptm('action')), [
-                        ($props.templates && $props.templates.itemicon)
-                          ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.itemicon), {
-                              key: 0,
-                              item: $props.item,
-                              class: "p-menuitem-icon"
-                            }, null, 8, ["item"]))
-                          : ($props.item.icon)
-                            ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
-                                key: 1,
-                                class: ['p-menuitem-icon', $props.item.icon]
-                              }, _ctx.ptm('icon')), null, 16))
-                            : vue.createCommentVNode("", true),
-                        ($props.item.label)
-                          ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
-                              key: 2,
-                              class: "p-menuitem-text"
-                            }, _ctx.ptm('label')), vue.toDisplayString($options.label()), 17))
-                          : vue.createCommentVNode("", true)
-                      ], 16, _hoisted_2))
-                ], 64))
-              : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.item), {
-                  key: 1,
-                  item: $props.item
-                }, null, 8, ["item"]))
-          ], 16))
-        : vue.createCommentVNode("", true)
+            item: $props.item,
+            "class": vue.normalizeClass(_ctx.cx('icon'))
+          }, null, 8, ["item", "class"])) : $props.item.icon ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+            key: 1,
+            "class": [_ctx.cx('icon'), $props.item.icon]
+          }, _ctx.ptm('icon')), null, 16)) : vue.createCommentVNode("", true), $props.item.label ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+            key: 2,
+            "class": _ctx.cx('label')
+          }, _ctx.ptm('label')), vue.toDisplayString($options.label()), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_1)];
+        }),
+        _: 1
+      }, 8, ["to"])) : (vue.openBlock(), vue.createElementBlock("a", vue.mergeProps({
+        key: 1,
+        href: $props.item.url || '#',
+        "class": _ctx.cx('action'),
+        target: $props.item.target,
+        "aria-current": $options.isCurrentUrl(),
+        onClick: _cache[0] || (_cache[0] = function () {
+          return $options.onClick && $options.onClick.apply($options, arguments);
+        })
+      }, _ctx.ptm('action')), [$props.templates && $props.templates.itemicon ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.itemicon), {
+        key: 0,
+        item: $props.item,
+        "class": vue.normalizeClass(_ctx.cx('icon'))
+      }, null, 8, ["item", "class"])) : $props.item.icon ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+        key: 1,
+        "class": [_ctx.cx('icon'), $props.item.icon]
+      }, _ctx.ptm('icon')), null, 16)) : vue.createCommentVNode("", true), $props.item.label ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+        key: 2,
+        "class": _ctx.cx('label')
+      }, _ctx.ptm('label')), vue.toDisplayString($options.label()), 17)) : vue.createCommentVNode("", true)], 16, _hoisted_2))], 64)) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.item), {
+        key: 1,
+        item: $props.item
+      }, null, 8, ["item"]))], 16)) : vue.createCommentVNode("", true);
     }
 
     script$1.render = render$1;
 
     var script = {
-        name: 'Breadcrumb',
-        extends: BaseComponent__default["default"],
-        props: {
-            model: {
-                type: Array,
-                default: null
-            },
-            home: {
-                type: null,
-                default: null
-            },
-            exact: {
-                type: Boolean,
-                default: true
-            }
-        },
-        components: {
-            BreadcrumbItem: script$1,
-            ChevronRightIcon: ChevronRightIcon__default["default"]
-        }
+      name: 'Breadcrumb',
+      "extends": script$2,
+      components: {
+        BreadcrumbItem: script$1,
+        ChevronRightIcon: ChevronRightIcon__default["default"]
+      }
     };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      const _component_BreadcrumbItem = vue.resolveComponent("BreadcrumbItem");
-      const _component_ChevronRightIcon = vue.resolveComponent("ChevronRightIcon");
-
-      return (vue.openBlock(), vue.createElementBlock("nav", vue.mergeProps({ class: "p-breadcrumb p-component" }, _ctx.ptm('root')), [
-        vue.createElementVNode("ol", vue.mergeProps({ class: "p-breadcrumb-list" }, _ctx.ptm('menu')), [
-          ($props.home)
-            ? (vue.openBlock(), vue.createBlock(_component_BreadcrumbItem, {
-                key: 0,
-                item: $props.home,
-                class: "p-breadcrumb-home",
-                templates: _ctx.$slots,
-                exact: $props.exact,
-                pt: _ctx.pt
-              }, null, 8, ["item", "templates", "exact", "pt"]))
-            : vue.createCommentVNode("", true),
-          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.model, (item, i) => {
-            return (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
-              key: item.label
-            }, [
-              ($props.home || i !== 0)
-                ? (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
-                    key: 0,
-                    class: "p-menuitem-separator"
-                  }, _ctx.ptm('separator')), [
-                    vue.renderSlot(_ctx.$slots, "separator", {}, () => [
-                      vue.createVNode(_component_ChevronRightIcon, vue.mergeProps({ "aria-hidden": "true" }, _ctx.ptm('separatorIcon')), null, 16)
-                    ])
-                  ], 16))
-                : vue.createCommentVNode("", true),
-              vue.createVNode(_component_BreadcrumbItem, {
-                item: item,
-                index: i,
-                templates: _ctx.$slots,
-                exact: $props.exact,
-                pt: _ctx.pt
-              }, null, 8, ["item", "index", "templates", "exact", "pt"])
-            ], 64))
-          }), 128))
-        ], 16)
-      ], 16))
+      var _component_BreadcrumbItem = vue.resolveComponent("BreadcrumbItem");
+      var _component_ChevronRightIcon = vue.resolveComponent("ChevronRightIcon");
+      return vue.openBlock(), vue.createElementBlock("nav", vue.mergeProps({
+        "class": _ctx.cx('root')
+      }, _ctx.ptm('root'), {
+        "data-pc-name": "breadcrumb"
+      }), [vue.createElementVNode("ol", vue.mergeProps({
+        "class": _ctx.cx('menu')
+      }, _ctx.ptm('menu')), [_ctx.home ? (vue.openBlock(), vue.createBlock(_component_BreadcrumbItem, vue.mergeProps({
+        key: 0,
+        item: _ctx.home,
+        "class": _ctx.cx('home'),
+        templates: _ctx.$slots,
+        exact: _ctx.exact,
+        pt: _ctx.pt
+      }, _ctx.ptm('home')), null, 16, ["item", "class", "templates", "exact", "pt"])) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.model, function (item, i) {
+        return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+          key: item.label
+        }, [_ctx.home || i !== 0 ? (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
+          key: 0,
+          "class": _ctx.cx('separator')
+        }, _ctx.ptm('separator')), [vue.renderSlot(_ctx.$slots, "separator", {}, function () {
+          return [vue.createVNode(_component_ChevronRightIcon, vue.mergeProps({
+            "aria-hidden": "true"
+          }, _ctx.ptm('separatorIcon')), null, 16)];
+        })], 16)) : vue.createCommentVNode("", true), vue.createVNode(_component_BreadcrumbItem, {
+          item: item,
+          index: i,
+          templates: _ctx.$slots,
+          exact: _ctx.exact,
+          pt: _ctx.pt
+        }, null, 8, ["item", "index", "templates", "exact", "pt"])], 64);
+      }), 128))], 16)], 16);
     }
 
-    function styleInject(css, ref) {
-      if ( ref === void 0 ) ref = {};
-      var insertAt = ref.insertAt;
-
-      if (!css || typeof document === 'undefined') { return; }
-
-      var head = document.head || document.getElementsByTagName('head')[0];
-      var style = document.createElement('style');
-      style.type = 'text/css';
-
-      if (insertAt === 'top') {
-        if (head.firstChild) {
-          head.insertBefore(style, head.firstChild);
-        } else {
-          head.appendChild(style);
-        }
-      } else {
-        head.appendChild(style);
-      }
-
-      if (style.styleSheet) {
-        style.styleSheet.cssText = css;
-      } else {
-        style.appendChild(document.createTextNode(css));
-      }
-    }
-
-    var css_248z = "\n.p-breadcrumb {\n    overflow-x: auto;\n}\n.p-breadcrumb .p-breadcrumb-list {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n}\n.p-breadcrumb .p-menuitem-text {\n    line-height: 1;\n}\n.p-breadcrumb .p-menuitem-link {\n    text-decoration: none;\n    display: flex;\n    align-items: center;\n}\n.p-breadcrumb .p-menuitem-separator {\n    display: flex;\n    align-items: center;\n}\n.p-breadcrumb::-webkit-scrollbar {\n    display: none;\n}\n";
-    styleInject(css_248z);
-
     script.render = render;
 
     return script;
 
-})(primevue.basecomponent, primevue.icons.chevronright, Vue);
+})(primevue.icons.chevronright, primevue.basecomponent, primevue.usestyle, Vue);

package/breadcrumb/breadcrumb.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.breadcrumb=function(e,t,n){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(e),o=i(t),r={name:"BreadcrumbItem",extends:l.default,props:{item:null,templates:null,exact:null,index:null},methods:{onClick(e,t){this.item.command&&this.item.command({originalEvent:e,item:this.item}),this.item.to&&t&&t(e)},containerClass(){return["p-menuitem",{"p-disabled":this.disabled()},this.item.class]},linkClass(e){return["p-menuitem-link",{"router-link-active":e&&e.isActive,"router-link-active-exact":this.exact&&e&&e.isExactActive}]},visible(){return"function"==typeof this.item.visible?this.item.visible():!1!==this.item.visible},disabled(){return"function"==typeof this.item.disabled?this.item.disabled():this.item.disabled},label(){return"function"==typeof this.item.label?this.item.label():this.item.label},isCurrentUrl(){const{to:e,url:t}=this.item;let n=this.$router?this.$router.currentRoute.path:"";return e===n||t===n?"page":void 0}}};const m=["href","aria-current","onClick"],a=["href","target","aria-current"];r.render=function(e,t,i,l,o,r){const c=n.resolveComponent("router-link");return r.visible()?(n.openBlock(),n.createElementBlock("li",n.mergeProps({key:0,class:r.containerClass()},e.ptm("menuitem")),[i.templates&&i.templates.item?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(i.templates.item),{key:1,item:i.item},null,8,["item"])):(n.openBlock(),n.createElementBlock(n.Fragment,{key:0},[i.item.to?(n.openBlock(),n.createBlock(c,{key:0,to:i.item.to,custom:""},{default:n.withCtx((({navigate:t,href:l,isActive:o,isExactActive:a})=>[n.createElementVNode("a",n.mergeProps({href:l,class:r.linkClass({isActive:o,isExactActive:a}),"aria-current":r.isCurrentUrl(),onClick:e=>r.onClick(e,t)},e.ptm("action")),[i.templates.itemicon?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(i.templates.itemicon),{key:0,item:i.item,class:"p-menuitem-icon"},null,8,["item"])):i.item.icon?(n.openBlock(),n.createElementBlock("span",n.mergeProps({key:1,class:["p-menuitem-icon",i.item.icon]},e.ptm("icon")),null,16)):n.createCommentVNode("",!0),i.item.label?(n.openBlock(),n.createElementBlock("span",n.mergeProps({key:2,class:"p-menuitem-text"},e.ptm("label")),n.toDisplayString(r.label()),17)):n.createCommentVNode("",!0)],16,m)])),_:1},8,["to"])):(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:1,href:i.item.url||"#",class:r.linkClass(),target:i.item.target,"aria-current":r.isCurrentUrl(),onClick:t[0]||(t[0]=(...e)=>r.onClick&&r.onClick(...e))},e.ptm("action")),[i.templates&&i.templates.itemicon?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(i.templates.itemicon),{key:0,item:i.item,class:"p-menuitem-icon"},null,8,["item"])):i.item.icon?(n.openBlock(),n.createElementBlock("span",n.mergeProps({key:1,class:["p-menuitem-icon",i.item.icon]},e.ptm("icon")),null,16)):n.createCommentVNode("",!0),i.item.label?(n.openBlock(),n.createElementBlock("span",n.mergeProps({key:2,class:"p-menuitem-text"},e.ptm("label")),n.toDisplayString(r.label()),17)):n.createCommentVNode("",!0)],16,a))],64))],16)):n.createCommentVNode("",!0)};var c={name:"Breadcrumb",extends:l.default,props:{model:{type:Array,default:null},home:{type:null,default:null},exact:{type:Boolean,default:!0}},components:{BreadcrumbItem:r,ChevronRightIcon:o.default}};return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===n&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-breadcrumb {\n    overflow-x: auto;\n}\n.p-breadcrumb .p-breadcrumb-list {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n}\n.p-breadcrumb .p-menuitem-text {\n    line-height: 1;\n}\n.p-breadcrumb .p-menuitem-link {\n    text-decoration: none;\n    display: flex;\n    align-items: center;\n}\n.p-breadcrumb .p-menuitem-separator {\n    display: flex;\n    align-items: center;\n}\n.p-breadcrumb::-webkit-scrollbar {\n    display: none;\n}\n"),c.render=function(e,t,i,l,o,r){const m=n.resolveComponent("BreadcrumbItem"),a=n.resolveComponent("ChevronRightIcon");return n.openBlock(),n.createElementBlock("nav",n.mergeProps({class:"p-breadcrumb p-component"},e.ptm("root")),[n.createElementVNode("ol",n.mergeProps({class:"p-breadcrumb-list"},e.ptm("menu")),[i.home?(n.openBlock(),n.createBlock(m,{key:0,item:i.home,class:"p-breadcrumb-home",templates:e.$slots,exact:i.exact,pt:e.pt},null,8,["item","templates","exact","pt"])):n.createCommentVNode("",!0),(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(i.model,((t,l)=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:t.label},[i.home||0!==l?(n.openBlock(),n.createElementBlock("li",n.mergeProps({key:0,class:"p-menuitem-separator"},e.ptm("separator")),[n.renderSlot(e.$slots,"separator",{},(()=>[n.createVNode(a,n.mergeProps({"aria-hidden":"true"},e.ptm("separatorIcon")),null,16)]))],16)):n.createCommentVNode("",!0),n.createVNode(m,{item:t,index:l,templates:e.$slots,exact:i.exact,pt:e.pt},null,8,["item","index","templates","exact","pt"])],64)))),128))],16)],16)},c}(primevue.basecomponent,primevue.icons.chevronright,Vue);
+this.primevue=this.primevue||{},this.primevue.breadcrumb=function(e,t,n,r){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=o(e),l=o(t),a=n.useStyle("\n.p-breadcrumb {\n    overflow-x: auto;\n}\n\n.p-breadcrumb .p-breadcrumb-list {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n}\n\n.p-breadcrumb .p-menuitem-text {\n    line-height: 1;\n}\n\n.p-breadcrumb .p-menuitem-link {\n    text-decoration: none;\n    display: flex;\n    align-items: center;\n}\n\n.p-breadcrumb .p-menuitem-separator {\n    display: flex;\n    align-items: center;\n}\n\n.p-breadcrumb::-webkit-scrollbar {\n    display: none;\n}\n",{name:"breadcrumb",manual:!0}),c={name:"BaseBreadcrumb",extends:l.default,props:{model:{type:Array,default:null},home:{type:null,default:null},exact:{type:Boolean,default:!0}},css:{classes:{root:"p-breadcrumb p-component",menu:"p-breadcrumb-list",home:"p-breadcrumb-home",separator:"p-menuitem-separator",menuitem:function(e){return["p-menuitem",{"p-disabled":e.instance.disabled()}]},action:function(e){return["p-menuitem-link",{"router-link-active":e.isActive,"router-link-active-exact":e.props.exact&&e.isExactActive}]},icon:"p-menuitem-icon",label:"p-menuitem-text"},loadStyle:a.load},provide:function(){return{$parentInstance:this}}},m={name:"BreadcrumbItem",hostName:"Breadcrumb",extends:l.default,props:{item:null,templates:null,exact:null,index:null},methods:{onClick:function(e,t){this.item.command&&this.item.command({originalEvent:e,item:this.item}),this.item.to&&t&&t(e)},visible:function(){return"function"==typeof this.item.visible?this.item.visible():!1!==this.item.visible},disabled:function(){return"function"==typeof this.item.disabled?this.item.disabled():this.item.disabled},label:function(){return"function"==typeof this.item.label?this.item.label():this.item.label},isCurrentUrl:function(){var e=this.item,t=this.$router?this.$router.currentRoute.path:"";return e.to===t||e.url===t?"page":void 0}}},s=["href","aria-current","onClick"],p=["href","target","aria-current"];m.render=function(e,t,n,o,i,l){var a=r.resolveComponent("router-link");return l.visible()?(r.openBlock(),r.createElementBlock("li",r.mergeProps({key:0,class:[e.cx("menuitem"),n.item.class]},e.ptm("menuitem")),[n.templates&&n.templates.item?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.item),{key:1,item:n.item},null,8,["item"])):(r.openBlock(),r.createElementBlock(r.Fragment,{key:0},[n.item.to?(r.openBlock(),r.createBlock(a,{key:0,to:n.item.to,custom:""},{default:r.withCtx((function(t){var o=t.navigate;return[r.createElementVNode("a",r.mergeProps({href:t.href,class:e.cx("action",{isActive:t.isActive,isExactActive:t.isExactActive}),"aria-current":l.isCurrentUrl(),onClick:function(e){return l.onClick(e,o)}},e.ptm("action")),[n.templates.itemicon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.itemicon),{key:0,item:n.item,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):n.item.icon?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:1,class:[e.cx("icon"),n.item.icon]},e.ptm("icon")),null,16)):r.createCommentVNode("",!0),n.item.label?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:2,class:e.cx("label")},e.ptm("label")),r.toDisplayString(l.label()),17)):r.createCommentVNode("",!0)],16,s)]})),_:1},8,["to"])):(r.openBlock(),r.createElementBlock("a",r.mergeProps({key:1,href:n.item.url||"#",class:e.cx("action"),target:n.item.target,"aria-current":l.isCurrentUrl(),onClick:t[0]||(t[0]=function(){return l.onClick&&l.onClick.apply(l,arguments)})},e.ptm("action")),[n.templates&&n.templates.itemicon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.itemicon),{key:0,item:n.item,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):n.item.icon?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:1,class:[e.cx("icon"),n.item.icon]},e.ptm("icon")),null,16)):r.createCommentVNode("",!0),n.item.label?(r.openBlock(),r.createElementBlock("span",r.mergeProps({key:2,class:e.cx("label")},e.ptm("label")),r.toDisplayString(l.label()),17)):r.createCommentVNode("",!0)],16,p))],64))],16)):r.createCommentVNode("",!0)};var u={name:"Breadcrumb",extends:c,components:{BreadcrumbItem:m,ChevronRightIcon:i.default}};return u.render=function(e,t,n,o,i,l){var a=r.resolveComponent("BreadcrumbItem"),c=r.resolveComponent("ChevronRightIcon");return r.openBlock(),r.createElementBlock("nav",r.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"breadcrumb"}),[r.createElementVNode("ol",r.mergeProps({class:e.cx("menu")},e.ptm("menu")),[e.home?(r.openBlock(),r.createBlock(a,r.mergeProps({key:0,item:e.home,class:e.cx("home"),templates:e.$slots,exact:e.exact,pt:e.pt},e.ptm("home")),null,16,["item","class","templates","exact","pt"])):r.createCommentVNode("",!0),(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(e.model,(function(t,n){return r.openBlock(),r.createElementBlock(r.Fragment,{key:t.label},[e.home||0!==n?(r.openBlock(),r.createElementBlock("li",r.mergeProps({key:0,class:e.cx("separator")},e.ptm("separator")),[r.renderSlot(e.$slots,"separator",{},(function(){return[r.createVNode(c,r.mergeProps({"aria-hidden":"true"},e.ptm("separatorIcon")),null,16)]}))],16)):r.createCommentVNode("",!0),r.createVNode(a,{item:t,index:n,templates:e.$slots,exact:e.exact,pt:e.pt},null,8,["item","index","templates","exact","pt"])],64)})),128))],16)],16)},u}(primevue.icons.chevronright,primevue.basecomponent,primevue.usestyle,Vue);

package/button/BaseButton.vue

@@ -0,0 +1,115 @@
+<script>
+import BaseComponent from 'primevue/basecomponent';
+
+const classes = {
+    root: ({ instance, props }) => [
+        'p-button p-component',
+        {
+            'p-button-icon-only': instance.hasIcon && !props.label && !props.badge,
+            'p-button-vertical': (props.iconPos === 'top' || props.iconPos === 'bottom') && props.label,
+            'p-disabled': instance.$attrs.disabled || instance.$attrs.disabled === '' || props.loading,
+            'p-button-loading': props.loading,
+            'p-button-loading-label-only': props.loading && !instance.hasIcon && props.label,
+            'p-button-link': props.link,
+            [`p-button-${props.severity}`]: props.severity,
+            'p-button-raised': props.raised,
+            'p-button-rounded': props.rounded,
+            'p-button-text': props.text,
+            'p-button-outlined': props.outlined,
+            'p-button-sm': props.size === 'small',
+            'p-button-lg': props.size === 'large',
+            'p-button-plain': props.plain
+        }
+    ],
+    loadingIcon: 'p-button-loading-icon pi-spin',
+    icon: ({ props }) => [
+        'p-button-icon',
+        {
+            'p-button-icon-left': props.iconPos === 'left' && props.label,
+            'p-button-icon-right': props.iconPos === 'right' && props.label,
+            'p-button-icon-top': props.iconPos === 'top' && props.label,
+            'p-button-icon-bottom': props.iconPos === 'bottom' && props.label
+        }
+    ],
+    label: 'p-button-label'
+};
+
+export default {
+    name: 'BaseButton',
+    extends: BaseComponent,
+    props: {
+        label: {
+            type: String,
+            default: null
+        },
+        icon: {
+            type: String,
+            default: null
+        },
+        iconPos: {
+            type: String,
+            default: 'left'
+        },
+        iconClass: {
+            type: String,
+            default: null
+        },
+        badge: {
+            type: String,
+            default: null
+        },
+        badgeClass: {
+            type: String,
+            default: null
+        },
+        loading: {
+            type: Boolean,
+            default: false
+        },
+        loadingIcon: {
+            type: String,
+            default: undefined
+        },
+        link: {
+            type: Boolean,
+            default: false
+        },
+        severity: {
+            type: String,
+            default: null
+        },
+        raised: {
+            type: Boolean,
+            default: false
+        },
+        rounded: {
+            type: Boolean,
+            default: false
+        },
+        text: {
+            type: Boolean,
+            default: false
+        },
+        outlined: {
+            type: Boolean,
+            default: false
+        },
+        size: {
+            type: String,
+            default: null
+        },
+        plain: {
+            type: Boolean,
+            default: false
+        }
+    },
+    css: {
+        classes
+    },
+    provide() {
+        return {
+            $parentInstance: this
+        };
+    }
+};
+</script>

package/button/Button.d.ts

@@ -8,6 +8,7 @@
  *
  */
 import { ButtonHTMLAttributes, VNode } from 'vue';
+import { ComponentHooks } from '../basecomponent';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
 export declare type ButtonPassThroughOptionType = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions) => ButtonPassThroughAttributes) | null | undefined;
@@ -16,7 +17,9 @@ export declare type ButtonPassThroughOptionType = ButtonPassThroughAttributes |
  * Custom passthrough(pt) option method.
  */
 export interface ButtonPassThroughMethodOptions {
+    instance: any;
     props: ButtonProps;
+    context: ButtonContext;
 }
 
 /**
@@ -44,6 +47,11 @@ export interface ButtonPassThroughOptions {
      * Uses to pass attributes to the badge's DOM element.
      */
     badge?: ButtonPassThroughOptionType;
+    /**
+     * Uses to manage all lifecycle hooks
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
 }
 
 /**
@@ -142,6 +150,22 @@ export interface ButtonProps extends ButtonHTMLAttributes {
      * @type {ButtonPassThroughOptions}
      */
     pt?: ButtonPassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
+}
+
+/**
+ * Defines current options in Button component.
+ */
+export interface ButtonContext {
+    /**
+     * Current disabled state of the element as a boolean.
+     * @defaultValue false
+     */
+    disabled: boolean;
 }
 
 /**