@valaxyjs/devtools 0.22.13 → 0.22.15

package/dist/client/assets/{splitpanes.es-oE07QrQG.js → splitpanes.es-qAuBPxFz.js}

@@ -1,9 +1,33 @@
-import { ae as getKeyValue, m as mergeProps, af as isFunction$1, ag as toCapitalCase, ah as service_default, ai as config_default, B as BaseStyle, aj as isString$1, ak as toFlatCase, al as resolve, am as isObject$1, an as isEmpty, ao as PrimeVueService, ap as isArray$1, M as getAttribute, aq as removeClass, ar as getHeight, as as getWidth, O as getOuterWidth, at as getOuterHeight, au as getOffset, av as addClass, aw as createElement, i as isNotEmpty, D as isClient, K as findSingle, c as createElementBlock, o as openBlock, a as createBaseVNode, b as renderSlot, z as createTextVNode, t as toDisplayString, h as resolveComponent, r as resolveDirective, w as withDirectives, k as createBlock, p as withCtx, d as createCommentVNode, n as normalizeClass, U as resolveDynamicComponent, ax as h, S as normalizeStyle } from './index-ChxUjQc_.js';
+import { ae as getKeyValue, m as mergeProps, af as isFunction$1, ag as toCapitalCase, ah as service_default, ai as config_default, B as BaseStyle, aj as isString$1, ak as toFlatCase, al as resolve, am as isObject$1, an as isEmpty, ao as PrimeVueService, ap as isArray$1, M as getAttribute, aq as removeClass, ar as getHeight, as as getWidth, O as getOuterWidth, at as getOuterHeight, au as getOffset, av as addClass, aw as createElement, ax as useId, i as isNotEmpty, K as findSingle, ay as isElement, c as createElementBlock, o as openBlock, a as createBaseVNode, b as renderSlot, z as createTextVNode, t as toDisplayString, h as resolveComponent, r as resolveDirective, w as withDirectives, k as createBlock, p as withCtx, d as createCommentVNode, n as normalizeClass, U as resolveDynamicComponent, az as useSlots, s as ref, aA as computed, v as watch, a6 as onMounted, aB as onBeforeUnmount, aC as provide, aD as inject, aE as getCurrentInstance, S as normalizeStyle, y as unref, aF as h, aG as nextTick } from './index-CUyzvQjw.js';
+
+// src/classnames/index.ts
+function cn(...args) {
+  if (args) {
+    let classes = [];
+    for (let i = 0; i < args.length; i++) {
+      const className = args[i];
+      if (!className) {
+        continue;
+      }
+      const type = typeof className;
+      if (type === "string" || type === "number") {
+        classes.push(className);
+      } else if (type === "object") {
+        const _classes = Array.isArray(className) ? [cn(...className)] : Object.entries(className).map(([key, value]) => value ? key : void 0);
+        classes = _classes.length ? classes.concat(_classes.filter((c) => !!c)) : classes;
+      }
+    }
+    return classes.join(" ").trim();
+  }
+  return void 0;
+}
+
+/* Injected with object hook! */
 
 // src/uuid/index.ts
 var lastIds = {};
 function uuid(prefix = "pui_id_") {
-  if (!lastIds.hasOwnProperty(prefix)) {
+  if (!Object.hasOwn(lastIds, prefix)) {
     lastIds[prefix] = 0;
   }
   lastIds[prefix]++;
@@ -34,7 +58,7 @@ var Base = {
 
 /* Injected with object hook! */
 
-function _typeof$4(o) { "@babel/helpers - typeof"; return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$4(o); }
+function _typeof$6(o) { "@babel/helpers - typeof"; return _typeof$6 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$6(o); }
 function _slicedToArray$1(r, e) { return _arrayWithHoles$1(r) || _iterableToArrayLimit$1(r, e) || _unsupportedIterableToArray$2(r, e) || _nonIterableRest$1(); }
 function _nonIterableRest$1() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray$2(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$2(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$2(r, a) : void 0; } }
@@ -42,10 +66,10 @@ function _arrayLikeToArray$2(r, a) { (null == a || a > r.length) && (a = r.lengt
 function _iterableToArrayLimit$1(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = true, o = false; try { if (i = (t = t.call(r)).next, 0 === l) ; else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = true, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles$1(r) { if (Array.isArray(r)) return r; }
 function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty$4(e, r, t) { return (r = _toPropertyKey$4(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
-function _toPropertyKey$4(t) { var i = _toPrimitive$4(t, "string"); return "symbol" == _typeof$4(i) ? i : i + ""; }
-function _toPrimitive$4(t, r) { if ("object" != _typeof$4(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$4(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty$6(e, r, t) { return (r = _toPropertyKey$6(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$6(t) { var i = _toPrimitive$6(t, "string"); return "symbol" == _typeof$6(i) ? i : i + ""; }
+function _toPrimitive$6(t, r) { if ("object" != _typeof$6(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$6(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var BaseDirective = {
   _getMeta: function _getMeta() {
     return [isObject$1(arguments.length <= 0 ? undefined : arguments[0]) ? undefined : arguments.length <= 0 ? undefined : arguments[0], resolve(isObject$1(arguments.length <= 0 ? undefined : arguments[0]) ? arguments.length <= 0 ? undefined : arguments[0] : arguments.length <= 1 ? undefined : arguments[1])];
@@ -84,7 +108,7 @@ var BaseDirective = {
     var instance = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     var datasetPrefix = 'data-pc-';
-    return _objectSpread$2(_objectSpread$2({}, key === 'root' && _defineProperty$4({}, "".concat(datasetPrefix, "name"), toFlatCase(instance.$name))), {}, _defineProperty$4({}, "".concat(datasetPrefix, "section"), toFlatCase(key)));
+    return _objectSpread$2(_objectSpread$2({}, key === 'root' && _defineProperty$6({}, "".concat(datasetPrefix, "name"), toFlatCase(instance.$name))), {}, _defineProperty$6({}, "".concat(datasetPrefix, "section"), toFlatCase(key)));
   },
   _getPT: function _getPT(pt) {
     var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -95,7 +119,7 @@ var BaseDirective = {
       var _key = toFlatCase(key);
       return (_computedValue$_key = computedValue === null || computedValue === void 0 ? void 0 : computedValue[_key]) !== null && _computedValue$_key !== void 0 ? _computedValue$_key : computedValue;
     };
-    return pt !== null && pt !== void 0 && pt.hasOwnProperty('_usept') ? {
+    return pt && Object.hasOwn(pt, '_usept') ? {
       _usept: pt['_usept'],
       originalValue: getValue(pt.originalValue),
       value: getValue(pt.value)
@@ -110,7 +134,7 @@ var BaseDirective = {
     var fn = function fn(value) {
       return callback(value, key, params);
     };
-    if (pt !== null && pt !== void 0 && pt.hasOwnProperty('_usept')) {
+    if (pt && Object.hasOwn(pt, '_usept')) {
       var _instance$$primevueCo2;
       var _ref4 = pt['_usept'] || ((_instance$$primevueCo2 = instance.$primevueConfig) === null || _instance$$primevueCo2 === void 0 ? void 0 : _instance$$primevueCo2.ptOptions) || {},
         _ref4$mergeSections = _ref4.mergeSections,
@@ -132,18 +156,23 @@ var BaseDirective = {
     var params = arguments.length > 4 ? arguments[4] : undefined;
     return BaseDirective._usePT(instance, defaultPT, callback, key, params);
   },
-  _loadStyles: function _loadStyles(el, binding, vnode) {
+  _loadStyles: function _loadStyles() {
     var _config$csp;
+    var instance = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var binding = arguments.length > 1 ? arguments[1] : undefined;
+    var vnode = arguments.length > 2 ? arguments[2] : undefined;
     var config = BaseDirective._getConfig(binding, vnode);
     var useStyleOptions = {
       nonce: config === null || config === void 0 || (_config$csp = config.csp) === null || _config$csp === void 0 ? void 0 : _config$csp.nonce
     };
-    BaseDirective._loadCoreStyles(el.$instance, useStyleOptions);
-    BaseDirective._loadThemeStyles(el.$instance, useStyleOptions);
-    BaseDirective._loadScopedThemeStyles(el.$instance, useStyleOptions);
-    BaseDirective._themeChangeListener(function () {
-      return BaseDirective._loadThemeStyles(el.$instance, useStyleOptions);
-    });
+    BaseDirective._loadCoreStyles(instance, useStyleOptions);
+    BaseDirective._loadThemeStyles(instance, useStyleOptions);
+    BaseDirective._loadScopedThemeStyles(instance, useStyleOptions);
+    BaseDirective._removeThemeListeners(instance);
+    instance.$loadStyles = function () {
+      return BaseDirective._loadThemeStyles(instance, useStyleOptions);
+    };
+    BaseDirective._themeChangeListener(instance.$loadStyles);
   },
   _loadCoreStyles: function _loadCoreStyles() {
     var _instance$$style, _instance$$style2;
@@ -179,7 +208,7 @@ var BaseDirective = {
       BaseStyle.load(global === null || global === void 0 ? void 0 : global.css, _objectSpread$2({
         name: 'global-variables'
       }, useStyleOptions));
-      BaseStyle.loadTheme(_objectSpread$2({
+      BaseStyle.loadStyle(_objectSpread$2({
         name: 'global-style'
       }, useStyleOptions), style);
       config_default.setLoadedStyleName('common');
@@ -194,7 +223,7 @@ var BaseDirective = {
       (_instance$$style8 = instance.$style) === null || _instance$$style8 === void 0 || _instance$$style8.load(css, _objectSpread$2({
         name: "".concat(instance.$style.name, "-variables")
       }, useStyleOptions));
-      (_instance$$style9 = instance.$style) === null || _instance$$style9 === void 0 || _instance$$style9.loadTheme(_objectSpread$2({
+      (_instance$$style9 = instance.$style) === null || _instance$$style9 === void 0 || _instance$$style9.loadStyle(_objectSpread$2({
         name: "".concat(instance.$style.name, "-style")
       }, useStyleOptions), _style);
       config_default.setLoadedStyleName(instance.$style.name);
@@ -230,6 +259,10 @@ var BaseDirective = {
     Base.clearLoadedStyleNames();
     service_default.on('theme:change', callback);
   },
+  _removeThemeListeners: function _removeThemeListeners() {
+    var instance = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    service_default.off('theme:change', instance.$loadStyles);
+  },
   _hook: function _hook(directiveName, hookName, el, binding, vnode, prevVnode) {
     var _binding$value, _config$pt;
     var name = "on".concat(toCapitalCase(hookName));
@@ -246,7 +279,7 @@ var BaseDirective = {
     selfHook === null || selfHook === void 0 || selfHook(instance, options);
     defaultHook === null || defaultHook === void 0 || defaultHook(instance, options);
   },
-  _mergeProps: function _mergeProps() {
+  /* eslint-disable-next-line no-unused-vars */_mergeProps: function _mergeProps() {
     var fn = arguments.length > 1 ? arguments[1] : undefined;
     for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key2 = 2; _key2 < _len; _key2++) {
       args[_key2 - 2] = arguments[_key2];
@@ -256,7 +289,7 @@ var BaseDirective = {
   _extend: function _extend(name) {
     var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     var handleHook = function handleHook(hook, el, binding, vnode, prevVnode) {
-      var _el$$pd, _el$$instance$hook, _el$$instance9, _el$$pd2;
+      var _el$$pd, _el$$instance$hook, _el$$instance, _el$$pd2;
       el._$instances = el._$instances || {};
       var config = BaseDirective._getConfig(binding, vnode);
       var $prevInstance = el._$instances[name] || {};
@@ -274,7 +307,7 @@ var BaseDirective = {
           inlineStyles: undefined,
           load: function load() {},
           loadCSS: function loadCSS() {},
-          loadTheme: function loadTheme() {}
+          loadStyle: function loadStyle() {}
         }, options === null || options === void 0 ? void 0 : options.style),
         $primevueConfig: config,
         $attrSelector: (_el$$pd = el.$pd) === null || _el$$pd === void 0 || (_el$$pd = _el$$pd[name]) === null || _el$$pd === void 0 ? void 0 : _el$$pd.attrSelector,
@@ -286,76 +319,90 @@ var BaseDirective = {
           });
         },
         isUnstyled: function isUnstyled() {
-          var _el$$instance, _el$$instance2;
-          return ((_el$$instance = el.$instance) === null || _el$$instance === void 0 || (_el$$instance = _el$$instance.$binding) === null || _el$$instance === void 0 || (_el$$instance = _el$$instance.value) === null || _el$$instance === void 0 ? void 0 : _el$$instance.unstyled) !== undefined ? (_el$$instance2 = el.$instance) === null || _el$$instance2 === void 0 || (_el$$instance2 = _el$$instance2.$binding) === null || _el$$instance2 === void 0 || (_el$$instance2 = _el$$instance2.value) === null || _el$$instance2 === void 0 ? void 0 : _el$$instance2.unstyled : config === null || config === void 0 ? void 0 : config.unstyled;
+          var _el$_$instances$name, _el$_$instances$name2;
+          return ((_el$_$instances$name = el._$instances[name]) === null || _el$_$instances$name === void 0 || (_el$_$instances$name = _el$_$instances$name.$binding) === null || _el$_$instances$name === void 0 || (_el$_$instances$name = _el$_$instances$name.value) === null || _el$_$instances$name === void 0 ? void 0 : _el$_$instances$name.unstyled) !== undefined ? (_el$_$instances$name2 = el._$instances[name]) === null || _el$_$instances$name2 === void 0 || (_el$_$instances$name2 = _el$_$instances$name2.$binding) === null || _el$_$instances$name2 === void 0 || (_el$_$instances$name2 = _el$_$instances$name2.value) === null || _el$_$instances$name2 === void 0 ? void 0 : _el$_$instances$name2.unstyled : config === null || config === void 0 ? void 0 : config.unstyled;
         },
         theme: function theme() {
-          var _el$$instance3;
-          return (_el$$instance3 = el.$instance) === null || _el$$instance3 === void 0 || (_el$$instance3 = _el$$instance3.$primevueConfig) === null || _el$$instance3 === void 0 ? void 0 : _el$$instance3.theme;
+          var _el$_$instances$name3;
+          return (_el$_$instances$name3 = el._$instances[name]) === null || _el$_$instances$name3 === void 0 || (_el$_$instances$name3 = _el$_$instances$name3.$primevueConfig) === null || _el$_$instances$name3 === void 0 ? void 0 : _el$_$instances$name3.theme;
         },
         preset: function preset() {
-          var _el$$instance4;
-          return (_el$$instance4 = el.$instance) === null || _el$$instance4 === void 0 || (_el$$instance4 = _el$$instance4.$binding) === null || _el$$instance4 === void 0 || (_el$$instance4 = _el$$instance4.value) === null || _el$$instance4 === void 0 ? void 0 : _el$$instance4.dt;
+          var _el$_$instances$name4;
+          return (_el$_$instances$name4 = el._$instances[name]) === null || _el$_$instances$name4 === void 0 || (_el$_$instances$name4 = _el$_$instances$name4.$binding) === null || _el$_$instances$name4 === void 0 || (_el$_$instances$name4 = _el$_$instances$name4.value) === null || _el$_$instances$name4 === void 0 ? void 0 : _el$_$instances$name4.dt;
         },
         /* instance's methods */
         ptm: function ptm() {
-          var _el$$instance5;
+          var _el$_$instances$name5;
           var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
           var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-          return BaseDirective._getPTValue(el.$instance, (_el$$instance5 = el.$instance) === null || _el$$instance5 === void 0 || (_el$$instance5 = _el$$instance5.$binding) === null || _el$$instance5 === void 0 || (_el$$instance5 = _el$$instance5.value) === null || _el$$instance5 === void 0 ? void 0 : _el$$instance5.pt, key, _objectSpread$2({}, params));
+          return BaseDirective._getPTValue(el._$instances[name], (_el$_$instances$name5 = el._$instances[name]) === null || _el$_$instances$name5 === void 0 || (_el$_$instances$name5 = _el$_$instances$name5.$binding) === null || _el$_$instances$name5 === void 0 || (_el$_$instances$name5 = _el$_$instances$name5.value) === null || _el$_$instances$name5 === void 0 ? void 0 : _el$_$instances$name5.pt, key, _objectSpread$2({}, params));
         },
         ptmo: function ptmo() {
           var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
           var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
           var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-          return BaseDirective._getPTValue(el.$instance, obj, key, params, false);
+          return BaseDirective._getPTValue(el._$instances[name], obj, key, params, false);
         },
         cx: function cx() {
-          var _el$$instance6, _el$$instance7;
+          var _el$_$instances$name6, _el$_$instances$name7;
           var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
           var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-          return !((_el$$instance6 = el.$instance) !== null && _el$$instance6 !== void 0 && _el$$instance6.isUnstyled()) ? BaseDirective._getOptionValue((_el$$instance7 = el.$instance) === null || _el$$instance7 === void 0 || (_el$$instance7 = _el$$instance7.$style) === null || _el$$instance7 === void 0 ? void 0 : _el$$instance7.classes, key, _objectSpread$2({}, params)) : undefined;
+          return !((_el$_$instances$name6 = el._$instances[name]) !== null && _el$_$instances$name6 !== void 0 && _el$_$instances$name6.isUnstyled()) ? BaseDirective._getOptionValue((_el$_$instances$name7 = el._$instances[name]) === null || _el$_$instances$name7 === void 0 || (_el$_$instances$name7 = _el$_$instances$name7.$style) === null || _el$_$instances$name7 === void 0 ? void 0 : _el$_$instances$name7.classes, key, _objectSpread$2({}, params)) : undefined;
         },
         sx: function sx() {
-          var _el$$instance8;
+          var _el$_$instances$name8;
           var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
           var when = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
           var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-          return when ? BaseDirective._getOptionValue((_el$$instance8 = el.$instance) === null || _el$$instance8 === void 0 || (_el$$instance8 = _el$$instance8.$style) === null || _el$$instance8 === void 0 ? void 0 : _el$$instance8.inlineStyles, key, _objectSpread$2({}, params)) : undefined;
+          return when ? BaseDirective._getOptionValue((_el$_$instances$name8 = el._$instances[name]) === null || _el$_$instances$name8 === void 0 || (_el$_$instances$name8 = _el$_$instances$name8.$style) === null || _el$_$instances$name8 === void 0 ? void 0 : _el$_$instances$name8.inlineStyles, key, _objectSpread$2({}, params)) : undefined;
         }
       }, $options);
       el.$instance = el._$instances[name]; // pass instance data to hooks
-      (_el$$instance$hook = (_el$$instance9 = el.$instance)[hook]) === null || _el$$instance$hook === void 0 || _el$$instance$hook.call(_el$$instance9, el, binding, vnode, prevVnode); // handle hook in directive implementation
+      (_el$$instance$hook = (_el$$instance = el.$instance)[hook]) === null || _el$$instance$hook === void 0 || _el$$instance$hook.call(_el$$instance, el, binding, vnode, prevVnode); // handle hook in directive implementation
       el["$".concat(name)] = el.$instance; // expose all options with $<directive_name>
       BaseDirective._hook(name, hook, el, binding, vnode, prevVnode); // handle hooks during directive uses (global and self-definition)
 
       el.$pd || (el.$pd = {});
       el.$pd[name] = _objectSpread$2(_objectSpread$2({}, (_el$$pd2 = el.$pd) === null || _el$$pd2 === void 0 ? void 0 : _el$$pd2[name]), {}, {
         name: name,
-        instance: el.$instance
+        instance: el._$instances[name]
       });
     };
-    var handleWatch = function handleWatch(el) {
-      var _el$$instance10, _watchers$config, _el$$instance11, _watchers$configRipp, _el$$instance12;
-      var watchers = (_el$$instance10 = el.$instance) === null || _el$$instance10 === void 0 ? void 0 : _el$$instance10.watch;
-
-      // for 'config'
-      watchers === null || watchers === void 0 || (_watchers$config = watchers['config']) === null || _watchers$config === void 0 || _watchers$config.call(el.$instance, (_el$$instance11 = el.$instance) === null || _el$$instance11 === void 0 ? void 0 : _el$$instance11.$primevueConfig);
-      PrimeVueService.on('config:change', function (_ref8) {
-        var _watchers$config2;
+    var handleWatchers = function handleWatchers(el) {
+      var _watchers$config2, _watchers$configRipp2, _instance$$primevueCo3;
+      var instance = el._$instances[name];
+      var watchers = instance === null || instance === void 0 ? void 0 : instance.watch;
+      var handleWatchConfig = function handleWatchConfig(_ref8) {
+        var _watchers$config;
         var newValue = _ref8.newValue,
           oldValue = _ref8.oldValue;
-        return watchers === null || watchers === void 0 || (_watchers$config2 = watchers['config']) === null || _watchers$config2 === void 0 ? void 0 : _watchers$config2.call(el.$instance, newValue, oldValue);
-      });
-
-      // for 'config.ripple'
-      watchers === null || watchers === void 0 || (_watchers$configRipp = watchers['config.ripple']) === null || _watchers$configRipp === void 0 || _watchers$configRipp.call(el.$instance, (_el$$instance12 = el.$instance) === null || _el$$instance12 === void 0 || (_el$$instance12 = _el$$instance12.$primevueConfig) === null || _el$$instance12 === void 0 ? void 0 : _el$$instance12.ripple);
-      PrimeVueService.on('config:ripple:change', function (_ref9) {
-        var _watchers$configRipp2;
+        return watchers === null || watchers === void 0 || (_watchers$config = watchers['config']) === null || _watchers$config === void 0 ? void 0 : _watchers$config.call(instance, newValue, oldValue);
+      };
+      var handleWatchConfigRipple = function handleWatchConfigRipple(_ref9) {
+        var _watchers$configRipp;
         var newValue = _ref9.newValue,
           oldValue = _ref9.oldValue;
-        return watchers === null || watchers === void 0 || (_watchers$configRipp2 = watchers['config.ripple']) === null || _watchers$configRipp2 === void 0 ? void 0 : _watchers$configRipp2.call(el.$instance, newValue, oldValue);
-      });
+        return watchers === null || watchers === void 0 || (_watchers$configRipp = watchers['config.ripple']) === null || _watchers$configRipp === void 0 ? void 0 : _watchers$configRipp.call(instance, newValue, oldValue);
+      };
+      instance.$watchersCallback = {
+        config: handleWatchConfig,
+        'config.ripple': handleWatchConfigRipple
+      };
+
+      // for 'config'
+      watchers === null || watchers === void 0 || (_watchers$config2 = watchers['config']) === null || _watchers$config2 === void 0 || _watchers$config2.call(instance, instance === null || instance === void 0 ? void 0 : instance.$primevueConfig);
+      PrimeVueService.on('config:change', handleWatchConfig);
+
+      // for 'config.ripple'
+      watchers === null || watchers === void 0 || (_watchers$configRipp2 = watchers['config.ripple']) === null || _watchers$configRipp2 === void 0 || _watchers$configRipp2.call(instance, instance === null || instance === void 0 || (_instance$$primevueCo3 = instance.$primevueConfig) === null || _instance$$primevueCo3 === void 0 ? void 0 : _instance$$primevueCo3.ripple);
+      PrimeVueService.on('config:ripple:change', handleWatchConfigRipple);
+    };
+    var stopWatchers = function stopWatchers(el) {
+      var watchers = el._$instances[name].$watchersCallback;
+      if (watchers) {
+        PrimeVueService.off('config:change', watchers.config);
+        PrimeVueService.off('config:ripple:change', watchers['config.ripple']);
+      }
     };
     return {
       created: function created(el, binding, vnode, prevVnode) {
@@ -367,27 +414,33 @@ var BaseDirective = {
         handleHook('created', el, binding, vnode, prevVnode);
       },
       beforeMount: function beforeMount(el, binding, vnode, prevVnode) {
-        BaseDirective._loadStyles(el, binding, vnode);
+        var _el$$pd$name;
+        BaseDirective._loadStyles((_el$$pd$name = el.$pd[name]) === null || _el$$pd$name === void 0 ? void 0 : _el$$pd$name.instance, binding, vnode);
         handleHook('beforeMount', el, binding, vnode, prevVnode);
-        handleWatch(el);
+        handleWatchers(el);
       },
       mounted: function mounted(el, binding, vnode, prevVnode) {
-        BaseDirective._loadStyles(el, binding, vnode);
+        var _el$$pd$name2;
+        BaseDirective._loadStyles((_el$$pd$name2 = el.$pd[name]) === null || _el$$pd$name2 === void 0 ? void 0 : _el$$pd$name2.instance, binding, vnode);
         handleHook('mounted', el, binding, vnode, prevVnode);
       },
       beforeUpdate: function beforeUpdate(el, binding, vnode, prevVnode) {
         handleHook('beforeUpdate', el, binding, vnode, prevVnode);
       },
       updated: function updated(el, binding, vnode, prevVnode) {
-        BaseDirective._loadStyles(el, binding, vnode);
+        var _el$$pd$name3;
+        BaseDirective._loadStyles((_el$$pd$name3 = el.$pd[name]) === null || _el$$pd$name3 === void 0 ? void 0 : _el$$pd$name3.instance, binding, vnode);
         handleHook('updated', el, binding, vnode, prevVnode);
       },
       beforeUnmount: function beforeUnmount(el, binding, vnode, prevVnode) {
+        var _el$$pd$name4;
+        stopWatchers(el);
+        BaseDirective._removeThemeListeners((_el$$pd$name4 = el.$pd[name]) === null || _el$$pd$name4 === void 0 ? void 0 : _el$$pd$name4.instance);
         handleHook('beforeUnmount', el, binding, vnode, prevVnode);
       },
       unmounted: function unmounted(el, binding, vnode, prevVnode) {
-        var _el$$instance13;
-        (_el$$instance13 = el.$instance) === null || _el$$instance13 === void 0 || (_el$$instance13 = _el$$instance13.scopedStyleEl) === null || _el$$instance13 === void 0 || (_el$$instance13 = _el$$instance13.value) === null || _el$$instance13 === void 0 || _el$$instance13.remove();
+        var _el$$pd$name5;
+        (_el$$pd$name5 = el.$pd[name]) === null || _el$$pd$name5 === void 0 || (_el$$pd$name5 = _el$$pd$name5.instance) === null || _el$$pd$name5 === void 0 || (_el$$pd$name5 = _el$$pd$name5.scopedStyleEl) === null || _el$$pd$name5 === void 0 || (_el$$pd$name5 = _el$$pd$name5.value) === null || _el$$pd$name5 === void 0 || _el$$pd$name5.remove();
         handleHook('unmounted', el, binding, vnode, prevVnode);
       }
     };
@@ -412,16 +465,14 @@ var BaseDirective = {
 
 /* Injected with object hook! */
 
-var theme$2 = function theme(_ref) {
-  var dt = _ref.dt;
-  return "\n.p-ink {\n    display: block;\n    position: absolute;\n    background: ".concat(dt('ripple.background'), ";\n    border-radius: 100%;\n    transform: scale(0);\n    pointer-events: none;\n}\n\n.p-ink-active {\n    animation: ripple 0.4s linear;\n}\n\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n");
-};
+var style$2=({dt:n})=>`\n.p-ink {\n    display: block;\n    position: absolute;\n    background: ${n("ripple.background")};\n    border-radius: 100%;\n    transform: scale(0);\n    pointer-events: none;\n}\n\n.p-ink-active {\n    animation: ripple 0.4s linear;\n}\n\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n`;/* Injected with object hook! */
+
 var classes$2 = {
   root: 'p-ink'
 };
 var RippleStyle = BaseStyle.extend({
   name: 'ripple-directive',
-  theme: theme$2,
+  style: style$2,
   classes: classes$2
 });
 
@@ -432,16 +483,16 @@ var BaseRipple = BaseDirective.extend({
   style: RippleStyle
 });
 
-function _typeof$3(o) { "@babel/helpers - typeof"; return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$3(o); }
+function _typeof$5(o) { "@babel/helpers - typeof"; return _typeof$5 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$5(o); }
 function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray$1(r) || _unsupportedIterableToArray$1(r) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray$1(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$1(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$1(r, a) : void 0; } }
 function _iterableToArray$1(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
 function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray$1(r); }
 function _arrayLikeToArray$1(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _defineProperty$3(e, r, t) { return (r = _toPropertyKey$3(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
-function _toPropertyKey$3(t) { var i = _toPrimitive$3(t, "string"); return "symbol" == _typeof$3(i) ? i : i + ""; }
-function _toPrimitive$3(t, r) { if ("object" != _typeof$3(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$3(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _defineProperty$5(e, r, t) { return (r = _toPropertyKey$5(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$5(t) { var i = _toPrimitive$5(t, "string"); return "symbol" == _typeof$5(i) ? i : i + ""; }
+function _toPrimitive$5(t, r) { if ("object" != _typeof$5(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$5(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var Ripple = BaseRipple.extend('ripple', {
   watch: {
     'config.ripple': function configRipple(newValue) {
@@ -469,16 +520,19 @@ var Ripple = BaseRipple.extend('ripple', {
       el.removeEventListener('mousedown', this.onMouseDown.bind(this));
     },
     createRipple: function createRipple(el) {
-      var ink = createElement('span', _defineProperty$3(_defineProperty$3({
-        role: 'presentation',
-        'aria-hidden': true,
-        'data-p-ink': true,
-        'data-p-ink-active': false,
-        "class": !this.isUnstyled() && this.cx('root'),
-        onAnimationEnd: this.onAnimationEnd.bind(this)
-      }, this.$attrSelector, ''), 'p-bind', this.ptm('root')));
-      el.appendChild(ink);
-      this.$el = ink;
+      var ink = this.getInk(el);
+      if (!ink) {
+        ink = createElement('span', _defineProperty$5(_defineProperty$5({
+          role: 'presentation',
+          'aria-hidden': true,
+          'data-p-ink': true,
+          'data-p-ink-active': false,
+          "class": !this.isUnstyled() && this.cx('root'),
+          onAnimationEnd: this.onAnimationEnd.bind(this)
+        }, this.$attrSelector, ''), 'p-bind', this.ptm('root')));
+        el.appendChild(ink);
+        this.$el = ink;
+      }
     },
     remove: function remove(el) {
       var ink = this.getInk(el);
@@ -534,13 +588,22 @@ var Ripple = BaseRipple.extend('ripple', {
 });
 
 
+/* Injected with object hook! */
+
+function useAttrSelector() {
+  var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'pc';
+  var idx = useId();
+  return "".concat(prefix).concat(idx.replace('v-', '').replaceAll('-', '_'));
+}
+
+
 /* Injected with object hook! */
 
 var BaseComponentStyle = BaseStyle.extend({
   name: 'common'
 });
 
-function _typeof$2(o) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$2(o); }
+function _typeof$4(o) { "@babel/helpers - typeof"; return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$4(o); }
 function _toArray(r) { return _arrayWithHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableRest(); }
 function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
@@ -550,10 +613,10 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = true, o = false; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = true, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty$2(e, r, t) { return (r = _toPropertyKey$2(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
-function _toPropertyKey$2(t) { var i = _toPrimitive$2(t, "string"); return "symbol" == _typeof$2(i) ? i : i + ""; }
-function _toPrimitive$2(t, r) { if ("object" != _typeof$2(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$2(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty$4(e, r, t) { return (r = _toPropertyKey$4(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$4(t) { var i = _toPrimitive$4(t, "string"); return "symbol" == _typeof$4(i) ? i : i + ""; }
+function _toPrimitive$4(t, r) { if ("object" != _typeof$4(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$4(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script$5 = {
   name: 'BaseComponent',
   props: {
@@ -583,6 +646,7 @@ var script$5 = {
     isUnstyled: {
       immediate: true,
       handler: function handler(newValue) {
+        service_default.off('theme:change', this._loadCoreStyles);
         if (!newValue) {
           this._loadCoreStyles();
           this._themeChangeListener(this._loadCoreStyles); // update styles with theme settings
@@ -591,13 +655,15 @@ var script$5 = {
     },
     dt: {
       immediate: true,
-      handler: function handler(newValue) {
+      handler: function handler(newValue, oldValue) {
         var _this = this;
+        service_default.off('theme:change', this._themeScopedListener);
         if (newValue) {
           this._loadScopedThemeStyles(newValue);
-          this._themeChangeListener(function () {
+          this._themeScopedListener = function () {
             return _this._loadScopedThemeStyles(newValue);
-          });
+          };
+          this._themeChangeListener(this._themeScopedListener);
         } else {
           this._unloadScopedThemeStyles();
         }
@@ -606,6 +672,7 @@ var script$5 = {
   },
   scopedStyleEl: undefined,
   rootEl: undefined,
+  uid: undefined,
   $attrSelector: undefined,
   beforeCreate: function beforeCreate() {
     var _this$pt, _this$pt2, _this$pt3, _ref, _ref$onBeforeCreate, _this$$primevueConfig, _this$$primevue, _this$$primevue2, _this$$primevue3, _ref2, _ref2$onBeforeCreate;
@@ -617,16 +684,17 @@ var script$5 = {
     var originalValueInConfig = _useptInConfig ? (_this$$primevue = this.$primevue) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.config) === null || _this$$primevue === void 0 || (_this$$primevue = _this$$primevue.pt) === null || _this$$primevue === void 0 ? void 0 : _this$$primevue.originalValue : undefined;
     var valueInConfig = _useptInConfig ? (_this$$primevue2 = this.$primevue) === null || _this$$primevue2 === void 0 || (_this$$primevue2 = _this$$primevue2.config) === null || _this$$primevue2 === void 0 || (_this$$primevue2 = _this$$primevue2.pt) === null || _this$$primevue2 === void 0 ? void 0 : _this$$primevue2.value : (_this$$primevue3 = this.$primevue) === null || _this$$primevue3 === void 0 || (_this$$primevue3 = _this$$primevue3.config) === null || _this$$primevue3 === void 0 ? void 0 : _this$$primevue3.pt;
     (_ref2 = valueInConfig || originalValueInConfig) === null || _ref2 === void 0 || (_ref2 = _ref2[this.$.type.name]) === null || _ref2 === void 0 || (_ref2 = _ref2.hooks) === null || _ref2 === void 0 || (_ref2$onBeforeCreate = _ref2['onBeforeCreate']) === null || _ref2$onBeforeCreate === void 0 || _ref2$onBeforeCreate.call(_ref2);
-    this.$attrSelector = uuid('pc');
+    this.$attrSelector = useAttrSelector();
+    this.uid = this.$attrs.id || this.$attrSelector.replace('pc', 'pv_id_');
   },
   created: function created() {
     this._hook('onCreated');
   },
   beforeMount: function beforeMount() {
-    // @todo - improve performance
-    this.rootEl = findSingle(this.$el, "[data-pc-name=\"".concat(toFlatCase(this.$.type.name), "\"]"));
+    var _this$$el;
+    // @deprecated - remove in v5
+    this.rootEl = findSingle(isElement(this.$el) ? this.$el : (_this$$el = this.$el) === null || _this$$el === void 0 ? void 0 : _this$$el.parentElement, "[".concat(this.$attrSelector, "]"));
     if (this.rootEl) {
-      this.$attrSelector && !this.rootEl.hasAttribute(this.$attrSelector) && this.rootEl.setAttribute(this.$attrSelector, '');
       this.rootEl.$pc = _objectSpread$1({
         name: this.$.type.name,
         attrSelector: this.$attrSelector
@@ -648,6 +716,7 @@ var script$5 = {
     this._hook('onBeforeUnmount');
   },
   unmounted: function unmounted() {
+    this._removeThemeListeners();
     this._unloadScopedThemeStyles();
     this._hook('onUnmounted');
   },
@@ -666,19 +735,18 @@ var script$5 = {
       }
       return isFunction$1(fn) ? fn.apply(void 0, args) : mergeProps.apply(void 0, args);
     },
+    _load: function _load() {
+      // @todo
+      if (!Base.isStyleNameLoaded('base')) {
+        BaseStyle.loadCSS(this.$styleOptions);
+        this._loadGlobalStyles();
+        Base.setLoadedStyleName('base');
+      }
+      this._loadThemeStyles();
+    },
     _loadStyles: function _loadStyles() {
-      var _this2 = this;
-      var _load = function _load() {
-        // @todo
-        if (!Base.isStyleNameLoaded('base')) {
-          BaseStyle.loadCSS(_this2.$styleOptions);
-          _this2._loadGlobalStyles();
-          Base.setLoadedStyleName('base');
-        }
-        _this2._loadThemeStyles();
-      };
-      _load();
-      this._themeChangeListener(_load);
+      this._load();
+      this._themeChangeListener(this._load);
     },
     _loadCoreStyles: function _loadCoreStyles() {
       var _this$$style, _this$$style2;
@@ -725,7 +793,7 @@ var script$5 = {
         BaseStyle.load(global === null || global === void 0 ? void 0 : global.css, _objectSpread$1({
           name: 'global-variables'
         }, this.$styleOptions));
-        BaseStyle.loadTheme(_objectSpread$1({
+        BaseStyle.loadStyle(_objectSpread$1({
           name: 'global-style'
         }, this.$styleOptions), style);
         config_default.setLoadedStyleName('common');
@@ -740,7 +808,7 @@ var script$5 = {
         (_this$$style7 = this.$style) === null || _this$$style7 === void 0 || _this$$style7.load(css, _objectSpread$1({
           name: "".concat(this.$style.name, "-variables")
         }, this.$styleOptions));
-        (_this$$style8 = this.$style) === null || _this$$style8 === void 0 || _this$$style8.loadTheme(_objectSpread$1({
+        (_this$$style8 = this.$style) === null || _this$$style8 === void 0 || _this$$style8.loadStyle(_objectSpread$1({
           name: "".concat(this.$style.name, "-style")
         }, this.$styleOptions), _style);
         config_default.setLoadedStyleName(this.$style.name);
@@ -775,6 +843,11 @@ var script$5 = {
       Base.clearLoadedStyleNames();
       service_default.on('theme:change', callback);
     },
+    _removeThemeListeners: function _removeThemeListeners() {
+      service_default.off('theme:change', this._loadCoreStyles);
+      service_default.off('theme:change', this._load);
+      service_default.off('theme:change', this._themeScopedListener);
+    },
     _getHostInstance: function _getHostInstance(instance) {
       return instance ? this.$options.hostName ? instance.$.type.name === this.$options.hostName ? instance : this._getHostInstance(instance.$parentInstance) : instance.$parentInstance : undefined;
     },
@@ -821,7 +894,7 @@ var script$5 = {
       var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
       var datasetPrefix = 'data-pc-';
       var isExtended = key === 'root' && isNotEmpty((_this$pt4 = this.pt) === null || _this$pt4 === void 0 ? void 0 : _this$pt4['data-pc-section']);
-      return key !== 'transition' && _objectSpread$1(_objectSpread$1({}, key === 'root' && _objectSpread$1(_objectSpread$1(_defineProperty$2({}, "".concat(datasetPrefix, "name"), toFlatCase(isExtended ? (_this$pt5 = this.pt) === null || _this$pt5 === void 0 ? void 0 : _this$pt5['data-pc-section'] : this.$.type.name)), isExtended && _defineProperty$2({}, "".concat(datasetPrefix, "extend"), toFlatCase(this.$.type.name))), isClient() && _defineProperty$2({}, "".concat(this.$attrSelector), ''))), {}, _defineProperty$2({}, "".concat(datasetPrefix, "section"), toFlatCase(key)));
+      return key !== 'transition' && _objectSpread$1(_objectSpread$1({}, key === 'root' && _objectSpread$1(_objectSpread$1(_defineProperty$4({}, "".concat(datasetPrefix, "name"), toFlatCase(isExtended ? (_this$pt5 = this.pt) === null || _this$pt5 === void 0 ? void 0 : _this$pt5['data-pc-section'] : this.$.type.name)), isExtended && _defineProperty$4({}, "".concat(datasetPrefix, "extend"), toFlatCase(this.$.type.name))), {}, _defineProperty$4({}, "".concat(this.$attrSelector), ''))), {}, _defineProperty$4({}, "".concat(datasetPrefix, "section"), toFlatCase(key)));
     },
     _getPTClassValue: function _getPTClassValue() {
       var value = this._getOptionValue.apply(this, arguments);
@@ -830,16 +903,16 @@ var script$5 = {
       } : value;
     },
     _getPT: function _getPT(pt) {
-      var _this3 = this;
+      var _this2 = this;
       var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
       var callback = arguments.length > 2 ? arguments[2] : undefined;
       var getValue = function getValue(value) {
-        var _ref9;
+        var _ref8;
         var checkSameKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
         var computedValue = callback ? callback(value) : value;
         var _key = toFlatCase(key);
-        var _cKey = toFlatCase(_this3.$name);
-        return (_ref9 = checkSameKey ? _key !== _cKey ? computedValue === null || computedValue === void 0 ? void 0 : computedValue[_key] : undefined : computedValue === null || computedValue === void 0 ? void 0 : computedValue[_key]) !== null && _ref9 !== void 0 ? _ref9 : computedValue;
+        var _cKey = toFlatCase(_this2.$name);
+        return (_ref8 = checkSameKey ? _key !== _cKey ? computedValue === null || computedValue === void 0 ? void 0 : computedValue[_key] : undefined : computedValue === null || computedValue === void 0 ? void 0 : computedValue[_key]) !== null && _ref8 !== void 0 ? _ref8 : computedValue;
       };
       return pt !== null && pt !== void 0 && pt.hasOwnProperty('_usept') ? {
         _usept: pt['_usept'],
@@ -853,11 +926,11 @@ var script$5 = {
       };
       if (pt !== null && pt !== void 0 && pt.hasOwnProperty('_usept')) {
         var _this$$primevueConfig3;
-        var _ref10 = pt['_usept'] || ((_this$$primevueConfig3 = this.$primevueConfig) === null || _this$$primevueConfig3 === void 0 ? void 0 : _this$$primevueConfig3.ptOptions) || {},
-          _ref10$mergeSections = _ref10.mergeSections,
-          mergeSections = _ref10$mergeSections === void 0 ? true : _ref10$mergeSections,
-          _ref10$mergeProps = _ref10.mergeProps,
-          useMergeProps = _ref10$mergeProps === void 0 ? false : _ref10$mergeProps;
+        var _ref9 = pt['_usept'] || ((_this$$primevueConfig3 = this.$primevueConfig) === null || _this$$primevueConfig3 === void 0 ? void 0 : _this$$primevueConfig3.ptOptions) || {},
+          _ref9$mergeSections = _ref9.mergeSections,
+          mergeSections = _ref9$mergeSections === void 0 ? true : _ref9$mergeSections,
+          _ref9$mergeProps = _ref9.mergeProps,
+          useMergeProps = _ref9$mergeProps === void 0 ? false : _ref9$mergeProps;
         var originalValue = fn(pt.originalValue);
         var value = fn(pt.value);
         if (originalValue === undefined && value === undefined) return undefined;else if (isString$1(value)) return value;else if (isString$1(originalValue)) return originalValue;
@@ -877,10 +950,13 @@ var script$5 = {
       return this._getPTValue(this.pt, key, _objectSpread$1(_objectSpread$1({}, this.$params), params));
     },
     ptmi: function ptmi() {
+      var _attrs$id;
       var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
       var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
       // inheritAttrs:true
-      return mergeProps(this.$_attrsWithoutPT, this.ptm(key, params));
+      var attrs = mergeProps(this.$_attrsWithoutPT, this.ptm(key, params));
+      (attrs === null || attrs === void 0 ? void 0 : attrs.hasOwnProperty('id')) && ((_attrs$id = attrs.id) !== null && _attrs$id !== void 0 ? _attrs$id : attrs.id = this.$id);
+      return attrs;
     },
     ptmo: function ptmo() {
       var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -910,30 +986,33 @@ var script$5 = {
   computed: {
     globalPT: function globalPT() {
       var _this$$primevueConfig4,
-        _this4 = this;
+        _this3 = this;
       return this._getPT((_this$$primevueConfig4 = this.$primevueConfig) === null || _this$$primevueConfig4 === void 0 ? void 0 : _this$$primevueConfig4.pt, undefined, function (value) {
         return resolve(value, {
-          instance: _this4
+          instance: _this3
         });
       });
     },
     defaultPT: function defaultPT() {
       var _this$$primevueConfig5,
-        _this5 = this;
+        _this4 = this;
       return this._getPT((_this$$primevueConfig5 = this.$primevueConfig) === null || _this$$primevueConfig5 === void 0 ? void 0 : _this$$primevueConfig5.pt, undefined, function (value) {
-        return _this5._getOptionValue(value, _this5.$name, _objectSpread$1({}, _this5.$params)) || resolve(value, _objectSpread$1({}, _this5.$params));
+        return _this4._getOptionValue(value, _this4.$name, _objectSpread$1({}, _this4.$params)) || resolve(value, _objectSpread$1({}, _this4.$params));
       });
     },
     isUnstyled: function isUnstyled() {
       var _this$$primevueConfig6;
       return this.unstyled !== undefined ? this.unstyled : (_this$$primevueConfig6 = this.$primevueConfig) === null || _this$$primevueConfig6 === void 0 ? void 0 : _this$$primevueConfig6.unstyled;
     },
+    $id: function $id() {
+      return this.$attrs.id || this.uid;
+    },
     $inProps: function $inProps() {
       var _this$$$vnode;
       var nodePropKeys = Object.keys(((_this$$$vnode = this.$.vnode) === null || _this$$$vnode === void 0 ? void 0 : _this$$$vnode.props) || {});
-      return Object.fromEntries(Object.entries(this.$props).filter(function (_ref11) {
-        var _ref12 = _slicedToArray(_ref11, 1),
-          k = _ref12[0];
+      return Object.fromEntries(Object.entries(this.$props).filter(function (_ref10) {
+        var _ref11 = _slicedToArray(_ref10, 1),
+          k = _ref11[0];
         return nodePropKeys === null || nodePropKeys === void 0 ? void 0 : nodePropKeys.includes(k);
       }));
     },
@@ -947,7 +1026,7 @@ var script$5 = {
         inlineStyles: undefined,
         load: function load() {},
         loadCSS: function loadCSS() {},
-        loadTheme: function loadTheme() {}
+        loadStyle: function loadStyle() {}
       }, (this._getHostInstance(this) || {}).$style), this.$options.style);
     },
     $styleOptions: function $styleOptions() {
@@ -979,14 +1058,14 @@ var script$5 = {
       };
     },
     $_attrsPT: function $_attrsPT() {
-      return Object.entries(this.$attrs || {}).filter(function (_ref13) {
-        var _ref14 = _slicedToArray(_ref13, 1),
-          key = _ref14[0];
+      return Object.entries(this.$attrs || {}).filter(function (_ref12) {
+        var _ref13 = _slicedToArray(_ref12, 1),
+          key = _ref13[0];
         return key === null || key === void 0 ? void 0 : key.startsWith('pt:');
-      }).reduce(function (result, _ref15) {
-        var _ref16 = _slicedToArray(_ref15, 2),
-          key = _ref16[0],
-          value = _ref16[1];
+      }).reduce(function (result, _ref14) {
+        var _ref15 = _slicedToArray(_ref14, 2),
+          key = _ref15[0],
+          value = _ref15[1];
         var _key$split = key.split(':'),
           _key$split2 = _toArray(_key$split),
           rest = _key$split2.slice(1);
@@ -998,14 +1077,14 @@ var script$5 = {
       }, {});
     },
     $_attrsWithoutPT: function $_attrsWithoutPT() {
-      return Object.entries(this.$attrs || {}).filter(function (_ref17) {
-        var _ref18 = _slicedToArray(_ref17, 1),
-          key = _ref18[0];
+      return Object.entries(this.$attrs || {}).filter(function (_ref16) {
+        var _ref17 = _slicedToArray(_ref16, 1),
+          key = _ref17[0];
         return !(key !== null && key !== void 0 && key.startsWith('pt:'));
-      }).reduce(function (acc, _ref19) {
-        var _ref20 = _slicedToArray(_ref19, 2),
-          key = _ref20[0],
-          value = _ref20[1];
+      }).reduce(function (acc, _ref18) {
+        var _ref19 = _slicedToArray(_ref18, 2),
+          key = _ref19[0],
+          value = _ref19[1];
         acc[key] = value;
         return acc;
       }, {});
@@ -1624,26 +1703,6 @@ const toFiniteNumber = (value, defaultValue) => {
   return value != null && Number.isFinite(value = +value) ? value : defaultValue;
 };
 
-const ALPHA = 'abcdefghijklmnopqrstuvwxyz';
-
-const DIGIT = '0123456789';
-
-const ALPHABET = {
-  DIGIT,
-  ALPHA,
-  ALPHA_DIGIT: ALPHA + ALPHA.toUpperCase() + DIGIT
-};
-
-const generateString = (size = 16, alphabet = ALPHABET.ALPHA_DIGIT) => {
-  let str = '';
-  const {length} = alphabet;
-  while (size--) {
-    str += alphabet[Math.random() * length|0];
-  }
-
-  return str;
-};
-
 /**
  * If the thing is a FormData object, return true, otherwise return false.
  *
@@ -1771,8 +1830,6 @@ const utils$1 = {
   findKey,
   global: _global,
   isContextDefined,
-  ALPHABET,
-  generateString,
   isSpecCompliantForm,
   toJSONObject,
   isAsyncFn,
@@ -3322,8 +3379,9 @@ function combineURLs(baseURL, relativeURL) {
  *
  * @returns {string} The combined full path
  */
-function buildFullPath(baseURL, requestedURL) {
-  if (baseURL && !isAbsoluteURL(requestedURL)) {
+function buildFullPath(baseURL, requestedURL, allowAbsoluteUrls) {
+  let isRelativeUrl = !isAbsoluteURL(requestedURL);
+  if (baseURL && isRelativeUrl || allowAbsoluteUrls == false) {
     return combineURLs(baseURL, requestedURL);
   }
   return requestedURL;
@@ -3442,7 +3500,7 @@ const resolveConfig = (config) => {
 
   newConfig.headers = headers = AxiosHeaders$1.from(headers);
 
-  newConfig.url = buildURL(buildFullPath(newConfig.baseURL, newConfig.url), config.params, config.paramsSerializer);
+  newConfig.url = buildURL(buildFullPath(newConfig.baseURL, newConfig.url, newConfig.allowAbsoluteUrls), config.params, config.paramsSerializer);
 
   // HTTP basic authentication
   if (auth) {
@@ -4182,7 +4240,7 @@ function dispatchRequest(config) {
 
 /* Injected with object hook! */
 
-const VERSION$1 = "1.7.9";
+const VERSION$1 = "1.8.3";
 /* Injected with object hook! */
 
 const validators$1 = {};
@@ -4370,6 +4428,13 @@ let Axios$1 = class Axios {
       }
     }
 
+    // Set config.allowAbsoluteUrls
+    if (config.allowAbsoluteUrls !== undefined) ; else if (this.defaults.allowAbsoluteUrls !== undefined) {
+      config.allowAbsoluteUrls = this.defaults.allowAbsoluteUrls;
+    } else {
+      config.allowAbsoluteUrls = true;
+    }
+
     validator.assertOptions(config, {
       baseUrl: validators.spelling('baseURL'),
       withXsrfToken: validators.spelling('withXSRFToken')
@@ -4465,7 +4530,7 @@ let Axios$1 = class Axios {
 
   getUri(config) {
     config = mergeConfig$1(this.defaults, config);
-    const fullPath = buildFullPath(config.baseURL, config.url);
+    const fullPath = buildFullPath(config.baseURL, config.url, config.allowAbsoluteUrls);
     return buildURL(fullPath, config.params, config.paramsSerializer);
   }
 };
@@ -4853,12 +4918,12 @@ var BaseIconStyle = BaseStyle.extend({
 
 /* Injected with object hook! */
 
-function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$1(o); }
+function _typeof$3(o) { "@babel/helpers - typeof"; return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$3(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
-function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; }
-function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty$3(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty$3(e, r, t) { return (r = _toPropertyKey$3(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$3(t) { var i = _toPrimitive$3(t, "string"); return "symbol" == _typeof$3(i) ? i : i + ""; }
+function _toPrimitive$3(t, r) { if ("object" != _typeof$3(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$3(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script$4 = {
   name: 'BaseIcon',
   "extends": script$5,
@@ -4921,14 +4986,12 @@ script$3.render = render$2;
 
 /* Injected with object hook! */
 
-var theme$1 = function theme(_ref) {
-  var dt = _ref.dt;
-  return "\n.p-badge {\n    display: inline-flex;\n    border-radius: ".concat(dt('badge.border.radius'), ";\n    align-items: center;\n    justify-content: center;\n    padding: ").concat(dt('badge.padding'), ";\n    background: ").concat(dt('badge.primary.background'), ";\n    color: ").concat(dt('badge.primary.color'), ";\n    font-size: ").concat(dt('badge.font.size'), ";\n    font-weight: ").concat(dt('badge.font.weight'), ";\n    min-width: ").concat(dt('badge.min.width'), ";\n    height: ").concat(dt('badge.height'), ";\n}\n\n.p-badge-dot {\n    width: ").concat(dt('badge.dot.size'), ";\n    min-width: ").concat(dt('badge.dot.size'), ";\n    height: ").concat(dt('badge.dot.size'), ";\n    border-radius: 50%;\n    padding: 0;\n}\n\n.p-badge-circle {\n    padding: 0;\n    border-radius: 50%;\n}\n\n.p-badge-secondary {\n    background: ").concat(dt('badge.secondary.background'), ";\n    color: ").concat(dt('badge.secondary.color'), ";\n}\n\n.p-badge-success {\n    background: ").concat(dt('badge.success.background'), ";\n    color: ").concat(dt('badge.success.color'), ";\n}\n\n.p-badge-info {\n    background: ").concat(dt('badge.info.background'), ";\n    color: ").concat(dt('badge.info.color'), ";\n}\n\n.p-badge-warn {\n    background: ").concat(dt('badge.warn.background'), ";\n    color: ").concat(dt('badge.warn.color'), ";\n}\n\n.p-badge-danger {\n    background: ").concat(dt('badge.danger.background'), ";\n    color: ").concat(dt('badge.danger.color'), ";\n}\n\n.p-badge-contrast {\n    background: ").concat(dt('badge.contrast.background'), ";\n    color: ").concat(dt('badge.contrast.color'), ";\n}\n\n.p-badge-sm {\n    font-size: ").concat(dt('badge.sm.font.size'), ";\n    min-width: ").concat(dt('badge.sm.min.width'), ";\n    height: ").concat(dt('badge.sm.height'), ";\n}\n\n.p-badge-lg {\n    font-size: ").concat(dt('badge.lg.font.size'), ";\n    min-width: ").concat(dt('badge.lg.min.width'), ";\n    height: ").concat(dt('badge.lg.height'), ";\n}\n\n.p-badge-xl {\n    font-size: ").concat(dt('badge.xl.font.size'), ";\n    min-width: ").concat(dt('badge.xl.min.width'), ";\n    height: ").concat(dt('badge.xl.height'), ";\n}\n");
-};
+var style$1=({dt:n})=>`\n.p-badge {\n    display: inline-flex;\n    border-radius: ${n("badge.border.radius")};\n    align-items: center;\n    justify-content: center;\n    padding: ${n("badge.padding")};\n    background: ${n("badge.primary.background")};\n    color: ${n("badge.primary.color")};\n    font-size: ${n("badge.font.size")};\n    font-weight: ${n("badge.font.weight")};\n    min-width: ${n("badge.min.width")};\n    height: ${n("badge.height")};\n}\n\n.p-badge-dot {\n    width: ${n("badge.dot.size")};\n    min-width: ${n("badge.dot.size")};\n    height: ${n("badge.dot.size")};\n    border-radius: 50%;\n    padding: 0;\n}\n\n.p-badge-circle {\n    padding: 0;\n    border-radius: 50%;\n}\n\n.p-badge-secondary {\n    background: ${n("badge.secondary.background")};\n    color: ${n("badge.secondary.color")};\n}\n\n.p-badge-success {\n    background: ${n("badge.success.background")};\n    color: ${n("badge.success.color")};\n}\n\n.p-badge-info {\n    background: ${n("badge.info.background")};\n    color: ${n("badge.info.color")};\n}\n\n.p-badge-warn {\n    background: ${n("badge.warn.background")};\n    color: ${n("badge.warn.color")};\n}\n\n.p-badge-danger {\n    background: ${n("badge.danger.background")};\n    color: ${n("badge.danger.color")};\n}\n\n.p-badge-contrast {\n    background: ${n("badge.contrast.background")};\n    color: ${n("badge.contrast.color")};\n}\n\n.p-badge-sm {\n    font-size: ${n("badge.sm.font.size")};\n    min-width: ${n("badge.sm.min.width")};\n    height: ${n("badge.sm.height")};\n}\n\n.p-badge-lg {\n    font-size: ${n("badge.lg.font.size")};\n    min-width: ${n("badge.lg.min.width")};\n    height: ${n("badge.lg.height")};\n}\n\n.p-badge-xl {\n    font-size: ${n("badge.xl.font.size")};\n    min-width: ${n("badge.xl.min.width")};\n    height: ${n("badge.xl.height")};\n}\n`;/* Injected with object hook! */
+
 var classes$1 = {
-  root: function root(_ref2) {
-    var props = _ref2.props,
-      instance = _ref2.instance;
+  root: function root(_ref) {
+    var props = _ref.props,
+      instance = _ref.instance;
     return ['p-badge p-component', {
       'p-badge-circle': isNotEmpty(props.value) && String(props.value).length === 1,
       'p-badge-dot': isEmpty(props.value) && !instance.$slots["default"],
@@ -4946,7 +5009,7 @@ var classes$1 = {
 };
 var BadgeStyle = BaseStyle.extend({
   name: 'badge',
-  theme: theme$1,
+  style: style$1,
   classes: classes$1
 });
 
@@ -4979,18 +5042,32 @@ var script$1$1 = {
   }
 };
 
+function _typeof$2(o) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$2(o); }
+function _defineProperty$2(e, r, t) { return (r = _toPropertyKey$2(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$2(t) { var i = _toPrimitive$2(t, "string"); return "symbol" == _typeof$2(i) ? i : i + ""; }
+function _toPrimitive$2(t, r) { if ("object" != _typeof$2(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$2(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script$2 = {
   name: 'Badge',
   "extends": script$1$1,
-  inheritAttrs: false
+  inheritAttrs: false,
+  computed: {
+    dataP: function dataP() {
+      return cn(_defineProperty$2(_defineProperty$2({
+        circle: this.value != null && String(this.value).length === 1,
+        empty: this.value == null && !this.$slots["default"]
+      }, this.severity, this.severity), this.size, this.size));
+    }
+  }
 };
 
+var _hoisted_1$1 = ["data-p"];
 function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("span", mergeProps({
-    "class": _ctx.cx('root')
+    "class": _ctx.cx('root'),
+    "data-p": $options.dataP
   }, _ctx.ptmi('root')), [renderSlot(_ctx.$slots, "default", {}, function () {
     return [createTextVNode(toDisplayString(_ctx.value), 1)];
-  })], 16);
+  })], 16, _hoisted_1$1);
 }
 
 script$2.render = render$1;
@@ -4998,19 +5075,17 @@ script$2.render = render$1;
 
 /* Injected with object hook! */
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var theme = function theme(_ref) {
-  var dt = _ref.dt;
-  return "\n.p-button {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n    color: ".concat(dt('button.primary.color'), ";\n    background: ").concat(dt('button.primary.background'), ";\n    border: 1px solid ").concat(dt('button.primary.border.color'), ";\n    padding: ").concat(dt('button.padding.y'), " ").concat(dt('button.padding.x'), ";\n    font-size: 1rem;\n    font-family: inherit;\n    font-feature-settings: inherit;\n    transition: background ").concat(dt('button.transition.duration'), ", color ").concat(dt('button.transition.duration'), ", border-color ").concat(dt('button.transition.duration'), ",\n            outline-color ").concat(dt('button.transition.duration'), ", box-shadow ").concat(dt('button.transition.duration'), ";\n    border-radius: ").concat(dt('button.border.radius'), ";\n    outline-color: transparent;\n    gap: ").concat(dt('button.gap'), ";\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button-icon-right:dir(rtl) {\n    order: -1;\n}\n\n.p-button:not(.p-button-vertical) .p-button-icon:not(.p-button-icon-right):dir(rtl) {\n    order: 1;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-button-icon-only {\n    width: ").concat(dt('button.icon.only.width'), ";\n    padding-inline-start: 0;\n    padding-inline-end: 0;\n    gap: 0;\n}\n\n.p-button-icon-only.p-button-rounded {\n    border-radius: 50%;\n    height: ").concat(dt('button.icon.only.width'), ";\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n}\n\n.p-button-sm {\n    font-size: ").concat(dt('button.sm.font.size'), ";\n    padding: ").concat(dt('button.sm.padding.y'), " ").concat(dt('button.sm.padding.x'), ";\n}\n\n.p-button-sm .p-button-icon {\n    font-size: ").concat(dt('button.sm.font.size'), ";\n}\n\n.p-button-lg {\n    font-size: ").concat(dt('button.lg.font.size'), ";\n    padding: ").concat(dt('button.lg.padding.y'), " ").concat(dt('button.lg.padding.x'), ";\n}\n\n.p-button-lg .p-button-icon {\n    font-size: ").concat(dt('button.lg.font.size'), ";\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-label {\n    font-weight: ").concat(dt('button.label.font.weight'), ";\n}\n\n.p-button-fluid {\n    width: 100%;\n}\n\n.p-button-fluid.p-button-icon-only {\n    width: ").concat(dt('button.icon.only.width'), ";\n}\n\n.p-button:not(:disabled):hover {\n    background: ").concat(dt('button.primary.hover.background'), ";\n    border: 1px solid ").concat(dt('button.primary.hover.border.color'), ";\n    color: ").concat(dt('button.primary.hover.color'), ";\n}\n\n.p-button:not(:disabled):active {\n    background: ").concat(dt('button.primary.active.background'), ";\n    border: 1px solid ").concat(dt('button.primary.active.border.color'), ";\n    color: ").concat(dt('button.primary.active.color'), ";\n}\n\n.p-button:focus-visible {\n    box-shadow: ").concat(dt('button.primary.focus.ring.shadow'), ";\n    outline: ").concat(dt('button.focus.ring.width'), " ").concat(dt('button.focus.ring.style'), " ").concat(dt('button.primary.focus.ring.color'), ";\n    outline-offset: ").concat(dt('button.focus.ring.offset'), ";\n}\n\n.p-button .p-badge {\n    min-width: ").concat(dt('button.badge.size'), ";\n    height: ").concat(dt('button.badge.size'), ";\n    line-height: ").concat(dt('button.badge.size'), ";\n}\n\n.p-button-raised {\n    box-shadow: ").concat(dt('button.raised.shadow'), ";\n}\n\n.p-button-rounded {\n    border-radius: ").concat(dt('button.rounded.border.radius'), ";\n}\n\n.p-button-secondary {\n    background: ").concat(dt('button.secondary.background'), ";\n    border: 1px solid ").concat(dt('button.secondary.border.color'), ";\n    color: ").concat(dt('button.secondary.color'), ";\n}\n\n.p-button-secondary:not(:disabled):hover {\n    background: ").concat(dt('button.secondary.hover.background'), ";\n    border: 1px solid ").concat(dt('button.secondary.hover.border.color'), ";\n    color: ").concat(dt('button.secondary.hover.color'), ";\n}\n\n.p-button-secondary:not(:disabled):active {\n    background: ").concat(dt('button.secondary.active.background'), ";\n    border: 1px solid ").concat(dt('button.secondary.active.border.color'), ";\n    color: ").concat(dt('button.secondary.active.color'), ";\n}\n\n.p-button-secondary:focus-visible {\n    outline-color: ").concat(dt('button.secondary.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.secondary.focus.ring.shadow'), ";\n}\n\n.p-button-success {\n    background: ").concat(dt('button.success.background'), ";\n    border: 1px solid ").concat(dt('button.success.border.color'), ";\n    color: ").concat(dt('button.success.color'), ";\n}\n\n.p-button-success:not(:disabled):hover {\n    background: ").concat(dt('button.success.hover.background'), ";\n    border: 1px solid ").concat(dt('button.success.hover.border.color'), ";\n    color: ").concat(dt('button.success.hover.color'), ";\n}\n\n.p-button-success:not(:disabled):active {\n    background: ").concat(dt('button.success.active.background'), ";\n    border: 1px solid ").concat(dt('button.success.active.border.color'), ";\n    color: ").concat(dt('button.success.active.color'), ";\n}\n\n.p-button-success:focus-visible {\n    outline-color: ").concat(dt('button.success.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.success.focus.ring.shadow'), ";\n}\n\n.p-button-info {\n    background: ").concat(dt('button.info.background'), ";\n    border: 1px solid ").concat(dt('button.info.border.color'), ";\n    color: ").concat(dt('button.info.color'), ";\n}\n\n.p-button-info:not(:disabled):hover {\n    background: ").concat(dt('button.info.hover.background'), ";\n    border: 1px solid ").concat(dt('button.info.hover.border.color'), ";\n    color: ").concat(dt('button.info.hover.color'), ";\n}\n\n.p-button-info:not(:disabled):active {\n    background: ").concat(dt('button.info.active.background'), ";\n    border: 1px solid ").concat(dt('button.info.active.border.color'), ";\n    color: ").concat(dt('button.info.active.color'), ";\n}\n\n.p-button-info:focus-visible {\n    outline-color: ").concat(dt('button.info.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.info.focus.ring.shadow'), ";\n}\n\n.p-button-warn {\n    background: ").concat(dt('button.warn.background'), ";\n    border: 1px solid ").concat(dt('button.warn.border.color'), ";\n    color: ").concat(dt('button.warn.color'), ";\n}\n\n.p-button-warn:not(:disabled):hover {\n    background: ").concat(dt('button.warn.hover.background'), ";\n    border: 1px solid ").concat(dt('button.warn.hover.border.color'), ";\n    color: ").concat(dt('button.warn.hover.color'), ";\n}\n\n.p-button-warn:not(:disabled):active {\n    background: ").concat(dt('button.warn.active.background'), ";\n    border: 1px solid ").concat(dt('button.warn.active.border.color'), ";\n    color: ").concat(dt('button.warn.active.color'), ";\n}\n\n.p-button-warn:focus-visible {\n    outline-color: ").concat(dt('button.warn.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.warn.focus.ring.shadow'), ";\n}\n\n.p-button-help {\n    background: ").concat(dt('button.help.background'), ";\n    border: 1px solid ").concat(dt('button.help.border.color'), ";\n    color: ").concat(dt('button.help.color'), ";\n}\n\n.p-button-help:not(:disabled):hover {\n    background: ").concat(dt('button.help.hover.background'), ";\n    border: 1px solid ").concat(dt('button.help.hover.border.color'), ";\n    color: ").concat(dt('button.help.hover.color'), ";\n}\n\n.p-button-help:not(:disabled):active {\n    background: ").concat(dt('button.help.active.background'), ";\n    border: 1px solid ").concat(dt('button.help.active.border.color'), ";\n    color: ").concat(dt('button.help.active.color'), ";\n}\n\n.p-button-help:focus-visible {\n    outline-color: ").concat(dt('button.help.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.help.focus.ring.shadow'), ";\n}\n\n.p-button-danger {\n    background: ").concat(dt('button.danger.background'), ";\n    border: 1px solid ").concat(dt('button.danger.border.color'), ";\n    color: ").concat(dt('button.danger.color'), ";\n}\n\n.p-button-danger:not(:disabled):hover {\n    background: ").concat(dt('button.danger.hover.background'), ";\n    border: 1px solid ").concat(dt('button.danger.hover.border.color'), ";\n    color: ").concat(dt('button.danger.hover.color'), ";\n}\n\n.p-button-danger:not(:disabled):active {\n    background: ").concat(dt('button.danger.active.background'), ";\n    border: 1px solid ").concat(dt('button.danger.active.border.color'), ";\n    color: ").concat(dt('button.danger.active.color'), ";\n}\n\n.p-button-danger:focus-visible {\n    outline-color: ").concat(dt('button.danger.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.danger.focus.ring.shadow'), ";\n}\n\n.p-button-contrast {\n    background: ").concat(dt('button.contrast.background'), ";\n    border: 1px solid ").concat(dt('button.contrast.border.color'), ";\n    color: ").concat(dt('button.contrast.color'), ";\n}\n\n.p-button-contrast:not(:disabled):hover {\n    background: ").concat(dt('button.contrast.hover.background'), ";\n    border: 1px solid ").concat(dt('button.contrast.hover.border.color'), ";\n    color: ").concat(dt('button.contrast.hover.color'), ";\n}\n\n.p-button-contrast:not(:disabled):active {\n    background: ").concat(dt('button.contrast.active.background'), ";\n    border: 1px solid ").concat(dt('button.contrast.active.border.color'), ";\n    color: ").concat(dt('button.contrast.active.color'), ";\n}\n\n.p-button-contrast:focus-visible {\n    outline-color: ").concat(dt('button.contrast.focus.ring.color'), ";\n    box-shadow: ").concat(dt('button.contrast.focus.ring.shadow'), ";\n}\n\n.p-button-outlined {\n    background: transparent;\n    border-color: ").concat(dt('button.outlined.primary.border.color'), ";\n    color: ").concat(dt('button.outlined.primary.color'), ";\n}\n\n.p-button-outlined:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.primary.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.primary.border.color'), ";\n    color: ").concat(dt('button.outlined.primary.color'), ";\n}\n\n.p-button-outlined:not(:disabled):active {\n    background: ").concat(dt('button.outlined.primary.active.background'), ";\n    border-color: ").concat(dt('button.outlined.primary.border.color'), ";\n    color: ").concat(dt('button.outlined.primary.color'), ";\n}\n\n.p-button-outlined.p-button-secondary {\n    border-color: ").concat(dt('button.outlined.secondary.border.color'), ";\n    color: ").concat(dt('button.outlined.secondary.color'), ";\n}\n\n.p-button-outlined.p-button-secondary:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.secondary.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.secondary.border.color'), ";\n    color: ").concat(dt('button.outlined.secondary.color'), ";\n}\n\n.p-button-outlined.p-button-secondary:not(:disabled):active {\n    background: ").concat(dt('button.outlined.secondary.active.background'), ";\n    border-color: ").concat(dt('button.outlined.secondary.border.color'), ";\n    color: ").concat(dt('button.outlined.secondary.color'), ";\n}\n\n.p-button-outlined.p-button-success {\n    border-color: ").concat(dt('button.outlined.success.border.color'), ";\n    color: ").concat(dt('button.outlined.success.color'), ";\n}\n\n.p-button-outlined.p-button-success:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.success.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.success.border.color'), ";\n    color: ").concat(dt('button.outlined.success.color'), ";\n}\n\n.p-button-outlined.p-button-success:not(:disabled):active {\n    background: ").concat(dt('button.outlined.success.active.background'), ";\n    border-color: ").concat(dt('button.outlined.success.border.color'), ";\n    color: ").concat(dt('button.outlined.success.color'), ";\n}\n\n.p-button-outlined.p-button-info {\n    border-color: ").concat(dt('button.outlined.info.border.color'), ";\n    color: ").concat(dt('button.outlined.info.color'), ";\n}\n\n.p-button-outlined.p-button-info:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.info.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.info.border.color'), ";\n    color: ").concat(dt('button.outlined.info.color'), ";\n}\n\n.p-button-outlined.p-button-info:not(:disabled):active {\n    background: ").concat(dt('button.outlined.info.active.background'), ";\n    border-color: ").concat(dt('button.outlined.info.border.color'), ";\n    color: ").concat(dt('button.outlined.info.color'), ";\n}\n\n.p-button-outlined.p-button-warn {\n    border-color: ").concat(dt('button.outlined.warn.border.color'), ";\n    color: ").concat(dt('button.outlined.warn.color'), ";\n}\n\n.p-button-outlined.p-button-warn:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.warn.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.warn.border.color'), ";\n    color: ").concat(dt('button.outlined.warn.color'), ";\n}\n\n.p-button-outlined.p-button-warn:not(:disabled):active {\n    background: ").concat(dt('button.outlined.warn.active.background'), ";\n    border-color: ").concat(dt('button.outlined.warn.border.color'), ";\n    color: ").concat(dt('button.outlined.warn.color'), ";\n}\n\n.p-button-outlined.p-button-help {\n    border-color: ").concat(dt('button.outlined.help.border.color'), ";\n    color: ").concat(dt('button.outlined.help.color'), ";\n}\n\n.p-button-outlined.p-button-help:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.help.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.help.border.color'), ";\n    color: ").concat(dt('button.outlined.help.color'), ";\n}\n\n.p-button-outlined.p-button-help:not(:disabled):active {\n    background: ").concat(dt('button.outlined.help.active.background'), ";\n    border-color: ").concat(dt('button.outlined.help.border.color'), ";\n    color: ").concat(dt('button.outlined.help.color'), ";\n}\n\n.p-button-outlined.p-button-danger {\n    border-color: ").concat(dt('button.outlined.danger.border.color'), ";\n    color: ").concat(dt('button.outlined.danger.color'), ";\n}\n\n.p-button-outlined.p-button-danger:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.danger.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.danger.border.color'), ";\n    color: ").concat(dt('button.outlined.danger.color'), ";\n}\n\n.p-button-outlined.p-button-danger:not(:disabled):active {\n    background: ").concat(dt('button.outlined.danger.active.background'), ";\n    border-color: ").concat(dt('button.outlined.danger.border.color'), ";\n    color: ").concat(dt('button.outlined.danger.color'), ";\n}\n\n.p-button-outlined.p-button-contrast {\n    border-color: ").concat(dt('button.outlined.contrast.border.color'), ";\n    color: ").concat(dt('button.outlined.contrast.color'), ";\n}\n\n.p-button-outlined.p-button-contrast:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.contrast.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.contrast.border.color'), ";\n    color: ").concat(dt('button.outlined.contrast.color'), ";\n}\n\n.p-button-outlined.p-button-contrast:not(:disabled):active {\n    background: ").concat(dt('button.outlined.contrast.active.background'), ";\n    border-color: ").concat(dt('button.outlined.contrast.border.color'), ";\n    color: ").concat(dt('button.outlined.contrast.color'), ";\n}\n\n.p-button-outlined.p-button-plain {\n    border-color: ").concat(dt('button.outlined.plain.border.color'), ";\n    color: ").concat(dt('button.outlined.plain.color'), ";\n}\n\n.p-button-outlined.p-button-plain:not(:disabled):hover {\n    background: ").concat(dt('button.outlined.plain.hover.background'), ";\n    border-color: ").concat(dt('button.outlined.plain.border.color'), ";\n    color: ").concat(dt('button.outlined.plain.color'), ";\n}\n\n.p-button-outlined.p-button-plain:not(:disabled):active {\n    background: ").concat(dt('button.outlined.plain.active.background'), ";\n    border-color: ").concat(dt('button.outlined.plain.border.color'), ";\n    color: ").concat(dt('button.outlined.plain.color'), ";\n}\n\n.p-button-text {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.primary.color'), ";\n}\n\n.p-button-text:not(:disabled):hover {\n    background: ").concat(dt('button.text.primary.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.primary.color'), ";\n}\n\n.p-button-text:not(:disabled):active {\n    background: ").concat(dt('button.text.primary.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.primary.color'), ";\n}\n\n.p-button-text.p-button-secondary {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.secondary.color'), ";\n}\n\n.p-button-text.p-button-secondary:not(:disabled):hover {\n    background: ").concat(dt('button.text.secondary.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.secondary.color'), ";\n}\n\n.p-button-text.p-button-secondary:not(:disabled):active {\n    background: ").concat(dt('button.text.secondary.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.secondary.color'), ";\n}\n\n.p-button-text.p-button-success {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.success.color'), ";\n}\n\n.p-button-text.p-button-success:not(:disabled):hover {\n    background: ").concat(dt('button.text.success.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.success.color'), ";\n}\n\n.p-button-text.p-button-success:not(:disabled):active {\n    background: ").concat(dt('button.text.success.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.success.color'), ";\n}\n\n.p-button-text.p-button-info {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.info.color'), ";\n}\n\n.p-button-text.p-button-info:not(:disabled):hover {\n    background: ").concat(dt('button.text.info.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.info.color'), ";\n}\n\n.p-button-text.p-button-info:not(:disabled):active {\n    background: ").concat(dt('button.text.info.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.info.color'), ";\n}\n\n.p-button-text.p-button-warn {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.warn.color'), ";\n}\n\n.p-button-text.p-button-warn:not(:disabled):hover {\n    background: ").concat(dt('button.text.warn.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.warn.color'), ";\n}\n\n.p-button-text.p-button-warn:not(:disabled):active {\n    background: ").concat(dt('button.text.warn.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.warn.color'), ";\n}\n\n.p-button-text.p-button-help {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.help.color'), ";\n}\n\n.p-button-text.p-button-help:not(:disabled):hover {\n    background: ").concat(dt('button.text.help.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.help.color'), ";\n}\n\n.p-button-text.p-button-help:not(:disabled):active {\n    background: ").concat(dt('button.text.help.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.help.color'), ";\n}\n\n.p-button-text.p-button-danger {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.danger.color'), ";\n}\n\n.p-button-text.p-button-danger:not(:disabled):hover {\n    background: ").concat(dt('button.text.danger.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.danger.color'), ";\n}\n\n.p-button-text.p-button-danger:not(:disabled):active {\n    background: ").concat(dt('button.text.danger.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.danger.color'), ";\n}\n\n.p-button-text.p-button-contrast {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.contrast.color'), ";\n}\n\n.p-button-text.p-button-contrast:not(:disabled):hover {\n    background: ").concat(dt('button.text.contrast.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.contrast.color'), ";\n}\n\n.p-button-text.p-button-contrast:not(:disabled):active {\n    background: ").concat(dt('button.text.contrast.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.contrast.color'), ";\n}\n\n.p-button-text.p-button-plain {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.text.plain.color'), ";\n}\n\n.p-button-text.p-button-plain:not(:disabled):hover {\n    background: ").concat(dt('button.text.plain.hover.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.plain.color'), ";\n}\n\n.p-button-text.p-button-plain:not(:disabled):active {\n    background: ").concat(dt('button.text.plain.active.background'), ";\n    border-color: transparent;\n    color: ").concat(dt('button.text.plain.color'), ";\n}\n\n.p-button-link {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.link.color'), ";\n}\n\n.p-button-link:not(:disabled):hover {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.link.hover.color'), ";\n}\n\n.p-button-link:not(:disabled):hover .p-button-label {\n    text-decoration: underline;\n}\n\n.p-button-link:not(:disabled):active {\n    background: transparent;\n    border-color: transparent;\n    color: ").concat(dt('button.link.active.color'), ";\n}\n");
-};
+var style=({dt:o})=>`\n.p-button {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n    color: ${o("button.primary.color")};\n    background: ${o("button.primary.background")};\n    border: 1px solid ${o("button.primary.border.color")};\n    padding: ${o("button.padding.y")} ${o("button.padding.x")};\n    font-size: 1rem;\n    font-family: inherit;\n    font-feature-settings: inherit;\n    transition: background ${o("button.transition.duration")}, color ${o("button.transition.duration")}, border-color ${o("button.transition.duration")},\n            outline-color ${o("button.transition.duration")}, box-shadow ${o("button.transition.duration")};\n    border-radius: ${o("button.border.radius")};\n    outline-color: transparent;\n    gap: ${o("button.gap")};\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button-icon-right:dir(rtl) {\n    order: -1;\n}\n\n.p-button:not(.p-button-vertical) .p-button-icon:not(.p-button-icon-right):dir(rtl) {\n    order: 1;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-button-icon-only {\n    width: ${o("button.icon.only.width")};\n    padding-inline-start: 0;\n    padding-inline-end: 0;\n    gap: 0;\n}\n\n.p-button-icon-only.p-button-rounded {\n    border-radius: 50%;\n    height: ${o("button.icon.only.width")};\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n}\n\n.p-button-sm {\n    font-size: ${o("button.sm.font.size")};\n    padding: ${o("button.sm.padding.y")} ${o("button.sm.padding.x")};\n}\n\n.p-button-sm .p-button-icon {\n    font-size: ${o("button.sm.font.size")};\n}\n\n.p-button-sm.p-button-icon-only {\n    width: ${o("button.sm.icon.only.width")};\n}\n\n.p-button-sm.p-button-icon-only.p-button-rounded {\n    height: ${o("button.sm.icon.only.width")};\n}\n\n.p-button-lg {\n    font-size: ${o("button.lg.font.size")};\n    padding: ${o("button.lg.padding.y")} ${o("button.lg.padding.x")};\n}\n\n.p-button-lg .p-button-icon {\n    font-size: ${o("button.lg.font.size")};\n}\n\n.p-button-lg.p-button-icon-only {\n    width: ${o("button.lg.icon.only.width")};\n}\n\n.p-button-lg.p-button-icon-only.p-button-rounded {\n    height: ${o("button.lg.icon.only.width")};\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-label {\n    font-weight: ${o("button.label.font.weight")};\n}\n\n.p-button-fluid {\n    width: 100%;\n}\n\n.p-button-fluid.p-button-icon-only {\n    width: ${o("button.icon.only.width")};\n}\n\n.p-button:not(:disabled):hover {\n    background: ${o("button.primary.hover.background")};\n    border: 1px solid ${o("button.primary.hover.border.color")};\n    color: ${o("button.primary.hover.color")};\n}\n\n.p-button:not(:disabled):active {\n    background: ${o("button.primary.active.background")};\n    border: 1px solid ${o("button.primary.active.border.color")};\n    color: ${o("button.primary.active.color")};\n}\n\n.p-button:focus-visible {\n    box-shadow: ${o("button.primary.focus.ring.shadow")};\n    outline: ${o("button.focus.ring.width")} ${o("button.focus.ring.style")} ${o("button.primary.focus.ring.color")};\n    outline-offset: ${o("button.focus.ring.offset")};\n}\n\n.p-button .p-badge {\n    min-width: ${o("button.badge.size")};\n    height: ${o("button.badge.size")};\n    line-height: ${o("button.badge.size")};\n}\n\n.p-button-raised {\n    box-shadow: ${o("button.raised.shadow")};\n}\n\n.p-button-rounded {\n    border-radius: ${o("button.rounded.border.radius")};\n}\n\n.p-button-secondary {\n    background: ${o("button.secondary.background")};\n    border: 1px solid ${o("button.secondary.border.color")};\n    color: ${o("button.secondary.color")};\n}\n\n.p-button-secondary:not(:disabled):hover {\n    background: ${o("button.secondary.hover.background")};\n    border: 1px solid ${o("button.secondary.hover.border.color")};\n    color: ${o("button.secondary.hover.color")};\n}\n\n.p-button-secondary:not(:disabled):active {\n    background: ${o("button.secondary.active.background")};\n    border: 1px solid ${o("button.secondary.active.border.color")};\n    color: ${o("button.secondary.active.color")};\n}\n\n.p-button-secondary:focus-visible {\n    outline-color: ${o("button.secondary.focus.ring.color")};\n    box-shadow: ${o("button.secondary.focus.ring.shadow")};\n}\n\n.p-button-success {\n    background: ${o("button.success.background")};\n    border: 1px solid ${o("button.success.border.color")};\n    color: ${o("button.success.color")};\n}\n\n.p-button-success:not(:disabled):hover {\n    background: ${o("button.success.hover.background")};\n    border: 1px solid ${o("button.success.hover.border.color")};\n    color: ${o("button.success.hover.color")};\n}\n\n.p-button-success:not(:disabled):active {\n    background: ${o("button.success.active.background")};\n    border: 1px solid ${o("button.success.active.border.color")};\n    color: ${o("button.success.active.color")};\n}\n\n.p-button-success:focus-visible {\n    outline-color: ${o("button.success.focus.ring.color")};\n    box-shadow: ${o("button.success.focus.ring.shadow")};\n}\n\n.p-button-info {\n    background: ${o("button.info.background")};\n    border: 1px solid ${o("button.info.border.color")};\n    color: ${o("button.info.color")};\n}\n\n.p-button-info:not(:disabled):hover {\n    background: ${o("button.info.hover.background")};\n    border: 1px solid ${o("button.info.hover.border.color")};\n    color: ${o("button.info.hover.color")};\n}\n\n.p-button-info:not(:disabled):active {\n    background: ${o("button.info.active.background")};\n    border: 1px solid ${o("button.info.active.border.color")};\n    color: ${o("button.info.active.color")};\n}\n\n.p-button-info:focus-visible {\n    outline-color: ${o("button.info.focus.ring.color")};\n    box-shadow: ${o("button.info.focus.ring.shadow")};\n}\n\n.p-button-warn {\n    background: ${o("button.warn.background")};\n    border: 1px solid ${o("button.warn.border.color")};\n    color: ${o("button.warn.color")};\n}\n\n.p-button-warn:not(:disabled):hover {\n    background: ${o("button.warn.hover.background")};\n    border: 1px solid ${o("button.warn.hover.border.color")};\n    color: ${o("button.warn.hover.color")};\n}\n\n.p-button-warn:not(:disabled):active {\n    background: ${o("button.warn.active.background")};\n    border: 1px solid ${o("button.warn.active.border.color")};\n    color: ${o("button.warn.active.color")};\n}\n\n.p-button-warn:focus-visible {\n    outline-color: ${o("button.warn.focus.ring.color")};\n    box-shadow: ${o("button.warn.focus.ring.shadow")};\n}\n\n.p-button-help {\n    background: ${o("button.help.background")};\n    border: 1px solid ${o("button.help.border.color")};\n    color: ${o("button.help.color")};\n}\n\n.p-button-help:not(:disabled):hover {\n    background: ${o("button.help.hover.background")};\n    border: 1px solid ${o("button.help.hover.border.color")};\n    color: ${o("button.help.hover.color")};\n}\n\n.p-button-help:not(:disabled):active {\n    background: ${o("button.help.active.background")};\n    border: 1px solid ${o("button.help.active.border.color")};\n    color: ${o("button.help.active.color")};\n}\n\n.p-button-help:focus-visible {\n    outline-color: ${o("button.help.focus.ring.color")};\n    box-shadow: ${o("button.help.focus.ring.shadow")};\n}\n\n.p-button-danger {\n    background: ${o("button.danger.background")};\n    border: 1px solid ${o("button.danger.border.color")};\n    color: ${o("button.danger.color")};\n}\n\n.p-button-danger:not(:disabled):hover {\n    background: ${o("button.danger.hover.background")};\n    border: 1px solid ${o("button.danger.hover.border.color")};\n    color: ${o("button.danger.hover.color")};\n}\n\n.p-button-danger:not(:disabled):active {\n    background: ${o("button.danger.active.background")};\n    border: 1px solid ${o("button.danger.active.border.color")};\n    color: ${o("button.danger.active.color")};\n}\n\n.p-button-danger:focus-visible {\n    outline-color: ${o("button.danger.focus.ring.color")};\n    box-shadow: ${o("button.danger.focus.ring.shadow")};\n}\n\n.p-button-contrast {\n    background: ${o("button.contrast.background")};\n    border: 1px solid ${o("button.contrast.border.color")};\n    color: ${o("button.contrast.color")};\n}\n\n.p-button-contrast:not(:disabled):hover {\n    background: ${o("button.contrast.hover.background")};\n    border: 1px solid ${o("button.contrast.hover.border.color")};\n    color: ${o("button.contrast.hover.color")};\n}\n\n.p-button-contrast:not(:disabled):active {\n    background: ${o("button.contrast.active.background")};\n    border: 1px solid ${o("button.contrast.active.border.color")};\n    color: ${o("button.contrast.active.color")};\n}\n\n.p-button-contrast:focus-visible {\n    outline-color: ${o("button.contrast.focus.ring.color")};\n    box-shadow: ${o("button.contrast.focus.ring.shadow")};\n}\n\n.p-button-outlined {\n    background: transparent;\n    border-color: ${o("button.outlined.primary.border.color")};\n    color: ${o("button.outlined.primary.color")};\n}\n\n.p-button-outlined:not(:disabled):hover {\n    background: ${o("button.outlined.primary.hover.background")};\n    border-color: ${o("button.outlined.primary.border.color")};\n    color: ${o("button.outlined.primary.color")};\n}\n\n.p-button-outlined:not(:disabled):active {\n    background: ${o("button.outlined.primary.active.background")};\n    border-color: ${o("button.outlined.primary.border.color")};\n    color: ${o("button.outlined.primary.color")};\n}\n\n.p-button-outlined.p-button-secondary {\n    border-color: ${o("button.outlined.secondary.border.color")};\n    color: ${o("button.outlined.secondary.color")};\n}\n\n.p-button-outlined.p-button-secondary:not(:disabled):hover {\n    background: ${o("button.outlined.secondary.hover.background")};\n    border-color: ${o("button.outlined.secondary.border.color")};\n    color: ${o("button.outlined.secondary.color")};\n}\n\n.p-button-outlined.p-button-secondary:not(:disabled):active {\n    background: ${o("button.outlined.secondary.active.background")};\n    border-color: ${o("button.outlined.secondary.border.color")};\n    color: ${o("button.outlined.secondary.color")};\n}\n\n.p-button-outlined.p-button-success {\n    border-color: ${o("button.outlined.success.border.color")};\n    color: ${o("button.outlined.success.color")};\n}\n\n.p-button-outlined.p-button-success:not(:disabled):hover {\n    background: ${o("button.outlined.success.hover.background")};\n    border-color: ${o("button.outlined.success.border.color")};\n    color: ${o("button.outlined.success.color")};\n}\n\n.p-button-outlined.p-button-success:not(:disabled):active {\n    background: ${o("button.outlined.success.active.background")};\n    border-color: ${o("button.outlined.success.border.color")};\n    color: ${o("button.outlined.success.color")};\n}\n\n.p-button-outlined.p-button-info {\n    border-color: ${o("button.outlined.info.border.color")};\n    color: ${o("button.outlined.info.color")};\n}\n\n.p-button-outlined.p-button-info:not(:disabled):hover {\n    background: ${o("button.outlined.info.hover.background")};\n    border-color: ${o("button.outlined.info.border.color")};\n    color: ${o("button.outlined.info.color")};\n}\n\n.p-button-outlined.p-button-info:not(:disabled):active {\n    background: ${o("button.outlined.info.active.background")};\n    border-color: ${o("button.outlined.info.border.color")};\n    color: ${o("button.outlined.info.color")};\n}\n\n.p-button-outlined.p-button-warn {\n    border-color: ${o("button.outlined.warn.border.color")};\n    color: ${o("button.outlined.warn.color")};\n}\n\n.p-button-outlined.p-button-warn:not(:disabled):hover {\n    background: ${o("button.outlined.warn.hover.background")};\n    border-color: ${o("button.outlined.warn.border.color")};\n    color: ${o("button.outlined.warn.color")};\n}\n\n.p-button-outlined.p-button-warn:not(:disabled):active {\n    background: ${o("button.outlined.warn.active.background")};\n    border-color: ${o("button.outlined.warn.border.color")};\n    color: ${o("button.outlined.warn.color")};\n}\n\n.p-button-outlined.p-button-help {\n    border-color: ${o("button.outlined.help.border.color")};\n    color: ${o("button.outlined.help.color")};\n}\n\n.p-button-outlined.p-button-help:not(:disabled):hover {\n    background: ${o("button.outlined.help.hover.background")};\n    border-color: ${o("button.outlined.help.border.color")};\n    color: ${o("button.outlined.help.color")};\n}\n\n.p-button-outlined.p-button-help:not(:disabled):active {\n    background: ${o("button.outlined.help.active.background")};\n    border-color: ${o("button.outlined.help.border.color")};\n    color: ${o("button.outlined.help.color")};\n}\n\n.p-button-outlined.p-button-danger {\n    border-color: ${o("button.outlined.danger.border.color")};\n    color: ${o("button.outlined.danger.color")};\n}\n\n.p-button-outlined.p-button-danger:not(:disabled):hover {\n    background: ${o("button.outlined.danger.hover.background")};\n    border-color: ${o("button.outlined.danger.border.color")};\n    color: ${o("button.outlined.danger.color")};\n}\n\n.p-button-outlined.p-button-danger:not(:disabled):active {\n    background: ${o("button.outlined.danger.active.background")};\n    border-color: ${o("button.outlined.danger.border.color")};\n    color: ${o("button.outlined.danger.color")};\n}\n\n.p-button-outlined.p-button-contrast {\n    border-color: ${o("button.outlined.contrast.border.color")};\n    color: ${o("button.outlined.contrast.color")};\n}\n\n.p-button-outlined.p-button-contrast:not(:disabled):hover {\n    background: ${o("button.outlined.contrast.hover.background")};\n    border-color: ${o("button.outlined.contrast.border.color")};\n    color: ${o("button.outlined.contrast.color")};\n}\n\n.p-button-outlined.p-button-contrast:not(:disabled):active {\n    background: ${o("button.outlined.contrast.active.background")};\n    border-color: ${o("button.outlined.contrast.border.color")};\n    color: ${o("button.outlined.contrast.color")};\n}\n\n.p-button-outlined.p-button-plain {\n    border-color: ${o("button.outlined.plain.border.color")};\n    color: ${o("button.outlined.plain.color")};\n}\n\n.p-button-outlined.p-button-plain:not(:disabled):hover {\n    background: ${o("button.outlined.plain.hover.background")};\n    border-color: ${o("button.outlined.plain.border.color")};\n    color: ${o("button.outlined.plain.color")};\n}\n\n.p-button-outlined.p-button-plain:not(:disabled):active {\n    background: ${o("button.outlined.plain.active.background")};\n    border-color: ${o("button.outlined.plain.border.color")};\n    color: ${o("button.outlined.plain.color")};\n}\n\n.p-button-text {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.primary.color")};\n}\n\n.p-button-text:not(:disabled):hover {\n    background: ${o("button.text.primary.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.primary.color")};\n}\n\n.p-button-text:not(:disabled):active {\n    background: ${o("button.text.primary.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.primary.color")};\n}\n\n.p-button-text.p-button-secondary {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.secondary.color")};\n}\n\n.p-button-text.p-button-secondary:not(:disabled):hover {\n    background: ${o("button.text.secondary.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.secondary.color")};\n}\n\n.p-button-text.p-button-secondary:not(:disabled):active {\n    background: ${o("button.text.secondary.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.secondary.color")};\n}\n\n.p-button-text.p-button-success {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.success.color")};\n}\n\n.p-button-text.p-button-success:not(:disabled):hover {\n    background: ${o("button.text.success.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.success.color")};\n}\n\n.p-button-text.p-button-success:not(:disabled):active {\n    background: ${o("button.text.success.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.success.color")};\n}\n\n.p-button-text.p-button-info {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.info.color")};\n}\n\n.p-button-text.p-button-info:not(:disabled):hover {\n    background: ${o("button.text.info.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.info.color")};\n}\n\n.p-button-text.p-button-info:not(:disabled):active {\n    background: ${o("button.text.info.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.info.color")};\n}\n\n.p-button-text.p-button-warn {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.warn.color")};\n}\n\n.p-button-text.p-button-warn:not(:disabled):hover {\n    background: ${o("button.text.warn.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.warn.color")};\n}\n\n.p-button-text.p-button-warn:not(:disabled):active {\n    background: ${o("button.text.warn.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.warn.color")};\n}\n\n.p-button-text.p-button-help {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.help.color")};\n}\n\n.p-button-text.p-button-help:not(:disabled):hover {\n    background: ${o("button.text.help.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.help.color")};\n}\n\n.p-button-text.p-button-help:not(:disabled):active {\n    background: ${o("button.text.help.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.help.color")};\n}\n\n.p-button-text.p-button-danger {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.danger.color")};\n}\n\n.p-button-text.p-button-danger:not(:disabled):hover {\n    background: ${o("button.text.danger.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.danger.color")};\n}\n\n.p-button-text.p-button-danger:not(:disabled):active {\n    background: ${o("button.text.danger.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.danger.color")};\n}\n\n.p-button-text.p-button-contrast {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.contrast.color")};\n}\n\n.p-button-text.p-button-contrast:not(:disabled):hover {\n    background: ${o("button.text.contrast.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.contrast.color")};\n}\n\n.p-button-text.p-button-contrast:not(:disabled):active {\n    background: ${o("button.text.contrast.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.contrast.color")};\n}\n\n.p-button-text.p-button-plain {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.text.plain.color")};\n}\n\n.p-button-text.p-button-plain:not(:disabled):hover {\n    background: ${o("button.text.plain.hover.background")};\n    border-color: transparent;\n    color: ${o("button.text.plain.color")};\n}\n\n.p-button-text.p-button-plain:not(:disabled):active {\n    background: ${o("button.text.plain.active.background")};\n    border-color: transparent;\n    color: ${o("button.text.plain.color")};\n}\n\n.p-button-link {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.link.color")};\n}\n\n.p-button-link:not(:disabled):hover {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.link.hover.color")};\n}\n\n.p-button-link:not(:disabled):hover .p-button-label {\n    text-decoration: underline;\n}\n\n.p-button-link:not(:disabled):active {\n    background: transparent;\n    border-color: transparent;\n    color: ${o("button.link.active.color")};\n}\n`;/* Injected with object hook! */
+
+function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$1(o); }
+function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; }
+function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var classes = {
-  root: function root(_ref2) {
-    var instance = _ref2.instance,
-      props = _ref2.props;
-    return ['p-button p-component', _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+  root: function root(_ref) {
+    var instance = _ref.instance,
+      props = _ref.props;
+    return ['p-button p-component', _defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1(_defineProperty$1({
       'p-button-icon-only': instance.hasIcon && !props.label && !props.badge,
       'p-button-vertical': (props.iconPos === 'top' || props.iconPos === 'bottom') && props.label,
       'p-button-loading': props.loading,
@@ -5018,15 +5093,15 @@ var classes = {
     }, "p-button-".concat(props.severity), props.severity), 'p-button-raised', props.raised), 'p-button-rounded', props.rounded), 'p-button-text', props.text || props.variant === 'text'), 'p-button-outlined', props.outlined || props.variant === 'outlined'), 'p-button-sm', props.size === 'small'), 'p-button-lg', props.size === 'large'), 'p-button-plain', props.plain), 'p-button-fluid', instance.hasFluid)];
   },
   loadingIcon: 'p-button-loading-icon',
-  icon: function icon(_ref4) {
-    var props = _ref4.props;
-    return ['p-button-icon', _defineProperty({}, "p-button-icon-".concat(props.iconPos), props.label)];
+  icon: function icon(_ref3) {
+    var props = _ref3.props;
+    return ['p-button-icon', _defineProperty$1({}, "p-button-icon-".concat(props.iconPos), props.label)];
   },
   label: 'p-button-label'
 };
 var ButtonStyle = BaseStyle.extend({
   name: 'button',
-  theme: theme,
+  style: style,
   classes: classes
 });
 
@@ -5131,6 +5206,10 @@ var script$1 = {
   }
 };
 
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script = {
   name: 'Button',
   "extends": script$1,
@@ -5179,6 +5258,15 @@ var script = {
     },
     hasFluid: function hasFluid() {
       return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;
+    },
+    dataP: function dataP() {
+      return cn(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, this.size, this.size), 'icon-only', this.hasIcon && !this.label && !this.badge), "loading", this.loading), "fluid", this.hasFluid), "rounded", this.rounded), "raised", this.raised), "outlined", this.outlined || this.variant === 'outlined'), "text", this.text || this.variant === 'text'), "link", this.link || this.variant === 'link'), "vertical", (this.iconPos === 'top' || this.iconPos === 'bottom') && this.label));
+    },
+    dataIconP: function dataIconP() {
+      return cn(_defineProperty(_defineProperty({}, this.iconPos, this.iconPos), this.size, this.size));
+    },
+    dataLabelP: function dataLabelP() {
+      return cn(_defineProperty(_defineProperty({}, this.size, this.size), 'icon-only', this.hasIcon && !this.label && !this.badge));
     }
   },
   components: {
@@ -5190,13 +5278,16 @@ var script = {
   }
 };
 
+var _hoisted_1 = ["data-p"];
+var _hoisted_2 = ["data-p"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   var _component_SpinnerIcon = resolveComponent("SpinnerIcon");
   var _component_Badge = resolveComponent("Badge");
   var _directive_ripple = resolveDirective("ripple");
   return !_ctx.asChild ? withDirectives((openBlock(), createBlock(resolveDynamicComponent(_ctx.as), mergeProps({
     key: 0,
-    "class": _ctx.cx('root')
+    "class": _ctx.cx('root'),
+    "data-p": $options.dataP
   }, $options.attrs), {
     "default": withCtx(function () {
       return [renderSlot(_ctx.$slots, "default", {}, function () {
@@ -5218,11 +5309,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }, _ctx.ptm('icon')), function () {
           return [_ctx.icon ? (openBlock(), createElementBlock("span", mergeProps({
             key: 0,
-            "class": [_ctx.cx('icon'), _ctx.icon, _ctx.iconClass]
-          }, _ctx.ptm('icon')), null, 16)) : createCommentVNode("", true)];
+            "class": [_ctx.cx('icon'), _ctx.icon, _ctx.iconClass],
+            "data-p": $options.dataIconP
+          }, _ctx.ptm('icon')), null, 16, _hoisted_1)) : createCommentVNode("", true)];
         }), createBaseVNode("span", mergeProps({
           "class": _ctx.cx('label')
-        }, _ctx.ptm('label')), toDisplayString(_ctx.label || ' '), 17), _ctx.badge ? (openBlock(), createBlock(_component_Badge, {
+        }, _ctx.ptm('label'), {
+          "data-p": $options.dataLabelP
+        }), toDisplayString(_ctx.label || ' '), 17, _hoisted_2), _ctx.badge ? (openBlock(), createBlock(_component_Badge, {
           key: 2,
           value: _ctx.badge,
           "class": normalizeClass(_ctx.badgeClass),
@@ -5233,7 +5327,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       })];
     }),
     _: 3
-  }, 16, ["class"])), [[_directive_ripple]]) : renderSlot(_ctx.$slots, "default", {
+  }, 16, ["class", "data-p"])), [[_directive_ripple]]) : renderSlot(_ctx.$slots, "default", {
     key: 1,
     "class": normalizeClass(_ctx.cx('root')),
     a11yAttrs: $options.a11yAttrs
@@ -5245,456 +5339,264 @@ script.render = render;
 
 /* Injected with object hook! */
 
-const M = {
-  // eslint-disable-next-line vue/multi-word-component-names
-  name: "splitpanes",
-  emits: ["ready", "resize", "resized", "pane-click", "pane-maximize", "pane-add", "pane-remove", "splitter-click"],
+const Pe = {
+  __name: "splitpanes",
   props: {
     horizontal: { type: Boolean },
     pushOtherPanes: { type: Boolean, default: true },
-    dblClickSplitter: { type: Boolean, default: true },
+    maximizePanes: { type: Boolean, default: true },
+    // Maximize pane on splitter double click/tap.
     rtl: { type: Boolean, default: false },
     // Right to left direction.
     firstSplitter: { type: Boolean }
   },
-  provide() {
-    return {
-      requestUpdate: this.requestUpdate,
-      onPaneAdd: this.onPaneAdd,
-      onPaneRemove: this.onPaneRemove,
-      onPaneClick: this.onPaneClick
-    };
-  },
-  data: () => ({
-    container: null,
-    ready: false,
-    panes: [],
-    touch: {
+  emits: [
+    "ready",
+    "resize",
+    "resized",
+    "pane-click",
+    "pane-maximize",
+    "pane-add",
+    "pane-remove",
+    "splitter-click",
+    "splitter-dblclick"
+  ],
+  setup(D, { emit: p }) {
+    const _ = p, u = D, k = useSlots(), l = ref([]), M = computed(() => l.value.reduce((e, n) => (e[~~n.id] = n) && e, {})), m = computed(() => l.value.length), x = ref(null), S = ref(false), c = ref({
       mouseDown: false,
       dragging: false,
-      activeSplitter: null
-    },
-    splitterTaps: {
+      activeSplitter: null,
+      cursorOffset: 0
+      // Cursor offset within the splitter.
+    }), d = ref({
       // Used to detect double click on touch devices.
       splitter: null,
       timeoutId: null
-    }
-  }),
-  computed: {
-    panesCount() {
-      return this.panes.length;
-    },
-    // Indexed panes by `uid` of Pane components for fast lookup.
-    // Every time a pane is destroyed this index is recomputed.
-    indexedPanes() {
-      return this.panes.reduce((e, i) => (e[i.id] = i) && e, {});
-    }
-  },
-  methods: {
-    updatePaneComponents() {
-      this.panes.forEach((e) => {
-        e.update && e.update({
-          // Panes are indexed by Pane component uid, as they might be inserted at different index.
-          [this.horizontal ? "height" : "width"]: `${this.indexedPanes[e.id].size}%`
-        });
-      });
-    },
-    bindEvents() {
-      document.addEventListener("mousemove", this.onMouseMove, { passive: false }), document.addEventListener("mouseup", this.onMouseUp), "ontouchstart" in window && (document.addEventListener("touchmove", this.onMouseMove, { passive: false }), document.addEventListener("touchend", this.onMouseUp));
-    },
-    unbindEvents() {
-      document.removeEventListener("mousemove", this.onMouseMove, { passive: false }), document.removeEventListener("mouseup", this.onMouseUp), "ontouchstart" in window && (document.removeEventListener("touchmove", this.onMouseMove, { passive: false }), document.removeEventListener("touchend", this.onMouseUp));
-    },
-    onMouseDown(e, i) {
-      this.bindEvents(), this.touch.mouseDown = true, this.touch.activeSplitter = i;
-    },
-    onMouseMove(e) {
-      this.touch.mouseDown && (e.preventDefault(), this.touch.dragging = true, this.calculatePanesSize(this.getCurrentMouseDrag(e)), this.$emit("resize", this.panes.map((i) => ({ min: i.min, max: i.max, size: i.size }))));
-    },
-    onMouseUp() {
-      this.touch.dragging && this.$emit("resized", this.panes.map((e) => ({ min: e.min, max: e.max, size: e.size }))), this.touch.mouseDown = false, setTimeout(() => {
-        this.touch.dragging = false, this.unbindEvents();
+    }), y = computed(() => ({
+      [`splitpanes splitpanes--${u.horizontal ? "horizontal" : "vertical"}`]: true,
+      "splitpanes--dragging": c.value.dragging
+    })), R = () => {
+      document.addEventListener("mousemove", r, { passive: false }), document.addEventListener("mouseup", P), "ontouchstart" in window && (document.addEventListener("touchmove", r, { passive: false }), document.addEventListener("touchend", P));
+    }, O = () => {
+      document.removeEventListener("mousemove", r, { passive: false }), document.removeEventListener("mouseup", P), "ontouchstart" in window && (document.removeEventListener("touchmove", r, { passive: false }), document.removeEventListener("touchend", P));
+    }, b = (e, n) => {
+      const t = e.target.closest(".splitpanes__splitter");
+      if (t) {
+        const { left: i, top: s } = t.getBoundingClientRect(), { clientX: a, clientY: o } = "ontouchstart" in window && e.touches ? e.touches[0] : e;
+        c.value.cursorOffset = u.horizontal ? o - s : a - i;
+      }
+      R(), c.value.mouseDown = true, c.value.activeSplitter = n;
+    }, r = (e) => {
+      c.value.mouseDown && (e.preventDefault(), c.value.dragging = true, requestAnimationFrame(() => {
+        K(I(e)), f("resize", { event: e }, true);
+      }));
+    }, P = (e) => {
+      c.value.dragging && f("resized", { event: e }, true), c.value.mouseDown = false, c.value.activeSplitter = null, setTimeout(() => {
+        c.value.dragging = false, O();
       }, 100);
-    },
-    // If touch device, detect double tap manually (2 taps separated by less than 500ms).
-    onSplitterClick(e, i) {
-      "ontouchstart" in window && (e.preventDefault(), this.dblClickSplitter && (this.splitterTaps.splitter === i ? (clearTimeout(this.splitterTaps.timeoutId), this.splitterTaps.timeoutId = null, this.onSplitterDblClick(e, i), this.splitterTaps.splitter = null) : (this.splitterTaps.splitter = i, this.splitterTaps.timeoutId = setTimeout(() => {
-        this.splitterTaps.splitter = null;
-      }, 500)))), this.touch.dragging || this.$emit("splitter-click", this.panes[i]);
-    },
-    // On splitter dbl click or dbl tap maximize this pane.
-    onSplitterDblClick(e, i) {
-      let s = 0;
-      this.panes = this.panes.map((n, t) => (n.size = t === i ? n.max : n.min, t !== i && (s += n.min), n)), this.panes[i].size -= s, this.$emit("pane-maximize", this.panes[i]), this.$emit("resized", this.panes.map((n) => ({ min: n.min, max: n.max, size: n.size })));
-    },
-    onPaneClick(e, i) {
-      this.$emit("pane-click", this.indexedPanes[i]);
-    },
-    // Get the cursor position relative to the splitpane container.
-    getCurrentMouseDrag(e) {
-      const i = this.container.getBoundingClientRect(), { clientX: s, clientY: n } = "ontouchstart" in window && e.touches ? e.touches[0] : e;
+    }, A = (e, n) => {
+      "ontouchstart" in window && (e.preventDefault(), d.value.splitter === n ? (clearTimeout(d.value.timeoutId), d.value.timeoutId = null, U(e, n), d.value.splitter = null) : (d.value.splitter = n, d.value.timeoutId = setTimeout(() => d.value.splitter = null, 500))), c.value.dragging || f("splitter-click", { event: e, index: n }, true);
+    }, U = (e, n) => {
+      if (f("splitter-dblclick", { event: e, index: n }, true), u.maximizePanes) {
+        let t = 0;
+        l.value = l.value.map((i, s) => (i.size = s === n ? i.max : i.min, s !== n && (t += i.min), i)), l.value[n].size -= t, f("pane-maximize", { event: e, index: n, pane: l.value[n] }), f("resized", { event: e, index: n }, true);
+      }
+    }, W = (e, n) => {
+      f("pane-click", {
+        event: e,
+        index: M.value[n].index,
+        pane: M.value[n]
+      });
+    }, I = (e) => {
+      const n = x.value.getBoundingClientRect(), { clientX: t, clientY: i } = "ontouchstart" in window && e.touches ? e.touches[0] : e;
       return {
-        x: s - i.left,
-        y: n - i.top
+        x: t - (u.horizontal ? 0 : c.value.cursorOffset) - n.left,
+        y: i - (u.horizontal ? c.value.cursorOffset : 0) - n.top
       };
-    },
-    // Returns the drag percentage of the splitter relative to the container (ranging from 0 to 100%).
-    getCurrentDragPercentage(e) {
-      e = e[this.horizontal ? "y" : "x"];
-      const i = this.container[this.horizontal ? "clientHeight" : "clientWidth"];
-      return this.rtl && !this.horizontal && (e = i - e), e * 100 / i;
-    },
-    calculatePanesSize(e) {
-      const i = this.touch.activeSplitter;
-      let s = {
-        prevPanesSize: this.sumPrevPanesSize(i),
-        nextPanesSize: this.sumNextPanesSize(i),
+    }, J = (e) => {
+      e = e[u.horizontal ? "y" : "x"];
+      const n = x.value[u.horizontal ? "clientHeight" : "clientWidth"];
+      return u.rtl && !u.horizontal && (e = n - e), e * 100 / n;
+    }, K = (e) => {
+      const n = c.value.activeSplitter;
+      let t = {
+        prevPanesSize: $(n),
+        nextPanesSize: N(n),
         prevReachedMinPanes: 0,
         nextReachedMinPanes: 0
       };
-      const n = 0 + (this.pushOtherPanes ? 0 : s.prevPanesSize), t = 100 - (this.pushOtherPanes ? 0 : s.nextPanesSize), a = Math.max(Math.min(this.getCurrentDragPercentage(e), t), n);
-      let r = [i, i + 1], o = this.panes[r[0]] || null, h = this.panes[r[1]] || null;
-      const l = o.max < 100 && a >= o.max + s.prevPanesSize, u = h.max < 100 && a <= 100 - (h.max + this.sumNextPanesSize(i + 1));
-      if (l || u) {
-        l ? (o.size = o.max, h.size = Math.max(100 - o.max - s.prevPanesSize - s.nextPanesSize, 0)) : (o.size = Math.max(100 - h.max - s.prevPanesSize - this.sumNextPanesSize(i + 1), 0), h.size = h.max);
+      const i = 0 + (u.pushOtherPanes ? 0 : t.prevPanesSize), s = 100 - (u.pushOtherPanes ? 0 : t.nextPanesSize), a = Math.max(Math.min(J(e), s), i);
+      let o = [n, n + 1], v = l.value[o[0]] || null, z = l.value[o[1]] || null;
+      const H = v.max < 100 && a >= v.max + t.prevPanesSize, ue = z.max < 100 && a <= 100 - (z.max + N(n + 1));
+      if (H || ue) {
+        H ? (v.size = v.max, z.size = Math.max(100 - v.max - t.prevPanesSize - t.nextPanesSize, 0)) : (v.size = Math.max(100 - z.max - t.prevPanesSize - N(n + 1), 0), z.size = z.max);
         return;
       }
-      if (this.pushOtherPanes) {
-        const d = this.doPushOtherPanes(s, a);
-        if (!d) return;
-        (({ sums: s, panesToResize: r } = d)), o = this.panes[r[0]] || null, h = this.panes[r[1]] || null;
+      if (u.pushOtherPanes) {
+        const j = Q(t, a);
+        if (!j) return;
+        (({ sums: t, panesToResize: o } = j)), v = l.value[o[0]] || null, z = l.value[o[1]] || null;
       }
-      o !== null && (o.size = Math.min(Math.max(a - s.prevPanesSize - s.prevReachedMinPanes, o.min), o.max)), h !== null && (h.size = Math.min(Math.max(100 - a - s.nextPanesSize - s.nextReachedMinPanes, h.min), h.max));
-    },
-    doPushOtherPanes(e, i) {
-      const s = this.touch.activeSplitter, n = [s, s + 1];
-      return i < e.prevPanesSize + this.panes[n[0]].min && (n[0] = this.findPrevExpandedPane(s).index, e.prevReachedMinPanes = 0, n[0] < s && this.panes.forEach((t, a) => {
-        a > n[0] && a <= s && (t.size = t.min, e.prevReachedMinPanes += t.min);
-      }), e.prevPanesSize = this.sumPrevPanesSize(n[0]), n[0] === void 0) ? (e.prevReachedMinPanes = 0, this.panes[0].size = this.panes[0].min, this.panes.forEach((t, a) => {
-        a > 0 && a <= s && (t.size = t.min, e.prevReachedMinPanes += t.min);
-      }), this.panes[n[1]].size = 100 - e.prevReachedMinPanes - this.panes[0].min - e.prevPanesSize - e.nextPanesSize, null) : i > 100 - e.nextPanesSize - this.panes[n[1]].min && (n[1] = this.findNextExpandedPane(s).index, e.nextReachedMinPanes = 0, n[1] > s + 1 && this.panes.forEach((t, a) => {
-        a > s && a < n[1] && (t.size = t.min, e.nextReachedMinPanes += t.min);
-      }), e.nextPanesSize = this.sumNextPanesSize(n[1] - 1), n[1] === void 0) ? (e.nextReachedMinPanes = 0, this.panes[this.panesCount - 1].size = this.panes[this.panesCount - 1].min, this.panes.forEach((t, a) => {
-        a < this.panesCount - 1 && a >= s + 1 && (t.size = t.min, e.nextReachedMinPanes += t.min);
-      }), this.panes[n[0]].size = 100 - e.prevPanesSize - e.nextReachedMinPanes - this.panes[this.panesCount - 1].min - e.nextPanesSize, null) : { sums: e, panesToResize: n };
-    },
-    sumPrevPanesSize(e) {
-      return this.panes.reduce((i, s, n) => i + (n < e ? s.size : 0), 0);
-    },
-    sumNextPanesSize(e) {
-      return this.panes.reduce((i, s, n) => i + (n > e + 1 ? s.size : 0), 0);
-    },
-    // Return the previous pane from siblings which has a size (width for vert or height for horz) of more than 0.
-    findPrevExpandedPane(e) {
-      return [...this.panes].reverse().find((s) => s.index < e && s.size > s.min) || {};
-    },
-    // Return the next pane from siblings which has a size (width for vert or height for horz) of more than 0.
-    findNextExpandedPane(e) {
-      return this.panes.find((s) => s.index > e + 1 && s.size > s.min) || {};
-    },
-    checkSplitpanesNodes() {
-      Array.from(this.container.children).forEach((i) => {
-        const s = i.classList.contains("splitpanes__pane"), n = i.classList.contains("splitpanes__splitter");
-        !s && !n && (i.parentNode.removeChild(i), console.warn("Splitpanes: Only <pane> elements are allowed at the root of <splitpanes>. One of your DOM nodes was removed."));
+      v !== null && (v.size = Math.min(Math.max(a - t.prevPanesSize - t.prevReachedMinPanes, v.min), v.max)), z !== null && (z.size = Math.min(Math.max(100 - a - t.nextPanesSize - t.nextReachedMinPanes, z.min), z.max));
+    }, Q = (e, n) => {
+      const t = c.value.activeSplitter, i = [t, t + 1];
+      return n < e.prevPanesSize + l.value[i[0]].min && (i[0] = V(t).index, e.prevReachedMinPanes = 0, i[0] < t && l.value.forEach((s, a) => {
+        a > i[0] && a <= t && (s.size = s.min, e.prevReachedMinPanes += s.min);
+      }), e.prevPanesSize = $(i[0]), i[0] === void 0) ? (e.prevReachedMinPanes = 0, l.value[0].size = l.value[0].min, l.value.forEach((s, a) => {
+        a > 0 && a <= t && (s.size = s.min, e.prevReachedMinPanes += s.min);
+      }), l.value[i[1]].size = 100 - e.prevReachedMinPanes - l.value[0].min - e.prevPanesSize - e.nextPanesSize, null) : n > 100 - e.nextPanesSize - l.value[i[1]].min && (i[1] = Z(t).index, e.nextReachedMinPanes = 0, i[1] > t + 1 && l.value.forEach((s, a) => {
+        a > t && a < i[1] && (s.size = s.min, e.nextReachedMinPanes += s.min);
+      }), e.nextPanesSize = N(i[1] - 1), i[1] === void 0) ? (e.nextReachedMinPanes = 0, l.value.forEach((s, a) => {
+        a < m.value - 1 && a >= t + 1 && (s.size = s.min, e.nextReachedMinPanes += s.min);
+      }), l.value[i[0]].size = 100 - e.prevPanesSize - N(i[0] - 1), null) : { sums: e, panesToResize: i };
+    }, $ = (e) => l.value.reduce((n, t, i) => n + (i < e ? t.size : 0), 0), N = (e) => l.value.reduce((n, t, i) => n + (i > e + 1 ? t.size : 0), 0), V = (e) => [...l.value].reverse().find((t) => t.index < e && t.size > t.min) || {}, Z = (e) => l.value.find((t) => t.index > e + 1 && t.size > t.min) || {}, ee = () => {
+      var n;
+      Array.from(((n = x.value) == null ? void 0 : n.children) || []).forEach((t) => {
+        const i = t.classList.contains("splitpanes__pane"), s = t.classList.contains("splitpanes__splitter");
+        !i && !s && (t.remove(), console.warn("Splitpanes: Only <pane> elements are allowed at the root of <splitpanes>. One of your DOM nodes was removed."));
       });
-    },
-    addSplitter(e, i, s = false) {
-      const n = e - 1, t = document.createElement("div");
-      t.classList.add("splitpanes__splitter"), s || (t.onmousedown = (a) => this.onMouseDown(a, n), typeof window < "u" && "ontouchstart" in window && (t.ontouchstart = (a) => this.onMouseDown(a, n)), t.onclick = (a) => this.onSplitterClick(a, n + 1)), this.dblClickSplitter && (t.ondblclick = (a) => this.onSplitterDblClick(a, n + 1)), i.parentNode.insertBefore(t, i);
-    },
-    removeSplitter(e) {
-      e.onmousedown = void 0, e.onclick = void 0, e.ondblclick = void 0, e.parentNode.removeChild(e);
-    },
-    redoSplitters() {
-      const e = Array.from(this.container.children);
-      e.forEach((s) => {
-        s.className.includes("splitpanes__splitter") && this.removeSplitter(s);
+    }, F = (e, n, t = false) => {
+      const i = e - 1, s = document.createElement("div");
+      s.classList.add("splitpanes__splitter"), t || (s.onmousedown = (a) => b(a, i), typeof window < "u" && "ontouchstart" in window && (s.ontouchstart = (a) => b(a, i)), s.onclick = (a) => A(a, i + 1)), s.ondblclick = (a) => U(a, i + 1), n.parentNode.insertBefore(s, n);
+    }, ne = (e) => {
+      e.onmousedown = void 0, e.onclick = void 0, e.ondblclick = void 0, e.remove();
+    }, C = () => {
+      var t;
+      const e = Array.from(((t = x.value) == null ? void 0 : t.children) || []);
+      e.forEach((i) => {
+        i.className.includes("splitpanes__splitter") && ne(i);
       });
-      let i = 0;
-      e.forEach((s) => {
-        s.className.includes("splitpanes__pane") && (!i && this.firstSplitter ? this.addSplitter(i, s, true) : i && this.addSplitter(i, s), i++);
+      let n = 0;
+      e.forEach((i) => {
+        i.className.includes("splitpanes__pane") && (!n && u.firstSplitter ? F(n, i, true) : n && F(n, i), n++);
       });
-    },
-    // Called by Pane component on programmatic resize.
-    requestUpdate({ target: e, ...i }) {
-      const s = this.indexedPanes[e._.uid];
-      Object.entries(i).forEach(([n, t]) => s[n] = t);
-    },
-    onPaneAdd(e) {
-      let i = -1;
-      Array.from(e.$el.parentNode.children).some((t) => (t.className.includes("splitpanes__pane") && i++, t === e.$el));
-      const s = parseFloat(e.minSize), n = parseFloat(e.maxSize);
-      this.panes.splice(i, 0, {
-        id: e._.uid,
-        index: i,
-        min: isNaN(s) ? 0 : s,
-        max: isNaN(n) ? 100 : n,
-        size: e.size === null ? null : parseFloat(e.size),
-        givenSize: e.size,
-        update: e.update
-      }), this.panes.forEach((t, a) => t.index = a), this.ready && this.$nextTick(() => {
-        this.redoSplitters(), this.resetPaneSizes({ addedPane: this.panes[i] }), this.$emit("pane-add", { index: i, panes: this.panes.map((t) => ({ min: t.min, max: t.max, size: t.size })) });
+    }, ie = ({ uid: e, ...n }) => {
+      const t = M.value[e];
+      Object.entries(n).forEach(([i, s]) => t[i] = s);
+    }, te = (e) => {
+      var t;
+      let n = -1;
+      Array.from(((t = x.value) == null ? void 0 : t.children) || []).some((i) => (i.className.includes("splitpanes__pane") && n++, i.isSameNode(e.el))), l.value.splice(n, 0, { ...e, index: n }), l.value.forEach((i, s) => i.index = s), S.value && nextTick(() => {
+        C(), L({ addedPane: l.value[n] }), f("pane-add", { pane: l.value[n] });
       });
-    },
-    onPaneRemove(e) {
-      const i = this.panes.findIndex((n) => n.id === e._.uid), s = this.panes.splice(i, 1)[0];
-      this.panes.forEach((n, t) => n.index = t), this.$nextTick(() => {
-        this.redoSplitters(), this.resetPaneSizes({ removedPane: { ...s, index: i } }), this.$emit("pane-remove", { removed: s, panes: this.panes.map((n) => ({ min: n.min, max: n.max, size: n.size })) });
+    }, se = (e) => {
+      const n = l.value.findIndex((i) => i.id === e);
+      l.value[n].el = null;
+      const t = l.value.splice(n, 1)[0];
+      l.value.forEach((i, s) => i.index = s), nextTick(() => {
+        C(), f("pane-remove", { pane: t }), L({ removedPane: { ...t } });
       });
-    },
-    resetPaneSizes(e = {}) {
-      !e.addedPane && !e.removedPane ? this.initialPanesSizing() : this.panes.some((i) => i.givenSize !== null || i.min || i.max < 100) ? this.equalizeAfterAddOrRemove(e) : this.equalize(), this.ready && this.$emit("resized", this.panes.map((i) => ({ min: i.min, max: i.max, size: i.size })));
-    },
-    equalize() {
-      const e = 100 / this.panesCount;
-      let i = 0;
-      const s = [], n = [];
-      this.panes.forEach((t) => {
-        t.size = Math.max(Math.min(e, t.max), t.min), i -= t.size, t.size >= t.max && s.push(t.id), t.size <= t.min && n.push(t.id);
-      }), i > 0.1 && this.readjustSizes(i, s, n);
-    },
-    initialPanesSizing() {
-      let e = 100;
-      const i = [], s = [];
+    }, L = (e = {}) => {
+      !e.addedPane && !e.removedPane ? le() : l.value.some((n) => n.givenSize !== null || n.min || n.max < 100) ? oe(e) : ae(), S.value && f("resized");
+    }, ae = () => {
+      const e = 100 / m.value;
       let n = 0;
-      this.panes.forEach((a) => {
-        e -= a.size, a.size !== null && n++, a.size >= a.max && i.push(a.id), a.size <= a.min && s.push(a.id);
+      const t = [], i = [];
+      l.value.forEach((s) => {
+        s.size = Math.max(Math.min(e, s.max), s.min), n -= s.size, s.size >= s.max && t.push(s.id), s.size <= s.min && i.push(s.id);
+      }), n > 0.1 && q(n, t, i);
+    }, le = () => {
+      let e = 100;
+      const n = [], t = [];
+      let i = 0;
+      l.value.forEach((a) => {
+        e -= a.size, a.givenSize !== null && i++, a.size >= a.max && n.push(a.id), a.size <= a.min && t.push(a.id);
       });
-      let t = 100;
-      e > 0.1 && (this.panes.forEach((a) => {
-        a.size === null && (a.size = Math.max(Math.min(e / (this.panesCount - n), a.max), a.min)), t -= a.size;
-      }), t > 0.1 && this.readjustSizes(e, i, s));
-    },
-    equalizeAfterAddOrRemove({ addedPane: e, removedPane: i } = {}) {
-      let s = 100 / this.panesCount, n = 0;
-      const t = [], a = [];
-      e && e.givenSize !== null && (s = (100 - e.givenSize) / (this.panesCount - 1)), this.panes.forEach((r) => {
-        n -= r.size, r.size >= r.max && t.push(r.id), r.size <= r.min && a.push(r.id);
-      }), !(Math.abs(n) < 0.1) && (this.panes.forEach((r) => {
-        e && e.givenSize !== null && e.id === r.id || (r.size = Math.max(Math.min(s, r.max), r.min)), n -= r.size, r.size >= r.max && t.push(r.id), r.size <= r.min && a.push(r.id);
-      }), n > 0.1 && this.readjustSizes(n, t, a));
-    },
-    /* recalculatePaneSizes ({ addedPane, removedPane } = {}) {
-          let leftToAllocate = 100
-          let equalSpaceToAllocate = leftToAllocate / this.panesCount
-          let ungrowable = []
-          let unshrinkable = []
-    
-          // When adding a pane with no size, apply min-size if defined otherwise divide another pane
-          // (next or prev) in 2.
-          // if (addedPane && addedPane.size === null) {
-          //   if (addedPane.min) addedPane.size = addedPane.min
-          //   else {
-          //     const paneToDivide = this.panes[addedPane.index + 1] || this.panes[addedPane.index - 1]
-          //     if (paneToDivide) {
-          //       // @todo: Dividing that pane in 2 could be incorrect if becoming lower than its min size.
-          //       addedPane.size = paneToDivide.size / 2
-          //       paneToDivide.size /= 2
-          //     }
-          //   }
-          // }
-    
-          this.panes.forEach((pane, i) => {
-            // Added pane - reduce the size of the next pane.
-            if (addedPane && addedPane.index + 1 === i) {
-              pane.size = Math.max(Math.min(100 - this.sumPrevPanesSize(i) - this.sumNextPanesSize(i + 1), pane.max), pane.min)
-              // @todo: if could not allocate correctly, try to allocate in the next pane straight away,
-              // then still do the second loop if not correct.
-            }
-    
-            // Removed pane - increase the size of the next pane.
-            else if (removedPane && removedPane.index === i) {
-              pane.size = Math.max(Math.min(100 - this.sumPrevPanesSize(i) - this.sumNextPanesSize(i + 1), pane.max), pane.min)
-              // @todo: if could not allocate correctly, try to allocate in the next pane straight away,
-              // then still do the second loop if not correct.
-            }
-    
-            // Initial load and on demand recalculation.
-            else if (!addedPane && !removedPane && pane.size === null) {
-              pane.size = Math.max(Math.min(equalSpaceToAllocate, pane.max), pane.min)
-            }
-    
-            leftToAllocate -= pane.size
-    
-            if (pane.size >= pane.max) ungrowable.push(pane.id)
-            if (pane.size <= pane.min) unshrinkable.push(pane.id)
-          })
-    
-          // Do one more loop to adjust sizes if still wrong.
-          // > 0.1: Prevent maths rounding issues due to bytes.
-          if (Math.abs(leftToAllocate) > 0.1) this.readjustSizes(leftToAllocate, ungrowable, unshrinkable)
-        }, */
-    // Second loop to adjust sizes now that we know more about the panes constraints.
-    readjustSizes(e, i, s) {
-      let n;
-      e > 0 ? n = e / (this.panesCount - i.length) : n = e / (this.panesCount - s.length), this.panes.forEach((t, a) => {
-        if (e > 0 && !i.includes(t.id)) {
-          const r = Math.max(Math.min(t.size + n, t.max), t.min), o = r - t.size;
-          e -= o, t.size = r;
-        } else if (!s.includes(t.id)) {
-          const r = Math.max(Math.min(t.size + n, t.max), t.min), o = r - t.size;
-          e -= o, t.size = r;
+      let s = 100;
+      e > 0.1 && (l.value.forEach((a) => {
+        a.givenSize === null && (a.size = Math.max(Math.min(e / (m.value - i), a.max), a.min)), s -= a.size;
+      }), s > 0.1 && q(s, n, t));
+    }, oe = ({ addedPane: e, removedPane: n } = {}) => {
+      let t = 100 / m.value, i = 0;
+      const s = [], a = [];
+      ((e == null ? void 0 : e.givenSize) ?? null) !== null && (t = (100 - e.givenSize) / (m.value - 1)), l.value.forEach((o) => {
+        i -= o.size, o.size >= o.max && s.push(o.id), o.size <= o.min && a.push(o.id);
+      }), !(Math.abs(i) < 0.1) && (l.value.forEach((o) => {
+        (e == null ? void 0 : e.givenSize) !== null && (e == null ? void 0 : e.id) === o.id || (o.size = Math.max(Math.min(t, o.max), o.min)), i -= o.size, o.size >= o.max && s.push(o.id), o.size <= o.min && a.push(o.id);
+      }), i > 0.1 && q(i, s, a));
+    }, q = (e, n, t) => {
+      let i;
+      e > 0 ? i = e / (m.value - n.length) : i = e / (m.value - t.length), l.value.forEach((s, a) => {
+        if (e > 0 && !n.includes(s.id)) {
+          const o = Math.max(Math.min(s.size + i, s.max), s.min), v = o - s.size;
+          e -= v, s.size = o;
+        } else if (!t.includes(s.id)) {
+          const o = Math.max(Math.min(s.size + i, s.max), s.min), v = o - s.size;
+          e -= v, s.size = o;
         }
-        t.update({
-          [this.horizontal ? "height" : "width"]: `${this.indexedPanes[t.id].size}%`
-        });
-      }), Math.abs(e) > 0.1 && this.$nextTick(() => {
-        this.ready && console.warn("Splitpanes: Could not resize panes correctly due to their constraints.");
+      }), Math.abs(e) > 0.1 && nextTick(() => {
+        S.value && console.warn("Splitpanes: Could not resize panes correctly due to their constraints.");
       });
-    }
-    /* distributeEmptySpace () {
-          let growablePanes = []
-          let collapsedPanesCount = 0
-          let growableAmount = 0 // Total of how much the current panes can grow to fill blank space.
-          let spaceToDistribute = 100 - this.panes.reduce((sum, pane) => (sum += pane.size) && sum, 0)
-          // Do a first loop to determine if we can distribute the new blank space between all the
-          // expandedPanes, without expanding the collapsed ones.
-          this.panes.forEach(pane => {
-            if (pane.size < pane.max) growablePanes.push(pane)
-    
-            if (!pane.size) collapsedPanesCount++
-            else growableAmount += pane.max - pane.size
-          })
-    
-          // If the blank space to distribute is too great for the expanded panes, also expand collapsed ones.
-          let expandCollapsedPanes = growableAmount < spaceToDistribute
-    
-          // New space to distribute equally.
-          let growablePanesCount = (growablePanes.length - (expandCollapsedPanes ? 0 : collapsedPanesCount))
-          let equalSpaceToDistribute = spaceToDistribute / growablePanesCount
-          // if (growablePanesCount === 1) equalSpace = 100 / this.panesCount
-          let spaceLeftToDistribute = spaceToDistribute
-    
-          // Now add the equalSpaceToDistribute to each pane size accordingly.
-          growablePanes.forEach(pane => {
-            if (pane.size < pane.max && (pane.size || (!pane.size && expandCollapsedPanes))) {
-              const newSize = Math.min(pane.size + equalSpaceToDistribute, pane.max)
-              let allocatedSpace = (newSize - pane.size)
-              spaceLeftToDistribute -= allocatedSpace
-              pane.size = newSize
-              // If the equalSpaceToDistribute is not fully added to the current pane, distribute the remainder
-              // to the next panes.
-              // Also fix decimal issue due to bites - E.g. calculating 8.33 and getting 8.3299999999999
-              if (equalSpaceToDistribute - allocatedSpace > 0.1) equalSpaceToDistribute = spaceLeftToDistribute / (--growablePanesCount)
-            }
-          })
-    
-          /* Disabled otherwise will show up on hot reload.
-          // if there is still space to allocate show warning message.
-          if (this.panesCount && ~~spaceLeftToDistribute) {
-            // eslint-disable-next-line no-console
-            console.warn('Splitpanes: Could not distribute all the empty space between panes due to their constraints.')
-          } *\/
-    
-          this.$emit('resized', this.panes.map(pane => ({ min: pane.min, max: pane.max, size: pane.size })))
-        } */
-  },
-  watch: {
-    panes: {
-      // Every time a pane is updated, update the panes accordingly.
-      deep: true,
-      immediate: false,
-      handler() {
-        this.updatePaneComponents();
-      }
-    },
-    horizontal() {
-      this.updatePaneComponents();
-    },
-    firstSplitter() {
-      this.redoSplitters();
-    },
-    dblClickSplitter(e) {
-      [...this.container.querySelectorAll(".splitpanes__splitter")].forEach((s, n) => {
-        s.ondblclick = e ? (t) => this.onSplitterDblClick(t, n) : void 0;
+    }, f = (e, n = void 0, t = false) => {
+      const i = (n == null ? void 0 : n.index) ?? c.value.activeSplitter ?? null;
+      _(e, {
+        ...n,
+        ...i !== null && { index: i },
+        ...t && i !== null && {
+          prevPane: l.value[i - (u.firstSplitter ? 1 : 0)],
+          nextPane: l.value[i + (u.firstSplitter ? 0 : 1)]
+        },
+        panes: l.value.map((s) => ({ min: s.min, max: s.max, size: s.size }))
       });
-    }
-  },
-  beforeUnmount() {
-    this.ready = false;
-  },
-  mounted() {
-    this.container = this.$refs.container, this.checkSplitpanesNodes(), this.redoSplitters(), this.resetPaneSizes(), this.$emit("ready"), this.ready = true;
-  },
-  render() {
-    return h(
-      "div",
-      {
-        ref: "container",
-        class: [
-          "splitpanes",
-          `splitpanes--${this.horizontal ? "horizontal" : "vertical"}`,
-          {
-            "splitpanes--dragging": this.touch.dragging
-          }
-        ]
-      },
-      this.$slots.default()
-    );
+    };
+    watch(() => u.firstSplitter, () => C()), onMounted(() => {
+      ee(), C(), L(), f("ready"), S.value = true;
+    }), onBeforeUnmount(() => S.value = false);
+    const re = () => {
+      var e;
+      return h(
+        "div",
+        { ref: x, class: y.value },
+        (e = k.default) == null ? void 0 : e.call(k)
+      );
+    };
+    return provide("panes", l), provide("indexedPanes", M), provide("horizontal", computed(() => u.horizontal)), provide("requestUpdate", ie), provide("onPaneAdd", te), provide("onPaneRemove", se), provide("onPaneClick", W), (e, n) => (openBlock(), createBlock(resolveDynamicComponent(re)));
   }
-}, S = (e, i) => {
-  const s = e.__vccOpts || e;
-  for (const [n, t] of i)
-    s[n] = t;
-  return s;
-}, x = {
-  // eslint-disable-next-line vue/multi-word-component-names
-  name: "pane",
-  inject: ["requestUpdate", "onPaneAdd", "onPaneRemove", "onPaneClick"],
+}, ge = {
+  __name: "pane",
   props: {
-    size: { type: [Number, String], default: null },
+    size: { type: [Number, String] },
     minSize: { type: [Number, String], default: 0 },
     maxSize: { type: [Number, String], default: 100 }
   },
-  data: () => ({
-    style: {}
-  }),
-  mounted() {
-    this.onPaneAdd(this);
-  },
-  beforeUnmount() {
-    this.onPaneRemove(this);
-  },
-  methods: {
-    // Called from the splitpanes component.
-    update(e) {
-      this.style = e;
-    }
-  },
-  computed: {
-    sizeNumber() {
-      return this.size || this.size === 0 ? parseFloat(this.size) : null;
-    },
-    minSizeNumber() {
-      return parseFloat(this.minSize);
-    },
-    maxSizeNumber() {
-      return parseFloat(this.maxSize);
-    }
-  },
-  watch: {
-    sizeNumber(e) {
-      this.requestUpdate({ target: this, size: e });
-    },
-    minSizeNumber(e) {
-      this.requestUpdate({ target: this, min: e });
-    },
-    maxSizeNumber(e) {
-      this.requestUpdate({ target: this, max: e });
-    }
+  setup(D) {
+    var b;
+    const p = D, _ = inject("requestUpdate"), u = inject("onPaneAdd"), k = inject("horizontal"), l = inject("onPaneRemove"), M = inject("onPaneClick"), m = (b = getCurrentInstance()) == null ? void 0 : b.uid, x = inject("indexedPanes"), S = computed(() => x.value[m]), c = ref(null), d = computed(() => {
+      const r = isNaN(p.size) || p.size === void 0 ? 0 : parseFloat(p.size);
+      return Math.max(Math.min(r, R.value), y.value);
+    }), y = computed(() => {
+      const r = parseFloat(p.minSize);
+      return isNaN(r) ? 0 : r;
+    }), R = computed(() => {
+      const r = parseFloat(p.maxSize);
+      return isNaN(r) ? 100 : r;
+    }), O = computed(() => {
+      var r;
+      return `${k.value ? "height" : "width"}: ${(r = S.value) == null ? void 0 : r.size}%`;
+    });
+    return watch(() => d.value, (r) => _({ uid: m, size: r })), watch(() => y.value, (r) => _({ uid: m, min: r })), watch(() => R.value, (r) => _({ uid: m, max: r })), onMounted(() => {
+      u({
+        id: m,
+        el: c.value,
+        min: y.value,
+        max: R.value,
+        // The given size (useful to know the user intention).
+        givenSize: p.size === void 0 ? null : d.value,
+        size: d.value
+        // The computed current size at any time.
+      });
+    }), onBeforeUnmount(() => l(m)), (r, P) => (openBlock(), createElementBlock("div", {
+      ref_key: "paneEl",
+      ref: c,
+      class: "splitpanes__pane",
+      onClick: P[0] || (P[0] = (A) => unref(M)(A, r._.uid)),
+      style: normalizeStyle(O.value)
+    }, [
+      renderSlot(r.$slots, "default")
+    ], 4));
   }
 };
-function P(e, i, s, n, t, a) {
-  return openBlock(), createElementBlock("div", {
-    class: "splitpanes__pane",
-    onClick: i[0] || (i[0] = (r) => a.onPaneClick(r, e._.uid)),
-    style: normalizeStyle(e.style)
-  }, [
-    renderSlot(e.$slots, "default")
-  ], 4);
-}
-const g = /* @__PURE__ */ S(x, [["render", P]]);
 
 /* Injected with object hook! */
 
-export { M, Ripple as R, script$4 as a, script as b, axios as c, g, script$5 as s, uuid as u };
+export { Pe as P, Ripple as R, script$4 as a, script as b, cn as c, axios as d, ge as g, script$5 as s };