primevue 3.47.2 → 3.48.1

package/core/core.js

@@ -1826,7 +1826,7 @@ this.primevue.config = (function (exports, api, vue) {
     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 || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
     var defaultOptions = {
       ripple: false,
-      inputStyle: 'outlined',
+      inputStyle: null,
       locale: {
         startsWith: 'Starts with',
         contains: 'Contains',
@@ -2192,12 +2192,8 @@ this.primevue.basecomponent.style = (function (BaseStyle, usestyle) {
     function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
     function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(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 || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-    var buttonCSS = "\n.p-button {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    vertical-align: bottom;\n    text-align: center;\n    overflow: hidden;\n    position: relative;\n}\n\n.p-button-label {\n    flex: 1 1 auto;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-only {\n    justify-content: center;\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n    flex: 0 0 auto;\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-buttonset .p-button {\n    margin: 0;\n}\n\n.p-buttonset .p-button:not(:last-child), .p-buttonset .p-button:not(:last-child):hover {\n    border-right: 0 none;\n}\n\n.p-buttonset .p-button:not(:first-of-type):not(:last-of-type) {\n    border-radius: 0;\n}\n\n.p-buttonset .p-button:first-of-type:not(:only-of-type) {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n\n.p-buttonset .p-button:last-of-type:not(:only-of-type) {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n\n.p-buttonset .p-button:focus {\n    position: relative;\n    z-index: 1;\n}\n";
-    var inputTextCSS = "\n.p-fluid .p-inputtext {\n    width: 100%;\n}\n\n/* InputGroup */\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup-addon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-inputgroup .p-float-label {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-fluid .p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-fluid .p-inputgroup .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n/* Floating Label */\n.p-float-label {\n    display: block;\n    position: relative;\n}\n\n.p-float-label label {\n    position: absolute;\n    pointer-events: none;\n    top: 50%;\n    margin-top: -.5rem;\n    transition-property: all;\n    transition-timing-function: ease;\n    line-height: 1;\n}\n\n.p-float-label textarea ~ label {\n    top: 1rem;\n}\n\n.p-float-label input:focus ~ label,\n.p-float-label input.p-filled ~ label,\n.p-float-label input:-webkit-autofill ~ label,\n.p-float-label textarea:focus ~ label,\n.p-float-label textarea.p-filled ~ label,\n.p-float-label .p-inputwrapper-focus ~ label,\n.p-float-label .p-inputwrapper-filled ~ label {\n    top: -.75rem;\n    font-size: 12px;\n}\n\n\n.p-float-label .p-placeholder,\n.p-float-label input::placeholder,\n.p-float-label .p-inputtext::placeholder {\n    opacity: 0;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-float-label .p-focus .p-placeholder,\n.p-float-label input:focus::placeholder,\n.p-float-label .p-inputtext:focus::placeholder {\n    opacity: 1;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-input-icon-left,\n.p-input-icon-right {\n    position: relative;\n    display: inline-block;\n}\n\n.p-input-icon-left > i,\n.p-input-icon-left > svg,\n.p-input-icon-right > i,\n.p-input-icon-right > svg {\n    position: absolute;\n    top: 50%;\n    margin-top: -.5rem;\n}\n\n.p-fluid .p-input-icon-left,\n.p-fluid .p-input-icon-right {\n    display: block;\n    width: 100%;\n}\n";
-    var css = "\n@layer primevue {\n.p-component, .p-component * {\n    box-sizing: border-box;\n}\n\n.p-hidden-space {\n    visibility: hidden;\n}\n\n.p-reset {\n    margin: 0;\n    padding: 0;\n    border: 0;\n    outline: 0;\n    text-decoration: none;\n    font-size: 100%;\n    list-style: none;\n}\n\n.p-disabled, .p-disabled * {\n    cursor: default;\n    pointer-events: none;\n    user-select: none;\n}\n\n.p-component-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n\n.p-unselectable-text {\n    user-select: none;\n}\n\n.p-sr-only {\n    border: 0;\n    clip: rect(1px, 1px, 1px, 1px);\n    clip-path: inset(50%);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n    word-wrap: normal;\n}\n\n.p-link {\n\ttext-align: left;\n\tbackground-color: transparent;\n\tmargin: 0;\n\tpadding: 0;\n\tborder: none;\n    cursor: pointer;\n    user-select: none;\n}\n\n.p-link:disabled {\n\tcursor: default;\n}\n\n/* Non vue overlay animations */\n.p-connected-overlay {\n    opacity: 0;\n    transform: scaleY(0.8);\n    transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.p-connected-overlay-visible {\n    opacity: 1;\n    transform: scaleY(1);\n}\n\n.p-connected-overlay-hidden {\n    opacity: 0;\n    transform: scaleY(1);\n    transition: opacity .1s linear;\n}\n\n/* Vue based overlay animations */\n.p-connected-overlay-enter-from {\n    opacity: 0;\n    transform: scaleY(0.8);\n}\n\n.p-connected-overlay-leave-to {\n    opacity: 0;\n}\n\n.p-connected-overlay-enter-active {\n    transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.p-connected-overlay-leave-active {\n    transition: opacity .1s linear;\n}\n\n/* Toggleable Content */\n.p-toggleable-content-enter-from,\n.p-toggleable-content-leave-to {\n    max-height: 0;\n}\n\n.p-toggleable-content-enter-to,\n.p-toggleable-content-leave-from {\n    max-height: 1000px;\n}\n\n.p-toggleable-content-leave-active {\n    overflow: hidden;\n    transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);\n}\n\n.p-toggleable-content-enter-active {\n    overflow: hidden;\n    transition: max-height 1s ease-in-out;\n}\n".concat(buttonCSS, "\n").concat(inputTextCSS, "\n}\n");
     var BaseComponentStyle = BaseStyle__default["default"].extend({
       name: 'common',
-      css: css,
       loadGlobalStyle: function loadGlobalStyle(globalCSS) {
         var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
         return usestyle.useStyle(globalCSS, _objectSpread({
@@ -2219,7 +2215,6 @@ this.primevue.accordion.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-accordion-header-action {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        user-select: none;\n        position: relative;\n        text-decoration: none;\n    }\n    \n    .p-accordion-header-action:focus {\n        z-index: 1;\n    }\n    \n    .p-accordion-header-text {\n        line-height: 1;\n    }\n}\n";
     var classes = {
       root: 'p-accordion p-component',
       tab: {
@@ -2248,7 +2243,6 @@ this.primevue.accordion.style = (function (BaseStyle) {
     };
     var AccordionStyle = BaseStyle__default["default"].extend({
       name: 'accordion',
-      css: css,
       classes: classes
     });
 
@@ -2287,7 +2281,6 @@ this.primevue.autocomplete.style = (function (BaseStyle, utils) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-autocomplete {\n        display: inline-flex;\n    }\n\n    .p-autocomplete-loader {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-autocomplete-dd .p-autocomplete-input {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n\n    .p-autocomplete-dd .p-autocomplete-input,\n    .p-autocomplete-dd .p-autocomplete-multiple-container {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-autocomplete-dd .p-autocomplete-dropdown {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0px;\n    }\n\n    .p-autocomplete .p-autocomplete-panel {\n        min-width: 100%;\n    }\n\n    .p-autocomplete-panel {\n        position: absolute;\n        overflow: auto;\n        top: 0;\n        left: 0;\n    }\n\n    .p-autocomplete-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-autocomplete-item {\n        cursor: pointer;\n        white-space: nowrap;\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-autocomplete-multiple-container {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        cursor: text;\n        overflow: hidden;\n        display: flex;\n        align-items: center;\n        flex-wrap: wrap;\n    }\n\n    .p-autocomplete-token {\n        cursor: default;\n        display: inline-flex;\n        align-items: center;\n        flex: 0 0 auto;\n    }\n\n    .p-autocomplete-token-icon {\n        cursor: pointer;\n    }\n\n    .p-autocomplete-input-token {\n        flex: 1 1 auto;\n        display: inline-flex;\n    }\n\n    .p-autocomplete-input-token input {\n        border: 0 none;\n        outline: 0 none;\n        background-color: transparent;\n        margin: 0;\n        padding: 0;\n        box-shadow: none;\n        border-radius: 0;\n        width: 100%;\n    }\n\n    .p-fluid .p-autocomplete {\n        display: flex;\n    }\n\n    .p-fluid .p-autocomplete-dd .p-autocomplete-input {\n        width: 1%;\n    }\n}\n";
     var inlineStyles = {
       root: {
         position: 'relative'
@@ -2299,6 +2292,7 @@ this.primevue.autocomplete.style = (function (BaseStyle, utils) {
           props = _ref.props;
         return ['p-autocomplete p-component p-inputwrapper', {
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
           'p-focus': instance.focused,
           'p-autocomplete-dd': props.dropdown,
           'p-autocomplete-multiple': props.multiple,
@@ -2308,15 +2302,23 @@ this.primevue.autocomplete.style = (function (BaseStyle, utils) {
         }];
       },
       input: function input(_ref2) {
-        var props = _ref2.props;
+        var props = _ref2.props,
+          instance = _ref2.instance;
         return ['p-autocomplete-input p-inputtext p-component', {
-          'p-autocomplete-dd-input': props.dropdown
+          'p-autocomplete-dd-input': props.dropdown,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       },
-      container: 'p-autocomplete-multiple-container p-component p-inputtext',
-      token: function token(_ref3) {
-        var instance = _ref3.instance,
-          i = _ref3.i;
+      container: function container(_ref3) {
+        var props = _ref3.props,
+          instance = _ref3.instance;
+        return ['p-autocomplete-multiple-container p-component p-inputtext', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
+        }];
+      },
+      token: function token(_ref4) {
+        var instance = _ref4.instance,
+          i = _ref4.i;
         return ['p-autocomplete-token', {
           'p-focus': instance.focusedMultipleOptionIndex === i
         }];
@@ -2326,20 +2328,20 @@ this.primevue.autocomplete.style = (function (BaseStyle, utils) {
       inputToken: 'p-autocomplete-input-token',
       loadingIcon: 'p-autocomplete-loader',
       dropdownButton: 'p-autocomplete-dropdown',
-      panel: function panel(_ref4) {
-        var instance = _ref4.instance;
+      panel: function panel(_ref5) {
+        _ref5.props;
+          var instance = _ref5.instance;
         return ['p-autocomplete-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
       list: 'p-autocomplete-items',
       itemGroup: 'p-autocomplete-item-group',
-      item: function item(_ref5) {
-        var instance = _ref5.instance,
-          option = _ref5.option,
-          i = _ref5.i,
-          getItemOptions = _ref5.getItemOptions;
+      item: function item(_ref6) {
+        var instance = _ref6.instance,
+          option = _ref6.option,
+          i = _ref6.i,
+          getItemOptions = _ref6.getItemOptions;
         return ['p-autocomplete-item', {
           'p-highlight': instance.isSelected(option),
           'p-focus': instance.focusedOptionIndex === instance.getOptionIndex(i, getItemOptions),
@@ -2350,7 +2352,6 @@ this.primevue.autocomplete.style = (function (BaseStyle, utils) {
     };
     var AutoCompleteStyle = BaseStyle__default["default"].extend({
       name: 'autocomplete',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -2368,7 +2369,6 @@ this.primevue.avatar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-avatar {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        width: 2rem;\n        height: 2rem;\n        font-size: 1rem;\n    }\n\n    .p-avatar.p-avatar-image {\n        background-color: transparent;\n    }\n\n    .p-avatar.p-avatar-circle {\n        border-radius: 50%;\n    }\n\n    .p-avatar-circle img {\n        border-radius: 50%;\n    }\n\n    .p-avatar .p-avatar-icon {\n        font-size: 1rem;\n    }\n\n    .p-avatar img {\n        width: 100%;\n        height: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -2384,7 +2384,6 @@ this.primevue.avatar.style = (function (BaseStyle) {
     };
     var AvatarStyle = BaseStyle__default["default"].extend({
       name: 'avatar',
-      css: css,
       classes: classes
     });
 
@@ -2401,13 +2400,11 @@ this.primevue.avatargroup.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-avatar-group .p-avatar + .p-avatar {\n        margin-left: -1rem;\n    }\n\n    .p-avatar-group {\n        display: flex;\n        align-items: center;\n    }\n}\n";
     var classes = {
       root: 'p-avatar-group p-component'
     };
     var AvatarGroupStyle = BaseStyle__default["default"].extend({
       name: 'avatargroup',
-      css: css,
       classes: classes
     });
 
@@ -2424,7 +2421,6 @@ this.primevue.badge.style = (function (BaseStyle, utils) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-badge {\n        display: inline-block;\n        border-radius: 10px;\n        text-align: center;\n        padding: 0 .5rem;\n    }\n\n    .p-overlay-badge {\n        position: relative;\n    }\n\n    .p-overlay-badge .p-badge {\n        position: absolute;\n        top: 0;\n        right: 0;\n        transform: translate(50%,-50%);\n        transform-origin: 100% 0;\n        margin: 0;\n    }\n\n    .p-badge-dot {\n        width: .5rem;\n        min-width: .5rem;\n        height: .5rem;\n        border-radius: 50%;\n        padding: 0;\n    }\n\n    .p-badge-no-gutter {\n        padding: 0;\n        border-radius: 50%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props,
@@ -2437,13 +2433,14 @@ this.primevue.badge.style = (function (BaseStyle, utils) {
           'p-badge-info': props.severity === 'info',
           'p-badge-success': props.severity === 'success',
           'p-badge-warning': props.severity === 'warning',
-          'p-badge-danger': props.severity === 'danger'
+          'p-badge-danger': props.severity === 'danger',
+          'p-badge-secondary': props.severity === 'secondary',
+          'p-badge-contrast': props.severity === 'contrast'
         }];
       }
     };
     var BadgeStyle = BaseStyle__default["default"].extend({
       name: 'badge',
-      css: css,
       classes: classes
     });
 
@@ -2460,13 +2457,11 @@ this.primevue.badgedirective.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-badge {\n        display: inline-block;\n        border-radius: 10px;\n        text-align: center;\n        padding: 0 .5rem;\n    }\n\n    .p-overlay-badge {\n        position: relative;\n    }\n\n    .p-overlay-badge .p-badge {\n        position: absolute;\n        top: 0;\n        right: 0;\n        transform: translate(50%,-50%);\n        transform-origin: 100% 0;\n        margin: 0;\n    }\n\n    .p-badge-dot {\n        width: .5rem;\n        min-width: .5rem;\n        height: .5rem;\n        border-radius: 50%;\n        padding: 0;\n    }\n\n    .p-badge-no-gutter {\n        padding: 0;\n        border-radius: 50%;\n    }\n}\n";
     var classes = {
       root: 'p-badge p-component'
     };
     var BadgeDirectiveStyle = BaseStyle__default["default"].extend({
       name: 'badge',
-      css: css,
       classes: classes
     });
 
@@ -2502,13 +2497,11 @@ this.primevue.blockui.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-blockui-container {\n        position: relative;\n    }\n\n    .p-blockui.p-component-overlay {\n        position: absolute;\n    }\n\n    .p-blockui-document.p-component-overlay {\n        position: fixed;\n    }\n}\n";
     var classes = {
       root: 'p-blockui-container'
     };
     var BlockUIStyle = BaseStyle__default["default"].extend({
       name: 'blockui',
-      css: css,
       classes: classes
     });
 
@@ -2525,7 +2518,6 @@ this.primevue.breadcrumb.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-breadcrumb {\n        overflow-x: auto;\n    }\n\n    .p-breadcrumb .p-breadcrumb-list {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        display: flex;\n        align-items: center;\n        flex-wrap: nowrap;\n    }\n\n    .p-breadcrumb .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-breadcrumb .p-menuitem-link {\n        text-decoration: none;\n        display: flex;\n        align-items: center;\n    }\n\n    .p-breadcrumb .p-menuitem-separator {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-breadcrumb::-webkit-scrollbar {\n        display: none;\n    }\n}\n";
     var classes = {
       root: 'p-breadcrumb p-component',
       menu: 'p-breadcrumb-list',
@@ -2543,7 +2535,6 @@ this.primevue.breadcrumb.style = (function (BaseStyle) {
     };
     var BreadcrumbStyle = BaseStyle__default["default"].extend({
       name: 'breadcrumb',
-      css: css,
       classes: classes
     });
 
@@ -2607,7 +2598,6 @@ this.primevue.calendar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-calendar {\n        display: inline-flex;\n        max-width: 100%;\n    }\n\n    .p-calendar .p-inputtext {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n\n    .p-calendar-w-btn .p-inputtext {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-calendar-w-btn .p-datepicker-trigger {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-calendar .p-datepicker-trigger-icon {\n        cursor: pointer;\n    }\n\n    /* Fluid */\n    .p-fluid .p-calendar {\n        display: flex;\n    }\n\n    .p-fluid .p-calendar .p-inputtext {\n        width: 1%;\n    }\n\n    /* Datepicker */\n    .p-calendar .p-datepicker {\n        min-width: 100%;\n    }\n\n    .p-datepicker {\n        width: auto;\n    }\n\n    .p-datepicker-inline {\n        display: inline-block;\n        overflow-x: auto;\n    }\n\n    /* Header */\n    .p-datepicker-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .p-datepicker-header .p-datepicker-title {\n        margin: 0 auto;\n    }\n\n    .p-datepicker-prev,\n    .p-datepicker-next {\n        cursor: pointer;\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Multiple Month DatePicker */\n    .p-datepicker-multiple-month .p-datepicker-group-container {\n        display: flex;\n    }\n\n    .p-datepicker-multiple-month .p-datepicker-group-container .p-datepicker-group {\n        flex: 1 1 auto;\n    }\n\n    /* DatePicker Table */\n    .p-datepicker table {\n        width: 100%;\n        border-collapse: collapse;\n    }\n\n    .p-datepicker td > span {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        margin: 0 auto;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Month Picker */\n    .p-monthpicker-month {\n        width: 33.3%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Year Picker */\n    .p-yearpicker-year {\n        width: 50%;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /*  Button Bar */\n    .p-datepicker-buttonbar {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n    }\n\n    /* Time Picker */\n    .p-timepicker {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n\n    .p-timepicker button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-timepicker > div {\n        display: flex;\n        align-items: center;\n        flex-direction: column;\n    }\n\n    /* Touch UI */\n    .p-datepicker-touch-ui,\n    .p-calendar .p-datepicker-touch-ui {\n        min-width: 80vw;\n    }\n}\n";
     var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -2625,18 +2615,25 @@ this.primevue.calendar.style = (function (BaseStyle) {
           'p-input-icon-right': props.showIcon && props.iconDisplay === 'input',
           'p-calendar-timeonly': props.timeOnly,
           'p-calendar-disabled': props.disabled,
+          'p-invalid': props.invalid,
           'p-inputwrapper-filled': props.modelValue,
           'p-inputwrapper-focus': state.focused,
           'p-focus': state.focused || state.overlayVisible
         }];
       },
-      input: 'p-inputtext p-component',
+      input: function input(_ref3) {
+        var props = _ref3.props,
+          instance = _ref3.instance;
+        return ['p-inputtext p-component', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
+        }];
+      },
       dropdownButton: 'p-datepicker-trigger',
       inputIcon: 'p-datepicker-trigger-icon',
-      panel: function panel(_ref3) {
-        var instance = _ref3.instance,
-          props = _ref3.props,
-          state = _ref3.state;
+      panel: function panel(_ref4) {
+        var instance = _ref4.instance,
+          props = _ref4.props,
+          state = _ref4.state;
         return ['p-datepicker p-component', {
           'p-datepicker-mobile': instance.queryMatches,
           'p-datepicker-inline': props.inline,
@@ -2646,7 +2643,6 @@ this.primevue.calendar.style = (function (BaseStyle) {
           'p-datepicker-monthpicker': state.currentView === 'month',
           'p-datepicker-yearpicker': state.currentView === 'year',
           'p-datepicker-touch-ui': props.touchUI,
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -2666,35 +2662,35 @@ this.primevue.calendar.style = (function (BaseStyle) {
       weekHeader: 'p-datepicker-weekheader p-disabled',
       weekNumber: 'p-datepicker-weeknumber',
       weekLabelContainer: 'p-disabled',
-      day: function day(_ref4) {
-        var date = _ref4.date;
+      day: function day(_ref5) {
+        var date = _ref5.date;
         return [{
           'p-datepicker-other-month': date.otherMonth,
           'p-datepicker-today': date.today
         }];
       },
-      dayLabel: function dayLabel(_ref5) {
-        var instance = _ref5.instance,
-          date = _ref5.date;
+      dayLabel: function dayLabel(_ref6) {
+        var instance = _ref6.instance,
+          date = _ref6.date;
         return [{
           'p-highlight': instance.isSelected(date) && date.selectable,
           'p-disabled': !date.selectable
         }];
       },
       monthPicker: 'p-monthpicker',
-      month: function month(_ref6) {
-        var instance = _ref6.instance,
-          _month = _ref6.month,
-          index = _ref6.index;
+      month: function month(_ref7) {
+        var instance = _ref7.instance,
+          _month = _ref7.month,
+          index = _ref7.index;
         return ['p-monthpicker-month', {
           'p-highlight': instance.isMonthSelected(index),
           'p-disabled': !_month.selectable
         }];
       },
       yearPicker: 'p-yearpicker',
-      year: function year(_ref7) {
-        var instance = _ref7.instance,
-          _year = _ref7.year;
+      year: function year(_ref8) {
+        var instance = _ref8.instance,
+          _year = _ref8.year;
         return ['p-yearpicker-year', {
           'p-highlight': instance.isYearSelected(_year.value),
           'p-disabled': !_year.selectable
@@ -2714,7 +2710,6 @@ this.primevue.calendar.style = (function (BaseStyle) {
     };
     var CalendarStyle = BaseStyle__default["default"].extend({
       name: 'calendar',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -2760,7 +2755,6 @@ this.primevue.carousel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-carousel {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-carousel-content {\n        display: flex;\n        flex-direction: column;\n        overflow: auto;\n    }\n\n    .p-carousel-prev,\n    .p-carousel-next {\n        align-self: center;\n        flex-grow: 0;\n        flex-shrink: 0;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-carousel-container {\n        display: flex;\n        flex-direction: row;\n    }\n\n    .p-carousel-items-content {\n        overflow: hidden;\n        width: 100%;\n    }\n\n    .p-carousel-items-container {\n        display: flex;\n        flex-direction: row;\n    }\n\n    .p-carousel-indicators {\n        display: flex;\n        flex-direction: row;\n        justify-content: center;\n        flex-wrap: wrap;\n    }\n\n    .p-carousel-indicator > button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    /* Vertical */\n    .p-carousel-vertical .p-carousel-container {\n        flex-direction: column;\n    }\n\n    .p-carousel-vertical .p-carousel-items-container {\n        flex-direction: column;\n        height: 100%;\n    }\n\n    /* Keyboard Support */\n    .p-items-hidden .p-carousel-item {\n        visibility: hidden;\n    }\n\n    .p-items-hidden .p-carousel-item.p-carousel-item-active {\n        visibility: visible;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
@@ -2821,7 +2815,6 @@ this.primevue.carousel.style = (function (BaseStyle) {
     };
     var CarouselStyle = BaseStyle__default["default"].extend({
       name: 'carousel',
-      css: css,
       classes: classes
     });
 
@@ -2838,7 +2831,6 @@ this.primevue.cascadeselect.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-cascadeselect {\n        display: inline-flex;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-cascadeselect-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n\n    .p-cascadeselect-label {\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        flex: 1 1 auto;\n        width: 1%;\n        text-overflow: ellipsis;\n        cursor: pointer;\n    }\n\n    .p-cascadeselect-label-empty {\n        overflow: hidden;\n        visibility: hidden;\n    }\n\n    .p-cascadeselect .p-cascadeselect-panel {\n        min-width: 100%;\n    }\n\n    .p-cascadeselect-item {\n        cursor: pointer;\n        font-weight: normal;\n        white-space: nowrap;\n    }\n\n    .p-cascadeselect-item-content {\n        display: flex;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-cascadeselect-group-icon {\n        margin-left: auto;\n    }\n\n    .p-cascadeselect-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        min-width: 100%;\n    }\n\n    .p-fluid .p-cascadeselect {\n        display: flex;\n    }\n\n    .p-fluid .p-cascadeselect .p-cascadeselect-label {\n        width: 1%;\n    }\n\n    .p-cascadeselect-sublist {\n        position: absolute;\n        min-width: 100%;\n        z-index: 1;\n        display: none;\n    }\n\n    .p-cascadeselect-item-active {\n        overflow: visible;\n    }\n\n    .p-cascadeselect-item-active > .p-cascadeselect-sublist {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n\n    .p-cascadeselect-enter-from,\n    .p-cascadeselect-leave-active {\n        opacity: 0;\n    }\n\n    .p-cascadeselect-enter-active {\n        transition: opacity 150ms;\n    }\n}\n";
     var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -2853,6 +2845,8 @@ this.primevue.cascadeselect.style = (function (BaseStyle) {
           props = _ref2.props;
         return ['p-cascadeselect p-component p-inputwrapper', {
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled',
           'p-focus': instance.focused,
           'p-inputwrapper-filled': props.modelValue,
           'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
@@ -2871,9 +2865,9 @@ this.primevue.cascadeselect.style = (function (BaseStyle) {
       loadingIcon: 'p-cascadeselect-trigger-icon',
       dropdownIcon: 'p-cascadeselect-trigger-icon',
       panel: function panel(_ref4) {
-        var instance = _ref4.instance;
+        _ref4.props;
+          var instance = _ref4.instance;
         return ['p-cascadeselect-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -2896,7 +2890,6 @@ this.primevue.cascadeselect.style = (function (BaseStyle) {
     };
     var CascadeSelectStyle = BaseStyle__default["default"].extend({
       name: 'cascadeselect',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -2941,14 +2934,15 @@ this.primevue.checkbox.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-checkbox {\n        position: relative;\n        display: inline-flex;\n        user-select: none;\n        vertical-align: bottom;\n    }\n\n    .p-checkbox-input {\n        cursor: pointer;\n    }\n\n    .p-checkbox-box {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-checkbox p-component', {
           'p-highlight': instance.checked,
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       },
       box: 'p-checkbox-box',
@@ -2957,7 +2951,6 @@ this.primevue.checkbox.style = (function (BaseStyle) {
     };
     var CheckboxStyle = BaseStyle__default["default"].extend({
       name: 'checkbox',
-      css: css,
       classes: classes
     });
 
@@ -2974,7 +2967,6 @@ this.primevue.chip.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-chip {\n        display: inline-flex;\n        align-items: center;\n    }\n\n    .p-chip-text {\n        line-height: 1.5;\n    }\n\n    .p-chip-icon.pi {\n        line-height: 1.5;\n    }\n\n    .p-chip-remove-icon {\n        line-height: 1.5;\n        cursor: pointer;\n    }\n\n    .p-chip img {\n        border-radius: 50%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -2988,7 +2980,6 @@ this.primevue.chip.style = (function (BaseStyle) {
     };
     var ChipStyle = BaseStyle__default["default"].extend({
       name: 'chip',
-      css: css,
       classes: classes
     });
 
@@ -3005,22 +2996,28 @@ this.primevue.chips.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-chips {\n        display: inline-flex;\n    }\n\n    .p-chips-multiple-container {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        cursor: text;\n        overflow: hidden;\n        display: flex;\n        align-items: center;\n        flex-wrap: wrap;\n    }\n\n    .p-chips-token {\n        cursor: default;\n        display: inline-flex;\n        align-items: center;\n        flex: 0 0 auto;\n    }\n\n    .p-chips-input-token {\n        flex: 1 1 auto;\n        display: inline-flex;\n    }\n\n    .p-chips-token-icon {\n        cursor: pointer;\n    }\n\n    .p-chips-input-token input {\n        border: 0 none;\n        outline: 0 none;\n        background-color: transparent;\n        margin: 0;\n        padding: 0;\n        box-shadow: none;\n        border-radius: 0;\n        width: 100%;\n    }\n\n    .p-fluid .p-chips {\n        display: flex;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-chips p-component p-inputwrapper', {
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
           'p-focus': instance.focused,
           'p-inputwrapper-filled': props.modelValue && props.modelValue.length || instance.inputValue && instance.inputValue.length,
           'p-inputwrapper-focus': instance.focused
         }];
       },
-      container: 'p-inputtext p-chips-multiple-container',
-      token: function token(_ref2) {
-        var state = _ref2.state,
-          index = _ref2.index;
+      container: function container(_ref2) {
+        var props = _ref2.props,
+          instance = _ref2.instance;
+        return ['p-inputtext p-chips-multiple-container', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
+        }];
+      },
+      token: function token(_ref3) {
+        var state = _ref3.state,
+          index = _ref3.index;
         return ['p-chips-token', {
           'p-focus': state.focusedIndex === index
         }];
@@ -3031,7 +3028,6 @@ this.primevue.chips.style = (function (BaseStyle) {
     };
     var ChipsStyle = BaseStyle__default["default"].extend({
       name: 'chips',
-      css: css,
       classes: classes
     });
 
@@ -3048,7 +3044,6 @@ this.primevue.colorpicker.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-colorpicker-panel .p-colorpicker-color {\n        background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)\n    }\n\n    .p-colorpicker-panel .p-colorpicker-hue {\n        background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -3068,7 +3063,6 @@ this.primevue.colorpicker.style = (function (BaseStyle) {
         return ['p-colorpicker-panel', {
           'p-colorpicker-overlay-panel': !props.inline,
           'p-disabled': props.disabled,
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3081,7 +3075,6 @@ this.primevue.colorpicker.style = (function (BaseStyle) {
     };
     var ColorPickerStyle = BaseStyle__default["default"].extend({
       name: 'colorpicker',
-      css: css,
       classes: classes
     });
 
@@ -3148,12 +3141,10 @@ this.primevue.confirmpopup.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-confirm-popup {\n        position: absolute;\n        margin-top: 10px;\n        top: 0;\n        left: 0;\n    }\n\n    .p-confirm-popup-flipped {\n        margin-top: 0;\n        margin-bottom: 10px;\n    }\n\n    /* Animation */\n    .p-confirm-popup-enter-from {\n        opacity: 0;\n        transform: scaleY(0.8);\n    }\n\n    .p-confirm-popup-leave-to {\n        opacity: 0;\n    }\n\n    .p-confirm-popup-enter-active {\n        transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-confirm-popup-leave-active {\n        transition: opacity 0.1s linear;\n    }\n\n    .p-confirm-popup:after,\n    .p-confirm-popup:before {\n        bottom: 100%;\n        left: calc(var(--overlayArrowLeft, 0) + 1.25rem);\n        content: ' ';\n        height: 0;\n        width: 0;\n        position: absolute;\n        pointer-events: none;\n    }\n\n    .p-confirm-popup:after {\n        border-width: 8px;\n        margin-left: -8px;\n    }\n\n    .p-confirm-popup:before {\n        border-width: 10px;\n        margin-left: -10px;\n    }\n\n    .p-confirm-popup-flipped:after,\n    .p-confirm-popup-flipped:before {\n        bottom: auto;\n        top: 100%;\n    }\n\n    .p-confirm-popup.p-confirm-popup-flipped:after {\n        border-bottom-color: transparent;\n    }\n\n    .p-confirm-popup.p-confirm-popup-flipped:before {\n        border-bottom-color: transparent;\n    }\n\n    .p-confirm-popup .p-confirm-popup-content {\n        display: flex;\n        align-items: center;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
         return ['p-confirm-popup p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3172,7 +3163,6 @@ this.primevue.confirmpopup.style = (function (BaseStyle) {
     };
     var ConfirmPopupStyle = BaseStyle__default["default"].extend({
       name: 'confirmpopup',
-      css: css,
       classes: classes
     });
 
@@ -3189,12 +3179,10 @@ this.primevue.contextmenu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-contextmenu ul {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-contextmenu .p-submenu-list {\n        position: absolute;\n        min-width: 100%;\n        z-index: 1;\n    }\n\n    .p-contextmenu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-contextmenu .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-contextmenu .p-menuitem {\n        position: relative;\n    }\n\n    .p-contextmenu .p-menuitem-link .p-submenu-icon {\n        margin-left: auto;\n    }\n\n    .p-contextmenu-enter-from,\n    .p-contextmenu-leave-active {\n        opacity: 0;\n    }\n\n    .p-contextmenu-enter-active {\n        transition: opacity 250ms;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
         return ['p-contextmenu p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3218,7 +3206,6 @@ this.primevue.contextmenu.style = (function (BaseStyle) {
     };
     var ContextMenuStyle = BaseStyle__default["default"].extend({
       name: 'contextmenu',
-      css: css,
       classes: classes
     });
 
@@ -3235,7 +3222,6 @@ this.primevue.datatable.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-datatable {\n        position: relative;\n    }\n\n    .p-datatable-table {\n        border-spacing: 0px;\n        width: 100%;\n    }\n\n    .p-datatable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-datatable .p-sortable-column .p-column-title,\n    .p-datatable .p-sortable-column .p-sortable-column-icon,\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        vertical-align: middle;\n    }\n\n    .p-datatable .p-sortable-column .p-sortable-column-badge {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-datatable-hoverable-rows .p-selectable-row {\n        cursor: pointer;\n    }\n\n    /* Scrollable */\n    .p-datatable-scrollable > .p-datatable-wrapper {\n        position: relative;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-thead {\n        top: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-frozen-tbody {\n        position: sticky;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tfoot {\n        bottom: 0;\n        z-index: 1;\n    }\n\n    .p-datatable-scrollable .p-frozen-column {\n        position: sticky;\n        background: inherit;\n    }\n\n    .p-datatable-scrollable th.p-frozen-column {\n        z-index: 1;\n    }\n\n    .p-datatable-flex-scrollable {\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n    }\n\n    .p-datatable-flex-scrollable > .p-datatable-wrapper {\n        display: flex;\n        flex-direction: column;\n        flex: 1;\n        height: 100%;\n    }\n\n    .p-datatable-scrollable-table > .p-datatable-tbody > .p-rowgroup-header {\n        position: sticky;\n        z-index: 1;\n    }\n\n    /* Resizable */\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th,\n    .p-datatable-resizable-table > .p-datatable-tfoot > tr > td,\n    .p-datatable-resizable-table > .p-datatable-tbody > tr > td {\n        overflow: hidden;\n        white-space: nowrap;\n    }\n\n    .p-datatable-resizable-table > .p-datatable-thead > tr > th.p-resizable-column:not(.p-frozen-column) {\n        background-clip: padding-box;\n        position: relative;\n    }\n\n    .p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n\n    .p-datatable .p-column-resizer {\n        display: block;\n        position: absolute;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n\n    .p-datatable .p-column-header-content {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-datatable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n\n    .p-datatable .p-row-editor-init,\n    .p-datatable .p-row-editor-save,\n    .p-datatable .p-row-editor-cancel {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Expand */\n    .p-datatable .p-row-toggler {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Reorder */\n    .p-datatable-reorder-indicator-up,\n    .p-datatable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n\n    .p-reorderable-column,\n    .p-datatable-reorderablerow-handle {\n        cursor: move;\n    }\n\n    /* Loader */\n    .p-datatable .p-datatable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n\n    /* Filter */\n    .p-column-filter-row {\n        display: flex;\n        align-items: center;\n        width: 100%;\n    }\n\n    .p-column-filter-menu {\n        display: inline-flex;\n        margin-left: auto;\n    }\n\n    .p-column-filter-row .p-column-filter-element {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n\n    .p-column-filter-menu-button,\n    .p-column-filter-clear-button {\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-column-filter-row-items {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-column-filter-row-item {\n        cursor: pointer;\n    }\n\n    .p-column-filter-add-button,\n    .p-column-filter-remove-button {\n        justify-content: center;\n    }\n\n    .p-column-filter-add-button .p-button-label,\n    .p-column-filter-remove-button .p-button-label {\n        flex-grow: 0;\n    }\n\n    .p-column-filter-buttonbar {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {\n        width: auto;\n    }\n\n    /* Responsive */\n    .p-datatable .p-datatable-tbody > tr > td > .p-column-title {\n        display: none;\n    }\n\n    /* VirtualScroller */\n    .p-datatable-virtualscroller-spacer {\n        display: flex;\n    }\n\n    .p-datatable .p-virtualscroller .p-virtualscroller-loading {\n        transform: none !important;\n        min-height: 0;\n        position: sticky;\n        top: 0;\n        left: 0;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
@@ -3323,7 +3309,6 @@ this.primevue.datatable.style = (function (BaseStyle) {
         return [{
           'p-column-filter-overlay p-component p-fluid': true,
           'p-column-filter-overlay-menu': props.display === 'menu',
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3358,14 +3343,15 @@ this.primevue.datatable.style = (function (BaseStyle) {
       row: function row(_ref11) {
         var instance = _ref11.instance,
           props = _ref11.props,
-          index = _ref11.index;
+          index = _ref11.index,
+          columnSelectionMode = _ref11.columnSelectionMode;
         var rowStyleClass = [];
         if (props.selectionMode) {
           rowStyleClass.push('p-selectable-row');
         }
         if (props.selection) {
           rowStyleClass.push({
-            'p-highlight': instance.isSelected && instance.$parentInstance.$parentInstance.highlightOnSelect
+            'p-highlight': columnSelectionMode ? instance.isSelected && instance.$parentInstance.$parentInstance.highlightOnSelect : instance.isSelected
           });
         }
         if (props.contextMenuSelection) {
@@ -3428,7 +3414,6 @@ this.primevue.datatable.style = (function (BaseStyle) {
     };
     var DataTableStyle = BaseStyle__default["default"].extend({
       name: 'datatable',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -3525,8 +3510,6 @@ this.primevue.dialog.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-dialog-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n\n    .p-dialog {\n        max-height: 90%;\n        transform: scale(1);\n    }\n\n    .p-dialog-content {\n        overflow-y: auto;\n    }\n\n    .p-dialog-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        flex-shrink: 0;\n    }\n\n    .p-dialog-footer {\n        flex-shrink: 0;\n    }\n\n    .p-dialog .p-dialog-header-icons {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-dialog .p-dialog-header-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Fluid */\n    .p-fluid .p-dialog-footer .p-button {\n        width: auto;\n    }\n\n    /* Animation */\n    /* Center */\n    .p-dialog-enter-active {\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    .p-dialog-leave-active {\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    .p-dialog-enter-from,\n    .p-dialog-leave-to {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n\n    /* Top, Bottom, Left, Right, Top* and Bottom* */\n    .p-dialog-top .p-dialog,\n    .p-dialog-bottom .p-dialog,\n    .p-dialog-left .p-dialog,\n    .p-dialog-right .p-dialog,\n    .p-dialog-topleft .p-dialog,\n    .p-dialog-topright .p-dialog,\n    .p-dialog-bottomleft .p-dialog,\n    .p-dialog-bottomright .p-dialog {\n        margin: 0.75rem;\n        transform: translate3d(0px, 0px, 0px);\n    }\n    .p-dialog-top .p-dialog-enter-active,\n    .p-dialog-top .p-dialog-leave-active,\n    .p-dialog-bottom .p-dialog-enter-active,\n    .p-dialog-bottom .p-dialog-leave-active,\n    .p-dialog-left .p-dialog-enter-active,\n    .p-dialog-left .p-dialog-leave-active,\n    .p-dialog-right .p-dialog-enter-active,\n    .p-dialog-right .p-dialog-leave-active,\n    .p-dialog-topleft .p-dialog-enter-active,\n    .p-dialog-topleft .p-dialog-leave-active,\n    .p-dialog-topright .p-dialog-enter-active,\n    .p-dialog-topright .p-dialog-leave-active,\n    .p-dialog-bottomleft .p-dialog-enter-active,\n    .p-dialog-bottomleft .p-dialog-leave-active,\n    .p-dialog-bottomright .p-dialog-enter-active,\n    .p-dialog-bottomright .p-dialog-leave-active {\n        transition: all 0.3s ease-out;\n    }\n    .p-dialog-top .p-dialog-enter-from,\n    .p-dialog-top .p-dialog-leave-to {\n        transform: translate3d(0px, -100%, 0px);\n    }\n    .p-dialog-bottom .p-dialog-enter-from,\n    .p-dialog-bottom .p-dialog-leave-to {\n        transform: translate3d(0px, 100%, 0px);\n    }\n    .p-dialog-left .p-dialog-enter-from,\n    .p-dialog-left .p-dialog-leave-to,\n    .p-dialog-topleft .p-dialog-enter-from,\n    .p-dialog-topleft .p-dialog-leave-to,\n    .p-dialog-bottomleft .p-dialog-enter-from,\n    .p-dialog-bottomleft .p-dialog-leave-to {\n        transform: translate3d(-100%, 0px, 0px);\n    }\n    .p-dialog-right .p-dialog-enter-from,\n    .p-dialog-right .p-dialog-leave-to,\n    .p-dialog-topright .p-dialog-enter-from,\n    .p-dialog-topright .p-dialog-leave-to,\n    .p-dialog-bottomright .p-dialog-enter-from,\n    .p-dialog-bottomright .p-dialog-leave-to {\n        transform: translate3d(100%, 0px, 0px);\n    }\n\n    /* Maximize */\n    .p-dialog-maximized {\n        width: 100vw !important;\n        height: 100vh !important;\n        top: 0px !important;\n        left: 0px !important;\n        max-height: 100%;\n        height: 100%;\n    }\n    .p-dialog-maximized .p-dialog-content {\n        flex-grow: 1;\n    }\n\n    .p-confirm-dialog .p-dialog-content {\n        display: flex;\n        align-items: center;\n    }\n}\n";
-
     /* Position */
     var inlineStyles = {
       mask: function mask(_ref) {
@@ -3567,7 +3550,6 @@ this.primevue.dialog.style = (function (BaseStyle) {
         return ['p-dialog p-component', {
           'p-dialog-rtl': props.rtl,
           'p-dialog-maximized': props.maximizable && instance.maximized,
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3583,7 +3565,6 @@ this.primevue.dialog.style = (function (BaseStyle) {
     };
     var DialogStyle = BaseStyle__default["default"].extend({
       name: 'dialog',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -3601,8 +3582,6 @@ this.primevue.divider.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-divider-horizontal {\n        display: flex;\n        width: 100%;\n        position: relative;\n        align-items: center;\n    }\n\n    .p-divider-horizontal:before {\n        position: absolute;\n        display: block;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        content: '';\n    }\n\n    .p-divider-content {\n        z-index: 1;\n    }\n\n    .p-divider-vertical {\n        min-height: 100%;\n        margin: 0 1rem;\n        display: flex;\n        position: relative;\n        justify-content: center;\n    }\n\n    .p-divider-vertical:before {\n        position: absolute;\n        display: block;\n        top: 0;\n        left: 50%;\n        height: 100%;\n        content: '';\n    }\n\n    .p-divider-solid.p-divider-horizontal:before {\n        border-top-style: solid;\n    }\n\n    .p-divider-solid.p-divider-vertical:before {\n        border-left-style: solid;\n    }\n\n    .p-divider-dashed.p-divider-horizontal:before {\n        border-top-style: dashed;\n    }\n\n    .p-divider-dashed.p-divider-vertical:before {\n        border-left-style: dashed;\n    }\n\n    .p-divider-dotted.p-divider-horizontal:before {\n        border-top-style: dotted;\n    }\n\n    .p-divider-dotted.p-divider-vertical:before {\n        border-left-style: dotted;\n    }\n}\n";
-
     /* Position */
     var inlineStyles = {
       root: function root(_ref) {
@@ -3634,7 +3613,6 @@ this.primevue.divider.style = (function (BaseStyle) {
     };
     var DividerStyle = BaseStyle__default["default"].extend({
       name: 'divider',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -3652,7 +3630,6 @@ this.primevue.dock.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-dock {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n    }\n\n    .p-dock-list-container {\n        display: flex;\n        pointer-events: auto;\n    }\n\n    .p-dock-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-dock-item {\n        transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n        will-change: transform;\n    }\n\n    .p-dock-link {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n    }\n\n    .p-dock-item-second-prev,\n    .p-dock-item-second-next {\n        transform: scale(1.2);\n    }\n\n    .p-dock-item-prev,\n    .p-dock-item-next {\n        transform: scale(1.4);\n    }\n\n    .p-dock-item-current {\n        transform: scale(1.6);\n        z-index: 1;\n    }\n\n    /* Position */\n    /* top */\n    .p-dock-top {\n        left: 0;\n        top: 0;\n        width: 100%;\n    }\n\n    .p-dock-top .p-dock-item {\n        transform-origin: center top;\n    }\n\n    /* bottom */\n    .p-dock-bottom {\n        left: 0;\n        bottom: 0;\n        width: 100%;\n    }\n\n    .p-dock-bottom .p-dock-item {\n        transform-origin: center bottom;\n    }\n\n    /* right */\n    .p-dock-right {\n        right: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-right .p-dock-item {\n        transform-origin: center right;\n    }\n\n    .p-dock-right .p-dock-list {\n        flex-direction: column;\n    }\n\n    /* left */\n    .p-dock-left {\n        left: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-left .p-dock-item {\n        transform-origin: center left;\n    }\n\n    .p-dock-left .p-dock-list {\n        flex-direction: column;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
@@ -3684,7 +3661,6 @@ this.primevue.dock.style = (function (BaseStyle) {
     };
     var DockStyle = BaseStyle__default["default"].extend({
       name: 'dock',
-      css: css,
       classes: classes
     });
 
@@ -3701,7 +3677,6 @@ this.primevue.dropdown.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-dropdown {\n        display: inline-flex;\n        cursor: pointer;\n        position: relative;\n        user-select: none;\n    }\n\n    .p-dropdown-clear-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-dropdown-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n\n    .p-dropdown-label {\n        display: block;\n        white-space: nowrap;\n        overflow: hidden;\n        flex: 1 1 auto;\n        width: 1%;\n        text-overflow: ellipsis;\n        cursor: pointer;\n    }\n\n    .p-dropdown-label-empty {\n        overflow: hidden;\n        opacity: 0;\n    }\n\n    input.p-dropdown-label {\n        cursor: default;\n    }\n\n    .p-dropdown .p-dropdown-panel {\n        min-width: 100%;\n    }\n\n    .p-dropdown-panel {\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n\n    .p-dropdown-items-wrapper {\n        overflow: auto;\n    }\n\n    .p-dropdown-item {\n        cursor: pointer;\n        font-weight: normal;\n        white-space: nowrap;\n        position: relative;\n        overflow: hidden;\n        display: flex;\n        align-items: center;\n    }\n\n    .p-dropdown-item-group {\n        cursor: auto;\n    }\n\n    .p-dropdown-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-dropdown-filter {\n        width: 100%;\n    }\n\n    .p-dropdown-filter-container {\n        position: relative;\n    }\n\n    .p-dropdown-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-fluid .p-dropdown {\n        display: flex;\n    }\n\n    .p-fluid .p-dropdown .p-dropdown-label {\n        width: 1%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
@@ -3709,6 +3684,8 @@ this.primevue.dropdown.style = (function (BaseStyle) {
           state = _ref.state;
         return ['p-dropdown p-component p-inputwrapper', {
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled',
           'p-dropdown-clearable': props.showClear,
           'p-focus': state.focused,
           'p-inputwrapper-filled': instance.hasSelectedOption,
@@ -3729,26 +3706,32 @@ this.primevue.dropdown.style = (function (BaseStyle) {
       loadingicon: 'p-dropdown-trigger-icon',
       dropdownIcon: 'p-dropdown-trigger-icon',
       panel: function panel(_ref3) {
-        var instance = _ref3.instance;
+        _ref3.props;
+          var instance = _ref3.instance;
         return ['p-dropdown-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
       header: 'p-dropdown-header',
       filterContainer: 'p-dropdown-filter-container',
-      filterInput: 'p-dropdown-filter p-inputtext p-component',
+      filterInput: function filterInput(_ref4) {
+        var props = _ref4.props,
+          instance = _ref4.instance;
+        return ['p-dropdown-filter p-inputtext p-component', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
+        }];
+      },
       filterIcon: 'p-dropdown-filter-icon',
       wrapper: 'p-dropdown-items-wrapper',
       list: 'p-dropdown-items',
       itemGroup: 'p-dropdown-item-group',
       itemGroupLabel: 'p-dropdown-item-group-label',
-      item: function item(_ref4) {
-        var instance = _ref4.instance,
-          props = _ref4.props,
-          state = _ref4.state,
-          option = _ref4.option,
-          focusedOption = _ref4.focusedOption;
+      item: function item(_ref5) {
+        var instance = _ref5.instance,
+          props = _ref5.props,
+          state = _ref5.state,
+          option = _ref5.option,
+          focusedOption = _ref5.focusedOption;
         return ['p-dropdown-item', {
           'p-highlight': instance.isSelected(option) && props.highlightOnSelect,
           'p-focus': state.focusedOptionIndex === focusedOption,
@@ -3762,7 +3745,6 @@ this.primevue.dropdown.style = (function (BaseStyle) {
     };
     var DropdownStyle = BaseStyle__default["default"].extend({
       name: 'dropdown',
-      css: css,
       classes: classes
     });
 
@@ -3815,7 +3797,6 @@ this.primevue.fieldset.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-fieldset-legend > a,\n    .p-fieldset-legend > span {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-fieldset-toggleable .p-fieldset-legend a {\n        cursor: pointer;\n        user-select: none;\n        overflow: hidden;\n        position: relative;\n        text-decoration: none;\n    }\n\n    .p-fieldset-legend-text {\n        line-height: 1;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -3831,7 +3812,6 @@ this.primevue.fieldset.style = (function (BaseStyle) {
     };
     var FieldsetStyle = BaseStyle__default["default"].extend({
       name: 'fieldset',
-      css: css,
       classes: classes
     });
 
@@ -3848,7 +3828,6 @@ this.primevue.fileupload.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-fileupload-content {\n        position: relative;\n    }\n\n    .p-fileupload-content .p-progressbar {\n        width: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n    }\n\n    .p-button.p-fileupload-choose {\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-fileupload-buttonbar {\n        display: flex;\n        flex-wrap: wrap;\n    }\n\n    .p-fileupload > input[type='file'],\n    .p-fileupload-basic input[type='file'] {\n        display: none;\n    }\n\n    .p-fluid .p-fileupload .p-button {\n        width: auto;\n    }\n\n    .p-fileupload-file {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n    }\n\n    .p-fileupload-file-thumbnail {\n        flex-shrink: 0;\n    }\n\n    .p-fileupload-file-actions {\n        margin-left: auto;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -3881,7 +3860,6 @@ this.primevue.fileupload.style = (function (BaseStyle) {
     };
     var FileUploadStyle = BaseStyle__default["default"].extend({
       name: 'fileupload',
-      css: css,
       classes: classes
     });
 
@@ -3909,12 +3887,10 @@ this.primevue.galleria.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-galleria-content {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-galleria-item-wrapper {\n        display: flex;\n        flex-direction: column;\n        position: relative;\n    }\n\n    .p-galleria-item-container {\n        position: relative;\n        display: flex;\n        height: 100%;\n    }\n\n    .p-galleria-item-nav {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n    }\n\n    .p-galleria-item-prev {\n        left: 0;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-galleria-item-next {\n        right: 0;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-galleria-item {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        height: 100%;\n        width: 100%;\n    }\n\n    .p-galleria-item-nav-onhover .p-galleria-item-nav {\n        pointer-events: none;\n        opacity: 0;\n        transition: opacity 0.2s ease-in-out;\n    }\n\n    .p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav {\n        pointer-events: all;\n        opacity: 1;\n    }\n\n    .p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {\n        pointer-events: none;\n    }\n\n    .p-galleria-caption {\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        width: 100%;\n    }\n\n    /* Thumbnails */\n    .p-galleria-thumbnail-wrapper {\n        display: flex;\n        flex-direction: column;\n        overflow: auto;\n        flex-shrink: 0;\n    }\n\n    .p-galleria-thumbnail-prev,\n    .p-galleria-thumbnail-next {\n        align-self: center;\n        flex: 0 0 auto;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-galleria-thumbnail-prev span,\n    .p-galleria-thumbnail-next span {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n\n    .p-galleria-thumbnail-container {\n        display: flex;\n        flex-direction: row;\n    }\n\n    .p-galleria-thumbnail-items-container {\n        overflow: hidden;\n        width: 100%;\n    }\n\n    .p-galleria-thumbnail-items {\n        display: flex;\n    }\n\n    .p-galleria-thumbnail-item {\n        overflow: auto;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        opacity: 0.5;\n    }\n\n    .p-galleria-thumbnail-item:hover {\n        opacity: 1;\n        transition: opacity 0.3s;\n    }\n\n    .p-galleria-thumbnail-item-current {\n        opacity: 1;\n    }\n\n    /* Positions */\n    /* Thumbnails */\n    .p-galleria-thumbnails-left .p-galleria-content,\n    .p-galleria-thumbnails-right .p-galleria-content {\n        flex-direction: row;\n    }\n\n    .p-galleria-thumbnails-left .p-galleria-item-wrapper,\n    .p-galleria-thumbnails-right .p-galleria-item-wrapper {\n        flex-direction: row;\n    }\n\n    .p-galleria-thumbnails-left .p-galleria-item-wrapper,\n    .p-galleria-thumbnails-top .p-galleria-item-wrapper {\n        order: 2;\n    }\n\n    .p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,\n    .p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper {\n        order: 1;\n    }\n\n    .p-galleria-thumbnails-left .p-galleria-thumbnail-container,\n    .p-galleria-thumbnails-right .p-galleria-thumbnail-container {\n        flex-direction: column;\n        flex-grow: 1;\n    }\n\n    .p-galleria-thumbnails-left .p-galleria-thumbnail-items,\n    .p-galleria-thumbnails-right .p-galleria-thumbnail-items {\n        flex-direction: column;\n        height: 100%;\n    }\n\n    /* Indicators */\n    .p-galleria-indicators {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-galleria-indicator > button {\n        display: inline-flex;\n        align-items: center;\n    }\n\n    .p-galleria-indicators-left .p-galleria-item-wrapper,\n    .p-galleria-indicators-right .p-galleria-item-wrapper {\n        flex-direction: row;\n        align-items: center;\n    }\n\n    .p-galleria-indicators-left .p-galleria-item-container,\n    .p-galleria-indicators-top .p-galleria-item-container {\n        order: 2;\n    }\n\n    .p-galleria-indicators-left .p-galleria-indicators,\n    .p-galleria-indicators-top .p-galleria-indicators {\n        order: 1;\n    }\n\n    .p-galleria-indicators-left .p-galleria-indicators,\n    .p-galleria-indicators-right .p-galleria-indicators {\n        flex-direction: column;\n    }\n\n    .p-galleria-indicator-onitem .p-galleria-indicators {\n        position: absolute;\n        display: flex;\n        z-index: 1;\n    }\n\n    .p-galleria-indicator-onitem.p-galleria-indicators-top .p-galleria-indicators {\n        top: 0;\n        left: 0;\n        width: 100%;\n        align-items: flex-start;\n    }\n\n    .p-galleria-indicator-onitem.p-galleria-indicators-right .p-galleria-indicators {\n        right: 0;\n        top: 0;\n        height: 100%;\n        align-items: flex-end;\n    }\n\n    .p-galleria-indicator-onitem.p-galleria-indicators-bottom .p-galleria-indicators {\n        bottom: 0;\n        left: 0;\n        width: 100%;\n        align-items: flex-end;\n    }\n\n    .p-galleria-indicator-onitem.p-galleria-indicators-left .p-galleria-indicators {\n        left: 0;\n        top: 0;\n        height: 100%;\n        align-items: flex-start;\n    }\n\n    /* FullScreen */\n    .p-galleria-mask {\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-galleria-close {\n        position: absolute;\n        top: 0;\n        right: 0;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n    }\n\n    .p-galleria-mask .p-galleria-item-nav {\n        position: fixed;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    /* Animation */\n    .p-galleria-enter-active {\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-galleria-leave-active {\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    .p-galleria-enter-from,\n    .p-galleria-leave-to {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n\n    .p-galleria-enter-active .p-galleria-item-nav {\n        opacity: 0;\n    }\n\n    /* Keyboard Support */\n    .p-items-hidden .p-galleria-thumbnail-item {\n        visibility: hidden;\n    }\n\n    .p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {\n        visibility: visible;\n    }\n}\n";
     var classes = {
       mask: function mask(_ref) {
         var instance = _ref.instance;
         return ['p-galleria-mask p-component-overlay p-component-overlay-enter', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -3993,7 +3969,6 @@ this.primevue.galleria.style = (function (BaseStyle) {
     };
     var GalleriaStyle = BaseStyle__default["default"].extend({
       name: 'galleria',
-      css: css,
       classes: classes
     });
 
@@ -4010,7 +3985,6 @@ this.primevue.image.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-image-mask {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-image-preview-container {\n        position: relative;\n        display: inline-block;\n        line-height: 0;\n    }\n\n    .p-image-preview-indicator {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        opacity: 0;\n        transition: opacity 0.3s;\n        border: none;\n        padding: 0;\n    }\n\n    .p-image-preview-container:hover > .p-image-preview-indicator {\n        opacity: 1;\n        cursor: pointer;\n    }\n\n    .p-image-preview-container > img {\n        cursor: pointer;\n    }\n\n    .p-image-toolbar {\n        position: absolute;\n        top: 0;\n        right: 0;\n        display: flex;\n        z-index: 1;\n    }\n\n    .p-image-action.p-link {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n    \n    .p-image-action.p-disabled {\n        pointer-events: auto;\n    }\n\n    .p-image-preview {\n        transition: transform 0.15s;\n        max-width: 100vw;\n        max-height: 100vh;\n    }\n\n    .p-image-preview-enter-active {\n        transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n    }\n    .p-image-preview-leave-active {\n        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n    .p-image-preview-enter-from,\n    .p-image-preview-leave-to {\n        opacity: 0;\n        transform: scale(0.7);\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4045,7 +4019,6 @@ this.primevue.image.style = (function (BaseStyle) {
     };
     var ImageStyle = BaseStyle__default["default"].extend({
       name: 'image',
-      css: css,
       classes: classes
     });
 
@@ -4062,7 +4035,6 @@ this.primevue.inlinemessage.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-inline-message {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        vertical-align: top;\n    }\n    \n    .p-inline-message-icon {\n        flex-shrink: 0;\n    }\n\n    .p-inline-message-icon-only .p-inline-message-text {\n        visibility: hidden;\n        width: 0;\n    }\n\n    .p-fluid .p-inline-message {\n        display: flex;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props,
@@ -4079,7 +4051,6 @@ this.primevue.inlinemessage.style = (function (BaseStyle) {
     };
     var InlineMessageStyle = BaseStyle__default["default"].extend({
       name: 'inlinemessage',
-      css: css,
       classes: classes
     });
 
@@ -4096,7 +4067,6 @@ this.primevue.inplace.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-inplace .p-inplace-display {\n        display: inline;\n        cursor: pointer;\n    }\n\n    .p-inplace .p-inplace-content {\n        display: inline;\n    }\n\n    .p-fluid .p-inplace.p-inplace-closable .p-inplace-content {\n        display: flex;\n    }\n\n    .p-fluid .p-inplace.p-inplace-closable .p-inplace-content > .p-inputtext {\n        flex: 1 1 auto;\n        width: 1%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4114,7 +4084,6 @@ this.primevue.inplace.style = (function (BaseStyle) {
     };
     var InplaceStyle = BaseStyle__default["default"].extend({
       name: 'inplace',
-      css: css,
       classes: classes
     });
 
@@ -4175,9 +4144,12 @@ this.primevue.inputmask.style = (function (BaseStyle) {
 
     var classes = {
       root: function root(_ref) {
-        var instance = _ref.instance;
+        var props = _ref.props,
+          instance = _ref.instance;
         return ['p-inputmask p-inputtext p-component', {
-          'p-filled': instance.filled
+          'p-filled': instance.filled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       }
     };
@@ -4199,7 +4171,6 @@ this.primevue.inputnumber.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
@@ -4209,21 +4180,28 @@ this.primevue.inputnumber.style = (function (BaseStyle) {
           'p-inputwrapper-focus': instance.focused,
           'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
           'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',
-          'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical'
+          'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical',
+          'p-invalid': props.invalid
+        }];
+      },
+      input: function input(_ref2) {
+        var props = _ref2.props,
+          instance = _ref2.instance;
+        return ['p-inputnumber-input', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       },
-      input: 'p-inputnumber-input',
       buttonGroup: 'p-inputnumber-button-group',
-      incrementButton: function incrementButton(_ref2) {
-        var instance = _ref2.instance,
-          props = _ref2.props;
+      incrementButton: function incrementButton(_ref3) {
+        var instance = _ref3.instance,
+          props = _ref3.props;
         return ['p-inputnumber-button p-inputnumber-button-up', {
           'p-disabled': props.showButtons && props.max !== null && instance.maxBoundry()
         }];
       },
-      decrementButton: function decrementButton(_ref3) {
-        var instance = _ref3.instance,
-          props = _ref3.props;
+      decrementButton: function decrementButton(_ref4) {
+        var instance = _ref4.instance,
+          props = _ref4.props;
         return ['p-inputnumber-button p-inputnumber-button-down', {
           'p-disabled': props.showButtons && props.min !== null && instance.minBoundry()
         }];
@@ -4231,7 +4209,6 @@ this.primevue.inputnumber.style = (function (BaseStyle) {
     };
     var InputNumberStyle = BaseStyle__default["default"].extend({
       name: 'inputnumber',
-      css: css,
       classes: classes
     });
 
@@ -4248,7 +4225,6 @@ this.primevue.inputswitch.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-inputswitch {\n        display: inline-block;\n    }\n\n    .p-inputswitch-input {\n        cursor: pointer;\n    }\n\n    .p-inputswitch-slider {\n        position: absolute;\n        cursor: pointer;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n        border: 1px solid transparent;\n    }\n\n    .p-inputswitch-slider:before {\n        position: absolute;\n        content: '';\n        top: 50%;\n    }\n}\n";
     var inlineStyles = {
       root: {
         position: 'relative'
@@ -4260,7 +4236,8 @@ this.primevue.inputswitch.style = (function (BaseStyle) {
           props = _ref.props;
         return ['p-inputswitch p-component', {
           'p-highlight': instance.checked,
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid
         }];
       },
       input: 'p-inputswitch-input',
@@ -4268,7 +4245,6 @@ this.primevue.inputswitch.style = (function (BaseStyle) {
     };
     var InputSwitchStyle = BaseStyle__default["default"].extend({
       name: 'inputswitch',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -4293,7 +4269,9 @@ this.primevue.inputtext.style = (function (BaseStyle) {
         return ['p-inputtext p-component', {
           'p-filled': instance.filled,
           'p-inputtext-sm': props.size === 'small',
-          'p-inputtext-lg': props.size === 'large'
+          'p-inputtext-lg': props.size === 'large',
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       }
     };
@@ -4315,7 +4293,6 @@ this.primevue.knob.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@keyframes dash-frame {\n    100% {\n        stroke-dashoffset: 0;\n    }\n}\n@layer primevue {\n    .p-knob-range {\n        fill: none;\n        transition: stroke 0.1s ease-in;\n    }\n    .p-knob-value {\n        animation-name: dash-frame;\n        animation-fill-mode: forwards;\n        fill: none;\n    }\n    .p-knob-text {\n        font-size: 1.3rem;\n        text-align: center;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4329,7 +4306,6 @@ this.primevue.knob.style = (function (BaseStyle) {
     };
     var KnobStyle = BaseStyle__default["default"].extend({
       name: 'knob',
-      css: css,
       classes: classes
     });
 
@@ -4346,13 +4322,13 @@ this.primevue.listbox.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-listbox-list-wrapper {\n        overflow: auto;\n    }\n\n    .p-listbox-list {\n        list-style-type: none;\n        margin: 0;\n        padding: 0;\n    }\n\n    .p-listbox-item {\n        cursor: pointer;\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-listbox-item-group {\n        cursor: auto;\n    }\n\n    .p-listbox-filter-container {\n        position: relative;\n    }\n\n    .p-listbox-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-listbox-filter {\n        width: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         _ref.instance;
           var props = _ref.props;
         return ['p-listbox p-component', {
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid
         }];
       },
       header: 'p-listbox-header',
@@ -4377,7 +4353,6 @@ this.primevue.listbox.style = (function (BaseStyle) {
     };
     var ListboxStyle = BaseStyle__default["default"].extend({
       name: 'listbox',
-      css: css,
       classes: classes
     });
 
@@ -4394,7 +4369,6 @@ this.primevue.megamenu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-megamenu {\n        display: flex;\n        position: relative;\n    }\n\n    .p-megamenu-root-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-megamenu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-megamenu .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-megamenu-panel {\n        display: none;\n        width: auto;\n        z-index: 1;\n        left: 0;\n        min-width: 100%;\n    }\n\n    .p-megamenu-panel:not(.p-megamenu-mobile) {\n        position: absolute;\n    }\n\n    .p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {\n        display: block;\n    }\n\n    .p-megamenu-submenu {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-megamenu-button {\n        display: none;\n        cursor: pointer;\n        align-items: center;\n        justify-content: center;\n        text-decoration: none;\n    }\n\n    /* Horizontal */\n    .p-megamenu-horizontal {\n        align-items: center;\n    }\n\n    .p-megamenu-horizontal .p-megamenu-root-list {\n        display: flex;\n        align-items: center;\n        flex-wrap: wrap;\n    }\n\n    .p-megamenu-horizontal .p-megamenu-end {\n        margin-left: auto;\n        align-self: center;\n    }\n\n    /* Vertical */\n    .p-megamenu-vertical {\n        flex-direction: column;\n    }\n    \n    .p-megamenu-vertical:not(.p-megamenu-mobile) {\n        display: inline-flex;\n    }\n\n    .p-megamenu-vertical .p-megamenu-root-list {\n        flex-direction: column;\n    }\n\n    .p-megamenu-vertical:not(.p-megamenu-mobile) .p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {\n        left: 100%;\n        top: 0;\n    }\n\n    .p-megamenu-vertical .p-megamenu-root-list > .p-menuitem > .p-menuitem-content > .p-menuitem-link > .p-submenu-icon {\n        margin-left: auto;\n    }\n\n    .p-megamenu-grid {\n        display: flex;\n    }\n\n    .p-megamenu-col-2,\n    .p-megamenu-col-3,\n    .p-megamenu-col-4,\n    .p-megamenu-col-6,\n    .p-megamenu-col-12 {\n        flex: 0 0 auto;\n        padding: 0.5rem;\n    }\n\n    .p-megamenu-col-2 {\n        width: 16.6667%;\n    }\n\n    .p-megamenu-col-3 {\n        width: 25%;\n    }\n\n    .p-megamenu-col-4 {\n        width: 33.3333%;\n    }\n\n    .p-megamenu-col-6 {\n        width: 50%;\n    }\n\n    .p-megamenu-col-12 {\n        width: 100%;\n    }\n\n    .p-megamenu.p-megamenu-mobile .p-megamenu-button {\n        display: flex;\n    }\n\n    .p-megamenu.p-megamenu-mobile .p-megamenu-root-list {\n        position: absolute;\n        display: none;\n        width: 100%;\n    }\n\n    .p-megamenu.p-megamenu-mobile .p-submenu-list {\n        width: 100%;\n        position: static;\n        box-shadow: none;\n        border: 0 none;\n    }\n\n    .p-megamenu.p-megamenu-mobile .p-megamenu-root-list .p-menuitem {\n        width: 100%;\n        position: static;\n    }\n\n    .p-megamenu.p-megamenu-mobile-active .p-megamenu-root-list {\n        display: flex;\n        flex-direction: column;\n        top: 100%;\n        left: 0;\n        z-index: 1;\n    }\n\n    .p-megamenu.p-megamenu-mobile .p-megamenu-grid {\n        flex-wrap: wrap;\n        overflow: auto;\n        max-height: 90%;\n    }\n}\n";
     var inlineStyles = {
       submenu: function submenu(_ref) {
         var instance = _ref.instance,
@@ -4473,7 +4447,6 @@ this.primevue.megamenu.style = (function (BaseStyle) {
     };
     var MegaMenuStyle = BaseStyle__default["default"].extend({
       name: 'megamenu',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -4491,14 +4464,12 @@ this.primevue.menu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-menu ul {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-menu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-menu .p-menuitem-text {\n        line-height: 1;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-menu p-component', {
           'p-menu-overlay': props.popup,
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -4521,7 +4492,6 @@ this.primevue.menu.style = (function (BaseStyle) {
     };
     var MenuStyle = BaseStyle__default["default"].extend({
       name: 'menu',
-      css: css,
       classes: classes
     });
 
@@ -4538,7 +4508,6 @@ this.primevue.menubar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-menubar {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-menubar ul {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-menubar .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-menubar .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-menubar .p-menuitem {\n        position: relative;\n    }\n\n    .p-menubar-root-list {\n        display: flex;\n        align-items: center;\n        flex-wrap: wrap;\n    }\n\n    .p-menubar-root-list > li ul {\n        display: none;\n        z-index: 1;\n    }\n\n    .p-menubar-root-list > .p-menuitem-active > .p-submenu-list {\n        display: block;\n    }\n\n    .p-menubar .p-submenu-list {\n        display: none;\n        position: absolute;\n        z-index: 1;\n    }\n\n    .p-menubar .p-submenu-list > .p-menuitem-active > .p-submenu-list {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n\n    .p-menubar .p-submenu-list .p-menuitem .p-menuitem-content .p-menuitem-link .p-submenu-icon {\n        margin-left: auto;\n    }\n\n    .p-menubar .p-menubar-end {\n        margin-left: auto;\n        align-self: center;\n    }\n\n    .p-menubar-button {\n        display: none;\n        cursor: pointer;\n        align-items: center;\n        justify-content: center;\n        text-decoration: none;\n    }\n\n    .p-menubar.p-menubar-mobile {\n        position: relative; \n    }\n\n    .p-menubar.p-menubar-mobile .p-menubar-button {\n        display: flex;\n    }\n\n    .p-menubar.p-menubar-mobile .p-menubar-root-list {\n        position: absolute;\n        display: none;\n        width: 100%;\n    }\n\n    .p-menubar.p-menubar-mobile .p-submenu-list {\n        width: 100%;\n        position: static;\n        box-shadow: none;\n        border: 0 none;\n    }\n\n    .p-menubar.p-menubar-mobile .p-menubar-root-list .p-menuitem {\n        width: 100%;\n        position: static;\n    }\n\n    .p-menubar.p-menubar-mobile-active .p-menubar-root-list {\n        display: flex;\n        flex-direction: column;\n        top: 100%;\n        left: 0;\n        z-index: 1;\n    }\n}\n";
     var inlineStyles = {
       submenu: function submenu(_ref) {
         var instance = _ref.instance,
@@ -4579,7 +4548,6 @@ this.primevue.menubar.style = (function (BaseStyle) {
     };
     var MenubarStyle = BaseStyle__default["default"].extend({
       name: 'menubar',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -4597,7 +4565,6 @@ this.primevue.message.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-message-wrapper {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-message-icon {\n        flex-shrink: 0;\n    }\n\n    .p-message-close {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n\n    .p-message-close.p-link {\n        margin-left: auto;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-message-enter-from {\n        opacity: 0;\n    }\n\n    .p-message-enter-active {\n        transition: opacity 0.3s;\n    }\n\n    .p-message.p-message-leave-from {\n        max-height: 1000px;\n    }\n\n    .p-message.p-message-leave-to {\n        max-height: 0;\n        opacity: 0;\n        margin: 0;\n    }\n\n    .p-message-leave-active {\n        overflow: hidden;\n        transition: max-height 0.3s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin 0.15s;\n    }\n\n    .p-message-leave-active .p-message-close {\n        display: none;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4611,7 +4578,6 @@ this.primevue.message.style = (function (BaseStyle) {
     };
     var MessageStyle = BaseStyle__default["default"].extend({
       name: 'message',
-      css: css,
       classes: classes
     });
 
@@ -4628,7 +4594,6 @@ this.primevue.metergroup.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-metergroup {\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-metergroup-vertical.p-metergroup {\n        display: flex;\n    }\n\n    .p-metergroup-vertical .p-metergroup-meter-container {\n        flex-direction: column;\n    }\n\n    .p-metergroup-meter-container {\n        display: flex;\n    }\n\n    .p-metergroup-label-list {\n        display: flex;\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-metergroup-vertical .p-metergroup-label-list {\n        align-items: start;\n    }\n\n    .p-metergroup-horizontal .p-metergroup-label-list-vertical {\n        flex-direction: column;\n    }\n\n    .p-metergroup-vertical .p-metergroup-label-list-horizontal {\n        flex-direction: column;\n    }\n\n    .p-metergroup-label-list-item {\n        display: inline-flex;\n        align-items: center;\n    }\n\n    .p-metergroup-label-type {\n        display: inline-block;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4637,25 +4602,22 @@ this.primevue.metergroup.style = (function (BaseStyle) {
           'p-metergroup-vertical': props.orientation === 'vertical'
         }];
       },
-      metercontainer: 'p-metergroup-meter-container',
+      metercontainer: 'p-metergroup-meters',
       meter: 'p-metergroup-meter',
       labellist: function labellist(_ref2) {
         var props = _ref2.props;
-        return ['p-metergroup-label-list', {
-          'p-metergroup-label-list-start': props.labelPosition === 'start',
-          'p-metergroup-label-list-end': props.labelPosition === 'end',
-          'p-metergroup-label-list-vertical': props.labelOrientation === 'vertical',
-          'p-metergroup-label-list-horizontal': props.labelOrientation === 'horizontal'
+        return ['p-metergroup-labels', {
+          'p-metergroup-labels-vertical': props.labelOrientation === 'vertical',
+          'p-metergroup-labels-horizontal': props.labelOrientation === 'horizontal'
         }];
       },
-      labellistitem: 'p-metergroup-label-list-item',
+      labellistitem: 'p-metergroup-label',
       labelicon: 'p-metergroup-label-icon',
-      labellisttype: 'p-metergroup-label-type',
-      label: 'p-metergroup-label'
+      labellisttype: 'p-metergroup-label-marker',
+      label: 'p-metergroup-label-text'
     };
     var MeterGroupStyle = BaseStyle__default["default"].extend({
       name: 'metergroup',
-      css: css,
       classes: classes
     });
 
@@ -4672,7 +4634,6 @@ this.primevue.multiselect.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-multiselect {\n        display: inline-flex;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-multiselect-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n\n    .p-multiselect-label-container {\n        overflow: hidden;\n        flex: 1 1 auto;\n        cursor: pointer;\n    }\n\n    .p-multiselect-label {\n        display: block;\n        white-space: nowrap;\n        cursor: pointer;\n        overflow: hidden;\n        text-overflow: ellipsis;\n    }\n\n    .p-multiselect-label-empty {\n        overflow: hidden;\n        visibility: hidden;\n    }\n\n    .p-multiselect-token {\n        cursor: default;\n        display: inline-flex;\n        align-items: center;\n        flex: 0 0 auto;\n    }\n\n    .p-multiselect-token-icon {\n        cursor: pointer;\n    }\n\n    .p-multiselect .p-multiselect-panel {\n        min-width: 100%;\n    }\n\n    .p-multiselect-items-wrapper {\n        overflow: auto;\n    }\n\n    .p-multiselect-items {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-multiselect-item {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        font-weight: normal;\n        white-space: nowrap;\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-multiselect-item-group {\n        cursor: auto;\n    }\n\n    .p-multiselect-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .p-multiselect-filter-container {\n        position: relative;\n        flex: 1 1 auto;\n    }\n\n    .p-multiselect-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-multiselect-filter-container .p-inputtext {\n        width: 100%;\n    }\n\n    .p-multiselect-close {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n        overflow: hidden;\n        position: relative;\n        margin-left: auto;\n    }\n\n    .p-fluid .p-multiselect {\n        display: flex;\n    }\n}\n";
     var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4688,6 +4649,8 @@ this.primevue.multiselect.style = (function (BaseStyle) {
         return ['p-multiselect p-component p-inputwrapper', {
           'p-multiselect-chip': props.display === 'chip',
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled',
           'p-focus': instance.focused,
           'p-inputwrapper-filled': props.modelValue && props.modelValue.length,
           'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
@@ -4710,27 +4673,33 @@ this.primevue.multiselect.style = (function (BaseStyle) {
       loadingIcon: 'p-multiselect-trigger-icon',
       dropdownIcon: 'p-multiselect-trigger-icon',
       panel: function panel(_ref4) {
-        var instance = _ref4.instance;
+        _ref4.props;
+          var instance = _ref4.instance;
         return ['p-multiselect-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
       header: 'p-multiselect-header',
       filterContainer: 'p-multiselect-filter-container',
-      filterInput: 'p-multiselect-filter p-inputtext p-component',
+      filterInput: function filterInput(_ref5) {
+        var props = _ref5.props,
+          instance = _ref5.instance;
+        return ['p-multiselect-filter p-inputtext p-component', {
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
+        }];
+      },
       filterIcon: 'p-multiselect-filter-icon',
       closeButton: 'p-multiselect-close p-link',
       closeIcon: 'p-multiselect-close-icon',
       wrapper: 'p-multiselect-items-wrapper',
       list: 'p-multiselect-items p-component',
       itemGroup: 'p-multiselect-item-group',
-      item: function item(_ref5) {
-        var instance = _ref5.instance,
-          option = _ref5.option,
-          index = _ref5.index,
-          getItemOptions = _ref5.getItemOptions,
-          props = _ref5.props;
+      item: function item(_ref6) {
+        var instance = _ref6.instance,
+          option = _ref6.option,
+          index = _ref6.index,
+          getItemOptions = _ref6.getItemOptions,
+          props = _ref6.props;
         return ['p-multiselect-item', {
           'p-highlight': instance.isSelected(option) && props.highlightOnSelect,
           'p-focus': instance.focusedOptionIndex === instance.getOptionIndex(index, getItemOptions),
@@ -4741,7 +4710,6 @@ this.primevue.multiselect.style = (function (BaseStyle) {
     };
     var MultiSelectStyle = BaseStyle__default["default"].extend({
       name: 'multiselect',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -4759,7 +4727,6 @@ this.primevue.orderlist.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-orderlist {\n        display: flex;\n    }\n\n    .p-orderlist-controls {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n    }\n\n    .p-orderlist-list-container {\n        flex: 1 1 auto;\n    }\n\n    .p-orderlist-list {\n        list-style-type: none;\n        margin: 0;\n        padding: 0;\n        overflow: auto;\n        min-height: 12rem;\n        max-height: 24rem;\n    }\n\n    .p-orderlist-item {\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-orderlist.p-state-disabled .p-orderlist-item,\n    .p-orderlist.p-state-disabled .p-button {\n        cursor: default;\n    }\n\n    .p-orderlist.p-state-disabled .p-orderlist-list {\n        overflow: hidden;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4783,7 +4750,6 @@ this.primevue.orderlist.style = (function (BaseStyle) {
     };
     var OrderListStyle = BaseStyle__default["default"].extend({
       name: 'orderlist',
-      css: css,
       classes: classes
     });
 
@@ -4800,7 +4766,6 @@ this.primevue.organizationchart.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-organizationchart-table {\n        border-spacing: 0;\n        border-collapse: separate;\n        margin: 0 auto;\n    }\n\n    .p-organizationchart-table > tbody > tr > td {\n        text-align: center;\n        vertical-align: top;\n        padding: 0 0.75rem;\n    }\n\n    .p-organizationchart-node-content {\n        display: inline-block;\n        position: relative;\n    }\n\n    .p-organizationchart-node-content .p-node-toggler {\n        position: absolute;\n        bottom: -0.75rem;\n        margin-left: -0.75rem;\n        z-index: 2;\n        left: 50%;\n        user-select: none;\n        cursor: pointer;\n        width: 1.5rem;\n        height: 1.5rem;\n        text-decoration: none;\n    }\n\n    .p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {\n        position: relative;\n        top: 0.25rem;\n    }\n\n    .p-organizationchart-line-down {\n        margin: 0 auto;\n        height: 20px;\n        width: 1px;\n    }\n\n    .p-organizationchart-line-right {\n        border-radius: 0px;\n    }\n\n    .p-organizationchart-line-left {\n        border-radius: 0;\n    }\n\n    .p-organizationchart-selectable-node {\n        cursor: pointer;\n    }\n}\n";
     var classes = {
       root: 'p-organizationchart p-component',
       table: 'p-organizationchart-table',
@@ -4832,7 +4797,6 @@ this.primevue.organizationchart.style = (function (BaseStyle) {
     };
     var OrganizationChartStyle = BaseStyle__default["default"].extend({
       name: 'organizationchart',
-      css: css,
       classes: classes
     });
 
@@ -4849,12 +4813,10 @@ this.primevue.overlaypanel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-overlaypanel {\n        margin-top: 10px;\n    }\n\n    .p-overlaypanel-flipped {\n        margin-top: 0;\n        margin-bottom: 10px;\n    }\n\n    .p-overlaypanel-close {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    /* Animation */\n    .p-overlaypanel-enter-from {\n        opacity: 0;\n        transform: scaleY(0.8);\n    }\n\n    .p-overlaypanel-leave-to {\n        opacity: 0;\n    }\n\n    .p-overlaypanel-enter-active {\n        transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1);\n    }\n\n    .p-overlaypanel-leave-active {\n        transition: opacity 0.1s linear;\n    }\n\n    .p-overlaypanel:after,\n    .p-overlaypanel:before {\n        bottom: 100%;\n        left: calc(var(--overlayArrowLeft, 0) + 1.25rem);\n        content: ' ';\n        height: 0;\n        width: 0;\n        position: absolute;\n        pointer-events: none;\n    }\n\n    .p-overlaypanel:after {\n        border-width: 8px;\n        margin-left: -8px;\n    }\n\n    .p-overlaypanel:before {\n        border-width: 10px;\n        margin-left: -10px;\n    }\n\n    .p-overlaypanel-flipped:after,\n    .p-overlaypanel-flipped:before {\n        bottom: auto;\n        top: 100%;\n    }\n\n    .p-overlaypanel.p-overlaypanel-flipped:after {\n        border-bottom-color: transparent;\n    }\n\n    .p-overlaypanel.p-overlaypanel-flipped:before {\n        border-bottom-color: transparent;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
         return ['p-overlaypanel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -4864,7 +4826,6 @@ this.primevue.overlaypanel.style = (function (BaseStyle) {
     };
     var OverlayPanelStyle = BaseStyle__default["default"].extend({
       name: 'overlaypanel',
-      css: css,
       classes: classes
     });
 
@@ -4885,7 +4846,6 @@ this.primevue.paginator.style = (function (BaseStyle) {
     function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
     function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(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 || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-    var css = "\n@layer primevue {\n    .p-paginator-default {\n        display: flex;\n    }\n\n    .p-paginator {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-wrap: wrap;\n    }\n\n    .p-paginator-left-content {\n        margin-right: auto;\n    }\n\n    .p-paginator-right-content {\n        margin-left: auto;\n    }\n\n    .p-paginator-page,\n    .p-paginator-next,\n    .p-paginator-last,\n    .p-paginator-first,\n    .p-paginator-prev,\n    .p-paginator-current {\n        cursor: pointer;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        line-height: 1;\n        user-select: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-paginator-element:focus {\n        z-index: 1;\n        position: relative;\n    }\n}\n";
     var classes = {
       paginator: function paginator(_ref) {
         var instance = _ref.instance,
@@ -4939,7 +4899,6 @@ this.primevue.paginator.style = (function (BaseStyle) {
     };
     var PaginatorStyle = BaseStyle__default["default"].extend({
       name: 'paginator',
-      css: css,
       classes: classes
     });
 
@@ -4956,7 +4915,6 @@ this.primevue.panel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-panel-header {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n    }\n\n    .p-panel-title {\n        line-height: 1;\n    }\n\n    .p-panel-header-icon {\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -4974,7 +4932,6 @@ this.primevue.panel.style = (function (BaseStyle) {
     };
     var PanelStyle = BaseStyle__default["default"].extend({
       name: 'panel',
-      css: css,
       classes: classes
     });
 
@@ -4991,7 +4948,6 @@ this.primevue.panelmenu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-panelmenu .p-panelmenu-header-action {\n        display: flex;\n        align-items: center;\n        user-select: none;\n        cursor: pointer;\n        position: relative;\n        text-decoration: none;\n    }\n\n    .p-panelmenu .p-panelmenu-header-action:focus {\n        z-index: 1;\n    }\n\n    .p-panelmenu .p-submenu-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-panelmenu .p-menuitem-link {\n        display: flex;\n        align-items: center;\n        user-select: none;\n        cursor: pointer;\n        text-decoration: none;\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-panelmenu .p-menuitem-text {\n        line-height: 1;\n    }\n}\n";
     var classes = {
       root: 'p-panelmenu p-component',
       panel: 'p-panelmenu-panel',
@@ -5028,7 +4984,6 @@ this.primevue.panelmenu.style = (function (BaseStyle) {
     };
     var PanelMenuStyle = BaseStyle__default["default"].extend({
       name: 'panelmenu',
-      css: css,
       classes: classes
     });
 
@@ -5045,7 +5000,6 @@ this.primevue.password.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-password {\n        display: inline-flex;\n    }\n\n    .p-password .p-password-panel {\n        min-width: 100%;\n    }\n\n    .p-password-meter {\n        height: 10px;\n    }\n\n    .p-password-strength {\n        height: 100%;\n        width: 0;\n        transition: width 1s ease-in-out;\n    }\n\n    .p-fluid .p-password {\n        display: flex;\n    }\n\n    .p-password-input::-ms-reveal,\n    .p-password-input::-ms-clear {\n        display: none;\n    }\n}\n";
     var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5071,9 +5025,9 @@ this.primevue.password.style = (function (BaseStyle) {
         }];
       },
       panel: function panel(_ref4) {
-        var instance = _ref4.instance;
+        _ref4.props;
+          var instance = _ref4.instance;
         return ['p-password-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -5086,7 +5040,6 @@ this.primevue.password.style = (function (BaseStyle) {
     };
     var PasswordStyle = BaseStyle__default["default"].extend({
       name: 'password',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5104,7 +5057,6 @@ this.primevue.picklist.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-picklist {\n        display: flex;\n    }\n\n    .p-picklist-buttons {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n    }\n\n    .p-picklist-list-wrapper {\n        flex: 1 1 50%;\n    }\n\n    .p-picklist-list {\n        list-style-type: none;\n        margin: 0;\n        padding: 0;\n        overflow: auto;\n        min-height: 12rem;\n        max-height: 24rem;\n    }\n\n    .p-picklist-item {\n        cursor: pointer;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-picklist-item.p-picklist-flip-enter-active.p-picklist-flip-enter-to,\n    .p-picklist-item.p-picklist-flip-leave-active.p-picklist-flip-leave-to {\n        transition: none;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5134,7 +5086,6 @@ this.primevue.picklist.style = (function (BaseStyle) {
     };
     var PickListStyle = BaseStyle__default["default"].extend({
       name: 'picklist',
-      css: css,
       classes: classes
     });
 
@@ -5162,7 +5113,6 @@ this.primevue.progressbar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-progressbar {\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-progressbar-determinate .p-progressbar-value {\n        height: 100%;\n        width: 0%;\n        position: absolute;\n        display: none;\n        border: 0 none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n    }\n\n    .p-progressbar-determinate .p-progressbar-label {\n        display: inline-flex;\n    }\n\n    .p-progressbar-determinate .p-progressbar-value-animate {\n        transition: width 1s ease-in-out;\n    }\n\n    .p-progressbar-indeterminate .p-progressbar-value::before {\n        content: '';\n        position: absolute;\n        background-color: inherit;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        will-change: left, right;\n        -webkit-animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n        animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n    }\n\n    .p-progressbar-indeterminate .p-progressbar-value::after {\n        content: '';\n        position: absolute;\n        background-color: inherit;\n        top: 0;\n        left: 0;\n        bottom: 0;\n        will-change: left, right;\n        -webkit-animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n        animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;\n        -webkit-animation-delay: 1.15s;\n        animation-delay: 1.15s;\n    }\n\n    @-webkit-keyframes p-progressbar-indeterminate-anim {\n        0% {\n            left: -35%;\n            right: 100%;\n        }\n        60% {\n            left: 100%;\n            right: -90%;\n        }\n        100% {\n            left: 100%;\n            right: -90%;\n        }\n    }\n    @keyframes p-progressbar-indeterminate-anim {\n        0% {\n            left: -35%;\n            right: 100%;\n        }\n        60% {\n            left: 100%;\n            right: -90%;\n        }\n        100% {\n            left: 100%;\n            right: -90%;\n        }\n    }\n\n    @-webkit-keyframes p-progressbar-indeterminate-anim-short {\n        0% {\n            left: -200%;\n            right: 100%;\n        }\n        60% {\n            left: 107%;\n            right: -8%;\n        }\n        100% {\n            left: 107%;\n            right: -8%;\n        }\n    }\n    @keyframes p-progressbar-indeterminate-anim-short {\n        0% {\n            left: -200%;\n            right: 100%;\n        }\n        60% {\n            left: 107%;\n            right: -8%;\n        }\n        100% {\n            left: 107%;\n            right: -8%;\n        }\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
@@ -5177,7 +5127,6 @@ this.primevue.progressbar.style = (function (BaseStyle) {
     };
     var ProgressBarStyle = BaseStyle__default["default"].extend({
       name: 'progressbar',
-      css: css,
       classes: classes
     });
 
@@ -5194,7 +5143,6 @@ this.primevue.progressspinner.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-progress-spinner {\n        position: relative;\n        margin: 0 auto;\n        width: 100px;\n        height: 100px;\n        display: inline-block;\n    }\n\n    .p-progress-spinner::before {\n        content: '';\n        display: block;\n        padding-top: 100%;\n    }\n\n    .p-progress-spinner-svg {\n        height: 100%;\n        transform-origin: center center;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        margin: auto;\n    }\n}\n";
     var classes = {
       root: 'p-progress-spinner',
       spinner: 'p-progress-spinner-svg',
@@ -5202,7 +5150,6 @@ this.primevue.progressspinner.style = (function (BaseStyle) {
     };
     var ProgressSpinnerStyle = BaseStyle__default["default"].extend({
       name: 'progressspinner',
-      css: css,
       classes: classes
     });
 
@@ -5219,14 +5166,15 @@ this.primevue.radiobutton.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-radiobutton {\n        position: relative;\n        display: inline-flex;\n        user-select: none;\n        vertical-align: bottom;\n    }\n\n    .p-radiobutton-input {\n        cursor: pointer;\n    }\n\n    .p-radiobutton-box {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n\n    .p-radiobutton-icon {\n        -webkit-backface-visibility: hidden;\n        backface-visibility: hidden;\n        transform: translateZ(0) scale(.1);\n        border-radius: 50%;\n        visibility: hidden;\n    }\n\n    .p-radiobutton.p-highlight .p-radiobutton-icon {\n        transform: translateZ(0) scale(1.0, 1.0);\n        visibility: visible;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-radiobutton p-component', {
           'p-highlight': instance.checked,
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       },
       box: 'p-radiobutton-box',
@@ -5235,7 +5183,6 @@ this.primevue.radiobutton.style = (function (BaseStyle) {
     };
     var RadioButtonStyle = BaseStyle__default["default"].extend({
       name: 'radiobutton',
-      css: css,
       classes: classes
     });
 
@@ -5252,7 +5199,6 @@ this.primevue.rating.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-rating {\n        position: relative;\n        display: flex;\n        align-items: center;\n    }\n\n    .p-rating-item {\n        display: inline-flex;\n        align-items: center;\n        cursor: pointer;\n    }\n\n    .p-rating.p-readonly .p-rating-item {\n        cursor: default;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5282,7 +5228,6 @@ this.primevue.rating.style = (function (BaseStyle) {
     };
     var RatingStyle = BaseStyle__default["default"].extend({
       name: 'rating',
-      css: css,
       classes: classes
     });
 
@@ -5299,13 +5244,11 @@ this.primevue.ripple.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\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    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n";
     var classes = {
       root: 'p-ink'
     };
     var RippleStyle = BaseStyle__default["default"].extend({
       name: 'ripple',
-      css: css,
       classes: classes
     });
 
@@ -5333,7 +5276,6 @@ this.primevue.scrollpanel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-scrollpanel-wrapper {\n        overflow: hidden;\n        width: 100%;\n        height: 100%;\n        position: relative;\n        z-index: 1;\n        float: left;\n    }\n\n    .p-scrollpanel-content {\n        height: calc(100% + 18px);\n        width: calc(100% + 18px);\n        padding: 0 18px 18px 0;\n        position: relative;\n        overflow: auto;\n        box-sizing: border-box;\n        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\n    }\n\n    .p-scrollpanel-bar {\n        position: relative;\n        background: #c1c1c1;\n        border-radius: 3px;\n        z-index: 2;\n        cursor: pointer;\n        opacity: 0;\n        transition: opacity 0.25s linear;\n    }\n\n    .p-scrollpanel-bar-y {\n        width: 9px;\n        top: 0;\n    }\n\n    .p-scrollpanel-bar-x {\n        height: 9px;\n        bottom: 0;\n    }\n\n    .p-scrollpanel-hidden {\n        visibility: hidden;\n    }\n\n    .p-scrollpanel:hover .p-scrollpanel-bar,\n    .p-scrollpanel:active .p-scrollpanel-bar {\n        opacity: 1;\n    }\n\n    .p-scrollpanel-grabbed {\n        user-select: none;\n    }\n}\n";
     var classes = {
       root: 'p-scrollpanel p-component',
       wrapper: 'p-scrollpanel-wrapper',
@@ -5343,7 +5285,6 @@ this.primevue.scrollpanel.style = (function (BaseStyle) {
     };
     var ScrollPanelStyle = BaseStyle__default["default"].extend({
       name: 'scrollpanel',
-      css: css,
       classes: classes
     });
 
@@ -5360,7 +5301,6 @@ this.primevue.scrolltop.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n\n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n\n    .p-scrolltop-enter-from {\n        opacity: 0;\n    }\n\n    .p-scrolltop-enter-active {\n        transition: opacity 0.15s;\n    }\n\n    .p-scrolltop.p-scrolltop-leave-to {\n        opacity: 0;\n    }\n\n    .p-scrolltop-leave-active {\n        transition: opacity 0.15s;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5372,7 +5312,6 @@ this.primevue.scrolltop.style = (function (BaseStyle) {
     };
     var ScrollTopStyle = BaseStyle__default["default"].extend({
       name: 'scrolltop',
-      css: css,
       classes: classes
     });
 
@@ -5393,7 +5332,8 @@ this.primevue.selectbutton.style = (function (BaseStyle) {
       root: function root(_ref) {
         var props = _ref.props;
         return ['p-selectbutton p-buttonset p-component', {
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid
         }];
       },
       button: function button(_ref2) {
@@ -5424,7 +5364,6 @@ this.primevue.sidebar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-sidebar-mask {\n        display: none;\n        pointer-events: none;\n        background-color: transparent;\n        transition-property: background-color;\n    }\n\n    .p-sidebar-mask.p-component-overlay {\n        pointer-events: auto;\n    }\n\n    .p-sidebar-visible {\n        display: flex;\n    }\n\n    .p-sidebar {\n        display: flex;\n        flex-direction: column;\n        pointer-events: auto;\n        transform: translate3d(0px, 0px, 0px);\n        position: relative;\n        transition: transform 0.3s;\n    }\n\n    .p-sidebar-content {\n        overflow-y: auto;\n        flex-grow: 1;\n    }\n\n    .p-sidebar-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        flex-shrink: 0;\n    }\n\n    .p-sidebar-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-sidebar-full .p-sidebar {\n        transition: none;\n        transform: none;\n        width: 100vw !important;\n        height: 100vh !important;\n        max-height: 100%;\n        top: 0px !important;\n        left: 0px !important;\n    }\n\n    /* Animation */\n    /* Center */\n    .p-sidebar-left .p-sidebar-enter-from,\n    .p-sidebar-left .p-sidebar-leave-to {\n        transform: translateX(-100%);\n    }\n    .p-sidebar-right .p-sidebar-enter-from,\n    .p-sidebar-right .p-sidebar-leave-to {\n        transform: translateX(100%);\n    }\n    .p-sidebar-top .p-sidebar-enter-from,\n    .p-sidebar-top .p-sidebar-leave-to {\n        transform: translateY(-100%);\n    }\n    .p-sidebar-bottom .p-sidebar-enter-from,\n    .p-sidebar-bottom .p-sidebar-leave-to {\n        transform: translateY(100%);\n    }\n    .p-sidebar-full .p-sidebar-enter-from,\n    .p-sidebar-full .p-sidebar-leave-to {\n        opacity: 0;\n    }\n    .p-sidebar-full .p-sidebar-enter-active,\n    .p-sidebar-full .p-sidebar-leave-active {\n        transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n\n    /* Size */\n    .p-sidebar-left .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n\n    .p-sidebar-right .p-sidebar {\n        width: 20rem;\n        height: 100%;\n    }\n\n    .p-sidebar-top .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n\n    .p-sidebar-bottom .p-sidebar {\n        height: 10rem;\n        width: 100%;\n    }\n\n    .p-sidebar-left .p-sidebar-sm,\n    .p-sidebar-right .p-sidebar-sm {\n        width: 20rem;\n    }\n\n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-md {\n        width: 40rem;\n    }\n\n    .p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-lg {\n        width: 60rem;\n    }\n\n    .p-sidebar-top .p-sidebar-sm,\n    .p-sidebar-bottom .p-sidebar-sm {\n        height: 10rem;\n    }\n\n    .p-sidebar-top .p-sidebar-md,\n    .p-sidebar-bottom .p-sidebar-md {\n        height: 20rem;\n    }\n\n    .p-sidebar-top .p-sidebar-lg,\n    .p-sidebar-bottom .p-sidebar-lg {\n        height: 30rem;\n    }\n\n    .p-sidebar-left .p-sidebar-content,\n    .p-sidebar-right .p-sidebar-content,\n    .p-sidebar-top .p-sidebar-content,\n    .p-sidebar-bottom .p-sidebar-content {\n        width: 100%;\n        height: 100%;\n    }\n\n    @media screen and (max-width: 64em) {\n        .p-sidebar-left .p-sidebar-lg,\n        .p-sidebar-left .p-sidebar-md,\n        .p-sidebar-right .p-sidebar-lg,\n        .p-sidebar-right .p-sidebar-md {\n            width: 20rem;\n        }\n    }\n}\n";
     var inlineStyles = {
       mask: function mask(_ref) {
         var position = _ref.position;
@@ -5458,7 +5397,6 @@ this.primevue.sidebar.style = (function (BaseStyle) {
       root: function root(_ref3) {
         var instance = _ref3.instance;
         return ['p-sidebar p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false,
           'p-sidebar-full': instance.fullScreen
         }];
@@ -5471,7 +5409,6 @@ this.primevue.sidebar.style = (function (BaseStyle) {
     };
     var SidebarStyle = BaseStyle__default["default"].extend({
       name: 'sidebar',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5489,7 +5426,6 @@ this.primevue.skeleton.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-skeleton {\n        overflow: hidden;\n    }\n\n    .p-skeleton::after {\n        content: '';\n        animation: p-skeleton-animation 1.2s infinite;\n        height: 100%;\n        left: 0;\n        position: absolute;\n        right: 0;\n        top: 0;\n        transform: translateX(-100%);\n        z-index: 1;\n    }\n\n    .p-skeleton.p-skeleton-circle {\n        border-radius: 50%;\n    }\n\n    .p-skeleton-none::after {\n        animation: none;\n    }\n\n    @keyframes p-skeleton-animation {\n        from {\n            transform: translateX(-100%);\n        }\n        to {\n            transform: translateX(100%);\n        }\n    }\n}\n";
     var inlineStyles = {
       root: {
         position: 'relative'
@@ -5506,7 +5442,6 @@ this.primevue.skeleton.style = (function (BaseStyle) {
     };
     var SkeletonStyle = BaseStyle__default["default"].extend({
       name: 'skeleton',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5524,7 +5459,6 @@ this.primevue.slider.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-slider {\n        position: relative;\n    }\n\n    .p-slider .p-slider-handle {\n        cursor: grab;\n        touch-action: none;\n        display: block;\n    }\n\n    .p-slider-range {\n        display: block;\n    }\n\n    .p-slider-horizontal .p-slider-range {\n        top: 0;\n        left: 0;\n        height: 100%;\n    }\n\n    .p-slider-horizontal .p-slider-handle {\n        top: 50%;\n    }\n\n    .p-slider-vertical {\n        height: 100px;\n    }\n\n    .p-slider-vertical .p-slider-handle {\n        left: 50%;\n    }\n\n    .p-slider-vertical .p-slider-range {\n        bottom: 0;\n        left: 0;\n        width: 100%;\n    }\n}\n";
     var inlineStyles = {
       handle: {
         position: 'absolute'
@@ -5547,7 +5481,6 @@ this.primevue.slider.style = (function (BaseStyle) {
     };
     var SliderStyle = BaseStyle__default["default"].extend({
       name: 'slider',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5569,7 +5502,6 @@ this.primevue.speeddial.style = (function (BaseStyle) {
     function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
     function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(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 || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-    var css = "\n@layer primevue {\n    .p-speeddial {\n        position: absolute;\n        display: flex;\n    }\n\n    .p-speeddial-button {\n        z-index: 1;\n    }\n\n    .p-speeddial-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        transition: top 0s linear 0.2s;\n        pointer-events: none;\n        z-index: 2;\n    }\n\n    .p-speeddial-item {\n        transform: scale(0);\n        opacity: 0;\n        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;\n        will-change: transform;\n    }\n\n    .p-speeddial-action {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 50%;\n        position: relative;\n        overflow: hidden;\n    }\n\n    .p-speeddial-circle .p-speeddial-item,\n    .p-speeddial-semi-circle .p-speeddial-item,\n    .p-speeddial-quarter-circle .p-speeddial-item {\n        position: absolute;\n    }\n\n    .p-speeddial-rotate {\n        transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n        will-change: transform;\n    }\n\n    .p-speeddial-mask {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 100%;\n        height: 100%;\n        opacity: 0;\n        transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n\n    .p-speeddial-mask-visible {\n        pointer-events: none;\n        opacity: 1;\n        transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n\n    .p-speeddial-opened .p-speeddial-list {\n        pointer-events: auto;\n    }\n\n    .p-speeddial-opened .p-speeddial-item {\n        transform: scale(1);\n        opacity: 1;\n    }\n\n    .p-speeddial-opened .p-speeddial-rotate {\n        transform: rotate(45deg);\n    }\n}\n";
 
     /* Direction */
     var inlineStyles = {
@@ -5624,7 +5556,6 @@ this.primevue.speeddial.style = (function (BaseStyle) {
     };
     var SpeedDialStyle = BaseStyle__default["default"].extend({
       name: 'speeddial',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5642,7 +5573,6 @@ this.primevue.splitbutton.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-splitbutton {\n        display: inline-flex;\n        position: relative;\n    }\n\n    .p-splitbutton .p-splitbutton-defaultbutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button-outlined.p-button:hover {\n        flex: 1 1 auto;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n        border-right: 0 none;\n    }\n\n    .p-splitbutton-menubutton,\n    .p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button,\n    .p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-splitbutton .p-menu {\n        min-width: 100%;\n    }\n\n    .p-fluid .p-splitbutton {\n        display: flex;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5660,7 +5590,6 @@ this.primevue.splitbutton.style = (function (BaseStyle) {
     };
     var SplitButtonStyle = BaseStyle__default["default"].extend({
       name: 'splitbutton',
-      css: css,
       classes: classes
     });
 
@@ -5677,7 +5606,6 @@ this.primevue.splitter.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-splitter {\n        display: flex;\n        flex-wrap: nowrap;\n    }\n\n    .p-splitter-vertical {\n        flex-direction: column;\n    }\n\n    .p-splitter-gutter {\n        flex-grow: 0;\n        flex-shrink: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: col-resize;\n    }\n\n    .p-splitter-horizontal.p-splitter-resizing {\n        cursor: col-resize;\n        user-select: none;\n    }\n\n    .p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n        height: 24px;\n        width: 100%;\n    }\n\n    .p-splitter-horizontal > .p-splitter-gutter {\n        cursor: col-resize;\n    }\n\n    .p-splitter-vertical.p-splitter-resizing {\n        cursor: row-resize;\n        user-select: none;\n    }\n\n    .p-splitter-vertical > .p-splitter-gutter {\n        cursor: row-resize;\n    }\n\n    .p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n        width: 24px;\n        height: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5699,7 +5627,6 @@ this.primevue.splitter.style = (function (BaseStyle) {
     };
     var SplitterStyle = BaseStyle__default["default"].extend({
       name: 'splitter',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -5717,7 +5644,6 @@ this.primevue.splitterpanel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-splitter-panel {\n        flex-grow: 1;\n        overflow: hidden;\n    }\n\n    .p-splitter-panel-nested {\n        display: flex;\n    }\n\n    .p-splitter-panel .p-splitter {\n        flex-grow: 1;\n        border: 0 none;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance;
@@ -5728,7 +5654,6 @@ this.primevue.splitterpanel.style = (function (BaseStyle) {
     };
     var SplitterPanelStyle = BaseStyle__default["default"].extend({
       name: 'splitterpanel',
-      css: css,
       classes: classes
     });
 
@@ -5745,7 +5670,6 @@ this.primevue.steps.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-steps {\n        position: relative;\n    }\n\n    .p-steps .p-steps-list {\n        padding: 0;\n        margin: 0;\n        list-style-type: none;\n        display: flex;\n    }\n\n    .p-steps-item {\n        position: relative;\n        display: flex;\n        justify-content: center;\n        flex: 1 1 auto;\n        overflow: hidden;\n    }\n\n    .p-steps-item .p-menuitem-link {\n        display: inline-flex;\n        flex-direction: column;\n        align-items: center;\n        overflow: hidden;\n        text-decoration: none;\n        cursor: pointer;\n    }\n\n    .p-steps.p-steps-readonly .p-steps-item {\n        cursor: auto;\n    }\n\n    .p-steps-item.p-steps-current .p-menuitem-link {\n        cursor: default;\n    }\n\n    .p-steps-title {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        max-width: 100%;\n    }\n\n    .p-steps-number {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-steps-title {\n        display: block;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5769,7 +5693,6 @@ this.primevue.steps.style = (function (BaseStyle) {
     };
     var StepsStyle = BaseStyle__default["default"].extend({
       name: 'steps',
-      css: css,
       classes: classes
     });
 
@@ -5786,7 +5709,6 @@ this.primevue.tabmenu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tabmenu {\n        overflow-x: auto;\n    }\n\n    .p-tabmenu-nav {\n        display: flex;\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        flex-wrap: nowrap;\n    }\n\n    .p-tabmenu-nav a {\n        cursor: pointer;\n        user-select: none;\n        display: flex;\n        align-items: center;\n        position: relative;\n        text-decoration: none;\n        text-decoration: none;\n        overflow: hidden;\n    }\n\n    .p-tabmenu-nav a:focus {\n        z-index: 1;\n    }\n\n    .p-tabmenu-nav .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-tabmenu-ink-bar {\n        display: none;\n        z-index: 1;\n    }\n\n    .p-tabmenu::-webkit-scrollbar {\n        display: none;\n    }\n}\n";
     var classes = {
       root: 'p-tabmenu p-component',
       menu: 'p-tabmenu-nav p-reset',
@@ -5806,7 +5728,6 @@ this.primevue.tabmenu.style = (function (BaseStyle) {
     };
     var TabMenuStyle = BaseStyle__default["default"].extend({
       name: 'tabmenu',
-      css: css,
       classes: classes
     });
 
@@ -5834,7 +5755,6 @@ this.primevue.tabview.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tabview-nav-container {\n        position: relative;\n    }\n\n    .p-tabview-scrollable .p-tabview-nav-container {\n        overflow: hidden;\n    }\n\n    .p-tabview-nav-content {\n        overflow-x: auto;\n        overflow-y: hidden;\n        scroll-behavior: smooth;\n        scrollbar-width: none;\n        overscroll-behavior: contain auto;\n    }\n\n    .p-tabview-nav {\n        display: flex;\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        flex: 1 1 auto;\n    }\n\n    .p-tabview-header-action {\n        cursor: pointer;\n        user-select: none;\n        display: flex;\n        align-items: center;\n        position: relative;\n        text-decoration: none;\n        overflow: hidden;\n    }\n\n    .p-tabview-ink-bar {\n        display: none;\n        z-index: 1;\n    }\n\n    .p-tabview-header-action:focus {\n        z-index: 1;\n    }\n\n    .p-tabview-title {\n        line-height: 1;\n        white-space: nowrap;\n    }\n\n    .p-tabview-nav-btn {\n        position: absolute;\n        top: 0;\n        z-index: 2;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-tabview-nav-prev {\n        left: 0;\n    }\n\n    .p-tabview-nav-next {\n        right: 0;\n    }\n\n    .p-tabview-nav-content::-webkit-scrollbar {\n        display: none;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5870,7 +5790,6 @@ this.primevue.tabview.style = (function (BaseStyle) {
     };
     var TabViewStyle = BaseStyle__default["default"].extend({
       name: 'tabview',
-      css: css,
       classes: classes
     });
 
@@ -5887,7 +5806,6 @@ this.primevue.tag.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tag {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-tag-icon,\n    .p-tag-value,\n    .p-tag-icon.pi {\n        line-height: 1.5;\n    }\n\n    .p-tag.p-tag-rounded {\n        border-radius: 10rem;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -5896,6 +5814,8 @@ this.primevue.tag.style = (function (BaseStyle) {
           'p-tag-success': props.severity === 'success',
           'p-tag-warning': props.severity === 'warning',
           'p-tag-danger': props.severity === 'danger',
+          'p-tag-secondary': props.severity === 'secondary',
+          'p-tag-contrast': props.severity === 'contrast',
           'p-tag-rounded': props.rounded
         }];
       },
@@ -5904,7 +5824,6 @@ this.primevue.tag.style = (function (BaseStyle) {
     };
     var TagStyle = BaseStyle__default["default"].extend({
       name: 'tag',
-      css: css,
       classes: classes
     });
 
@@ -5921,7 +5840,6 @@ this.primevue.terminal.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-terminal {\n        height: 18rem;\n        overflow: auto;\n    }\n\n    .p-terminal-prompt-container {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-terminal-input {\n        flex: 1 1 auto;\n        border: 0 none;\n        background-color: transparent;\n        color: inherit;\n        padding: 0;\n        outline: 0 none;\n    }\n\n    .p-terminal-input::-ms-clear {\n        display: none;\n    }\n}\n";
     var classes = {
       root: 'p-terminal p-component',
       content: 'p-terminal-content',
@@ -5933,7 +5851,6 @@ this.primevue.terminal.style = (function (BaseStyle) {
     };
     var TerminalStyle = BaseStyle__default["default"].extend({
       name: 'terminal',
-      css: css,
       classes: classes
     });
 
@@ -5950,20 +5867,20 @@ this.primevue.textarea.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-inputtextarea-resizable {\n        overflow: hidden;\n        resize: none;\n    }\n\n    .p-fluid .p-inputtextarea {\n        width: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-inputtextarea p-inputtext p-component', {
           'p-filled': instance.filled,
-          'p-inputtextarea-resizable ': props.autoResize
+          'p-inputtextarea-resizable ': props.autoResize,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
         }];
       }
     };
     var TextareaStyle = BaseStyle__default["default"].extend({
       name: 'textarea',
-      css: css,
       classes: classes
     });
 
@@ -5980,7 +5897,6 @@ this.primevue.tieredmenu.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tieredmenu ul {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n    }\n\n    .p-tieredmenu .p-submenu-list {\n        position: absolute;\n        min-width: 100%;\n        z-index: 1;\n        display: none;\n    }\n\n    .p-tieredmenu .p-menuitem-link {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        text-decoration: none;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-tieredmenu .p-menuitem-text {\n        line-height: 1;\n    }\n\n    .p-tieredmenu .p-menuitem {\n        position: relative;\n    }\n\n    .p-tieredmenu .p-menuitem-link .p-submenu-icon {\n        margin-left: auto;\n    }\n\n    .p-tieredmenu .p-menuitem-active > .p-submenu-list {\n        display: block;\n        left: 100%;\n        top: 0;\n    }\n\n    .p-tieredmenu-enter-from,\n    .p-tieredmenu-leave-active {\n        opacity: 0;\n    }\n\n    .p-tieredmenu-enter-active {\n        transition: opacity 250ms;\n    }\n}\n";
     var inlineStyles = {
       submenu: function submenu(_ref) {
         var instance = _ref.instance,
@@ -5996,7 +5912,6 @@ this.primevue.tieredmenu.style = (function (BaseStyle) {
           props = _ref2.props;
         return ['p-tieredmenu p-component', {
           'p-tieredmenu-overlay': props.popup,
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -6022,7 +5937,6 @@ this.primevue.tieredmenu.style = (function (BaseStyle) {
     };
     var TieredMenuStyle = BaseStyle__default["default"].extend({
       name: 'tieredmenu',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -6040,7 +5954,6 @@ this.primevue.timeline.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-timeline {\n        display: flex;\n        flex-grow: 1;\n        flex-direction: column;\n    }\n\n    .p-timeline-left .p-timeline-event-opposite {\n        text-align: right;\n    }\n\n    .p-timeline-left .p-timeline-event-content {\n        text-align: left;\n    }\n\n    .p-timeline-right .p-timeline-event {\n        flex-direction: row-reverse;\n    }\n\n    .p-timeline-right .p-timeline-event-opposite {\n        text-align: left;\n    }\n\n    .p-timeline-right .p-timeline-event-content {\n        text-align: right;\n    }\n\n    .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n        flex-direction: row-reverse;\n    }\n\n    .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n        text-align: right;\n    }\n\n    .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n        text-align: left;\n    }\n\n    .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n        text-align: left;\n    }\n\n    .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n        text-align: right;\n    }\n\n    .p-timeline-event {\n        display: flex;\n        position: relative;\n        min-height: 70px;\n    }\n\n    .p-timeline-event:last-child {\n        min-height: 0;\n    }\n\n    .p-timeline-event-opposite {\n        flex: 1;\n        padding: 0 1rem;\n    }\n\n    .p-timeline-event-content {\n        flex: 1;\n        padding: 0 1rem;\n    }\n\n    .p-timeline-event-separator {\n        flex: 0;\n        display: flex;\n        align-items: center;\n        flex-direction: column;\n    }\n\n    .p-timeline-event-marker {\n        display: flex;\n        align-self: baseline;\n    }\n\n    .p-timeline-event-connector {\n        flex-grow: 1;\n    }\n\n    .p-timeline-horizontal {\n        flex-direction: row;\n    }\n\n    .p-timeline-horizontal .p-timeline-event {\n        flex-direction: column;\n        flex: 1;\n    }\n\n    .p-timeline-horizontal .p-timeline-event:last-child {\n        flex: 0;\n    }\n\n    .p-timeline-horizontal .p-timeline-event-separator {\n        flex-direction: row;\n    }\n\n    .p-timeline-horizontal .p-timeline-event-connector {\n        width: 100%;\n    }\n\n    .p-timeline-bottom .p-timeline-event {\n        flex-direction: column-reverse;\n    }\n\n    .p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n        flex-direction: column-reverse;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -6055,7 +5968,6 @@ this.primevue.timeline.style = (function (BaseStyle) {
     };
     var TimelineStyle = BaseStyle__default["default"].extend({
       name: 'timeline',
-      css: css,
       classes: classes
     });
 
@@ -6076,7 +5988,6 @@ this.primevue.toast.style = (function (BaseStyle) {
     function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
     function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(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 || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-    var css = "\n@layer primevue {\n    .p-toast {\n        width: 25rem;\n        white-space: pre-line;\n        word-break: break-word;\n    }\n\n    .p-toast-message-icon {\n        flex-shrink: 0;\n    }\n\n    .p-toast-message-content {\n        display: flex;\n        align-items: flex-start;\n    }\n\n    .p-toast-message-text {\n        flex: 1 1 auto;\n    }\n\n    .p-toast-top-center {\n        transform: translateX(-50%);\n    }\n\n    .p-toast-bottom-center {\n        transform: translateX(-50%);\n    }\n\n    .p-toast-center {\n        min-width: 20vw;\n        transform: translate(-50%, -50%);\n    }\n\n    .p-toast-icon-close {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-toast-icon-close.p-link {\n        cursor: pointer;\n    }\n\n    /* Animations */\n    .p-toast-message-enter-from {\n        opacity: 0;\n        -webkit-transform: translateY(50%);\n        -ms-transform: translateY(50%);\n        transform: translateY(50%);\n    }\n\n    .p-toast-message-leave-from {\n        max-height: 1000px;\n    }\n\n    .p-toast .p-toast-message.p-toast-message-leave-to {\n        max-height: 0;\n        opacity: 0;\n        margin-bottom: 0;\n        overflow: hidden;\n    }\n\n    .p-toast-message-enter-active {\n        -webkit-transition: transform 0.3s, opacity 0.3s;\n        transition: transform 0.3s, opacity 0.3s;\n    }\n\n    .p-toast-message-leave-active {\n        -webkit-transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;\n        transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;\n    }\n}\n";
 
     // Position
     var inlineStyles = {
@@ -6096,7 +6007,6 @@ this.primevue.toast.style = (function (BaseStyle) {
         var props = _ref2.props,
           instance = _ref2.instance;
         return ['p-toast p-component p-toast-' + props.position, {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -6106,7 +6016,9 @@ this.primevue.toast.style = (function (BaseStyle) {
           'p-toast-message-info': props.message.severity === 'info' || props.message.severity === undefined,
           'p-toast-message-warn': props.message.severity === 'warn',
           'p-toast-message-error': props.message.severity === 'error',
-          'p-toast-message-success': props.message.severity === 'success'
+          'p-toast-message-success': props.message.severity === 'success',
+          'p-toast-message-secondary': props.message.severity === 'secondary',
+          'p-toast-message-contrast': props.message.severity === 'contrast'
         }];
       },
       content: 'p-toast-message-content',
@@ -6122,7 +6034,6 @@ this.primevue.toast.style = (function (BaseStyle) {
     };
     var ToastStyle = BaseStyle__default["default"].extend({
       name: 'toast',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -6140,14 +6051,14 @@ this.primevue.togglebutton.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-togglebutton {\n        position: relative;\n        display: inline-flex;\n        user-select: none;\n        vertical-align: bottom;\n    }\n\n    .p-togglebutton-input {\n        cursor: pointer;\n    }\n\n    .p-togglebutton .p-button {\n        flex: 1 1 auto;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-togglebutton p-component', {
           'p-disabled': props.disabled,
-          'p-highlight': instance.active
+          'p-highlight': instance.active,
+          'p-invalid': props.invalid
         }];
       },
       input: 'p-togglebutton-input',
@@ -6169,7 +6080,6 @@ this.primevue.togglebutton.style = (function (BaseStyle) {
     };
     var ToggleButtonStyle = BaseStyle__default["default"].extend({
       name: 'togglebutton',
-      css: css,
       classes: classes
     });
 
@@ -6186,7 +6096,6 @@ this.primevue.toolbar.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-toolbar {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        flex-wrap: wrap;\n    }\n\n    .p-toolbar-group-start,\n    .p-toolbar-group-center,\n    .p-toolbar-group-end {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-toolbar-group-left,\n    .p-toolbar-group-right {\n        display: flex;\n        align-items: center;\n    }\n}\n";
     var classes = {
       root: 'p-toolbar p-component',
       start: 'p-toolbar-group-start p-toolbar-group-left',
@@ -6195,7 +6104,6 @@ this.primevue.toolbar.style = (function (BaseStyle) {
     };
     var ToolbarStyle = BaseStyle__default["default"].extend({
       name: 'toolbar',
-      css: css,
       classes: classes
     });
 
@@ -6212,7 +6120,6 @@ this.primevue.tooltip.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tooltip {\n        position:absolute;\n        display:none;\n        padding: .25em .5rem;\n        max-width: 12.5rem;\n    }\n\n    .p-tooltip.p-tooltip-right,\n    .p-tooltip.p-tooltip-left {\n        padding: 0 .25rem;\n    }\n\n    .p-tooltip.p-tooltip-top,\n    .p-tooltip.p-tooltip-bottom {\n        padding:.25em 0;\n    }\n\n    .p-tooltip .p-tooltip-text {\n        white-space: pre-line;\n        word-break: break-word;\n    }\n\n    .p-tooltip-arrow {\n        position: absolute;\n        width: 0;\n        height: 0;\n        border-color: transparent;\n        border-style: solid;\n        scale: 2;\n    }\n\n    .p-tooltip-right .p-tooltip-arrow {\n        margin-top: -.25rem;\n        border-width: .25em .25em .25em 0;\n    }\n\n    .p-tooltip-left .p-tooltip-arrow {\n        margin-top: -.25rem;\n        border-width: .25em 0 .25em .25rem;\n    }\n\n    .p-tooltip.p-tooltip-top {\n        padding: .25em 0;\n    }\n\n    .p-tooltip-top .p-tooltip-arrow {\n        margin-left: -.25rem;\n        border-width: .25em .25em 0;\n    }\n\n    .p-tooltip-bottom .p-tooltip-arrow {\n        margin-left: -.25rem;\n        border-width: 0 .25em .25rem;\n    }\n}\n";
     var classes = {
       root: 'p-tooltip p-component',
       arrow: 'p-tooltip-arrow',
@@ -6220,7 +6127,6 @@ this.primevue.tooltip.style = (function (BaseStyle) {
     };
     var TooltipStyle = BaseStyle__default["default"].extend({
       name: 'tooltip',
-      css: css,
       classes: classes
     });
 
@@ -6237,7 +6143,6 @@ this.primevue.tree.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-tree-container {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n        overflow: auto;\n    }\n\n    .p-treenode-children {\n        margin: 0;\n        padding: 0;\n        list-style-type: none;\n    }\n\n    .p-tree-wrapper {\n        overflow: auto;\n    }\n\n    .p-treenode-selectable {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-tree-toggler {\n        cursor: pointer;\n        user-select: none;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        overflow: hidden;\n        position: relative;\n        flex-shrink: 0;\n    }\n\n    .p-treenode-leaf > .p-treenode-content .p-tree-toggler {\n        visibility: hidden;\n    }\n\n    .p-treenode-content {\n        display: flex;\n        align-items: center;\n    }\n\n    .p-tree-filter {\n        width: 100%;\n    }\n\n    .p-tree-filter-container {\n        position: relative;\n        display: block;\n        width: 100%;\n    }\n\n    .p-tree-filter-icon {\n        position: absolute;\n        top: 50%;\n        margin-top: -0.5rem;\n    }\n\n    .p-tree-loading {\n        position: relative;\n        min-height: 4rem;\n    }\n\n    .p-tree .p-tree-loading-overlay {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-tree-flex-scrollable {\n        display: flex;\n        flex: 1;\n        height: 100%;\n        flex-direction: column;\n    }\n\n    .p-tree-flex-scrollable .p-tree-wrapper {\n        flex: 1;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -6282,7 +6187,6 @@ this.primevue.tree.style = (function (BaseStyle) {
     };
     var TreeStyle = BaseStyle__default["default"].extend({
       name: 'tree',
-      css: css,
       classes: classes
     });
 
@@ -6299,7 +6203,6 @@ this.primevue.treeselect.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-treeselect {\n        display: inline-flex;\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-treeselect-trigger {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n    }\n\n    .p-treeselect-label-container {\n        overflow: hidden;\n        flex: 1 1 auto;\n        cursor: pointer;\n    }\n\n    .p-treeselect-label {\n        display: block;\n        white-space: nowrap;\n        cursor: pointer;\n        overflow: hidden;\n        text-overflow: ellipsis;\n    }\n\n    .p-treeselect-label-empty {\n        overflow: hidden;\n        visibility: hidden;\n    }\n\n    .p-treeselect-token {\n        cursor: default;\n        display: inline-flex;\n        align-items: center;\n        flex: 0 0 auto;\n    }\n\n    .p-treeselect .p-treeselect-panel {\n        min-width: 100%;\n    }\n\n    .p-treeselect-items-wrapper {\n        overflow: auto;\n    }\n\n    .p-fluid .p-treeselect {\n        display: flex;\n    }\n}\n";
     var inlineStyles = {
       root: function root(_ref) {
         var props = _ref.props;
@@ -6315,7 +6218,9 @@ this.primevue.treeselect.style = (function (BaseStyle) {
         return ['p-treeselect p-component p-inputwrapper', {
           'p-treeselect-chip': props.display === 'chip',
           'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
           'p-focus': instance.focused,
+          'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled',
           'p-inputwrapper-filled': !instance.emptyValue,
           'p-inputwrapper-focus': instance.focused || instance.overlayVisible
         }];
@@ -6334,9 +6239,9 @@ this.primevue.treeselect.style = (function (BaseStyle) {
       trigger: 'p-treeselect-trigger',
       triggerIcon: 'p-treeselect-trigger-icon',
       panel: function panel(_ref4) {
-        var instance = _ref4.instance;
+        _ref4.props;
+          var instance = _ref4.instance;
         return ['p-treeselect-panel p-component', {
-          'p-input-filled': instance.$primevue.config.inputStyle === 'filled',
           'p-ripple-disabled': instance.$primevue.config.ripple === false
         }];
       },
@@ -6345,7 +6250,6 @@ this.primevue.treeselect.style = (function (BaseStyle) {
     };
     var TreeSelectStyle = BaseStyle__default["default"].extend({
       name: 'treeselect',
-      css: css,
       classes: classes,
       inlineStyles: inlineStyles
     });
@@ -6363,7 +6267,6 @@ this.primevue.treetable.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-treetable {\n        position: relative;\n    }\n\n    .p-treetable table {\n        border-collapse: collapse;\n        width: 100%;\n        table-layout: fixed;\n    }\n\n    .p-treetable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n\n    .p-treetable-responsive-scroll > .p-treetable-wrapper {\n        overflow-x: auto;\n    }\n\n    .p-treetable-responsive-scroll > .p-treetable-wrapper > table,\n    .p-treetable-auto-layout > .p-treetable-wrapper > table {\n        table-layout: auto;\n    }\n\n    .p-treetable-hoverable-rows .p-treetable-tbody > tr {\n        cursor: pointer;\n    }\n\n    .p-treetable-toggler {\n        cursor: pointer;\n        user-select: none;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        vertical-align: middle;\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-treetable-toggler + .p-checkbox {\n        vertical-align: middle;\n    }\n\n    .p-treetable-toggler + .p-checkbox + span {\n        vertical-align: middle;\n    }\n\n    /* Resizable */\n    .p-treetable-resizable > .p-treetable-wrapper {\n        overflow-x: auto;\n    }\n\n    .p-treetable-resizable .p-treetable-thead > tr > th,\n    .p-treetable-resizable .p-treetable-tfoot > tr > td,\n    .p-treetable-resizable .p-treetable-tbody > tr > td {\n        overflow: hidden;\n    }\n\n    .p-treetable-resizable .p-resizable-column:not(.p-frozen-column) {\n        background-clip: padding-box;\n        position: relative;\n    }\n\n    .p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n\n    .p-treetable .p-column-resizer {\n        display: block;\n        position: absolute;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n\n    .p-treetable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n\n    .p-treetable .p-treetable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n\n    /* Scrollable */\n    .p-treetable-scrollable .p-treetable-wrapper {\n        position: relative;\n        overflow: auto;\n    }\n\n    .p-treetable-scrollable .p-treetable-table {\n        display: block;\n    }\n\n    .p-treetable-scrollable .p-treetable-thead,\n    .p-treetable-scrollable .p-treetable-tbody,\n    .p-treetable-scrollable .p-treetable-tfoot {\n        display: block;\n    }\n\n    .p-treetable-scrollable .p-treetable-thead > tr,\n    .p-treetable-scrollable .p-treetable-tbody > tr,\n    .p-treetable-scrollable .p-treetable-tfoot > tr {\n        display: flex;\n        flex-wrap: nowrap;\n        width: 100%;\n    }\n\n    .p-treetable-scrollable .p-treetable-thead > tr > th,\n    .p-treetable-scrollable .p-treetable-tbody > tr > td,\n    .p-treetable-scrollable .p-treetable-tfoot > tr > td {\n        display: flex;\n        flex: 1 1 0;\n        align-items: center;\n    }\n\n    .p-treetable-scrollable .p-treetable-thead {\n        position: sticky;\n        top: 0;\n        z-index: 1;\n    }\n\n    .p-treetable-scrollable .p-treetable-tfoot {\n        position: sticky;\n        bottom: 0;\n        z-index: 1;\n    }\n\n    .p-treetable-scrollable .p-frozen-column {\n        position: sticky;\n        background: inherit;\n    }\n\n    .p-treetable-scrollable th.p-frozen-column {\n        z-index: 1;\n    }\n\n    .p-treetable-scrollable-both .p-treetable-thead > tr > th,\n    .p-treetable-scrollable-both .p-treetable-tbody > tr > td,\n    .p-treetable-scrollable-both .p-treetable-tfoot > tr > td,\n    .p-treetable-scrollable-horizontal .p-treetable-thead > tr > th .p-treetable-scrollable-horizontal .p-treetable-tbody > tr > td,\n    .p-treetable-scrollable-horizontal .p-treetable-tfoot > tr > td {\n        flex: 0 0 auto;\n    }\n\n    .p-treetable-flex-scrollable {\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n    }\n\n    .p-treetable-flex-scrollable .p-treetable-wrapper {\n        display: flex;\n        flex-direction: column;\n        flex: 1;\n        height: 100%;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
@@ -6451,7 +6354,6 @@ this.primevue.treetable.style = (function (BaseStyle) {
     };
     var TreeTableStyle = BaseStyle__default["default"].extend({
       name: 'treetable',
-      css: css,
       classes: classes
     });
 
@@ -6468,14 +6370,15 @@ this.primevue.tristatecheckbox.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\n    .p-checkbox {\n        position: relative;\n        display: inline-flex;\n        user-select: none;\n        vertical-align: bottom;\n    }\n\n    .p-checkbox-input {\n        cursor: pointer;\n    }\n\n    .p-checkbox-box {\n        display: flex;\n        justify-content: center;\n        align-items: center;\n    }\n}\n";
     var classes = {
       root: function root(_ref) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-tristatecheckbox p-checkbox p-component', {
           'p-highlight': instance.active,
-          'p-disabled': props.disabled
+          'p-disabled': props.disabled,
+          'p-invalid': props.invalid,
+          'p-variant-filled': props.variant === 'filled' || instance.$primevue.config.inputStyle === 'filled'
         }];
       },
       box: 'p-checkbox-box',
@@ -6486,7 +6389,6 @@ this.primevue.tristatecheckbox.style = (function (BaseStyle) {
     };
     var TriStateCheckboxStyle = BaseStyle__default["default"].extend({
       name: 'tristatecheckbox',
-      css: css,
       classes: classes
     });
 
@@ -6563,7 +6465,6 @@ this.primevue.basedirective = (function (BaseStyle, utils, vue) {
             "class": value
           } : value;
         };
-        var datasetPrefix = 'data-pc-';
         var _ref2 = ((_instance$binding = instance.binding) === null || _instance$binding === void 0 || (_instance$binding = _instance$binding.value) === null || _instance$binding === void 0 ? void 0 : _instance$binding.ptOptions) || ((_instance$$config = instance.$config) === null || _instance$$config === void 0 ? void 0 : _instance$$config.ptOptions) || {},
           _ref2$mergeSections = _ref2.mergeSections,
           mergeSections = _ref2$mergeSections === void 0 ? true : _ref2$mergeSections,
@@ -6573,8 +6474,14 @@ this.primevue.basedirective = (function (BaseStyle, utils, vue) {
         var self = BaseDirective._usePT(instance, BaseDirective._getPT(obj, instance.$name), getValue, key, _objectSpread(_objectSpread({}, params), {}, {
           global: global || {}
         }));
-        var datasets = _objectSpread(_objectSpread({}, key === 'root' && _defineProperty({}, "".concat(datasetPrefix, "name"), utils.ObjectUtils.toFlatCase(instance.$name))), {}, _defineProperty({}, "".concat(datasetPrefix, "section"), utils.ObjectUtils.toFlatCase(key)));
-        return mergeSections || !mergeSections && self ? useMergeProps ? vue.mergeProps(global, self, datasets) : _objectSpread(_objectSpread(_objectSpread({}, global), self), datasets) : _objectSpread(_objectSpread({}, self), datasets);
+        var datasets = BaseDirective._getPTDatasets(instance, key);
+        return mergeSections || !mergeSections && self ? useMergeProps ? BaseDirective._mergeProps(instance, useMergeProps, global, self, datasets) : _objectSpread(_objectSpread(_objectSpread({}, global), self), datasets) : _objectSpread(_objectSpread({}, self), datasets);
+      },
+      _getPTDatasets: function _getPTDatasets() {
+        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(_objectSpread({}, key === 'root' && _defineProperty({}, "".concat(datasetPrefix, "name"), utils.ObjectUtils.toFlatCase(instance.$name))), {}, _defineProperty({}, "".concat(datasetPrefix, "section"), utils.ObjectUtils.toFlatCase(key)));
       },
       _getPT: function _getPT(pt) {
         var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -6610,7 +6517,7 @@ this.primevue.basedirective = (function (BaseStyle, utils, vue) {
           var originalValue = fn(pt.originalValue);
           var value = fn(pt.value);
           if (originalValue === undefined && value === undefined) return undefined;else if (utils.ObjectUtils.isString(value)) return value;else if (utils.ObjectUtils.isString(originalValue)) return originalValue;
-          return mergeSections || !mergeSections && value ? useMergeProps ? vue.mergeProps(originalValue, value) : _objectSpread(_objectSpread({}, originalValue), value) : value;
+          return mergeSections || !mergeSections && value ? useMergeProps ? BaseDirective._mergeProps(instance, useMergeProps, originalValue, value) : _objectSpread(_objectSpread({}, originalValue), value) : value;
         }
         return fn(pt);
       },
@@ -6638,6 +6545,13 @@ this.primevue.basedirective = (function (BaseStyle, utils, vue) {
         selfHook === null || selfHook === void 0 || selfHook(instance, options);
         defaultHook === null || defaultHook === void 0 || defaultHook(instance, options);
       },
+      _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];
+        }
+        return utils.ObjectUtils.isFunction(fn) ? fn.apply(void 0, args) : vue.mergeProps.apply(void 0, args);
+      },
       _extend: function _extend(name) {
         var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
         var handleHook = function handleHook(hook, el, binding, vnode, prevVnode) {
@@ -6932,12 +6846,8 @@ this.primevue.basecomponent = (function (BaseStyle, utils, vue, usestyle) {
     function _defineProperty$1(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
     function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : String(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 || "default"); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-    var buttonCSS = "\n.p-button {\n    display: inline-flex;\n    cursor: pointer;\n    user-select: none;\n    align-items: center;\n    vertical-align: bottom;\n    text-align: center;\n    overflow: hidden;\n    position: relative;\n}\n\n.p-button-label {\n    flex: 1 1 auto;\n}\n\n.p-button-icon-right {\n    order: 1;\n}\n\n.p-button:disabled {\n    cursor: default;\n}\n\n.p-button-icon-only {\n    justify-content: center;\n}\n\n.p-button-icon-only .p-button-label {\n    visibility: hidden;\n    width: 0;\n    flex: 0 0 auto;\n}\n\n.p-button-vertical {\n    flex-direction: column;\n}\n\n.p-button-icon-bottom {\n    order: 2;\n}\n\n.p-buttonset .p-button {\n    margin: 0;\n}\n\n.p-buttonset .p-button:not(:last-child), .p-buttonset .p-button:not(:last-child):hover {\n    border-right: 0 none;\n}\n\n.p-buttonset .p-button:not(:first-of-type):not(:last-of-type) {\n    border-radius: 0;\n}\n\n.p-buttonset .p-button:first-of-type:not(:only-of-type) {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n\n.p-buttonset .p-button:last-of-type:not(:only-of-type) {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n\n.p-buttonset .p-button:focus {\n    position: relative;\n    z-index: 1;\n}\n";
-    var inputTextCSS = "\n.p-fluid .p-inputtext {\n    width: 100%;\n}\n\n/* InputGroup */\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup-addon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-inputgroup .p-float-label {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-fluid .p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-fluid .p-inputgroup .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n/* Floating Label */\n.p-float-label {\n    display: block;\n    position: relative;\n}\n\n.p-float-label label {\n    position: absolute;\n    pointer-events: none;\n    top: 50%;\n    margin-top: -.5rem;\n    transition-property: all;\n    transition-timing-function: ease;\n    line-height: 1;\n}\n\n.p-float-label textarea ~ label {\n    top: 1rem;\n}\n\n.p-float-label input:focus ~ label,\n.p-float-label input.p-filled ~ label,\n.p-float-label input:-webkit-autofill ~ label,\n.p-float-label textarea:focus ~ label,\n.p-float-label textarea.p-filled ~ label,\n.p-float-label .p-inputwrapper-focus ~ label,\n.p-float-label .p-inputwrapper-filled ~ label {\n    top: -.75rem;\n    font-size: 12px;\n}\n\n\n.p-float-label .p-placeholder,\n.p-float-label input::placeholder,\n.p-float-label .p-inputtext::placeholder {\n    opacity: 0;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-float-label .p-focus .p-placeholder,\n.p-float-label input:focus::placeholder,\n.p-float-label .p-inputtext:focus::placeholder {\n    opacity: 1;\n    transition-property: all;\n    transition-timing-function: ease;\n}\n\n.p-input-icon-left,\n.p-input-icon-right {\n    position: relative;\n    display: inline-block;\n}\n\n.p-input-icon-left > i,\n.p-input-icon-left > svg,\n.p-input-icon-right > i,\n.p-input-icon-right > svg {\n    position: absolute;\n    top: 50%;\n    margin-top: -.5rem;\n}\n\n.p-fluid .p-input-icon-left,\n.p-fluid .p-input-icon-right {\n    display: block;\n    width: 100%;\n}\n";
-    var css = "\n@layer primevue {\n.p-component, .p-component * {\n    box-sizing: border-box;\n}\n\n.p-hidden-space {\n    visibility: hidden;\n}\n\n.p-reset {\n    margin: 0;\n    padding: 0;\n    border: 0;\n    outline: 0;\n    text-decoration: none;\n    font-size: 100%;\n    list-style: none;\n}\n\n.p-disabled, .p-disabled * {\n    cursor: default;\n    pointer-events: none;\n    user-select: none;\n}\n\n.p-component-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n\n.p-unselectable-text {\n    user-select: none;\n}\n\n.p-sr-only {\n    border: 0;\n    clip: rect(1px, 1px, 1px, 1px);\n    clip-path: inset(50%);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n    word-wrap: normal;\n}\n\n.p-link {\n\ttext-align: left;\n\tbackground-color: transparent;\n\tmargin: 0;\n\tpadding: 0;\n\tborder: none;\n    cursor: pointer;\n    user-select: none;\n}\n\n.p-link:disabled {\n\tcursor: default;\n}\n\n/* Non vue overlay animations */\n.p-connected-overlay {\n    opacity: 0;\n    transform: scaleY(0.8);\n    transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.p-connected-overlay-visible {\n    opacity: 1;\n    transform: scaleY(1);\n}\n\n.p-connected-overlay-hidden {\n    opacity: 0;\n    transform: scaleY(1);\n    transition: opacity .1s linear;\n}\n\n/* Vue based overlay animations */\n.p-connected-overlay-enter-from {\n    opacity: 0;\n    transform: scaleY(0.8);\n}\n\n.p-connected-overlay-leave-to {\n    opacity: 0;\n}\n\n.p-connected-overlay-enter-active {\n    transition: transform .12s cubic-bezier(0, 0, 0.2, 1), opacity .12s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.p-connected-overlay-leave-active {\n    transition: opacity .1s linear;\n}\n\n/* Toggleable Content */\n.p-toggleable-content-enter-from,\n.p-toggleable-content-leave-to {\n    max-height: 0;\n}\n\n.p-toggleable-content-enter-to,\n.p-toggleable-content-leave-from {\n    max-height: 1000px;\n}\n\n.p-toggleable-content-leave-active {\n    overflow: hidden;\n    transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);\n}\n\n.p-toggleable-content-enter-active {\n    overflow: hidden;\n    transition: max-height 1s ease-in-out;\n}\n".concat(buttonCSS, "\n").concat(inputTextCSS, "\n}\n");
     var BaseComponentStyle = BaseStyle__default["default"].extend({
       name: 'common',
-      css: css,
       loadGlobalStyle: function loadGlobalStyle(globalCSS) {
         var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
         return usestyle.useStyle(globalCSS, _objectSpread$1({
@@ -7035,6 +6945,12 @@ this.primevue.basecomponent = (function (BaseStyle, utils, vue, usestyle) {
             defaultHook === null || defaultHook === void 0 || defaultHook();
           }
         },
+        _mergeProps: function _mergeProps(fn) {
+          for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key2 = 1; _key2 < _len; _key2++) {
+            args[_key2 - 1] = arguments[_key2];
+          }
+          return utils.ObjectUtils.isFunction(fn) ? fn.apply(void 0, args) : vue.mergeProps.apply(void 0, args);
+        },
         _loadGlobalStyles: function _loadGlobalStyles() {
           var _this$$config5;
           /*
@@ -7074,7 +6990,6 @@ this.primevue.basecomponent = (function (BaseStyle, utils, vue, usestyle) {
           var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
           var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
           var searchInDefaultPT = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
-          var datasetPrefix = 'data-pc-';
           var searchOut = /./g.test(key) && !!params[key.split('.')[0]];
           var _ref3 = this._getPropValue('ptOptions') || ((_this$$config6 = this.$config) === null || _this$$config6 === void 0 ? void 0 : _this$$config6.ptOptions) || {},
             _ref3$mergeSections = _ref3.mergeSections,
@@ -7085,8 +7000,15 @@ this.primevue.basecomponent = (function (BaseStyle, utils, vue, usestyle) {
           var self = searchOut ? undefined : this._usePT(this._getPT(obj, this.$name), this._getPTClassValue, key, _objectSpread(_objectSpread({}, params), {}, {
             global: global || {}
           }));
-          var datasets = key !== 'transition' && _objectSpread(_objectSpread({}, key === 'root' && _defineProperty({}, "".concat(datasetPrefix, "name"), utils.ObjectUtils.toFlatCase(this.$.type.name))), {}, _defineProperty({}, "".concat(datasetPrefix, "section"), utils.ObjectUtils.toFlatCase(key)));
-          return mergeSections || !mergeSections && self ? useMergeProps ? vue.mergeProps(global, self, datasets) : _objectSpread(_objectSpread(_objectSpread({}, global), self), datasets) : _objectSpread(_objectSpread({}, self), datasets);
+          var datasets = this._getPTDatasets(key);
+          return mergeSections || !mergeSections && self ? useMergeProps ? this._mergeProps(useMergeProps, global, self, datasets) : _objectSpread(_objectSpread(_objectSpread({}, global), self), datasets) : _objectSpread(_objectSpread({}, self), datasets);
+        },
+        _getPTDatasets: function _getPTDatasets() {
+          var _this$pt4, _this$pt5;
+          var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+          var datasetPrefix = 'data-pc-';
+          var isExtended = key === 'root' && utils.ObjectUtils.isNotEmpty((_this$pt4 = this.pt) === null || _this$pt4 === void 0 ? void 0 : _this$pt4['data-pc-section']);
+          return key !== 'transition' && _objectSpread(_objectSpread({}, key === 'root' && _objectSpread(_defineProperty({}, "".concat(datasetPrefix, "name"), utils.ObjectUtils.toFlatCase(isExtended ? (_this$pt5 = this.pt) === null || _this$pt5 === void 0 ? void 0 : _this$pt5['data-pc-section'] : this.$.type.name)), isExtended && _defineProperty({}, "".concat(datasetPrefix, "extend"), utils.ObjectUtils.toFlatCase(this.$.type.name)))), {}, _defineProperty({}, "".concat(datasetPrefix, "section"), utils.ObjectUtils.toFlatCase(key)));
         },
         _getPTClassValue: function _getPTClassValue() {
           var value = this._getOptionValue.apply(this, arguments);
@@ -7126,7 +7048,7 @@ this.primevue.basecomponent = (function (BaseStyle, utils, vue, usestyle) {
             var originalValue = fn(pt.originalValue);
             var value = fn(pt.value);
             if (originalValue === undefined && value === undefined) return undefined;else if (utils.ObjectUtils.isString(value)) return value;else if (utils.ObjectUtils.isString(originalValue)) return originalValue;
-            return mergeSections || !mergeSections && value ? useMergeProps ? vue.mergeProps(originalValue, value) : _objectSpread(_objectSpread({}, originalValue), value) : value;
+            return mergeSections || !mergeSections && value ? useMergeProps ? this._mergeProps(useMergeProps, originalValue, value) : _objectSpread(_objectSpread({}, originalValue), value) : value;
           }
           return fn(pt);
         },
@@ -7268,11 +7190,6 @@ this.primevue.baseicon = (function (BaseComponent, BaseIconStyle, utils) {
             'aria-hidden': isLabelEmpty
           });
         }
-      },
-      computed: {
-        pathId: function pathId() {
-          return utils.UniqueComponentId('pv_icon_clip_pv_id_');
-        }
       }
     };
 
@@ -7582,21 +7499,13 @@ this.primevue.icons.arrowdown = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.99994 14C6.91097 14.0004 6.82281 13.983 6.74064 13.9489C6.65843 13.9148 6.58387 13.8646 6.52133 13.8013L1.10198 8.38193C0.982318 8.25351 0.917175 8.08367 0.920272 7.90817C0.923368 7.73267 0.994462 7.56523 1.11858 7.44111C1.24269 7.317 1.41014 7.2459 1.58563 7.2428C1.76113 7.23971 1.93098 7.30485 2.0594 7.42451L6.32263 11.6877V0.677419C6.32263 0.497756 6.394 0.325452 6.52104 0.198411C6.64808 0.0713706 6.82039 0 7.00005 0C7.17971 0 7.35202 0.0713706 7.47906 0.198411C7.6061 0.325452 7.67747 0.497756 7.67747 0.677419V11.6877L11.9407 7.42451C12.0691 7.30485 12.2389 7.23971 12.4144 7.2428C12.5899 7.2459 12.7574 7.317 12.8815 7.44111C13.0056 7.56523 13.0767 7.73267 13.0798 7.90817C13.0829 8.08367 13.0178 8.25351 12.8981 8.38193L7.47875 13.8013C7.41621 13.8646 7.34164 13.9148 7.25944 13.9489C7.17727 13.983 7.08912 14.0004 7.00015 14C7.00012 14 7.00009 14 7.00005 14C7.00001 14 6.99998 14 6.99994 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -7604,11 +7513,7 @@ this.primevue.icons.arrowdown = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -7631,21 +7536,13 @@ this.primevue.icons.arrowup = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.51551 13.799C6.64205 13.9255 6.813 13.9977 6.99193 14C7.17087 13.9977 7.34182 13.9255 7.46835 13.799C7.59489 13.6725 7.66701 13.5015 7.66935 13.3226V2.31233L11.9326 6.57554C11.9951 6.63887 12.0697 6.68907 12.1519 6.72319C12.2341 6.75731 12.3223 6.77467 12.4113 6.77425C12.5003 6.77467 12.5885 6.75731 12.6707 6.72319C12.7529 6.68907 12.8274 6.63887 12.89 6.57554C13.0168 6.44853 13.0881 6.27635 13.0881 6.09683C13.0881 5.91732 13.0168 5.74514 12.89 5.61812L7.48846 0.216594C7.48274 0.210436 7.4769 0.204374 7.47094 0.198411C7.3439 0.0713707 7.1716 0 6.99193 0C6.81227 0 6.63997 0.0713707 6.51293 0.198411C6.50704 0.204296 6.50128 0.210278 6.49563 0.216354L1.09386 5.61812C0.974201 5.74654 0.909057 5.91639 0.912154 6.09189C0.91525 6.26738 0.986345 6.43483 1.11046 6.55894C1.23457 6.68306 1.40202 6.75415 1.57752 6.75725C1.75302 6.76035 1.92286 6.6952 2.05128 6.57554L6.31451 2.31231V13.3226C6.31685 13.5015 6.38898 13.6725 6.51551 13.799Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -7653,11 +7550,7 @@ this.primevue.icons.arrowup = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -7680,19 +7573,11 @@ this.primevue.icons.ban = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M7 0C5.61553 0 4.26215 0.410543 3.11101 1.17971C1.95987 1.94888 1.06266 3.04213 0.532846 4.32122C0.00303296 5.6003 -0.13559 7.00776 0.134506 8.36563C0.404603 9.7235 1.07129 10.9708 2.05026 11.9497C3.02922 12.9287 4.2765 13.5954 5.63437 13.8655C6.99224 14.1356 8.3997 13.997 9.67879 13.4672C10.9579 12.9373 12.0511 12.0401 12.8203 10.889C13.5895 9.73785 14 8.38447 14 7C14 5.14348 13.2625 3.36301 11.9497 2.05025C10.637 0.737498 8.85652 0 7 0ZM1.16667 7C1.16549 5.65478 1.63303 4.35118 2.48889 3.31333L10.6867 11.5111C9.83309 12.2112 8.79816 12.6544 7.70243 12.789C6.60669 12.9236 5.49527 12.744 4.49764 12.2713C3.50001 11.7986 2.65724 11.0521 2.06751 10.1188C1.47778 9.18558 1.16537 8.10397 1.16667 7ZM11.5111 10.6867L3.31334 2.48889C4.43144 1.57388 5.84966 1.10701 7.29265 1.1789C8.73565 1.2508 10.1004 1.85633 11.1221 2.87795C12.1437 3.89956 12.7492 5.26435 12.8211 6.70735C12.893 8.15034 12.4261 9.56856 11.5111 10.6867Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -7700,11 +7585,7 @@ this.primevue.icons.ban = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8011,27 +7892,19 @@ this.primevue.icons.exclamationtriangle = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M13.4018 13.1893H0.598161C0.49329 13.189 0.390283 13.1615 0.299143 13.1097C0.208003 13.0578 0.131826 12.9832 0.0780112 12.8932C0.0268539 12.8015 0 12.6982 0 12.5931C0 12.4881 0.0268539 12.3848 0.0780112 12.293L6.47985 1.08982C6.53679 1.00399 6.61408 0.933574 6.70484 0.884867C6.7956 0.836159 6.897 0.810669 7 0.810669C7.103 0.810669 7.2044 0.836159 7.29516 0.884867C7.38592 0.933574 7.46321 1.00399 7.52015 1.08982L13.922 12.293C13.9731 12.3848 14 12.4881 14 12.5931C14 12.6982 13.9731 12.8015 13.922 12.8932C13.8682 12.9832 13.792 13.0578 13.7009 13.1097C13.6097 13.1615 13.5067 13.189 13.4018 13.1893ZM1.63046 11.989H12.3695L7 2.59425L1.63046 11.989Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M6.99996 8.78801C6.84143 8.78594 6.68997 8.72204 6.57787 8.60993C6.46576 8.49782 6.40186 8.34637 6.39979 8.18784V5.38703C6.39979 5.22786 6.46302 5.0752 6.57557 4.96265C6.68813 4.85009 6.84078 4.78686 6.99996 4.78686C7.15914 4.78686 7.31179 4.85009 7.42435 4.96265C7.5369 5.0752 7.60013 5.22786 7.60013 5.38703V8.18784C7.59806 8.34637 7.53416 8.49782 7.42205 8.60993C7.30995 8.72204 7.15849 8.78594 6.99996 8.78801Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_4 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M6.99996 11.1887C6.84143 11.1866 6.68997 11.1227 6.57787 11.0106C6.46576 10.8985 6.40186 10.7471 6.39979 10.5885V10.1884C6.39979 10.0292 6.46302 9.87658 6.57557 9.76403C6.68813 9.65147 6.84078 9.58824 6.99996 9.58824C7.15914 9.58824 7.31179 9.65147 7.42435 9.76403C7.5369 9.87658 7.60013 10.0292 7.60013 10.1884V10.5885C7.59806 10.7471 7.53416 10.8985 7.42205 11.0106C7.30995 11.1227 7.15849 11.1866 6.99996 11.1887Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_5 = [_hoisted_2, _hoisted_3, _hoisted_4];
-    var _hoisted_6 = ["id"];
-    var _hoisted_7 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_8 = [_hoisted_7];
+    var _hoisted_4 = [_hoisted_1, _hoisted_2, _hoisted_3];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8039,11 +7912,7 @@ this.primevue.icons.exclamationtriangle = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_5, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_8, 8, _hoisted_6)])], 16);
+      }, _ctx.pti()), _hoisted_4, 16);
     }
 
     script.render = render;
@@ -8103,21 +7972,13 @@ this.primevue.icons.eyeslash = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M13.9414 6.74792C13.9437 6.75295 13.9455 6.757 13.9469 6.76003C13.982 6.8394 14.0001 6.9252 14.0001 7.01195C14.0001 7.0987 13.982 7.1845 13.9469 7.26386C13.6004 8.00059 13.1711 8.69549 12.6674 9.33515C12.6115 9.4071 12.54 9.46538 12.4582 9.50556C12.3765 9.54574 12.2866 9.56678 12.1955 9.56707C12.0834 9.56671 11.9737 9.53496 11.8788 9.47541C11.7838 9.41586 11.7074 9.3309 11.6583 9.23015C11.6092 9.12941 11.5893 9.01691 11.6008 8.90543C11.6124 8.79394 11.6549 8.68793 11.7237 8.5994C12.1065 8.09726 12.4437 7.56199 12.7313 6.99995C12.2595 6.08027 10.3402 2.8014 6.99732 2.8014C6.63723 2.80218 6.27816 2.83969 5.92569 2.91336C5.77666 2.93304 5.62568 2.89606 5.50263 2.80972C5.37958 2.72337 5.29344 2.59398 5.26125 2.44714C5.22907 2.30031 5.2532 2.14674 5.32885 2.01685C5.40451 1.88696 5.52618 1.79021 5.66978 1.74576C6.10574 1.64961 6.55089 1.60134 6.99732 1.60181C11.5916 1.60181 13.7864 6.40856 13.9414 6.74792ZM2.20333 1.61685C2.35871 1.61411 2.5091 1.67179 2.6228 1.77774L12.2195 11.3744C12.3318 11.4869 12.3949 11.6393 12.3949 11.7983C12.3949 11.9572 12.3318 12.1097 12.2195 12.2221C12.107 12.3345 11.9546 12.3976 11.7956 12.3976C11.6367 12.3976 11.4842 12.3345 11.3718 12.2221L10.5081 11.3584C9.46549 12.0426 8.24432 12.4042 6.99729 12.3981C2.403 12.3981 0.208197 7.59135 0.0532336 7.25198C0.0509364 7.24694 0.0490875 7.2429 0.0476856 7.23986C0.0162332 7.16518 3.05176e-05 7.08497 3.05176e-05 7.00394C3.05176e-05 6.92291 0.0162332 6.8427 0.0476856 6.76802C0.631261 5.47831 1.46902 4.31959 2.51084 3.36119L1.77509 2.62545C1.66914 2.51175 1.61146 2.36136 1.61421 2.20597C1.61695 2.05059 1.6799 1.90233 1.78979 1.79244C1.89968 1.68254 2.04794 1.6196 2.20333 1.61685ZM7.45314 8.35147L5.68574 6.57609V6.5361C5.5872 6.78938 5.56498 7.06597 5.62183 7.33173C5.67868 7.59749 5.8121 7.84078 6.00563 8.03158C6.19567 8.21043 6.43052 8.33458 6.68533 8.39089C6.94014 8.44721 7.20543 8.43359 7.45314 8.35147ZM1.26327 6.99994C1.7351 7.91163 3.64645 11.1985 6.99729 11.1985C7.9267 11.2048 8.8408 10.9618 9.64438 10.4947L8.35682 9.20718C7.86027 9.51441 7.27449 9.64491 6.69448 9.57752C6.11446 9.51014 5.57421 9.24881 5.16131 8.83592C4.74842 8.42303 4.4871 7.88277 4.41971 7.30276C4.35232 6.72274 4.48282 6.13697 4.79005 5.64041L3.35855 4.2089C2.4954 5.00336 1.78523 5.94935 1.26327 6.99994Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8125,11 +7986,7 @@ this.primevue.icons.eyeslash = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8152,19 +8009,11 @@ this.primevue.icons.filter = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M8.64708 14H5.35296C5.18981 13.9979 5.03395 13.9321 4.91858 13.8167C4.8032 13.7014 4.73745 13.5455 4.73531 13.3824V7L0.329431 0.98C0.259794 0.889466 0.217389 0.780968 0.20718 0.667208C0.19697 0.553448 0.219379 0.439133 0.271783 0.337647C0.324282 0.236453 0.403423 0.151519 0.500663 0.0920138C0.597903 0.0325088 0.709548 0.000692754 0.823548 0H13.1765C13.2905 0.000692754 13.4021 0.0325088 13.4994 0.0920138C13.5966 0.151519 13.6758 0.236453 13.7283 0.337647C13.7807 0.439133 13.8031 0.553448 13.7929 0.667208C13.7826 0.780968 13.7402 0.889466 13.6706 0.98L9.26472 7V13.3824C9.26259 13.5455 9.19683 13.7014 9.08146 13.8167C8.96609 13.9321 8.81022 13.9979 8.64708 14ZM5.97061 12.7647H8.02943V6.79412C8.02878 6.66289 8.07229 6.53527 8.15296 6.43177L11.9412 1.23529H2.05884L5.86355 6.43177C5.94422 6.53527 5.98773 6.66289 5.98708 6.79412L5.97061 12.7647Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8172,11 +8021,7 @@ this.primevue.icons.filter = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8199,21 +8044,13 @@ this.primevue.icons.filterslash = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M13.4994 0.0920138C13.5967 0.151519 13.6758 0.236453 13.7283 0.337647C13.7807 0.439133 13.8031 0.553448 13.7929 0.667208C13.7827 0.780968 13.7403 0.889466 13.6707 0.98L11.406 4.06823C11.3099 4.19928 11.1656 4.28679 11.005 4.3115C10.8444 4.33621 10.6805 4.2961 10.5495 4.2C10.4184 4.1039 10.3309 3.95967 10.3062 3.79905C10.2815 3.63843 10.3216 3.47458 10.4177 3.34353L11.9412 1.23529H7.41184C7.24803 1.23529 7.09093 1.17022 6.97509 1.05439C6.85926 0.938558 6.79419 0.781457 6.79419 0.617647C6.79419 0.453837 6.85926 0.296736 6.97509 0.180905C7.09093 0.0650733 7.24803 0 7.41184 0H13.1765C13.2905 0.000692754 13.4022 0.0325088 13.4994 0.0920138ZM4.20008 0.181168H4.24126L13.2013 9.03411C13.3169 9.14992 13.3819 9.3069 13.3819 9.47058C13.3819 9.63426 13.3169 9.79124 13.2013 9.90705C13.1445 9.96517 13.0766 10.0112 13.0016 10.0423C12.9266 10.0735 12.846 10.0891 12.7648 10.0882C12.6836 10.0886 12.6032 10.0728 12.5283 10.0417C12.4533 10.0106 12.3853 9.96479 12.3283 9.90705L9.3142 6.92587L9.26479 6.99999V13.3823C9.26265 13.5455 9.19689 13.7014 9.08152 13.8167C8.96615 13.9321 8.81029 13.9979 8.64714 14H5.35302C5.18987 13.9979 5.03401 13.9321 4.91864 13.8167C4.80327 13.7014 4.73751 13.5455 4.73537 13.3823V6.99999L0.329492 1.02117C0.259855 0.930634 0.21745 0.822137 0.207241 0.708376C0.197031 0.594616 0.21944 0.480301 0.271844 0.378815C0.324343 0.277621 0.403484 0.192687 0.500724 0.133182C0.597964 0.073677 0.709609 0.041861 0.823609 0.0411682H3.86243C3.92448 0.0461551 3.9855 0.060022 4.04361 0.0823446C4.10037 0.10735 4.15311 0.140655 4.20008 0.181168ZM8.02949 6.79411C8.02884 6.66289 8.07235 6.53526 8.15302 6.43176L8.42478 6.05293L3.55773 1.23529H2.0589L5.84714 6.43176C5.92781 6.53526 5.97132 6.66289 5.97067 6.79411V12.7647H8.02949V6.79411Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8221,11 +8058,7 @@ this.primevue.icons.filterslash = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8248,21 +8081,13 @@ this.primevue.icons.infocircle = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M3.11101 12.8203C4.26215 13.5895 5.61553 14 7 14C8.85652 14 10.637 13.2625 11.9497 11.9497C13.2625 10.637 14 8.85652 14 7C14 5.61553 13.5895 4.26215 12.8203 3.11101C12.0511 1.95987 10.9579 1.06266 9.67879 0.532846C8.3997 0.00303296 6.99224 -0.13559 5.63437 0.134506C4.2765 0.404603 3.02922 1.07129 2.05026 2.05026C1.07129 3.02922 0.404603 4.2765 0.134506 5.63437C-0.13559 6.99224 0.00303296 8.3997 0.532846 9.67879C1.06266 10.9579 1.95987 12.0511 3.11101 12.8203ZM3.75918 2.14976C4.71846 1.50879 5.84628 1.16667 7 1.16667C8.5471 1.16667 10.0308 1.78125 11.1248 2.87521C12.2188 3.96918 12.8333 5.45291 12.8333 7C12.8333 8.15373 12.4912 9.28154 11.8502 10.2408C11.2093 11.2001 10.2982 11.9478 9.23232 12.3893C8.16642 12.8308 6.99353 12.9463 5.86198 12.7212C4.73042 12.4962 3.69102 11.9406 2.87521 11.1248C2.05941 10.309 1.50384 9.26958 1.27876 8.13803C1.05367 7.00647 1.16919 5.83358 1.61071 4.76768C2.05222 3.70178 2.79989 2.79074 3.75918 2.14976ZM7.00002 4.8611C6.84594 4.85908 6.69873 4.79698 6.58977 4.68801C6.48081 4.57905 6.4187 4.43185 6.41669 4.27776V3.88888C6.41669 3.73417 6.47815 3.58579 6.58754 3.4764C6.69694 3.367 6.84531 3.30554 7.00002 3.30554C7.15473 3.30554 7.3031 3.367 7.4125 3.4764C7.52189 3.58579 7.58335 3.73417 7.58335 3.88888V4.27776C7.58134 4.43185 7.51923 4.57905 7.41027 4.68801C7.30131 4.79698 7.1541 4.85908 7.00002 4.8611ZM7.00002 10.6945C6.84594 10.6925 6.69873 10.6304 6.58977 10.5214C6.48081 10.4124 6.4187 10.2652 6.41669 10.1111V6.22225C6.41669 6.06754 6.47815 5.91917 6.58754 5.80977C6.69694 5.70037 6.84531 5.63892 7.00002 5.63892C7.15473 5.63892 7.3031 5.70037 7.4125 5.80977C7.52189 5.91917 7.58335 6.06754 7.58335 6.22225V10.1111C7.58134 10.2652 7.51923 10.4124 7.41027 10.5214C7.30131 10.6304 7.1541 10.6925 7.00002 10.6945Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8270,11 +8095,7 @@ this.primevue.icons.infocircle = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8332,19 +8153,11 @@ this.primevue.icons.pencil = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M0.609628 13.959C0.530658 13.9599 0.452305 13.9451 0.379077 13.9156C0.305849 13.8861 0.239191 13.8424 0.18294 13.787C0.118447 13.7234 0.0688234 13.6464 0.0376166 13.5614C0.00640987 13.4765 -0.00560954 13.3857 0.00241768 13.2956L0.25679 10.1501C0.267698 10.0041 0.331934 9.86709 0.437312 9.76516L9.51265 0.705715C10.0183 0.233014 10.6911 -0.0203041 11.3835 0.00127367C12.0714 0.00660201 12.7315 0.27311 13.2298 0.746671C13.7076 1.23651 13.9824 1.88848 13.9992 2.57201C14.0159 3.25554 13.7733 3.92015 13.32 4.4327L4.23648 13.5331C4.13482 13.6342 4.0017 13.6978 3.85903 13.7133L0.667067 14L0.609628 13.959ZM1.43018 10.4696L1.25787 12.714L3.50619 12.5092L12.4502 3.56444C12.6246 3.35841 12.7361 3.10674 12.7714 2.83933C12.8067 2.57193 12.7644 2.30002 12.6495 2.05591C12.5346 1.8118 12.3519 1.60575 12.1231 1.46224C11.8943 1.31873 11.6291 1.2438 11.3589 1.24633C11.1813 1.23508 11.0033 1.25975 10.8355 1.31887C10.6677 1.37798 10.5136 1.47033 10.3824 1.59036L1.43018 10.4696Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8352,11 +8165,7 @@ this.primevue.icons.pencil = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8379,19 +8188,11 @@ this.primevue.icons.plus = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M7.67742 6.32258V0.677419C7.67742 0.497757 7.60605 0.325452 7.47901 0.198411C7.35197 0.0713707 7.17966 0 7 0C6.82034 0 6.64803 0.0713707 6.52099 0.198411C6.39395 0.325452 6.32258 0.497757 6.32258 0.677419V6.32258H0.677419C0.497757 6.32258 0.325452 6.39395 0.198411 6.52099C0.0713707 6.64803 0 6.82034 0 7C0 7.17966 0.0713707 7.35197 0.198411 7.47901C0.325452 7.60605 0.497757 7.67742 0.677419 7.67742H6.32258V13.3226C6.32492 13.5015 6.39704 13.6725 6.52358 13.799C6.65012 13.9255 6.82106 13.9977 7 14C7.17966 14 7.35197 13.9286 7.47901 13.8016C7.60605 13.6745 7.67742 13.5022 7.67742 13.3226V7.67742H13.3226C13.5022 7.67742 13.6745 7.60605 13.8016 7.47901C13.9286 7.35197 14 7.17966 14 7C13.9977 6.82106 13.9255 6.65012 13.799 6.52358C13.6725 6.39704 13.5015 6.32492 13.3226 6.32258H7.67742Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8399,11 +8200,7 @@ this.primevue.icons.plus = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8426,21 +8223,13 @@ this.primevue.icons.refresh = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.77051 5.96336C6.84324 5.99355 6.92127 6.00891 7.00002 6.00854C7.07877 6.00891 7.1568 5.99355 7.22953 5.96336C7.30226 5.93317 7.36823 5.88876 7.42357 5.83273L9.82101 3.43529C9.93325 3.32291 9.99629 3.17058 9.99629 3.01175C9.99629 2.85292 9.93325 2.70058 9.82101 2.5882L7.42357 0.190763C7.3687 0.131876 7.30253 0.0846451 7.22901 0.0518865C7.15549 0.019128 7.07612 0.00151319 6.99564 9.32772e-05C6.91517 -0.00132663 6.83523 0.0134773 6.7606 0.0436218C6.68597 0.0737664 6.61817 0.118634 6.56126 0.175548C6.50435 0.232462 6.45948 0.300257 6.42933 0.374888C6.39919 0.449519 6.38439 0.529456 6.38581 0.609933C6.38722 0.690409 6.40484 0.769775 6.4376 0.843296C6.47036 0.916817 6.51759 0.982986 6.57647 1.03786L7.95103 2.41241H6.99998C5.46337 2.41241 3.98969 3.02283 2.90314 4.10938C1.81659 5.19593 1.20618 6.66961 1.20618 8.20622C1.20618 9.74283 1.81659 11.2165 2.90314 12.3031C3.98969 13.3896 5.46337 14 6.99998 14C8.53595 13.9979 10.0084 13.3868 11.0945 12.3007C12.1806 11.2146 12.7917 9.74218 12.7938 8.20622C12.7938 8.04726 12.7306 7.89481 12.6182 7.78241C12.5058 7.67001 12.3534 7.60686 12.1944 7.60686C12.0355 7.60686 11.883 7.67001 11.7706 7.78241C11.6582 7.89481 11.5951 8.04726 11.5951 8.20622C11.5951 9.11504 11.3256 10.0035 10.8207 10.7591C10.3157 11.5148 9.59809 12.1037 8.75845 12.4515C7.9188 12.7993 6.99489 12.8903 6.10353 12.713C5.21217 12.5357 4.3934 12.0981 3.75077 11.4554C3.10813 10.8128 2.67049 9.99404 2.49319 9.10268C2.31589 8.21132 2.40688 7.2874 2.75468 6.44776C3.10247 5.60811 3.69143 4.89046 4.44709 4.38554C5.20275 3.88063 6.09116 3.61113 6.99998 3.61113H7.95098L6.57647 4.98564C6.46423 5.09802 6.40119 5.25035 6.40119 5.40918C6.40119 5.56801 6.46423 5.72035 6.57647 5.83273C6.63181 5.88876 6.69778 5.93317 6.77051 5.96336Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8448,11 +8237,7 @@ this.primevue.icons.refresh = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8475,21 +8260,13 @@ this.primevue.icons.search = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M2.67602 11.0265C3.6661 11.688 4.83011 12.0411 6.02086 12.0411C6.81149 12.0411 7.59438 11.8854 8.32483 11.5828C8.87005 11.357 9.37808 11.0526 9.83317 10.6803L12.9769 13.8241C13.0323 13.8801 13.0983 13.9245 13.171 13.9548C13.2438 13.985 13.3219 14.0003 13.4007 14C13.4795 14.0003 13.5575 13.985 13.6303 13.9548C13.7031 13.9245 13.7691 13.8801 13.8244 13.8241C13.9367 13.7116 13.9998 13.5592 13.9998 13.4003C13.9998 13.2414 13.9367 13.089 13.8244 12.9765L10.6807 9.8328C11.053 9.37773 11.3573 8.86972 11.5831 8.32452C11.8857 7.59408 12.0414 6.81119 12.0414 6.02056C12.0414 4.8298 11.6883 3.66579 11.0268 2.67572C10.3652 1.68564 9.42494 0.913972 8.32483 0.45829C7.22472 0.00260857 6.01418 -0.116618 4.84631 0.115686C3.67844 0.34799 2.60568 0.921393 1.76369 1.76338C0.921698 2.60537 0.348296 3.67813 0.115991 4.84601C-0.116313 6.01388 0.00291375 7.22441 0.458595 8.32452C0.914277 9.42464 1.68595 10.3649 2.67602 11.0265ZM3.35565 2.0158C4.14456 1.48867 5.07206 1.20731 6.02086 1.20731C7.29317 1.20731 8.51338 1.71274 9.41304 2.6124C10.3127 3.51206 10.8181 4.73226 10.8181 6.00457C10.8181 6.95337 10.5368 7.88088 10.0096 8.66978C9.48251 9.45868 8.73328 10.0736 7.85669 10.4367C6.98011 10.7997 6.01554 10.8947 5.08496 10.7096C4.15439 10.5245 3.2996 10.0676 2.62869 9.39674C1.95778 8.72583 1.50089 7.87104 1.31579 6.94046C1.13068 6.00989 1.22568 5.04532 1.58878 4.16874C1.95187 3.29215 2.56675 2.54292 3.35565 2.0158Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8497,11 +8274,7 @@ this.primevue.icons.search = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8524,21 +8297,13 @@ this.primevue.icons.searchminus = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.0208 12.0411C4.83005 12.0411 3.66604 11.688 2.67596 11.0265C1.68589 10.3649 0.914216 9.42464 0.458534 8.32452C0.00285271 7.22441 -0.116374 6.01388 0.11593 4.84601C0.348235 3.67813 0.921637 2.60537 1.76363 1.76338C2.60562 0.921393 3.67838 0.34799 4.84625 0.115686C6.01412 -0.116618 7.22466 0.00260857 8.32477 0.45829C9.42488 0.913972 10.3652 1.68564 11.0267 2.67572C11.6883 3.66579 12.0414 4.8298 12.0414 6.02056C12.0395 7.41563 11.5542 8.76029 10.6783 9.8305L13.8244 12.9765C13.9367 13.089 13.9997 13.2414 13.9997 13.4003C13.9997 13.5592 13.9367 13.7116 13.8244 13.8241C13.769 13.8801 13.703 13.9245 13.6302 13.9548C13.5575 13.985 13.4794 14.0003 13.4006 14C13.3218 14.0003 13.2437 13.985 13.171 13.9548C13.0982 13.9245 13.0322 13.8801 12.9768 13.8241L9.83082 10.678C8.76059 11.5539 7.4159 12.0393 6.0208 12.0411ZM6.0208 1.20731C5.07199 1.20731 4.14449 1.48867 3.35559 2.0158C2.56669 2.54292 1.95181 3.29215 1.58872 4.16874C1.22562 5.04532 1.13062 6.00989 1.31572 6.94046C1.50083 7.87104 1.95772 8.72583 2.62863 9.39674C3.29954 10.0676 4.15433 10.5245 5.0849 10.7096C6.01548 10.8947 6.98005 10.7997 7.85663 10.4367C8.73322 10.0736 9.48244 9.45868 10.0096 8.66978C10.5367 7.88088 10.8181 6.95337 10.8181 6.00457C10.8181 4.73226 10.3126 3.51206 9.41297 2.6124C8.51331 1.71274 7.29311 1.20731 6.0208 1.20731ZM4.00591 6.60422H8.00362C8.16266 6.60422 8.31518 6.54104 8.42764 6.42859C8.5401 6.31613 8.60328 6.1636 8.60328 6.00456C8.60328 5.84553 8.5401 5.693 8.42764 5.58054C8.31518 5.46809 8.16266 5.40491 8.00362 5.40491H4.00591C3.84687 5.40491 3.69434 5.46809 3.58189 5.58054C3.46943 5.693 3.40625 5.84553 3.40625 6.00456C3.40625 6.1636 3.46943 6.31613 3.58189 6.42859C3.69434 6.54104 3.84687 6.60422 4.00591 6.60422Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8546,11 +8311,7 @@ this.primevue.icons.searchminus = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8573,21 +8334,13 @@ this.primevue.icons.searchplus = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M2.67596 11.0265C3.66604 11.688 4.83005 12.0411 6.0208 12.0411C6.81143 12.0411 7.59432 11.8854 8.32477 11.5828C8.86999 11.357 9.37802 11.0526 9.83311 10.6803L12.9768 13.8241C13.0322 13.8801 13.0982 13.9245 13.171 13.9548C13.2437 13.985 13.3218 14.0003 13.4006 14C13.4794 14.0003 13.5575 13.985 13.6302 13.9548C13.703 13.9245 13.769 13.8801 13.8244 13.8241C13.9367 13.7116 13.9997 13.5592 13.9997 13.4003C13.9997 13.2414 13.9367 13.089 13.8244 12.9765L10.6806 9.8328C11.0529 9.37773 11.3572 8.86972 11.5831 8.32452C11.8856 7.59408 12.0414 6.81119 12.0414 6.02056C12.0414 4.8298 11.6883 3.66579 11.0267 2.67572C10.3652 1.68564 9.42488 0.913972 8.32477 0.45829C7.22466 0.00260857 6.01412 -0.116618 4.84625 0.115686C3.67838 0.34799 2.60562 0.921393 1.76363 1.76338C0.921637 2.60537 0.348235 3.67813 0.11593 4.84601C-0.116374 6.01388 0.00285271 7.22441 0.458534 8.32452C0.914216 9.42464 1.68589 10.3649 2.67596 11.0265ZM3.35559 2.0158C4.14449 1.48867 5.07199 1.20731 6.0208 1.20731C7.29311 1.20731 8.51331 1.71274 9.41297 2.6124C10.3126 3.51206 10.8181 4.73226 10.8181 6.00457C10.8181 6.95337 10.5367 7.88088 10.0096 8.66978C9.48244 9.45868 8.73322 10.0736 7.85663 10.4367C6.98005 10.7997 6.01548 10.8947 5.0849 10.7096C4.15433 10.5245 3.29954 10.0676 2.62863 9.39674C1.95772 8.72583 1.50083 7.87104 1.31572 6.94046C1.13062 6.00989 1.22562 5.04532 1.58872 4.16874C1.95181 3.29215 2.56669 2.54292 3.35559 2.0158ZM6.00481 8.60309C5.84641 8.60102 5.69509 8.53718 5.58308 8.42517C5.47107 8.31316 5.40722 8.16183 5.40515 8.00344V6.60422H4.00591C3.84687 6.60422 3.69434 6.54104 3.58189 6.42859C3.46943 6.31613 3.40625 6.1636 3.40625 6.00456C3.40625 5.84553 3.46943 5.693 3.58189 5.58054C3.69434 5.46809 3.84687 5.40491 4.00591 5.40491H5.40515V4.00572C5.40515 3.84668 5.46833 3.69416 5.58079 3.5817C5.69324 3.46924 5.84577 3.40607 6.00481 3.40607C6.16385 3.40607 6.31637 3.46924 6.42883 3.5817C6.54129 3.69416 6.60447 3.84668 6.60447 4.00572V5.40491H8.00362C8.16266 5.40491 8.31518 5.46809 8.42764 5.58054C8.5401 5.693 8.60328 5.84553 8.60328 6.00456C8.60328 6.1636 8.5401 6.31613 8.42764 6.42859C8.31518 6.54104 8.16266 6.60422 8.00362 6.60422H6.60447V8.00344C6.60239 8.16183 6.53855 8.31316 6.42654 8.42517C6.31453 8.53718 6.1632 8.60102 6.00481 8.60309Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8595,11 +8348,7 @@ this.primevue.icons.searchplus = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8622,31 +8371,23 @@ this.primevue.icons.sortalt = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M5.64515 3.61291C5.47353 3.61291 5.30192 3.54968 5.16644 3.4142L3.38708 1.63484L1.60773 3.4142C1.34579 3.67613 0.912244 3.67613 0.650309 3.4142C0.388374 3.15226 0.388374 2.71871 0.650309 2.45678L2.90837 0.198712C3.17031 -0.0632236 3.60386 -0.0632236 3.86579 0.198712L6.12386 2.45678C6.38579 2.71871 6.38579 3.15226 6.12386 3.4142C5.98837 3.54968 5.81676 3.61291 5.64515 3.61291Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M3.38714 14C3.01681 14 2.70972 13.6929 2.70972 13.3226V0.677419C2.70972 0.307097 3.01681 0 3.38714 0C3.75746 0 4.06456 0.307097 4.06456 0.677419V13.3226C4.06456 13.6929 3.75746 14 3.38714 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_4 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_3 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M10.6129 14C10.4413 14 10.2697 13.9368 10.1342 13.8013L7.87611 11.5432C7.61418 11.2813 7.61418 10.8477 7.87611 10.5858C8.13805 10.3239 8.5716 10.3239 8.83353 10.5858L10.6129 12.3652L12.3922 10.5858C12.6542 10.3239 13.0877 10.3239 13.3497 10.5858C13.6116 10.8477 13.6116 11.2813 13.3497 11.5432L11.0916 13.8013C10.9561 13.9368 10.7845 14 10.6129 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_4 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M10.6129 14C10.2426 14 9.93552 13.6929 9.93552 13.3226V0.677419C9.93552 0.307097 10.2426 0 10.6129 0C10.9833 0 11.2904 0.307097 11.2904 0.677419V13.3226C11.2904 13.6929 10.9832 14 10.6129 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_6 = [_hoisted_2, _hoisted_3, _hoisted_4, _hoisted_5];
-    var _hoisted_7 = ["id"];
-    var _hoisted_8 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_9 = [_hoisted_8];
+    var _hoisted_5 = [_hoisted_1, _hoisted_2, _hoisted_3, _hoisted_4];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8654,11 +8395,7 @@ this.primevue.icons.sortalt = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_6, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_9, 8, _hoisted_7)])], 16);
+      }, _ctx.pti()), _hoisted_5, 16);
     }
 
     script.render = render;
@@ -8681,19 +8418,11 @@ this.primevue.icons.sortamountdown = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M4.93953 10.5858L3.83759 11.6877V0.677419C3.83759 0.307097 3.53049 0 3.16017 0C2.78985 0 2.48275 0.307097 2.48275 0.677419V11.6877L1.38082 10.5858C1.11888 10.3239 0.685331 10.3239 0.423396 10.5858C0.16146 10.8477 0.16146 11.2813 0.423396 11.5432L2.68146 13.8013C2.74469 13.8645 2.81694 13.9097 2.89823 13.9458C2.97952 13.9819 3.06985 14 3.16017 14C3.25049 14 3.33178 13.9819 3.42211 13.9458C3.5034 13.9097 3.57565 13.8645 3.63888 13.8013L5.89694 11.5432C6.15888 11.2813 6.15888 10.8477 5.89694 10.5858C5.63501 10.3239 5.20146 10.3239 4.93953 10.5858ZM13.0957 0H7.22468C6.85436 0 6.54726 0.307097 6.54726 0.677419C6.54726 1.04774 6.85436 1.35484 7.22468 1.35484H13.0957C13.466 1.35484 13.7731 1.04774 13.7731 0.677419C13.7731 0.307097 13.466 0 13.0957 0ZM7.22468 5.41935H9.48275C9.85307 5.41935 10.1602 5.72645 10.1602 6.09677C10.1602 6.4671 9.85307 6.77419 9.48275 6.77419H7.22468C6.85436 6.77419 6.54726 6.4671 6.54726 6.09677C6.54726 5.72645 6.85436 5.41935 7.22468 5.41935ZM7.6763 8.12903H7.22468C6.85436 8.12903 6.54726 8.43613 6.54726 8.80645C6.54726 9.17677 6.85436 9.48387 7.22468 9.48387H7.6763C8.04662 9.48387 8.35372 9.17677 8.35372 8.80645C8.35372 8.43613 8.04662 8.12903 7.6763 8.12903ZM7.22468 2.70968H11.2892C11.6595 2.70968 11.9666 3.01677 11.9666 3.3871C11.9666 3.75742 11.6595 4.06452 11.2892 4.06452H7.22468C6.85436 4.06452 6.54726 3.75742 6.54726 3.3871C6.54726 3.01677 6.85436 2.70968 7.22468 2.70968Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8701,11 +8430,7 @@ this.primevue.icons.sortamountdown = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8728,19 +8453,11 @@ this.primevue.icons.sortamountupalt = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M3.63435 0.19871C3.57113 0.135484 3.49887 0.0903226 3.41758 0.0541935C3.255 -0.0180645 3.06532 -0.0180645 2.90274 0.0541935C2.82145 0.0903226 2.74919 0.135484 2.68597 0.19871L0.427901 2.45677C0.165965 2.71871 0.165965 3.15226 0.427901 3.41419C0.689836 3.67613 1.12338 3.67613 1.38532 3.41419L2.48726 2.31226V13.3226C2.48726 13.6929 2.79435 14 3.16467 14C3.535 14 3.84209 13.6929 3.84209 13.3226V2.31226L4.94403 3.41419C5.07951 3.54968 5.25113 3.6129 5.42274 3.6129C5.59435 3.6129 5.76597 3.54968 5.90145 3.41419C6.16338 3.15226 6.16338 2.71871 5.90145 2.45677L3.64338 0.19871H3.63435ZM13.7685 13.3226C13.7685 12.9523 13.4615 12.6452 13.0911 12.6452H7.22016C6.84984 12.6452 6.54274 12.9523 6.54274 13.3226C6.54274 13.6929 6.84984 14 7.22016 14H13.0911C13.4615 14 13.7685 13.6929 13.7685 13.3226ZM7.22016 8.58064C6.84984 8.58064 6.54274 8.27355 6.54274 7.90323C6.54274 7.5329 6.84984 7.22581 7.22016 7.22581H9.47823C9.84855 7.22581 10.1556 7.5329 10.1556 7.90323C10.1556 8.27355 9.84855 8.58064 9.47823 8.58064H7.22016ZM7.22016 5.87097H7.67177C8.0421 5.87097 8.34919 5.56387 8.34919 5.19355C8.34919 4.82323 8.0421 4.51613 7.67177 4.51613H7.22016C6.84984 4.51613 6.54274 4.82323 6.54274 5.19355C6.54274 5.56387 6.84984 5.87097 7.22016 5.87097ZM11.2847 11.2903H7.22016C6.84984 11.2903 6.54274 10.9832 6.54274 10.6129C6.54274 10.2426 6.84984 9.93548 7.22016 9.93548H11.2847C11.655 9.93548 11.9621 10.2426 11.9621 10.6129C11.9621 10.9832 11.655 11.2903 11.2847 11.2903Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8748,11 +8465,7 @@ this.primevue.icons.sortamountupalt = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8775,19 +8488,11 @@ this.primevue.icons.spinner = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M6.99701 14C5.85441 13.999 4.72939 13.7186 3.72012 13.1832C2.71084 12.6478 1.84795 11.8737 1.20673 10.9284C0.565504 9.98305 0.165424 8.89526 0.041387 7.75989C-0.0826496 6.62453 0.073125 5.47607 0.495122 4.4147C0.917119 3.35333 1.59252 2.4113 2.46241 1.67077C3.33229 0.930247 4.37024 0.413729 5.4857 0.166275C6.60117 -0.0811796 7.76026 -0.0520535 8.86188 0.251112C9.9635 0.554278 10.9742 1.12227 11.8057 1.90555C11.915 2.01493 11.9764 2.16319 11.9764 2.31778C11.9764 2.47236 11.915 2.62062 11.8057 2.73C11.7521 2.78503 11.688 2.82877 11.6171 2.85864C11.5463 2.8885 11.4702 2.90389 11.3933 2.90389C11.3165 2.90389 11.2404 2.8885 11.1695 2.85864C11.0987 2.82877 11.0346 2.78503 10.9809 2.73C9.9998 1.81273 8.73246 1.26138 7.39226 1.16876C6.05206 1.07615 4.72086 1.44794 3.62279 2.22152C2.52471 2.99511 1.72683 4.12325 1.36345 5.41602C1.00008 6.70879 1.09342 8.08723 1.62775 9.31926C2.16209 10.5513 3.10478 11.5617 4.29713 12.1803C5.48947 12.7989 6.85865 12.988 8.17414 12.7157C9.48963 12.4435 10.6711 11.7264 11.5196 10.6854C12.3681 9.64432 12.8319 8.34282 12.8328 7C12.8328 6.84529 12.8943 6.69692 13.0038 6.58752C13.1132 6.47812 13.2616 6.41667 13.4164 6.41667C13.5712 6.41667 13.7196 6.47812 13.8291 6.58752C13.9385 6.69692 14 6.84529 14 7C14 8.85651 13.2622 10.637 11.9489 11.9497C10.6356 13.2625 8.85432 14 6.99701 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8795,11 +8500,7 @@ this.primevue.icons.spinner = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8822,19 +8523,11 @@ this.primevue.icons.star = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M10.9741 13.6721C10.8806 13.6719 10.7886 13.6483 10.7066 13.6033L7.00002 11.6545L3.29345 13.6033C3.19926 13.6539 3.09281 13.6771 2.98612 13.6703C2.87943 13.6636 2.77676 13.6271 2.6897 13.5651C2.60277 13.5014 2.53529 13.4147 2.4948 13.3148C2.45431 13.215 2.44241 13.1058 2.46042 12.9995L3.17881 8.87264L0.167699 5.95324C0.0922333 5.8777 0.039368 5.78258 0.0150625 5.67861C-0.00924303 5.57463 -0.00402231 5.46594 0.030136 5.36477C0.0621323 5.26323 0.122141 5.17278 0.203259 5.10383C0.284377 5.03488 0.383311 4.99023 0.488681 4.97501L4.63087 4.37126L6.48797 0.618832C6.54083 0.530159 6.61581 0.456732 6.70556 0.405741C6.79532 0.35475 6.89678 0.327942 7.00002 0.327942C7.10325 0.327942 7.20471 0.35475 7.29447 0.405741C7.38422 0.456732 7.4592 0.530159 7.51206 0.618832L9.36916 4.37126L13.5114 4.97501C13.6167 4.99023 13.7157 5.03488 13.7968 5.10383C13.8779 5.17278 13.9379 5.26323 13.9699 5.36477C14.0041 5.46594 14.0093 5.57463 13.985 5.67861C13.9607 5.78258 13.9078 5.8777 13.8323 5.95324L10.8212 8.87264L11.532 12.9995C11.55 13.1058 11.5381 13.215 11.4976 13.3148C11.4571 13.4147 11.3896 13.5014 11.3027 13.5651C11.2059 13.632 11.0917 13.6692 10.9741 13.6721ZM7.00002 10.4393C7.09251 10.4404 7.18371 10.4613 7.2675 10.5005L10.2098 12.029L9.65193 8.75036C9.6368 8.6584 9.64343 8.56418 9.6713 8.47526C9.69918 8.38633 9.74751 8.30518 9.81242 8.23832L12.1969 5.94559L8.90298 5.45648C8.81188 5.44198 8.72555 5.406 8.65113 5.35152C8.57671 5.29703 8.51633 5.2256 8.475 5.14314L7.00002 2.1626L5.52503 5.15078C5.4837 5.23324 5.42332 5.30467 5.3489 5.35916C5.27448 5.41365 5.18815 5.44963 5.09705 5.46412L1.80318 5.94559L4.18761 8.23832C4.25252 8.30518 4.30085 8.38633 4.32873 8.47526C4.3566 8.56418 4.36323 8.6584 4.3481 8.75036L3.7902 12.0519L6.73253 10.5234C6.81451 10.4762 6.9058 10.4475 7.00002 10.4393Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8842,11 +8535,7 @@ this.primevue.icons.star = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8869,19 +8558,11 @@ this.primevue.icons.starfill = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       d: "M13.9718 5.36453C13.9398 5.26298 13.8798 5.17252 13.7986 5.10356C13.7175 5.0346 13.6186 4.98994 13.5132 4.97472L9.37043 4.37088L7.51307 0.617955C7.46021 0.529271 7.38522 0.455834 7.29545 0.404836C7.20568 0.353838 7.1042 0.327026 7.00096 0.327026C6.89771 0.327026 6.79624 0.353838 6.70647 0.404836C6.6167 0.455834 6.54171 0.529271 6.48885 0.617955L4.63149 4.37088L0.488746 4.97472C0.383363 4.98994 0.284416 5.0346 0.203286 5.10356C0.122157 5.17252 0.0621407 5.26298 0.03014 5.36453C-0.00402286 5.46571 -0.00924428 5.57442 0.0150645 5.67841C0.0393733 5.7824 0.0922457 5.87753 0.167722 5.95308L3.17924 8.87287L2.4684 13.0003C2.45038 13.1066 2.46229 13.2158 2.50278 13.3157C2.54328 13.4156 2.61077 13.5022 2.6977 13.5659C2.78477 13.628 2.88746 13.6644 2.99416 13.6712C3.10087 13.678 3.20733 13.6547 3.30153 13.6042L7.00096 11.6551L10.708 13.6042C10.79 13.6491 10.882 13.6728 10.9755 13.673C11.0958 13.6716 11.2129 13.6343 11.3119 13.5659C11.3988 13.5022 11.4663 13.4156 11.5068 13.3157C11.5473 13.2158 11.5592 13.1066 11.5412 13.0003L10.8227 8.87287L13.8266 5.95308C13.9033 5.87835 13.9577 5.7836 13.9833 5.67957C14.009 5.57554 14.005 5.4664 13.9718 5.36453Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8889,11 +8570,7 @@ this.primevue.icons.starfill = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -8916,21 +8593,13 @@ this.primevue.icons.thlarge = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M1.90909 6.36364H4.45455C4.96087 6.36364 5.44645 6.1625 5.80448 5.80448C6.1625 5.44645 6.36364 4.96087 6.36364 4.45455V1.90909C6.36364 1.40277 6.1625 0.917184 5.80448 0.55916C5.44645 0.201136 4.96087 0 4.45455 0H1.90909C1.40277 0 0.917184 0.201136 0.55916 0.55916C0.201136 0.917184 0 1.40277 0 1.90909V4.45455C0 4.96087 0.201136 5.44645 0.55916 5.80448C0.917184 6.1625 1.40277 6.36364 1.90909 6.36364ZM1.46154 1.46154C1.58041 1.34268 1.741 1.27492 1.90909 1.27273H4.45455C4.62264 1.27492 4.78322 1.34268 4.90209 1.46154C5.02096 1.58041 5.08871 1.741 5.09091 1.90909V4.45455C5.08871 4.62264 5.02096 4.78322 4.90209 4.90209C4.78322 5.02096 4.62264 5.08871 4.45455 5.09091H1.90909C1.741 5.08871 1.58041 5.02096 1.46154 4.90209C1.34268 4.78322 1.27492 4.62264 1.27273 4.45455V1.90909C1.27492 1.741 1.34268 1.58041 1.46154 1.46154ZM1.90909 14H4.45455C4.96087 14 5.44645 13.7989 5.80448 13.4408C6.1625 13.0828 6.36364 12.5972 6.36364 12.0909V9.54544C6.36364 9.03912 6.1625 8.55354 5.80448 8.19551C5.44645 7.83749 4.96087 7.63635 4.45455 7.63635H1.90909C1.40277 7.63635 0.917184 7.83749 0.55916 8.19551C0.201136 8.55354 0 9.03912 0 9.54544V12.0909C0 12.5972 0.201136 13.0828 0.55916 13.4408C0.917184 13.7989 1.40277 14 1.90909 14ZM1.46154 9.0979C1.58041 8.97903 1.741 8.91128 1.90909 8.90908H4.45455C4.62264 8.91128 4.78322 8.97903 4.90209 9.0979C5.02096 9.21677 5.08871 9.37735 5.09091 9.54544V12.0909C5.08871 12.259 5.02096 12.4196 4.90209 12.5384C4.78322 12.6573 4.62264 12.7251 4.45455 12.7273H1.90909C1.741 12.7251 1.58041 12.6573 1.46154 12.5384C1.34268 12.4196 1.27492 12.259 1.27273 12.0909V9.54544C1.27492 9.37735 1.34268 9.21677 1.46154 9.0979ZM12.0909 6.36364H9.54544C9.03912 6.36364 8.55354 6.1625 8.19551 5.80448C7.83749 5.44645 7.63635 4.96087 7.63635 4.45455V1.90909C7.63635 1.40277 7.83749 0.917184 8.19551 0.55916C8.55354 0.201136 9.03912 0 9.54544 0H12.0909C12.5972 0 13.0828 0.201136 13.4408 0.55916C13.7989 0.917184 14 1.40277 14 1.90909V4.45455C14 4.96087 13.7989 5.44645 13.4408 5.80448C13.0828 6.1625 12.5972 6.36364 12.0909 6.36364ZM9.54544 1.27273C9.37735 1.27492 9.21677 1.34268 9.0979 1.46154C8.97903 1.58041 8.91128 1.741 8.90908 1.90909V4.45455C8.91128 4.62264 8.97903 4.78322 9.0979 4.90209C9.21677 5.02096 9.37735 5.08871 9.54544 5.09091H12.0909C12.259 5.08871 12.4196 5.02096 12.5384 4.90209C12.6573 4.78322 12.7251 4.62264 12.7273 4.45455V1.90909C12.7251 1.741 12.6573 1.58041 12.5384 1.46154C12.4196 1.34268 12.259 1.27492 12.0909 1.27273H9.54544ZM9.54544 14H12.0909C12.5972 14 13.0828 13.7989 13.4408 13.4408C13.7989 13.0828 14 12.5972 14 12.0909V9.54544C14 9.03912 13.7989 8.55354 13.4408 8.19551C13.0828 7.83749 12.5972 7.63635 12.0909 7.63635H9.54544C9.03912 7.63635 8.55354 7.83749 8.19551 8.19551C7.83749 8.55354 7.63635 9.03912 7.63635 9.54544V12.0909C7.63635 12.5972 7.83749 13.0828 8.19551 13.4408C8.55354 13.7989 9.03912 14 9.54544 14ZM9.0979 9.0979C9.21677 8.97903 9.37735 8.91128 9.54544 8.90908H12.0909C12.259 8.91128 12.4196 8.97903 12.5384 9.0979C12.6573 9.21677 12.7251 9.37735 12.7273 9.54544V12.0909C12.7251 12.259 12.6573 12.4196 12.5384 12.5384C12.4196 12.6573 12.259 12.7251 12.0909 12.7273H9.54544C9.37735 12.7251 9.21677 12.6573 9.0979 12.5384C8.97903 12.4196 8.91128 12.259 8.90908 12.0909V9.54544C8.91128 9.37735 8.97903 9.21677 9.0979 9.0979Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -8938,11 +8607,7 @@ this.primevue.icons.thlarge = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9000,21 +8665,13 @@ this.primevue.icons.timescircle = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M7 14C5.61553 14 4.26215 13.5895 3.11101 12.8203C1.95987 12.0511 1.06266 10.9579 0.532846 9.67879C0.00303296 8.3997 -0.13559 6.99224 0.134506 5.63437C0.404603 4.2765 1.07129 3.02922 2.05026 2.05026C3.02922 1.07129 4.2765 0.404603 5.63437 0.134506C6.99224 -0.13559 8.3997 0.00303296 9.67879 0.532846C10.9579 1.06266 12.0511 1.95987 12.8203 3.11101C13.5895 4.26215 14 5.61553 14 7C14 8.85652 13.2625 10.637 11.9497 11.9497C10.637 13.2625 8.85652 14 7 14ZM7 1.16667C5.84628 1.16667 4.71846 1.50879 3.75918 2.14976C2.79989 2.79074 2.05222 3.70178 1.61071 4.76768C1.16919 5.83358 1.05367 7.00647 1.27876 8.13803C1.50384 9.26958 2.05941 10.309 2.87521 11.1248C3.69102 11.9406 4.73042 12.4962 5.86198 12.7212C6.99353 12.9463 8.16642 12.8308 9.23232 12.3893C10.2982 11.9478 11.2093 11.2001 11.8502 10.2408C12.4912 9.28154 12.8333 8.15373 12.8333 7C12.8333 5.45291 12.2188 3.96918 11.1248 2.87521C10.0308 1.78125 8.5471 1.16667 7 1.16667ZM4.66662 9.91668C4.58998 9.91704 4.51404 9.90209 4.44325 9.87271C4.37246 9.84333 4.30826 9.8001 4.2544 9.74557C4.14516 9.6362 4.0838 9.48793 4.0838 9.33335C4.0838 9.17876 4.14516 9.0305 4.2544 8.92113L6.17553 7L4.25443 5.07891C4.15139 4.96832 4.09529 4.82207 4.09796 4.67094C4.10063 4.51982 4.16185 4.37563 4.26872 4.26876C4.3756 4.16188 4.51979 4.10066 4.67091 4.09799C4.82204 4.09532 4.96829 4.15142 5.07887 4.25446L6.99997 6.17556L8.92106 4.25446C9.03164 4.15142 9.1779 4.09532 9.32903 4.09799C9.48015 4.10066 9.62434 4.16188 9.73121 4.26876C9.83809 4.37563 9.89931 4.51982 9.90198 4.67094C9.90464 4.82207 9.84855 4.96832 9.74551 5.07891L7.82441 7L9.74554 8.92113C9.85478 9.0305 9.91614 9.17876 9.91614 9.33335C9.91614 9.48793 9.85478 9.6362 9.74554 9.74557C9.69168 9.8001 9.62748 9.84333 9.55669 9.87271C9.4859 9.90209 9.40996 9.91704 9.33332 9.91668C9.25668 9.91704 9.18073 9.90209 9.10995 9.87271C9.03916 9.84333 8.97495 9.8001 8.9211 9.74557L6.99997 7.82444L5.07884 9.74557C5.02499 9.8001 4.96078 9.84333 4.88999 9.87271C4.81921 9.90209 4.74326 9.91704 4.66662 9.91668Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9022,11 +8679,7 @@ this.primevue.icons.timescircle = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9049,21 +8702,13 @@ this.primevue.icons.trash = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M3.44802 13.9955H10.552C10.8056 14.0129 11.06 13.9797 11.3006 13.898C11.5412 13.8163 11.7632 13.6877 11.9537 13.5196C12.1442 13.3515 12.2995 13.1473 12.4104 12.9188C12.5213 12.6903 12.5858 12.442 12.6 12.1884V4.36041H13.4C13.5591 4.36041 13.7117 4.29722 13.8243 4.18476C13.9368 4.07229 14 3.91976 14 3.76071C14 3.60166 13.9368 3.44912 13.8243 3.33666C13.7117 3.22419 13.5591 3.16101 13.4 3.16101H12.0537C12.0203 3.1557 11.9863 3.15299 11.952 3.15299C11.9178 3.15299 11.8838 3.1557 11.8503 3.16101H11.2285C11.2421 3.10893 11.2487 3.05513 11.248 3.00106V1.80966C11.2171 1.30262 10.9871 0.828306 10.608 0.48989C10.229 0.151475 9.73159 -0.0236625 9.22402 0.00257442H4.77602C4.27251 -0.0171866 3.78126 0.160868 3.40746 0.498617C3.03365 0.836366 2.807 1.30697 2.77602 1.80966V3.00106C2.77602 3.0556 2.78346 3.10936 2.79776 3.16101H0.6C0.521207 3.16101 0.443185 3.17652 0.37039 3.20666C0.297595 3.2368 0.231451 3.28097 0.175736 3.33666C0.120021 3.39235 0.0758251 3.45846 0.0456722 3.53121C0.0155194 3.60397 0 3.68196 0 3.76071C0 3.83946 0.0155194 3.91744 0.0456722 3.9902C0.0758251 4.06296 0.120021 4.12907 0.175736 4.18476C0.231451 4.24045 0.297595 4.28462 0.37039 4.31476C0.443185 4.3449 0.521207 4.36041 0.6 4.36041H1.40002V12.1884C1.41426 12.442 1.47871 12.6903 1.58965 12.9188C1.7006 13.1473 1.85582 13.3515 2.04633 13.5196C2.23683 13.6877 2.45882 13.8163 2.69944 13.898C2.94005 13.9797 3.1945 14.0129 3.44802 13.9955ZM2.60002 4.36041H11.304V12.1884C11.304 12.5163 10.952 12.7961 10.504 12.7961H3.40002C2.97602 12.7961 2.60002 12.5163 2.60002 12.1884V4.36041ZM3.95429 3.16101C3.96859 3.10936 3.97602 3.0556 3.97602 3.00106V1.80966C3.97602 1.48183 4.33602 1.20197 4.77602 1.20197H9.24802C9.66403 1.20197 10.048 1.48183 10.048 1.80966V3.00106C10.0473 3.05515 10.054 3.10896 10.0678 3.16101H3.95429ZM5.57571 10.997C5.41731 10.995 5.26597 10.9311 5.15395 10.8191C5.04193 10.7071 4.97808 10.5558 4.97601 10.3973V6.77517C4.97601 6.61612 5.0392 6.46359 5.15166 6.35112C5.26413 6.23866 5.41666 6.17548 5.57571 6.17548C5.73476 6.17548 5.8873 6.23866 5.99976 6.35112C6.11223 6.46359 6.17541 6.61612 6.17541 6.77517V10.3894C6.17647 10.4688 6.16174 10.5476 6.13208 10.6213C6.10241 10.695 6.05841 10.762 6.00261 10.8186C5.94682 10.8751 5.88035 10.92 5.80707 10.9506C5.73378 10.9813 5.65514 10.9971 5.57571 10.997ZM7.99968 10.8214C8.11215 10.9339 8.26468 10.997 8.42373 10.997C8.58351 10.9949 8.73604 10.93 8.84828 10.8163C8.96052 10.7025 9.02345 10.5491 9.02343 10.3894V6.77517C9.02343 6.61612 8.96025 6.46359 8.84778 6.35112C8.73532 6.23866 8.58278 6.17548 8.42373 6.17548C8.26468 6.17548 8.11215 6.23866 7.99968 6.35112C7.88722 6.46359 7.82404 6.61612 7.82404 6.77517V10.3973C7.82404 10.5564 7.88722 10.7089 7.99968 10.8214Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9071,11 +8716,7 @@ this.primevue.icons.trash = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9098,21 +8739,13 @@ this.primevue.icons.undo = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.77042 5.96336C6.84315 5.99355 6.92118 6.00891 6.99993 6.00854C7.07868 6.00891 7.15671 5.99355 7.22944 5.96336C7.30217 5.93317 7.36814 5.88876 7.42348 5.83273C7.53572 5.72035 7.59876 5.56801 7.59876 5.40918C7.59876 5.25035 7.53572 5.09802 7.42348 4.98564L6.04897 3.61113H6.99998C7.9088 3.61113 8.79722 3.88063 9.55288 4.38554C10.3085 4.89046 10.8975 5.60811 11.2453 6.44776C11.5931 7.2874 11.6841 8.21132 11.5068 9.10268C11.3295 9.99404 10.8918 10.8128 10.2492 11.4554C9.60657 12.0981 8.7878 12.5357 7.89644 12.713C7.00508 12.8903 6.08116 12.7993 5.24152 12.4515C4.40188 12.1037 3.68422 11.5148 3.17931 10.7591C2.67439 10.0035 2.4049 9.11504 2.4049 8.20622C2.4049 8.04726 2.34175 7.89481 2.22935 7.78241C2.11695 7.67001 1.9645 7.60686 1.80554 7.60686C1.64658 7.60686 1.49413 7.67001 1.38172 7.78241C1.26932 7.89481 1.20618 8.04726 1.20618 8.20622C1.20829 9.74218 1.81939 11.2146 2.90548 12.3007C3.99157 13.3868 5.46402 13.9979 6.99998 14C8.5366 14 10.0103 13.3896 11.0968 12.3031C12.1834 11.2165 12.7938 9.74283 12.7938 8.20622C12.7938 6.66961 12.1834 5.19593 11.0968 4.10938C10.0103 3.02283 8.5366 2.41241 6.99998 2.41241H6.04892L7.42348 1.03786C7.48236 0.982986 7.5296 0.916817 7.56235 0.843296C7.59511 0.769775 7.61273 0.690409 7.61415 0.609933C7.61557 0.529456 7.60076 0.449519 7.57062 0.374888C7.54047 0.300257 7.49561 0.232462 7.43869 0.175548C7.38178 0.118634 7.31398 0.0737664 7.23935 0.0436218C7.16472 0.0134773 7.08478 -0.00132663 7.00431 9.32772e-05C6.92383 0.00151319 6.84447 0.019128 6.77095 0.0518865C6.69742 0.0846451 6.63126 0.131876 6.57638 0.190763L4.17895 2.5882C4.06671 2.70058 4.00366 2.85292 4.00366 3.01175C4.00366 3.17058 4.06671 3.32291 4.17895 3.43529L6.57638 5.83273C6.63172 5.88876 6.69769 5.93317 6.77042 5.96336Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9120,11 +8753,7 @@ this.primevue.icons.undo = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9147,21 +8776,13 @@ this.primevue.icons.upload = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M6.58942 9.82197C6.70165 9.93405 6.85328 9.99793 7.012 10C7.17071 9.99793 7.32234 9.93405 7.43458 9.82197C7.54681 9.7099 7.61079 9.55849 7.61286 9.4V2.04798L9.79204 4.22402C9.84752 4.28011 9.91365 4.32457 9.98657 4.35479C10.0595 4.38502 10.1377 4.40039 10.2167 4.40002C10.2956 4.40039 10.3738 4.38502 10.4467 4.35479C10.5197 4.32457 10.5858 4.28011 10.6413 4.22402C10.7538 4.11152 10.817 3.95902 10.817 3.80002C10.817 3.64102 10.7538 3.48852 10.6413 3.37602L7.45127 0.190618C7.44656 0.185584 7.44176 0.180622 7.43687 0.175736C7.32419 0.063214 7.17136 0 7.012 0C6.85264 0 6.69981 0.063214 6.58712 0.175736C6.58181 0.181045 6.5766 0.186443 6.5715 0.191927L3.38282 3.37602C3.27669 3.48976 3.2189 3.6402 3.22165 3.79564C3.2244 3.95108 3.28746 4.09939 3.39755 4.20932C3.50764 4.31925 3.65616 4.38222 3.81182 4.38496C3.96749 4.3877 4.11814 4.33001 4.23204 4.22402L6.41113 2.04807V9.4C6.41321 9.55849 6.47718 9.7099 6.58942 9.82197ZM11.9952 14H2.02883C1.751 13.9887 1.47813 13.9228 1.22584 13.8061C0.973545 13.6894 0.746779 13.5241 0.558517 13.3197C0.370254 13.1154 0.22419 12.876 0.128681 12.6152C0.0331723 12.3545 -0.00990605 12.0775 0.0019109 11.8V9.40005C0.0019109 9.24092 0.065216 9.08831 0.1779 8.97579C0.290584 8.86326 0.443416 8.80005 0.602775 8.80005C0.762134 8.80005 0.914966 8.86326 1.02765 8.97579C1.14033 9.08831 1.20364 9.24092 1.20364 9.40005V11.8C1.18295 12.0376 1.25463 12.274 1.40379 12.4602C1.55296 12.6463 1.76817 12.7681 2.00479 12.8H11.9952C12.2318 12.7681 12.447 12.6463 12.5962 12.4602C12.7453 12.274 12.817 12.0376 12.7963 11.8V9.40005C12.7963 9.24092 12.8596 9.08831 12.9723 8.97579C13.085 8.86326 13.2378 8.80005 13.3972 8.80005C13.5565 8.80005 13.7094 8.86326 13.8221 8.97579C13.9347 9.08831 13.998 9.24092 13.998 9.40005V11.8C14.022 12.3563 13.8251 12.8996 13.45 13.3116C13.0749 13.7236 12.552 13.971 11.9952 14Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9169,11 +8790,7 @@ this.primevue.icons.upload = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9196,21 +8813,13 @@ this.primevue.icons.windowmaximize = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M7 14H11.8C12.3835 14 12.9431 13.7682 13.3556 13.3556C13.7682 12.9431 14 12.3835 14 11.8V2.2C14 1.61652 13.7682 1.05694 13.3556 0.644365C12.9431 0.231785 12.3835 0 11.8 0H2.2C1.61652 0 1.05694 0.231785 0.644365 0.644365C0.231785 1.05694 0 1.61652 0 2.2V7C0 7.15913 0.063214 7.31174 0.175736 7.42426C0.288258 7.53679 0.44087 7.6 0.6 7.6C0.75913 7.6 0.911742 7.53679 1.02426 7.42426C1.13679 7.31174 1.2 7.15913 1.2 7V2.2C1.2 1.93478 1.30536 1.68043 1.49289 1.49289C1.68043 1.30536 1.93478 1.2 2.2 1.2H11.8C12.0652 1.2 12.3196 1.30536 12.5071 1.49289C12.6946 1.68043 12.8 1.93478 12.8 2.2V11.8C12.8 12.0652 12.6946 12.3196 12.5071 12.5071C12.3196 12.6946 12.0652 12.8 11.8 12.8H7C6.84087 12.8 6.68826 12.8632 6.57574 12.9757C6.46321 13.0883 6.4 13.2409 6.4 13.4C6.4 13.5591 6.46321 13.7117 6.57574 13.8243C6.68826 13.9368 6.84087 14 7 14ZM9.77805 7.42192C9.89013 7.534 10.0415 7.59788 10.2 7.59995C10.3585 7.59788 10.5099 7.534 10.622 7.42192C10.7341 7.30985 10.798 7.15844 10.8 6.99995V3.94242C10.8066 3.90505 10.8096 3.86689 10.8089 3.82843C10.8079 3.77159 10.7988 3.7157 10.7824 3.6623C10.756 3.55552 10.701 3.45698 10.622 3.37798C10.5099 3.2659 10.3585 3.20202 10.2 3.19995H7.00002C6.84089 3.19995 6.68828 3.26317 6.57576 3.37569C6.46324 3.48821 6.40002 3.64082 6.40002 3.79995C6.40002 3.95908 6.46324 4.11169 6.57576 4.22422C6.68828 4.33674 6.84089 4.39995 7.00002 4.39995H8.80006L6.19997 7.00005C6.10158 7.11005 6.04718 7.25246 6.04718 7.40005C6.04718 7.54763 6.10158 7.69004 6.19997 7.80005C6.30202 7.91645 6.44561 7.98824 6.59997 8.00005C6.75432 7.98824 6.89791 7.91645 6.99997 7.80005L9.60002 5.26841V6.99995C9.6021 7.15844 9.66598 7.30985 9.77805 7.42192ZM1.4 14H3.8C4.17066 13.9979 4.52553 13.8498 4.78763 13.5877C5.04973 13.3256 5.1979 12.9707 5.2 12.6V10.2C5.1979 9.82939 5.04973 9.47452 4.78763 9.21242C4.52553 8.95032 4.17066 8.80215 3.8 8.80005H1.4C1.02934 8.80215 0.674468 8.95032 0.412371 9.21242C0.150274 9.47452 0.00210008 9.82939 0 10.2V12.6C0.00210008 12.9707 0.150274 13.3256 0.412371 13.5877C0.674468 13.8498 1.02934 13.9979 1.4 14ZM1.25858 10.0586C1.29609 10.0211 1.34696 10 1.4 10H3.8C3.85304 10 3.90391 10.0211 3.94142 10.0586C3.97893 10.0961 4 10.147 4 10.2V12.6C4 12.6531 3.97893 12.704 3.94142 12.7415C3.90391 12.779 3.85304 12.8 3.8 12.8H1.4C1.34696 12.8 1.29609 12.779 1.25858 12.7415C1.22107 12.704 1.2 12.6531 1.2 12.6V10.2C1.2 10.147 1.22107 10.0961 1.25858 10.0586Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9218,11 +8827,7 @@ this.primevue.icons.windowmaximize = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -9245,21 +8850,13 @@ this.primevue.icons.windowminimize = (function (BaseIcon, vue) {
       "extends": BaseIcon__default["default"]
     };
 
-    var _hoisted_1 = ["clip-path"];
-    var _hoisted_2 = /*#__PURE__*/vue.createElementVNode("path", {
+    var _hoisted_1 = /*#__PURE__*/vue.createElementVNode("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
       d: "M11.8 0H2.2C1.61652 0 1.05694 0.231785 0.644365 0.644365C0.231785 1.05694 0 1.61652 0 2.2V7C0 7.15913 0.063214 7.31174 0.175736 7.42426C0.288258 7.53679 0.44087 7.6 0.6 7.6C0.75913 7.6 0.911742 7.53679 1.02426 7.42426C1.13679 7.31174 1.2 7.15913 1.2 7V2.2C1.2 1.93478 1.30536 1.68043 1.49289 1.49289C1.68043 1.30536 1.93478 1.2 2.2 1.2H11.8C12.0652 1.2 12.3196 1.30536 12.5071 1.49289C12.6946 1.68043 12.8 1.93478 12.8 2.2V11.8C12.8 12.0652 12.6946 12.3196 12.5071 12.5071C12.3196 12.6946 12.0652 12.8 11.8 12.8H7C6.84087 12.8 6.68826 12.8632 6.57574 12.9757C6.46321 13.0883 6.4 13.2409 6.4 13.4C6.4 13.5591 6.46321 13.7117 6.57574 13.8243C6.68826 13.9368 6.84087 14 7 14H11.8C12.3835 14 12.9431 13.7682 13.3556 13.3556C13.7682 12.9431 14 12.3835 14 11.8V2.2C14 1.61652 13.7682 1.05694 13.3556 0.644365C12.9431 0.231785 12.3835 0 11.8 0ZM6.368 7.952C6.44137 7.98326 6.52025 7.99958 6.6 8H9.8C9.95913 8 10.1117 7.93678 10.2243 7.82426C10.3368 7.71174 10.4 7.55913 10.4 7.4C10.4 7.24087 10.3368 7.08826 10.2243 6.97574C10.1117 6.86321 9.95913 6.8 9.8 6.8H8.048L10.624 4.224C10.73 4.11026 10.7877 3.95982 10.7849 3.80438C10.7822 3.64894 10.7192 3.50063 10.6093 3.3907C10.4994 3.28077 10.3511 3.2178 10.1956 3.21506C10.0402 3.21232 9.88974 3.27002 9.776 3.376L7.2 5.952V4.2C7.2 4.04087 7.13679 3.88826 7.02426 3.77574C6.91174 3.66321 6.75913 3.6 6.6 3.6C6.44087 3.6 6.28826 3.66321 6.17574 3.77574C6.06321 3.88826 6 4.04087 6 4.2V7.4C6.00042 7.47975 6.01674 7.55862 6.048 7.632C6.07656 7.70442 6.11971 7.7702 6.17475 7.82524C6.2298 7.88029 6.29558 7.92344 6.368 7.952ZM1.4 8.80005H3.8C4.17066 8.80215 4.52553 8.95032 4.78763 9.21242C5.04973 9.47452 5.1979 9.82939 5.2 10.2V12.6C5.1979 12.9707 5.04973 13.3256 4.78763 13.5877C4.52553 13.8498 4.17066 13.9979 3.8 14H1.4C1.02934 13.9979 0.674468 13.8498 0.412371 13.5877C0.150274 13.3256 0.00210008 12.9707 0 12.6V10.2C0.00210008 9.82939 0.150274 9.47452 0.412371 9.21242C0.674468 8.95032 1.02934 8.80215 1.4 8.80005ZM3.94142 12.7415C3.97893 12.704 4 12.6531 4 12.6V10.2C4 10.147 3.97893 10.0961 3.94142 10.0586C3.90391 10.0211 3.85304 10 3.8 10H1.4C1.34696 10 1.29609 10.0211 1.25858 10.0586C1.22107 10.0961 1.2 10.147 1.2 10.2V12.6C1.2 12.6531 1.22107 12.704 1.25858 12.7415C1.29609 12.779 1.34696 12.8 1.4 12.8H3.8C3.85304 12.8 3.90391 12.779 3.94142 12.7415Z",
       fill: "currentColor"
     }, null, -1);
-    var _hoisted_3 = [_hoisted_2];
-    var _hoisted_4 = ["id"];
-    var _hoisted_5 = /*#__PURE__*/vue.createElementVNode("rect", {
-      width: "14",
-      height: "14",
-      fill: "white"
-    }, null, -1);
-    var _hoisted_6 = [_hoisted_5];
+    var _hoisted_2 = [_hoisted_1];
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
         width: "14",
@@ -9267,11 +8864,7 @@ this.primevue.icons.windowminimize = (function (BaseIcon, vue) {
         viewBox: "0 0 14 14",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, _ctx.pti()), [vue.createElementVNode("g", {
-        "clip-path": "url(#".concat(_ctx.pathId, ")")
-      }, _hoisted_3, 8, _hoisted_1), vue.createElementVNode("defs", null, [vue.createElementVNode("clipPath", {
-        id: "".concat(_ctx.pathId)
-      }, _hoisted_6, 8, _hoisted_4)])], 16);
+      }, _ctx.pti()), _hoisted_2, 16);
     }
 
     script.render = render;
@@ -10067,6 +9660,7 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           if (utils.DomHandler.isVisible(this.element)) {
             this.setContentEl(this.content);
             this.init();
+            this.calculateAutoSize();
             this.bindResizeListener();
             this.defaultWidth = utils.DomHandler.getWidth(this.element);
             this.defaultHeight = utils.DomHandler.getHeight(this.element);
@@ -10092,10 +9686,7 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           return this.orientation === 'both';
         },
         scrollTo: function scrollTo(options) {
-          this.lastScrollPos = this.both ? {
-            top: 0,
-            left: 0
-          } : 0;
+          //this.lastScrollPos = this.both ? { top: 0, left: 0 } : 0;
           this.element && this.element.scrollTo(options);
         },
         scrollToIndex: function scrollToIndex(index) {
@@ -10108,6 +9699,11 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           }) : index > -1;
           if (valid) {
             var first = this.first;
+            var _this$element = this.element,
+              _this$element$scrollT = _this$element.scrollTop,
+              scrollTop = _this$element$scrollT === void 0 ? 0 : _this$element$scrollT,
+              _this$element$scrollL = _this$element.scrollLeft,
+              scrollLeft = _this$element$scrollL === void 0 ? 0 : _this$element$scrollL;
             var _this$calculateNumIte = this.calculateNumItems(),
               numToleratedItems = _this$calculateNumIte.numToleratedItems;
             var contentPos = this.getContentPosition();
@@ -10133,21 +9729,24 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
               rows: 0,
               cols: 0
             } : 0;
-            var isRangeChanged = false;
+            var isRangeChanged = false,
+              isScrollChanged = false;
             if (both) {
               newFirst = {
                 rows: calculateFirst(index[0], numToleratedItems[0]),
                 cols: calculateFirst(index[1], numToleratedItems[1])
               };
               scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPos.left), calculateCoord(newFirst.rows, itemSize[0], contentPos.top));
+              isScrollChanged = this.lastScrollPos.top !== scrollTop || this.lastScrollPos.left !== scrollLeft;
               isRangeChanged = newFirst.rows !== first.rows || newFirst.cols !== first.cols;
             } else {
               newFirst = calculateFirst(index, numToleratedItems);
-              horizontal ? scrollTo(calculateCoord(newFirst, itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(newFirst, itemSize, contentPos.top));
+              horizontal ? scrollTo(calculateCoord(newFirst, itemSize, contentPos.left), scrollTop) : scrollTo(scrollLeft, calculateCoord(newFirst, itemSize, contentPos.top));
+              isScrollChanged = this.lastScrollPos !== (horizontal ? scrollLeft : scrollTop);
               isRangeChanged = newFirst !== first;
             }
             this.isRangeChanged = isRangeChanged;
-            this.first = newFirst;
+            isScrollChanged && (this.first = newFirst);
           }
         },
         scrollInView: function scrollInView(index, to) {
@@ -10215,9 +9814,9 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           if (this.element) {
             var both = this.isBoth();
             var horizontal = this.isHorizontal();
-            var _this$element = this.element,
-              scrollTop = _this$element.scrollTop,
-              scrollLeft = _this$element.scrollLeft;
+            var _this$element2 = this.element,
+              scrollTop = _this$element2.scrollTop,
+              scrollLeft = _this$element2.scrollLeft;
             if (both) {
               firstInViewport = {
                 rows: calculateFirstInViewport(scrollTop, this.itemSize[0]),
@@ -10297,12 +9896,13 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           }
           if (this.lazy) {
             Promise.resolve().then(function () {
+              var _this3$items;
               _this3.lazyLoadState = {
                 first: _this3.step ? both ? {
                   rows: 0,
                   cols: first.cols
                 } : 0 : first,
-                last: Math.min(_this3.step ? _this3.step : last, _this3.items.length)
+                last: Math.min(_this3.step ? _this3.step : last, ((_this3$items = _this3.items) === null || _this3$items === void 0 ? void 0 : _this3$items.length) || 0)
               };
               _this3.$emit('lazy-load', _this3.lazyLoadState);
             });
@@ -10319,14 +9919,14 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
                 _this4.content.style.minHeight = _this4.content.style.minWidth = 'auto';
                 _this4.content.style.position = 'relative';
                 _this4.element.style.contain = 'none';
-                var _ref = [utils.DomHandler.getWidth(_this4.content), utils.DomHandler.getHeight(_this4.content)],
-                  contentWidth = _ref[0],
-                  contentHeight = _ref[1];
-                contentWidth !== _this4.defaultContentWidth && (_this4.element.style.width = '');
-                contentHeight !== _this4.defaultContentHeight && (_this4.element.style.height = '');
-                var _ref2 = [utils.DomHandler.getWidth(_this4.element), utils.DomHandler.getHeight(_this4.element)],
-                  width = _ref2[0],
-                  height = _ref2[1];
+
+                /*const [contentWidth, contentHeight] = [DomHandler.getWidth(this.content), DomHandler.getHeight(this.content)];
+                 contentWidth !== this.defaultContentWidth && (this.element.style.width = '');
+                contentHeight !== this.defaultContentHeight && (this.element.style.height = '');*/
+
+                var _ref = [utils.DomHandler.getWidth(_this4.element), utils.DomHandler.getHeight(_this4.element)],
+                  width = _ref[0],
+                  height = _ref[1];
                 (both || horizontal) && (_this4.element.style.width = width < _this4.defaultWidth ? width + 'px' : _this4.scrollWidth || _this4.defaultWidth + 'px');
                 (both || vertical) && (_this4.element.style.height = height < _this4.defaultHeight ? height + 'px' : _this4.scrollHeight || _this4.defaultHeight + 'px');
                 _this4.content.style.minHeight = _this4.content.style.minWidth = '';
@@ -10337,9 +9937,10 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
           }
         },
         getLast: function getLast() {
+          var _ref2, _this$items;
           var last = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
           var isCols = arguments.length > 1 ? arguments[1] : undefined;
-          return this.items ? Math.min(isCols ? (this.columns || this.items[0]).length : this.items.length, last) : 0;
+          return this.items ? Math.min(isCols ? ((_ref2 = this.columns || this.items[0]) === null || _ref2 === void 0 ? void 0 : _ref2.length) || 0 : ((_this$items = this.items) === null || _this$items === void 0 ? void 0 : _this$items.length) || 0, last) : 0;
         },
         getContentPosition: function getContentPosition() {
           if (this.content) {
@@ -10524,9 +10125,10 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
             this.lastScrollPos = scrollPos;
             this.$emit('scroll-index-change', newState);
             if (this.lazy && this.isPageChanged(first)) {
+              var _this$items2, _this$items3;
               var lazyLoadState = {
-                first: this.step ? Math.min(this.getPageByFirst(first) * this.step, this.items.length - this.step) : first,
-                last: Math.min(this.step ? (this.getPageByFirst(first) + 1) * this.step : last, this.items.length)
+                first: this.step ? Math.min(this.getPageByFirst(first) * this.step, (((_this$items2 = this.items) === null || _this$items2 === void 0 ? void 0 : _this$items2.length) || 0) - this.step) : first,
+                last: Math.min(this.step ? (this.getPageByFirst(first) + 1) * this.step : last, ((_this$items3 = this.items) === null || _this$items3 === void 0 ? void 0 : _this$items3.length) || 0)
               };
               var isLazyStateChanged = this.lazyLoadState.first !== lazyLoadState.first || this.lazyLoadState.last !== lazyLoadState.last;
               isLazyStateChanged && this.$emit('lazy-load', lazyLoadState);
@@ -10698,9 +10300,7 @@ this.primevue.virtualscroller = (function (SpinnerIcon, utils, BaseComponent, Vi
         onScroll: _cache[0] || (_cache[0] = function () {
           return $options.onScroll && $options.onScroll.apply($options, arguments);
         })
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "virtualscroller"
-      }), [vue.renderSlot(_ctx.$slots, "content", {
+      }, _ctx.ptm('root')), [vue.renderSlot(_ctx.$slots, "content", {
         styleClass: $options.contentClass,
         items: $options.loadedItems,
         getItemOptions: $options.getOptions,
@@ -11015,7 +10615,6 @@ this.primevue.button = (function (Badge, SpinnerIcon, Ripple, BaseComponent, But
         "aria-label": $options.defaultAriaLabel,
         disabled: $options.disabled
       }, $options.getPTOptions('root'), {
-        "data-pc-name": "button",
         "data-pc-severity": _ctx.severity
       }), [vue.renderSlot(_ctx.$slots, "default", {}, function () {
         return [_ctx.loading ? vue.renderSlot(_ctx.$slots, "loadingicon", {
@@ -11073,6 +10672,14 @@ this.primevue.inputtext = (function (BaseComponent, InputTextStyle, vue) {
         size: {
           type: String,
           "default": null
+        },
+        invalid: {
+          type: Boolean,
+          "default": false
+        },
+        variant: {
+          type: String,
+          "default": null
         }
       },
       style: InputTextStyle__default["default"],
@@ -11115,9 +10722,7 @@ this.primevue.inputtext = (function (BaseComponent, InputTextStyle, vue) {
         onInput: _cache[0] || (_cache[0] = function () {
           return $options.onInput && $options.onInput.apply($options, arguments);
         })
-      }, $options.getPTOptions('root'), {
-        "data-pc-name": "inputtext"
-      }), null, 16, _hoisted_1);
+      }, $options.getPTOptions('root')), null, 16, _hoisted_1);
     }
 
     script.render = render;
@@ -11246,6 +10851,14 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
           type: Boolean,
           "default": false
         },
+        variant: {
+          type: String,
+          "default": null
+        },
+        invalid: {
+          type: Boolean,
+          "default": false
+        },
         disabled: {
           type: Boolean,
           "default": false
@@ -12153,9 +11766,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
       var _component_INButton = vue.resolveComponent("INButton");
       return vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
         "class": _ctx.cx('root')
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "inputnumber"
-      }), [vue.createVNode(_component_INInputText, vue.mergeProps({
+      }, _ctx.ptm('root')), [vue.createVNode(_component_INInputText, vue.mergeProps({
         ref: "input",
         id: _ctx.inputId,
         role: "spinbutton",
@@ -12179,8 +11790,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
         onBlur: $options.onInputBlur
       }, _ctx.inputProps, {
         pt: _ctx.ptm('input'),
-        unstyled: _ctx.unstyled,
-        "data-pc-section": "input"
+        unstyled: _ctx.unstyled
       }), null, 16, ["id", "class", "style", "value", "aria-valuemin", "aria-valuemax", "aria-valuenow", "disabled", "readonly", "placeholder", "aria-labelledby", "aria-label", "onInput", "onKeydown", "onKeypress", "onPaste", "onClick", "onFocus", "onBlur", "pt", "unstyled"]), _ctx.showButtons && _ctx.buttonLayout === 'stacked' ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
         key: 0,
         "class": _ctx.cx('buttonGroup')
@@ -12192,8 +11802,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
         "aria-hidden": "true"
       }, _ctx.incrementButtonProps, {
         pt: _ctx.ptm('incrementButton'),
-        unstyled: _ctx.unstyled,
-        "data-pc-section": "incrementbutton"
+        unstyled: _ctx.unstyled
       }), {
         icon: vue.withCtx(function () {
           return [vue.renderSlot(_ctx.$slots, "incrementbuttonicon", {}, function () {
@@ -12213,8 +11822,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
         "aria-hidden": "true"
       }, _ctx.decrementButtonProps, {
         pt: _ctx.ptm('decrementButton'),
-        unstyled: _ctx.unstyled,
-        "data-pc-section": "decrementbutton"
+        unstyled: _ctx.unstyled
       }), {
         icon: vue.withCtx(function () {
           return [vue.renderSlot(_ctx.$slots, "decrementbuttonicon", {}, function () {
@@ -12235,8 +11843,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
         "aria-hidden": "true"
       }, _ctx.incrementButtonProps, {
         pt: _ctx.ptm('incrementButton'),
-        unstyled: _ctx.unstyled,
-        "data-pc-section": "incrementbutton"
+        unstyled: _ctx.unstyled
       }), {
         icon: vue.withCtx(function () {
           return [vue.renderSlot(_ctx.$slots, "incrementbuttonicon", {}, function () {
@@ -12257,8 +11864,7 @@ this.primevue.inputnumber = (function (Button, AngleDownIcon, AngleUpIcon, Input
         "aria-hidden": "true"
       }, _ctx.decrementButtonProps, {
         pt: _ctx.ptm('decrementButton'),
-        unstyled: _ctx.unstyled,
-        "data-pc-section": "decrementbutton"
+        unstyled: _ctx.unstyled
       }), {
         icon: vue.withCtx(function () {
           return [vue.renderSlot(_ctx.$slots, "decrementbuttonicon", {}, function () {
@@ -12308,6 +11914,14 @@ this.primevue.checkbox = (function (CheckIcon, utils, BaseComponent, CheckboxSty
           type: null,
           "default": false
         },
+        variant: {
+          type: String,
+          "default": null
+        },
+        invalid: {
+          type: Boolean,
+          "default": false
+        },
         disabled: {
           type: Boolean,
           "default": false
@@ -12411,7 +12025,6 @@ this.primevue.checkbox = (function (CheckIcon, utils, BaseComponent, CheckboxSty
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         "class": _ctx.cx('root')
       }, $options.getPTOptions('root'), {
-        "data-pc-name": "checkbox",
         "data-p-highlight": $options.checked,
         "data-p-disabled": _ctx.disabled
       }), [vue.createElementVNode("input", vue.mergeProps({
@@ -12476,6 +12089,14 @@ this.primevue.radiobutton = (function (utils, BaseComponent, RadioButtonStyle, v
           type: String,
           "default": null
         },
+        variant: {
+          type: String,
+          "default": null
+        },
+        invalid: {
+          type: Boolean,
+          "default": false
+        },
         disabled: {
           type: Boolean,
           "default": false
@@ -12557,7 +12178,6 @@ this.primevue.radiobutton = (function (utils, BaseComponent, RadioButtonStyle, v
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         "class": _ctx.cx('root')
       }, $options.getPTOptions('root'), {
-        "data-pc-name": "radiobutton",
         "data-p-highlight": $options.checked,
         "data-p-disabled": _ctx.disabled
       }), [vue.createElementVNode("input", vue.mergeProps({
@@ -12731,9 +12351,7 @@ this.primevue.message = (function (CheckIcon, ExclamationTriangleIcon, InfoCircl
             role: "alert",
             "aria-live": "assertive",
             "aria-atomic": "true"
-          }, _ctx.ptm('root'), {
-            "data-pc-name": "message"
-          }), [_ctx.$slots.container ? vue.renderSlot(_ctx.$slots, "container", {
+          }, _ctx.ptm('root')), [_ctx.$slots.container ? vue.renderSlot(_ctx.$slots, "container", {
             key: 0,
             onClose: $options.close,
             closeCallback: $options.close
@@ -12837,9 +12455,7 @@ this.primevue.progressbar = (function (BaseComponent, ProgressBarStyle, vue) {
         "aria-valuemin": "0",
         "aria-valuenow": _ctx.value,
         "aria-valuemax": "100"
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "progressbar"
-      }), [$options.determinate ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+      }, _ctx.ptm('root')), [$options.determinate ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         key: 0,
         "class": _ctx.cx('value'),
         style: $options.progressStyle
@@ -12863,7 +12479,7 @@ this.primevue.progressbar = (function (BaseComponent, ProgressBarStyle, vue) {
 })(primevue.basecomponent, primevue.progressbar.style, Vue);
 
 this.primevue = this.primevue || {};
-this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon, FilterIcon, SpinnerIcon, TimesIcon, OverlayEventBus, Portal, Ripple, utils, VirtualScroller, BaseComponent, DropdownStyle, vue) {
+this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon, SearchIcon, SpinnerIcon, TimesIcon, OverlayEventBus, Portal, Ripple, utils, VirtualScroller, BaseComponent, DropdownStyle, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -12871,7 +12487,7 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
     var BlankIcon__default = /*#__PURE__*/_interopDefaultLegacy(BlankIcon);
     var CheckIcon__default = /*#__PURE__*/_interopDefaultLegacy(CheckIcon);
     var ChevronDownIcon__default = /*#__PURE__*/_interopDefaultLegacy(ChevronDownIcon);
-    var FilterIcon__default = /*#__PURE__*/_interopDefaultLegacy(FilterIcon);
+    var SearchIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchIcon);
     var SpinnerIcon__default = /*#__PURE__*/_interopDefaultLegacy(SpinnerIcon);
     var TimesIcon__default = /*#__PURE__*/_interopDefaultLegacy(TimesIcon);
     var OverlayEventBus__default = /*#__PURE__*/_interopDefaultLegacy(OverlayEventBus);
@@ -12912,6 +12528,14 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
           type: String,
           "default": null
         },
+        variant: {
+          type: String,
+          "default": null
+        },
+        invalid: {
+          type: Boolean,
+          "default": false
+        },
         disabled: {
           type: Boolean,
           "default": false
@@ -13822,7 +13446,7 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
         TimesIcon: TimesIcon__default["default"],
         ChevronDownIcon: ChevronDownIcon__default["default"],
         SpinnerIcon: SpinnerIcon__default["default"],
-        FilterIcon: FilterIcon__default["default"],
+        SearchIcon: SearchIcon__default["default"],
         CheckIcon: CheckIcon__default["default"],
         BlankIcon: BlankIcon__default["default"]
       }
@@ -13852,12 +13476,10 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
         ref: "container",
         id: $data.id,
         "class": _ctx.cx('root'),
-        onClick: _cache[15] || (_cache[15] = function () {
+        onClick: _cache[16] || (_cache[16] = function () {
           return $options.onContainerClick && $options.onContainerClick.apply($options, arguments);
         })
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "dropdown"
-      }), [_ctx.editable ? (vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
+      }, _ctx.ptm('root')), [_ctx.editable ? (vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
         key: 0,
         ref: "focusInput",
         id: _ctx.inputId,
@@ -13971,10 +13593,10 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
                 ref: $options.overlayRef,
                 "class": [_ctx.cx('panel'), _ctx.panelClass],
                 style: _ctx.panelStyle,
-                onClick: _cache[13] || (_cache[13] = function () {
+                onClick: _cache[14] || (_cache[14] = function () {
                   return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
                 }),
-                onKeydown: _cache[14] || (_cache[14] = function () {
+                onKeydown: _cache[15] || (_cache[15] = function () {
                   return $options.onOverlayKeyDown && $options.onOverlayKeyDown.apply($options, arguments);
                 })
               }, _objectSpread(_objectSpread({}, _ctx.panelProps), _ctx.ptm('panel'))), [vue.createElementVNode("span", vue.mergeProps({
@@ -14004,25 +13626,28 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
                 onVnodeMounted: _cache[8] || (_cache[8] = function () {
                   return $options.onFilterUpdated && $options.onFilterUpdated.apply($options, arguments);
                 }),
+                onVnodeUpdated: _cache[9] || (_cache[9] = function () {
+                  return $options.onFilterUpdated && $options.onFilterUpdated.apply($options, arguments);
+                }),
                 "class": _ctx.cx('filterInput'),
                 placeholder: _ctx.filterPlaceholder,
                 role: "searchbox",
                 autocomplete: "off",
                 "aria-owns": $data.id + '_list',
                 "aria-activedescendant": $options.focusedOptionId,
-                onKeydown: _cache[9] || (_cache[9] = function () {
+                onKeydown: _cache[10] || (_cache[10] = function () {
                   return $options.onFilterKeyDown && $options.onFilterKeyDown.apply($options, arguments);
                 }),
-                onBlur: _cache[10] || (_cache[10] = function () {
+                onBlur: _cache[11] || (_cache[11] = function () {
                   return $options.onFilterBlur && $options.onFilterBlur.apply($options, arguments);
                 }),
-                onInput: _cache[11] || (_cache[11] = function () {
+                onInput: _cache[12] || (_cache[12] = function () {
                   return $options.onFilterChange && $options.onFilterChange.apply($options, arguments);
                 })
               }, _objectSpread(_objectSpread({}, _ctx.filterInputProps), _ctx.ptm('filterInput'))), null, 16, _hoisted_4), vue.renderSlot(_ctx.$slots, "filtericon", {
                 "class": vue.normalizeClass(_ctx.cx('filterIcon'))
               }, function () {
-                return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.filterIcon ? 'span' : 'FilterIcon'), vue.mergeProps({
+                return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.filterIcon ? 'span' : 'SearchIcon'), vue.mergeProps({
                   "class": [_ctx.cx('filterIcon'), _ctx.filterIcon]
                 }, _ctx.ptm('filterIcon')), null, 16, ["class"]))];
               })], 16), vue.createElementVNode("span", vue.mergeProps({
@@ -14171,7 +13796,7 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
                 "aria-hidden": "true",
                 "class": "p-hidden-accessible p-hidden-focusable",
                 tabindex: 0,
-                onFocus: _cache[12] || (_cache[12] = function () {
+                onFocus: _cache[13] || (_cache[13] = function () {
                   return $options.onLastHiddenFocus && $options.onLastHiddenFocus.apply($options, arguments);
                 })
               }, _ctx.ptm('hiddenLastFocusableEl'), {
@@ -14190,7 +13815,7 @@ this.primevue.dropdown = (function (api, BlankIcon, CheckIcon, ChevronDownIcon,
 
     return script;
 
-})(primevue.api, primevue.icons.blank, primevue.icons.check, primevue.icons.chevrondown, primevue.icons.filter, primevue.icons.spinner, primevue.icons.times, primevue.overlayeventbus, primevue.portal, primevue.ripple, primevue.utils, primevue.virtualscroller, primevue.basecomponent, primevue.dropdown.style, Vue);
+})(primevue.api, primevue.icons.blank, primevue.icons.check, primevue.icons.chevrondown, primevue.icons.search, primevue.icons.spinner, primevue.icons.times, primevue.overlayeventbus, primevue.portal, primevue.ripple, primevue.utils, primevue.virtualscroller, primevue.basecomponent, primevue.dropdown.style, Vue);
 
 this.primevue = this.primevue || {};
 this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, WindowMinimizeIcon, Portal, Ripple, utils, vue, BaseComponent, DialogStyle) {
@@ -14344,12 +13969,18 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
       },
       data: function data() {
         return {
+          id: this.$attrs.id,
           containerVisible: this.visible,
           maximized: false,
           focusableMax: null,
           focusableClose: null
         };
       },
+      watch: {
+        '$attrs.id': function $attrsId(newValue) {
+          this.id = newValue || utils.UniqueComponentId();
+        }
+      },
       documentKeydownListener: null,
       container: null,
       mask: null,
@@ -14380,6 +14011,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
         this.mask = null;
       },
       mounted: function mounted() {
+        this.id = this.id || utils.UniqueComponentId();
         if (this.breakpoints) {
           this.createStyle();
         }
@@ -14539,6 +14171,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
             this.lastPageX = event.pageX;
             this.lastPageY = event.pageY;
             this.container.style.margin = '0';
+            document.body.setAttribute('data-p-unselectable-text');
             !this.isUnstyled && utils.DomHandler.addClass(document.body, 'p-unselectable-text');
           }
         },
@@ -14602,6 +14235,7 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
           this.documentDragEndListener = function (event) {
             if (_this3.dragging) {
               _this3.dragging = false;
+              document.body.removeAttribute('data-p-unselectable-text');
               !_this3.isUnstyled && utils.DomHandler.removeClass(document.body, 'p-unselectable-text');
               _this3.$emit('dragend', event);
             }
@@ -14619,11 +14253,8 @@ this.primevue.dialog = (function (FocusTrap, TimesIcon, WindowMaximizeIcon, Wind
         maximizeIconComponent: function maximizeIconComponent() {
           return this.maximized ? this.minimizeIcon ? 'span' : 'WindowMinimizeIcon' : this.maximizeIcon ? 'span' : 'WindowMaximizeIcon';
         },
-        ariaId: function ariaId() {
-          return utils.UniqueComponentId();
-        },
         ariaLabelledById: function ariaLabelledById() {
-          return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.ariaId + '_header' : null;
+          return this.header != null || this.$attrs['aria-labelledby'] !== null ? this.id + '_header' : null;
         },
         closeAriaLabel: function closeAriaLabel() {
           return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;
@@ -14983,7 +14614,6 @@ this.primevue.paginator = (function (utils, BaseComponent, PaginatorStyle, vue,
         disabled: $props.disabled,
         unstyled: _ctx.unstyled,
         pt: _ctx.ptm('jumpToPageDropdown'),
-        "data-pc-section": "jumptopagedropdown",
         "data-pc-group-section": "pagedropdown"
       }, vue.createSlots({
         _: 2
@@ -15049,8 +14679,7 @@ this.primevue.paginator = (function (utils, BaseComponent, PaginatorStyle, vue,
         disabled: $props.disabled,
         "onUpdate:modelValue": $options.onChange,
         unstyled: _ctx.unstyled,
-        pt: _ctx.ptm('jumpToPageInput'),
-        "data-pc-section": "jumptopageinput"
+        pt: _ctx.ptm('jumpToPageInput')
       }, null, 8, ["modelValue", "class", "aria-label", "disabled", "onUpdate:modelValue", "unstyled", "pt"]);
     }
 
@@ -15286,7 +14915,6 @@ this.primevue.paginator = (function (utils, BaseComponent, PaginatorStyle, vue,
         disabled: $props.disabled,
         unstyled: _ctx.unstyled,
         pt: _ctx.ptm('rowPerPageDropdown'),
-        "data-pc-section": "rowperpagedropdown",
         "data-pc-group-section": "pagedropdown"
       }, vue.createSlots({
         _: 2
@@ -15543,9 +15171,7 @@ this.primevue.paginator = (function (utils, BaseComponent, PaginatorStyle, vue,
           "class": _ctx.cx('paginator', {
             key: key
           })
-        }, _ctx.ptm('root'), {
-          "data-pc-name": "paginator"
-        }), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+        }, _ctx.ptm('root')), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
           key: 0,
           "class": _ctx.cx('start')
         }, _ctx.ptm('start')), [vue.renderSlot(_ctx.$slots, "start", {
@@ -16492,9 +16118,7 @@ this.primevue.tree = (function (SearchIcon, SpinnerIcon, utils, BaseComponent, T
       var _component_TreeNode = vue.resolveComponent("TreeNode");
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         "class": _ctx.cx('root')
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "tree"
-      }), [_ctx.loading && _ctx.loadingMode === 'mask' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+      }, _ctx.ptm('root')), [_ctx.loading && _ctx.loadingMode === 'mask' ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         key: 0,
         "class": _ctx.cx('loadingOverlay')
       }, _ctx.ptm('loadingOverlay')), [vue.renderSlot(_ctx.$slots, "loadingicon", {
@@ -17070,9 +16694,7 @@ this.primevue.menu = (function (OverlayEventBus, Portal, utils, BaseComponent, M
                 onClick: _cache[3] || (_cache[3] = function () {
                   return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
                 })
-              }, _objectSpread(_objectSpread({}, _ctx.$attrs), _ctx.ptm('root')), {
-                "data-pc-name": "menu"
-              }), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              }, _objectSpread(_objectSpread({}, _ctx.$attrs), _ctx.ptm('root'))), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 0,
                 "class": _ctx.cx('start')
               }, _ctx.ptm('start')), [vue.renderSlot(_ctx.$slots, "start")], 16)) : vue.createCommentVNode("", true), vue.createElementVNode("ul", vue.mergeProps({
@@ -18117,9 +17739,7 @@ this.primevue.tieredmenu = (function (OverlayEventBus, Portal, utils, BaseCompon
                 onClick: _cache[0] || (_cache[0] = function () {
                   return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
                 })
-              }, _objectSpread(_objectSpread({}, _ctx.$attrs), _ctx.ptm('root')), {
-                "data-pc-name": "tieredmenu"
-              }), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+              }, _objectSpread(_objectSpread({}, _ctx.$attrs), _ctx.ptm('root'))), [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                 key: 0,
                 "class": _ctx.cx('start')
               }, _ctx.ptm('start')), [vue.renderSlot(_ctx.$slots, "start")], 16)) : vue.createCommentVNode("", true), vue.createVNode(_component_TieredMenuSub, {
@@ -18206,9 +17826,7 @@ this.primevue.badge = (function (BadgeStyle, BaseComponent, vue) {
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
         "class": _ctx.cx('root')
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "badge"
-      }), [vue.renderSlot(_ctx.$slots, "default", {}, function () {
+      }, _ctx.ptm('root')), [vue.renderSlot(_ctx.$slots, "default", {}, function () {
         return [vue.createTextVNode(vue.toDisplayString(_ctx.value), 1)];
       })], 16);
     }