primevue 4.0.7 → 4.1.0

package/imagecompare/index.d.ts

@@ -0,0 +1,149 @@
+/**
+ *
+ * ImageCompare compares two images side by side with a slider.
+ *
+ * [Live Demo](https://www.primevue.org/imagecompare)
+ *
+ * @module imagecompare
+ *
+ */
+import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
+import type { ComponentHooks } from '@primevue/core/basecomponent';
+import type { PassThroughOptions } from 'primevue/passthrough';
+import { VNode } from 'vue';
+
+export declare type ImageComparePassThroughOptionType = ImageComparePassThroughAttributes | ((options: ImageComparePassThroughMethodOptions) => ImageComparePassThroughAttributes | string) | string | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ImageComparePassThroughMethodOptions {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: ImageCompareProps;
+    /**
+     * Defines valid attributes.
+     */
+    attrs: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ImageCompareProps.pt}
+ */
+export interface ImageComparePassThroughOptions {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: ImageComparePassThroughOptionType;
+    /**
+     * Used to pass attributes to the slider's DOM element.
+     */
+    slider?: ImageComparePassThroughOptionType;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ImageComparePassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines valid properties in ImageCompare component.
+ */
+export interface ImageCompareProps {
+    /**
+     * Index of the element in tabbing order.
+     * @defaultValue 0
+     */
+    tabindex?: number | undefined;
+    /**
+     * Defines a string value that labels an interactive element.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Identifier of the underlying input element.
+     */
+    ariaLabelledby?: string | undefined;
+    /**
+     * It generates scoped CSS variables using design tokens for the component.
+     */
+    dt?: DesignToken<any>;
+    /**
+     * Used to pass attributes to DOM elements inside the component.
+     * @type {ImageComparePassThroughOptions}
+     */
+    pt?: PassThrough<ImageComparePassThroughOptions>;
+    /**
+     * Used to configure passthrough(pt) options of the component.
+     * @type {PassThroughOptions}
+     */
+    ptOptions?: PassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
+}
+
+/**
+ * Defines valid slots in ImageCompare component.
+ */
+export interface ImageCompareSlots {
+    /**
+     * Custom left template.
+     */
+    left(): VNode[];
+    /**
+     * Custom right template.
+     */
+    right(): VNode[];
+}
+
+/**
+ * Defines valid emits in ImageCompare component.
+ */
+export interface ImageCompareEmitsOptions {}
+
+export declare type ImageCompareEmits = EmitFn<ImageCompareEmitsOptions>;
+
+/**
+ * **PrimeVue - ImageCompare**
+ *
+ * _ImageCompare compares two images side by side with a slider._
+ *
+ * [Live Demo](https://www.primevue.org/imagecompare/)
+ * --- ---
+ * ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const ImageCompare: DefineComponent<ImageCompareProps, ImageCompareSlots, ImageCompareEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        ImageCompare: GlobalComponentConstructor<ImageCompareProps, ImageCompareSlots, ImageCompareEmits>;
+    }
+}
+
+export default ImageCompare;

package/imagecompare/index.mjs

@@ -0,0 +1,61 @@
+import BaseComponent from '@primevue/core/basecomponent';
+import ImageCompareStyle from 'primevue/imagecompare/style';
+import { openBlock, createElementBlock, mergeProps, renderSlot, createElementVNode } from 'vue';
+
+var script$1 = {
+  name: 'BaseImageCompare',
+  "extends": BaseComponent,
+  props: {
+    tabindex: {
+      type: Number,
+      "default": 0
+    },
+    ariaLabelledby: {
+      type: String,
+      "default": null
+    },
+    ariaLabel: {
+      type: String,
+      "default": null
+    }
+  },
+  style: ImageCompareStyle,
+  provide: function provide() {
+    return {
+      $pcImageCompare: this,
+      $parentInstance: this
+    };
+  }
+};
+
+var script = {
+  name: 'ImageCompare',
+  "extends": script$1,
+  methods: {
+    onSlide: function onSlide(event) {
+      var value = event.target.value;
+      var image = event.target.previousElementSibling;
+      image.style.clipPath = 'polygon(0 0,' + value + '% 0,' + value + '% 100%, 0 100%)';
+    }
+  }
+};
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", mergeProps({
+    "class": _ctx.cx('root')
+  }, _ctx.ptmi('root')), [renderSlot(_ctx.$slots, "left"), renderSlot(_ctx.$slots, "right"), createElementVNode("input", mergeProps({
+    type: "range",
+    min: "0",
+    max: "100",
+    value: "50",
+    onInput: _cache[0] || (_cache[0] = function () {
+      return $options.onSlide && $options.onSlide.apply($options, arguments);
+    }),
+    "class": _ctx.cx('slider')
+  }, _ctx.ptm('slider')), null, 16)], 16);
+}
+
+script.render = render;
+
+export { script as default };
+//# sourceMappingURL=index.mjs.map

package/imagecompare/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/imagecompare/BaseImageCompare.vue","../../src/imagecompare/ImageCompare.vue","../../src/imagecompare/ImageCompare.vue?vue&type=template&id=24903c0a&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevue/core/basecomponent';\nimport ImageCompareStyle from 'primevue/imagecompare/style';\n\nexport default {\n    name: 'BaseImageCompare',\n    extends: BaseComponent,\n    props: {\n        tabindex: {\n            type: Number,\n            default: 0\n        },\n        ariaLabelledby: {\n            type: String,\n            default: null\n        },\n        ariaLabel: {\n            type: String,\n            default: null\n        }\n    },\n    style: ImageCompareStyle,\n    provide() {\n        return {\n            $pcImageCompare: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot name=\"left\"></slot>\n        <slot name=\"right\"></slot>\n        <input type=\"range\" min=\"0\" max=\"100\" value=\"50\" @input=\"onSlide\" :class=\"cx('slider')\" v-bind=\"ptm('slider')\" />\n    </div>\n</template>\n\n<script>\nimport BaseImageCompare from './BaseImageCompare.vue';\n\nexport default {\n    name: 'ImageCompare',\n    extends: BaseImageCompare,\n    methods: {\n        onSlide(event) {\n            const value = event.target.value;\n            const image = event.target.previousElementSibling;\n\n            image.style.clipPath = 'polygon(0 0,' + value + '% 0,' + value + '% 100%, 0 100%)';\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot name=\"left\"></slot>\n        <slot name=\"right\"></slot>\n        <input type=\"range\" min=\"0\" max=\"100\" value=\"50\" @input=\"onSlide\" :class=\"cx('slider')\" v-bind=\"ptm('slider')\" />\n    </div>\n</template>\n\n<script>\nimport BaseImageCompare from './BaseImageCompare.vue';\n\nexport default {\n    name: 'ImageCompare',\n    extends: BaseImageCompare,\n    methods: {\n        onSlide(event) {\n            const value = event.target.value;\n            const image = event.target.previousElementSibling;\n\n            image.style.clipPath = 'polygon(0 0,' + value + '% 0,' + value + '% 100%, 0 100%)';\n        }\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","tabindex","type","Number","ariaLabelledby","String","ariaLabel","style","ImageCompareStyle","provide","$pcImageCompare","$parentInstance","BaseImageCompare","methods","onSlide","event","value","target","image","previousElementSibling","clipPath","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","$slots","_createElementVNode","min","max","onInput","$options","apply","arguments","ptm"],"mappings":";;;;AAIA,eAAe;AACXA,EAAAA,IAAI,EAAE,kBAAkB;AACxB,EAAA,SAAA,EAASC,aAAa;AACtBC,EAAAA,KAAK,EAAE;AACHC,IAAAA,QAAQ,EAAE;AACNC,MAAAA,IAAI,EAAEC,MAAM;MACZ,SAAS,EAAA,CAAA;KACZ;AACDC,IAAAA,cAAc,EAAE;AACZF,MAAAA,IAAI,EAAEG,MAAM;MACZ,SAAS,EAAA,IAAA;KACZ;AACDC,IAAAA,SAAS,EAAE;AACPJ,MAAAA,IAAI,EAAEG,MAAM;MACZ,SAAS,EAAA,IAAA;AACb,KAAA;GACH;AACDE,EAAAA,KAAK,EAAEC,iBAAiB;EACxBC,OAAO,EAAA,SAAPA,OAAOA,GAAG;IACN,OAAO;AACHC,MAAAA,eAAe,EAAE,IAAI;AACrBC,MAAAA,eAAe,EAAE,IAAA;KACpB,CAAA;AACL,GAAA;AACJ,CAAC;;ACjBD,aAAe;AACXb,EAAAA,IAAI,EAAE,cAAc;AACpB,EAAA,SAAA,EAASc,QAAgB;AACzBC,EAAAA,OAAO,EAAE;AACLC,IAAAA,OAAO,EAAPA,SAAAA,OAAOA,CAACC,KAAK,EAAE;AACX,MAAA,IAAMC,KAAI,GAAID,KAAK,CAACE,MAAM,CAACD,KAAK,CAAA;AAChC,MAAA,IAAME,KAAM,GAAEH,KAAK,CAACE,MAAM,CAACE,sBAAsB,CAAA;AAEjDD,MAAAA,KAAK,CAACX,KAAK,CAACa,QAAO,GAAI,cAAe,GAAEJ,KAAM,GAAE,MAAO,GAAEA,KAAI,GAAI,iBAAiB,CAAA;AACtF,KAAA;AACJ,GAAA;AACJ,CAAC;;;ECrBG,OAAAK,SAAA,EAAA,EAAAC,kBAAA,CAIK,OAJLC,UAIK,CAAA;AAJC,IAAA,OAAA,EAAOC,IAAE,CAAAC,EAAA,CAAA,MAAA,CAAA;KAAkBD,IAAI,CAAAE,IAAA,CAAA,MAAA,CAAA,CAAA,EAAA,CACjCC,UAAwB,CAAAH,IAAA,CAAAI,MAAA,EAAA,MAAA,CAAA,EACxBD,UAAyB,CAAAH,IAAA,CAAAI,MAAA,EAAA,OAAA,CAAA,EACzBC,kBAAA,CAAgH,SAAhHN,UAAgH,CAAA;AAAzGrB,IAAAA,IAAI,EAAC,OAAM;AAAE4B,IAAAA,GAAG,EAAC,GAAE;AAAEC,IAAAA,GAAG,EAAC,KAAI;AAAEf,IAAAA,KAAK,EAAC,IAAK;IAACgB,OAAK;aAAEC,QAAO,CAAAnB,OAAA,IAAAmB,QAAA,CAAAnB,OAAA,CAAAoB,KAAA,CAAAD,QAAA,EAAAE,SAAA,CAAA,CAAA;AAAA,KAAA,CAAA;AAAG,IAAA,OAAA,EAAOX,IAAE,CAAAC,EAAA,CAAA,QAAA,CAAA;KAAoBD,IAAG,CAAAY,GAAA,CAAA,QAAA,CAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA;;;;;;;"}

package/imagecompare/package.json

@@ -0,0 +1,11 @@
+{
+    "main": "./index.mjs",
+    "module": "./index.mjs",
+    "types": "./index.d.ts",
+    "browser": {
+        "./sfc": "./ImageCompare.vue"
+    },
+    "sideEffects": [
+        "*.vue"
+    ]
+}

package/imagecompare/style/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ *
+ * ImageCompare compares two images side by side with a slider.
+ *
+ * [Live Demo](https://www.primevue.org/imagecompare/)
+ *
+ * @module imagecomparestyle
+ *
+ */
+import type { BaseStyle } from '@primevue/core/base/style';
+
+export enum ImageCompareClasses {
+    /**
+     * Class name of the root element
+     */
+    root = 'p-imagecompare',
+    /**
+     * Class name of the slider element
+     */
+    slider = 'p-imagecompare-slider'
+}
+
+export interface ImageCompareStyle extends BaseStyle {}

package/imagecompare/style/index.mjs

@@ -0,0 +1,18 @@
+import BaseStyle from '@primevue/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-imagecompare {\n    position: relative;\n    overflow: hidden;\n    width: 100%;\n    aspect-ratio: 16 / 9;\n}\n\n.p-imagecompare img {\n    width: 100%;\n    height: 100%;\n    position: absolute;\n}\n\n.p-imagecompare img + img {\n    clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);\n}\n\n.p-imagecompare-slider {\n    position: relative;\n    -webkit-appearance: none;\n    width: calc(100% + ".concat(dt('imagecompare.handle.size'), ");\n    height: 100%;\n    margin-left: calc(-1 * calc(").concat(dt('imagecompare.handle.size'), " / 2));\n    background-color: transparent;\n    outline: none;\n    transition: all ").concat(dt('imagecompare.handle.transition.duration'), ";\n}\n\n.p-imagecompare-slider::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    height: ").concat(dt('imagecompare.handle.size'), ";\n    width: ").concat(dt('imagecompare.handle.size'), ";\n    background: ").concat(dt('imagecompare.handle.background'), ";\n    border: ").concat(dt('imagecompare.handle.border.width'), " solid ").concat(dt('imagecompare.handle.border.color'), ";\n    border-radius: ").concat(dt('imagecompare.handle.border.radius'), ";\n    background-size: contain;\n    cursor: ew-resize;\n    transition: all ").concat(dt('imagecompare.handle.transition.duration'), ";\n}\n\n.p-imagecompare-slider::-moz-range-thumb {\n    height: ").concat(dt('imagecompare.handle.size'), ";\n    width: ").concat(dt('imagecompare.handle.size'), ";\n    background: ").concat(dt('imagecompare.handle.background'), ";\n    border: ").concat(dt('imagecompare.handle.border.width'), " ").concat(dt('imagecompare.handle.border.style'), " ").concat(dt('imagecompare.handle.border.color'), ";\n    border-radius: ").concat(dt('imagecompare.handle.border.radius'), ";\n    background-size: contain;\n    cursor: ew-resize;\n}\n\n.p-imagecompare-slider:focus-visible::-webkit-slider-thumb {\n    box-shadow: ").concat(dt('imagecompare.handle.focus.ring.shadow'), ";\n    outline: ").concat(dt('imagecompare.handle.focus.ring.width'), " ").concat(dt('imagecompare.handle.focus.ring.style'), " ").concat(dt('imagecompare.handle.focus.ring.color'), ";\n    outline-offset: ").concat(dt('imagecompare.handle.focus.ring.offset'), ";\n}\n\n.p-imagecompare-slider:focus-visible::-moz-range-thumb {\n    box-shadow: ").concat(dt('imagecompare.handle.focus.ring.shadow'), ";\n    outline: ").concat(dt('imagecompare.handle.focus.ring.width'), " ").concat(dt('imagecompare.handle.focus.ring.style'), " ").concat(dt('imagecompare.handle.focus.ring.color'), ";\n    outline-offset: ").concat(dt('imagecompare.handle.focus.ring.offset'), ";\n}\n    \n.p-imagecompare-slider:hover {\n    width: calc(100% + ").concat(dt('imagecompare.handle.hover.size'), ");\n    margin-left: calc(-1 * calc(").concat(dt('imagecompare.handle.hover.size'), " / 2));\n}\n\n.p-imagecompare-slider:hover::-webkit-slider-thumb {\n    background: ").concat(dt('imagecompare.handle.hover.background'), ";\n    border-color: ").concat(dt('imagecompare.handle.hover.border.color'), ";\n    height: ").concat(dt('imagecompare.handle.hover.size'), ";\n    width: ").concat(dt('imagecompare.handle.hover.size'), ";\n}\n\n.p-imagecompare-slider:hover::-moz-range-thumb {\n    background: ").concat(dt('imagecompare.handle.hover.background'), ";\n    border-color: ").concat(dt('imagecompare.handle.hover.border.color'), ";\n    height: ").concat(dt('imagecompare.handle.hover.size'), ";\n    width: ").concat(dt('imagecompare.handle.hover.size'), ";\n}\n");
+};
+var classes = {
+  root: 'p-imagecompare',
+  slider: 'p-imagecompare-slider'
+};
+var ImageCompareStyle = BaseStyle.extend({
+  name: 'imagecompare',
+  theme: theme,
+  classes: classes
+});
+
+export { ImageCompareStyle as default };
+//# sourceMappingURL=index.mjs.map

package/imagecompare/style/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../src/imagecompare/style/ImageCompareStyle.js"],"sourcesContent":["import BaseStyle from '@primevue/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-imagecompare {\n    position: relative;\n    overflow: hidden;\n    width: 100%;\n    aspect-ratio: 16 / 9;\n}\n\n.p-imagecompare img {\n    width: 100%;\n    height: 100%;\n    position: absolute;\n}\n\n.p-imagecompare img + img {\n    clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);\n}\n\n.p-imagecompare-slider {\n    position: relative;\n    -webkit-appearance: none;\n    width: calc(100% + ${dt('imagecompare.handle.size')});\n    height: 100%;\n    margin-left: calc(-1 * calc(${dt('imagecompare.handle.size')} / 2));\n    background-color: transparent;\n    outline: none;\n    transition: all ${dt('imagecompare.handle.transition.duration')};\n}\n\n.p-imagecompare-slider::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    height: ${dt('imagecompare.handle.size')};\n    width: ${dt('imagecompare.handle.size')};\n    background: ${dt('imagecompare.handle.background')};\n    border: ${dt('imagecompare.handle.border.width')} solid ${dt('imagecompare.handle.border.color')};\n    border-radius: ${dt('imagecompare.handle.border.radius')};\n    background-size: contain;\n    cursor: ew-resize;\n    transition: all ${dt('imagecompare.handle.transition.duration')};\n}\n\n.p-imagecompare-slider::-moz-range-thumb {\n    height: ${dt('imagecompare.handle.size')};\n    width: ${dt('imagecompare.handle.size')};\n    background: ${dt('imagecompare.handle.background')};\n    border: ${dt('imagecompare.handle.border.width')} ${dt('imagecompare.handle.border.style')} ${dt('imagecompare.handle.border.color')};\n    border-radius: ${dt('imagecompare.handle.border.radius')};\n    background-size: contain;\n    cursor: ew-resize;\n}\n\n.p-imagecompare-slider:focus-visible::-webkit-slider-thumb {\n    box-shadow: ${dt('imagecompare.handle.focus.ring.shadow')};\n    outline: ${dt('imagecompare.handle.focus.ring.width')} ${dt('imagecompare.handle.focus.ring.style')} ${dt('imagecompare.handle.focus.ring.color')};\n    outline-offset: ${dt('imagecompare.handle.focus.ring.offset')};\n}\n\n.p-imagecompare-slider:focus-visible::-moz-range-thumb {\n    box-shadow: ${dt('imagecompare.handle.focus.ring.shadow')};\n    outline: ${dt('imagecompare.handle.focus.ring.width')} ${dt('imagecompare.handle.focus.ring.style')} ${dt('imagecompare.handle.focus.ring.color')};\n    outline-offset: ${dt('imagecompare.handle.focus.ring.offset')};\n}\n    \n.p-imagecompare-slider:hover {\n    width: calc(100% + ${dt('imagecompare.handle.hover.size')});\n    margin-left: calc(-1 * calc(${dt('imagecompare.handle.hover.size')} / 2));\n}\n\n.p-imagecompare-slider:hover::-webkit-slider-thumb {\n    background: ${dt('imagecompare.handle.hover.background')};\n    border-color: ${dt('imagecompare.handle.hover.border.color')};\n    height: ${dt('imagecompare.handle.hover.size')};\n    width: ${dt('imagecompare.handle.hover.size')};\n}\n\n.p-imagecompare-slider:hover::-moz-range-thumb {\n    background: ${dt('imagecompare.handle.hover.background')};\n    border-color: ${dt('imagecompare.handle.hover.border.color')};\n    height: ${dt('imagecompare.handle.hover.size')};\n    width: ${dt('imagecompare.handle.hover.size')};\n}\n`;\n\nconst classes = {\n    root: 'p-imagecompare',\n    slider: 'p-imagecompare-slider'\n};\n\nexport default BaseStyle.extend({\n    name: 'imagecompare',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","slider","BaseStyle","extend","name"],"mappings":"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"}

package/imagecompare/style/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "./index.mjs",
+    "module": "./index.mjs",
+    "types": "./index.d.ts",
+    "sideEffects": false
+}

package/inputgroup/BaseInputGroup.vue

@@ -5,12 +5,6 @@ import InputGroupStyle from 'primevue/inputgroup/style';
 export default {
     name: 'BaseInputGroup',
     extends: BaseComponent,
-    props: {
-        fluid: {
-            type: Boolean,
-            default: null
-        }
-    },
     style: InputGroupStyle,
     provide() {
         return {

package/inputgroup/InputGroup.vue

@@ -5,20 +5,11 @@
 </template>
 
 <script>
-import { isEmpty } from '@primeuix/utils/object';
 import BaseInputGroup from './BaseInputGroup.vue';
 
 export default {
     name: 'InputGroup',
     extends: BaseInputGroup,
-    inheritAttrs: false,
-    inject: {
-        $pcFluid: { default: null }
-    },
-    computed: {
-        hasFluid() {
-            return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;
-        }
-    }
+    inheritAttrs: false
 };
 </script>

package/inputgroup/index.d.ts

@@ -67,11 +67,6 @@ export interface InputGroupPassThroughAttributes {
  * Defines valid properties in InputGroup component.
  */
 export interface InputGroupProps {
-    /**
-     * Spans 100% width of the container when enabled.
-     * @defaultValue null
-     */
-    fluid?: boolean | undefined;
     /**
      * It generates scoped CSS variables using design tokens for the component.
      */

package/inputgroup/index.mjs

@@ -1,4 +1,3 @@
-import { isEmpty } from '@primeuix/utils/object';
 import BaseComponent from '@primevue/core/basecomponent';
 import InputGroupStyle from 'primevue/inputgroup/style';
 import { openBlock, createElementBlock, mergeProps, renderSlot } from 'vue';
@@ -6,12 +5,6 @@ import { openBlock, createElementBlock, mergeProps, renderSlot } from 'vue';
 var script$1 = {
   name: 'BaseInputGroup',
   "extends": BaseComponent,
-  props: {
-    fluid: {
-      type: Boolean,
-      "default": null
-    }
-  },
   style: InputGroupStyle,
   provide: function provide() {
     return {
@@ -24,17 +17,7 @@ var script$1 = {
 var script = {
   name: 'InputGroup',
   "extends": script$1,
-  inheritAttrs: false,
-  inject: {
-    $pcFluid: {
-      "default": null
-    }
-  },
-  computed: {
-    hasFluid: function hasFluid() {
-      return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;
-    }
-  }
+  inheritAttrs: false
 };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {

package/inputgroup/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/inputgroup/BaseInputGroup.vue","../../src/inputgroup/InputGroup.vue","../../src/inputgroup/InputGroup.vue?vue&type=template&id=5a5bedce&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevue/core/basecomponent';\nimport InputGroupStyle from 'primevue/inputgroup/style';\n\nexport default {\n    name: 'BaseInputGroup',\n    extends: BaseComponent,\n    props: {\n        fluid: {\n            type: Boolean,\n            default: null\n        }\n    },\n    style: InputGroupStyle,\n    provide() {\n        return {\n            $pcInputGroup: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot />\n    </div>\n</template>\n\n<script>\nimport { isEmpty } from '@primeuix/utils/object';\nimport BaseInputGroup from './BaseInputGroup.vue';\n\nexport default {\n    name: 'InputGroup',\n    extends: BaseInputGroup,\n    inheritAttrs: false,\n    inject: {\n        $pcFluid: { default: null }\n    },\n    computed: {\n        hasFluid() {\n            return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot />\n    </div>\n</template>\n\n<script>\nimport { isEmpty } from '@primeuix/utils/object';\nimport BaseInputGroup from './BaseInputGroup.vue';\n\nexport default {\n    name: 'InputGroup',\n    extends: BaseInputGroup,\n    inheritAttrs: false,\n    inject: {\n        $pcFluid: { default: null }\n    },\n    computed: {\n        hasFluid() {\n            return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;\n        }\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","fluid","type","Boolean","style","InputGroupStyle","provide","$pcInputGroup","$parentInstance","BaseInputGroup","inheritAttrs","inject","$pcFluid","computed","hasFluid","isEmpty","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","$slots"],"mappings":";;;;;AAIA,eAAe;AACXA,EAAAA,IAAI,EAAE,gBAAgB;AACtB,EAAA,SAAA,EAASC,aAAa;AACtBC,EAAAA,KAAK,EAAE;AACHC,IAAAA,KAAK,EAAE;AACHC,MAAAA,IAAI,EAAEC,OAAO;MACb,SAAS,EAAA,IAAA;AACb,KAAA;GACH;AACDC,EAAAA,KAAK,EAAEC,eAAe;EACtBC,OAAO,EAAA,SAAPA,OAAOA,GAAG;IACN,OAAO;AACHC,MAAAA,aAAa,EAAE,IAAI;AACnBC,MAAAA,eAAe,EAAE,IAAA;KACpB,CAAA;AACL,GAAA;AACJ,CAAC;;ACVD,aAAe;AACXV,EAAAA,IAAI,EAAE,YAAY;AAClB,EAAA,SAAA,EAASW,QAAc;AACvBC,EAAAA,YAAY,EAAE,KAAK;AACnBC,EAAAA,MAAM,EAAE;AACJC,IAAAA,QAAQ,EAAE;MAAE,SAAS,EAAA,IAAA;AAAK,KAAA;GAC7B;AACDC,EAAAA,QAAQ,EAAE;IACNC,QAAQ,EAAA,SAARA,QAAQA,GAAG;AACP,MAAA,OAAOC,OAAO,CAAC,IAAI,CAACd,KAAK,CAAE,GAAE,CAAC,CAAC,IAAI,CAACW,QAAS,GAAE,IAAI,CAACX,KAAK,CAAA;AAC7D,KAAA;AACJ,GAAA;AACJ,CAAC;;;ECrBG,OAAAe,SAAA,EAAA,EAAAC,kBAAA,CAEK,OAFLC,UAEK,CAAA;AAFC,IAAA,OAAA,EAAOC,IAAE,CAAAC,EAAA,CAAA,MAAA,CAAA;KAAkBD,IAAI,CAAAE,IAAA,CAAA,MAAA,CAAA,CAAA,EAAA,CACjCC,UAAO,CAAAH,IAAA,CAAAI,MAAA,EAAA,SAAA,CAAA;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../src/inputgroup/BaseInputGroup.vue","../../src/inputgroup/InputGroup.vue","../../src/inputgroup/InputGroup.vue?vue&type=template&id=3036958d&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevue/core/basecomponent';\nimport InputGroupStyle from 'primevue/inputgroup/style';\n\nexport default {\n    name: 'BaseInputGroup',\n    extends: BaseComponent,\n    style: InputGroupStyle,\n    provide() {\n        return {\n            $pcInputGroup: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot />\n    </div>\n</template>\n\n<script>\nimport BaseInputGroup from './BaseInputGroup.vue';\n\nexport default {\n    name: 'InputGroup',\n    extends: BaseInputGroup,\n    inheritAttrs: false\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" v-bind=\"ptmi('root')\">\n        <slot />\n    </div>\n</template>\n\n<script>\nimport BaseInputGroup from './BaseInputGroup.vue';\n\nexport default {\n    name: 'InputGroup',\n    extends: BaseInputGroup,\n    inheritAttrs: false\n};\n</script>\n"],"names":["name","BaseComponent","style","InputGroupStyle","provide","$pcInputGroup","$parentInstance","BaseInputGroup","inheritAttrs","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","$slots"],"mappings":";;;;AAIA,eAAe;AACXA,EAAAA,IAAI,EAAE,gBAAgB;AACtB,EAAA,SAAA,EAASC,aAAa;AACtBC,EAAAA,KAAK,EAAEC,eAAe;EACtBC,OAAO,EAAA,SAAPA,OAAOA,GAAG;IACN,OAAO;AACHC,MAAAA,aAAa,EAAE,IAAI;AACnBC,MAAAA,eAAe,EAAE,IAAA;KACpB,CAAA;AACL,GAAA;AACJ,CAAC;;ACLD,aAAe;AACXN,EAAAA,IAAI,EAAE,YAAY;AAClB,EAAA,SAAA,EAASO,QAAc;AACvBC,EAAAA,YAAY,EAAE,KAAA;AAClB,CAAC;;;ECZG,OAAAC,SAAA,EAAA,EAAAC,kBAAA,CAEK,OAFLC,UAEK,CAAA;AAFC,IAAA,OAAA,EAAOC,IAAE,CAAAC,EAAA,CAAA,MAAA,CAAA;KAAkBD,IAAI,CAAAE,IAAA,CAAA,MAAA,CAAA,CAAA,EAAA,CACjCC,UAAO,CAAAH,IAAA,CAAAI,MAAA,EAAA,SAAA,CAAA;;;;;;;"}

package/inputgroup/style/index.mjs

@@ -2,15 +2,10 @@ import BaseStyle from '@primevue/core/base/style';
 
 var theme = function theme(_ref) {
   var dt = _ref.dt;
-  return "\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroupaddon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0.5rem;\n    background: ".concat(dt('inputgroup.addon.background'), ";\n    color: ").concat(dt('inputgroup.addon.color'), ";\n    border-top: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n    border-left: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n    border-bottom: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n    padding: 0.5rem 0.75rem;\n    min-width: 2.5rem;\n}\n\n.p-inputgroup .p-floatlabel {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-inputgroup-fluid .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-inputgroup-fluid .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n.p-inputgroupaddon:last-child {\n    border-right: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n}\n\n.p-inputgroup > .p-component,\n.p-inputgroup > .p-inputwrapper > .p-inputtext,\n.p-inputgroup > .p-floatlabel > .p-component {\n    border-radius: 0;\n    margin: 0;\n}\n\n.p-inputgroup > .p-component + .p-inputgroupaddon,\n.p-inputgroup > .p-inputwrapper > .p-inputtext + .p-inputgroupaddon,\n.p-inputgroup > .p-floatlabel > .p-component + .p-inputgroupaddon {\n    border-left: 0 none;\n}\n\n.p-inputgroup > .p-component:focus,\n.p-inputgroup > .p-inputwrapper > .p-inputtext:focus,\n.p-inputgroup > .p-floatlabel > .p-component:focus {\n    z-index: 1;\n}\n\n.p-inputgroup > .p-component:focus ~ label,\n.p-inputgroup > .p-inputwrapper > .p-inputtext:focus~label,\n.p-inputgroup > .p-floatlabel > .p-component:focus~label {\n    z-index: 1;\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroup button:first-child,\n.p-inputgroup input:first-child,\n.p-inputgroup > .p-inputwrapper:first-child,\n.p-inputgroup > .p-inputwrapper:first-child > .p-inputtext {\n    border-top-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroup .p-floatlabel:first-child input {\n    border-top-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroupaddon:last-child,\n.p-inputgroup button:last-child,\n.p-inputgroup input:last-child,\n.p-inputgroup > .p-inputwrapper:last-child,\n.p-inputgroup > .p-inputwrapper:last-child > .p-inputtext {\n    border-top-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroup .p-floatlabel:last-child input {\n    border-top-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroup-fluid .p-button {\n    width: auto;\n}\n\n.p-inputgroup-fluid .p-button.p-button-icon-only {\n    width: 2.5rem;\n}\n");
+  return "\n.p-inputgroup,\n.p-inputgroup .p-floatlabel,\n.p-inputgroup .p-iftalabel {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n.p-inputgroupaddon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ".concat(dt('inputgroup.addon.padding'), ";\n    background: ").concat(dt('inputgroup.addon.background'), ";\n    color: ").concat(dt('inputgroup.addon.color'), ";\n    border-top: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n    border-bottom: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n    min-width: ").concat(dt('inputgroup.addon.min.width'), ";\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroupaddon + .p-inputgroupaddon {\n    border-left: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n}\n\n.p-inputgroupaddon:last-child {\n    border-right: 1px solid ").concat(dt('inputgroup.addon.border.color'), ";\n}\n\n.p-inputgroup > .p-component,\n.p-inputgroup > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-floatlabel > .p-component,\n.p-inputgroup > .p-floatlabel > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel > .p-component,\n.p-inputgroup > .p-iftalabel > .p-inputwrapper > .p-component {\n    border-radius: 0;\n    margin: 0;\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroup > .p-component:first-child,\n.p-inputgroup > .p-inputwrapper:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-inputwrapper > .p-component {\n    border-top-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-left-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroupaddon:last-child,\n.p-inputgroup > .p-component:last-child,\n.p-inputgroup > .p-inputwrapper:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-inputwrapper > .p-component {\n    border-top-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n    border-bottom-right-radius: ").concat(dt('inputgroup.addon.border.radius'), ";\n}\n\n.p-inputgroup .p-component:focus,\n.p-inputgroup .p-component.p-focus,\n.p-inputgroup .p-inputwrapper-focus,\n.p-inputgroup .p-component:focus ~ label,\n.p-inputgroup .p-component.p-focus ~ label,\n.p-inputgroup .p-inputwrapper-focus ~ label {\n    z-index: 1;\n}\n\n.p-inputgroup > .p-button:not(.p-button-icon-only) {\n    width: auto;\n}\n");
 };
 var classes = {
-  root: function root(_ref2) {
-    var instance = _ref2.instance;
-    return ['p-inputgroup', {
-      'p-inputgroup-fluid': instance.hasFluid
-    }];
-  }
+  root: 'p-inputgroup'
 };
 var InputGroupStyle = BaseStyle.extend({
   name: 'inputgroup',

package/inputgroup/style/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../src/inputgroup/style/InputGroupStyle.js"],"sourcesContent":["import BaseStyle from '@primevue/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-inputgroup {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroupaddon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0.5rem;\n    background: ${dt('inputgroup.addon.background')};\n    color: ${dt('inputgroup.addon.color')};\n    border-top: 1px solid ${dt('inputgroup.addon.border.color')};\n    border-left: 1px solid ${dt('inputgroup.addon.border.color')};\n    border-bottom: 1px solid ${dt('inputgroup.addon.border.color')};\n    padding: 0.5rem 0.75rem;\n    min-width: 2.5rem;\n}\n\n.p-inputgroup .p-floatlabel {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-inputgroup-fluid .p-inputtext,\n.p-inputgroup .p-inputwrapper,\n.p-inputgroup-fluid .p-input {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n.p-inputgroupaddon:last-child {\n    border-right: 1px solid ${dt('inputgroup.addon.border.color')};\n}\n\n.p-inputgroup > .p-component,\n.p-inputgroup > .p-inputwrapper > .p-inputtext,\n.p-inputgroup > .p-floatlabel > .p-component {\n    border-radius: 0;\n    margin: 0;\n}\n\n.p-inputgroup > .p-component + .p-inputgroupaddon,\n.p-inputgroup > .p-inputwrapper > .p-inputtext + .p-inputgroupaddon,\n.p-inputgroup > .p-floatlabel > .p-component + .p-inputgroupaddon {\n    border-left: 0 none;\n}\n\n.p-inputgroup > .p-component:focus,\n.p-inputgroup > .p-inputwrapper > .p-inputtext:focus,\n.p-inputgroup > .p-floatlabel > .p-component:focus {\n    z-index: 1;\n}\n\n.p-inputgroup > .p-component:focus ~ label,\n.p-inputgroup > .p-inputwrapper > .p-inputtext:focus~label,\n.p-inputgroup > .p-floatlabel > .p-component:focus~label {\n    z-index: 1;\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroup button:first-child,\n.p-inputgroup input:first-child,\n.p-inputgroup > .p-inputwrapper:first-child,\n.p-inputgroup > .p-inputwrapper:first-child > .p-inputtext {\n    border-top-left-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-left-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroup .p-floatlabel:first-child input {\n    border-top-left-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-left-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroupaddon:last-child,\n.p-inputgroup button:last-child,\n.p-inputgroup input:last-child,\n.p-inputgroup > .p-inputwrapper:last-child,\n.p-inputgroup > .p-inputwrapper:last-child > .p-inputtext {\n    border-top-right-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-right-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroup .p-floatlabel:last-child input {\n    border-top-right-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-right-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroup-fluid .p-button {\n    width: auto;\n}\n\n.p-inputgroup-fluid .p-button.p-button-icon-only {\n    width: 2.5rem;\n}\n`;\n\nconst classes = {\n    root: ({ instance }) => [\n        'p-inputgroup',\n        {\n            'p-inputgroup-fluid': instance.hasFluid\n        }\n    ]\n};\n\nexport default BaseStyle.extend({\n    name: 'inputgroup',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","_ref2","instance","hasFluid","BaseStyle","extend","name"],"mappings":";;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CAAA;EAAA,OAAAC,mOAAAA,CAAAA,MAAA,CAYDD,EAAE,CAAC,6BAA6B,CAAC,EAAA,gBAAA,CAAA,CAAAC,MAAA,CACtCD,EAAE,CAAC,wBAAwB,CAAC,mCAAAC,MAAA,CACbD,EAAE,CAAC,+BAA+B,CAAC,EAAA,gCAAA,CAAA,CAAAC,MAAA,CAClCD,EAAE,CAAC,+BAA+B,CAAC,EAAAC,kCAAAA,CAAAA,CAAAA,MAAA,CACjCD,EAAE,CAAC,+BAA+B,CAAC,EAAA,4YAAA,CAAA,CAAAC,MAAA,CAoBpCD,EAAE,CAAC,+BAA+B,CAAC,0+BAAAC,MAAA,CAiCnCD,EAAE,CAAC,gCAAgC,CAAC,wCAAAC,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAAC,uFAAAA,CAAAA,CAAAA,MAAA,CAIvCD,EAAE,CAAC,gCAAgC,CAAC,EAAA,oCAAA,CAAA,CAAAC,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAAC,oPAAAA,CAAAA,CAAAA,MAAA,CAQtCD,EAAE,CAAC,gCAAgC,CAAC,yCAAAC,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAAC,uFAAAA,CAAAA,CAAAA,MAAA,CAIvCD,EAAE,CAAC,gCAAgC,CAAC,EAAA,qCAAA,CAAA,CAAAC,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAA,6IAAA,CAAA,CAAA;AAAA,CAUrE,CAAA;AAED,IAAME,OAAO,GAAG;AACZC,EAAAA,IAAI,EAAE,SAANA,IAAIA,CAAAC,KAAA,EAAA;AAAA,IAAA,IAAKC,QAAQ,GAAAD,KAAA,CAARC,QAAQ,CAAA;IAAA,OAAO,CACpB,cAAc,EACd;MACI,oBAAoB,EAAEA,QAAQ,CAACC,QAAAA;AACnC,KAAC,CACJ,CAAA;AAAA,GAAA;AACL,CAAC,CAAA;AAED,sBAAeC,SAAS,CAACC,MAAM,CAAC;AAC5BC,EAAAA,IAAI,EAAE,YAAY;AAClBX,EAAAA,KAAK,EAALA,KAAK;AACLI,EAAAA,OAAO,EAAPA,OAAAA;AACJ,CAAC,CAAC;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../src/inputgroup/style/InputGroupStyle.js"],"sourcesContent":["import BaseStyle from '@primevue/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-inputgroup,\n.p-inputgroup .p-floatlabel,\n.p-inputgroup .p-iftalabel {\n    display: flex;\n    align-items: stretch;\n    width: 100%;\n}\n\n.p-inputgroup .p-inputtext,\n.p-inputgroup .p-inputwrapper {\n    flex: 1 1 auto;\n    width: 1%;\n}\n\n.p-inputgroupaddon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${dt('inputgroup.addon.padding')};\n    background: ${dt('inputgroup.addon.background')};\n    color: ${dt('inputgroup.addon.color')};\n    border-top: 1px solid ${dt('inputgroup.addon.border.color')};\n    border-bottom: 1px solid ${dt('inputgroup.addon.border.color')};\n    min-width: ${dt('inputgroup.addon.min.width')};\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroupaddon + .p-inputgroupaddon {\n    border-left: 1px solid ${dt('inputgroup.addon.border.color')};\n}\n\n.p-inputgroupaddon:last-child {\n    border-right: 1px solid ${dt('inputgroup.addon.border.color')};\n}\n\n.p-inputgroup > .p-component,\n.p-inputgroup > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-floatlabel > .p-component,\n.p-inputgroup > .p-floatlabel > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel > .p-component,\n.p-inputgroup > .p-iftalabel > .p-inputwrapper > .p-component {\n    border-radius: 0;\n    margin: 0;\n}\n\n.p-inputgroupaddon:first-child,\n.p-inputgroup > .p-component:first-child,\n.p-inputgroup > .p-inputwrapper:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-component,\n.p-inputgroup > .p-floatlabel:first-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-component,\n.p-inputgroup > .p-iftalabel:first-child > .p-inputwrapper > .p-component {\n    border-top-left-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-left-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroupaddon:last-child,\n.p-inputgroup > .p-component:last-child,\n.p-inputgroup > .p-inputwrapper:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-component,\n.p-inputgroup > .p-floatlabel:last-child > .p-inputwrapper > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-component,\n.p-inputgroup > .p-iftalabel:last-child > .p-inputwrapper > .p-component {\n    border-top-right-radius: ${dt('inputgroup.addon.border.radius')};\n    border-bottom-right-radius: ${dt('inputgroup.addon.border.radius')};\n}\n\n.p-inputgroup .p-component:focus,\n.p-inputgroup .p-component.p-focus,\n.p-inputgroup .p-inputwrapper-focus,\n.p-inputgroup .p-component:focus ~ label,\n.p-inputgroup .p-component.p-focus ~ label,\n.p-inputgroup .p-inputwrapper-focus ~ label {\n    z-index: 1;\n}\n\n.p-inputgroup > .p-button:not(.p-button-icon-only) {\n    width: auto;\n}\n`;\n\nconst classes = {\n    root: 'p-inputgroup'\n};\n\nexport default BaseStyle.extend({\n    name: 'inputgroup',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","BaseStyle","extend","name"],"mappings":";;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CAAA;AAAA,EAAA,OAAA,6WAAA,CAAAC,MAAA,CAmBJD,EAAE,CAAC,0BAA0B,CAAC,EAAAC,qBAAAA,CAAAA,CAAAA,MAAA,CAC3BD,EAAE,CAAC,6BAA6B,CAAC,oBAAAC,MAAA,CACtCD,EAAE,CAAC,wBAAwB,CAAC,EAAA,+BAAA,CAAA,CAAAC,MAAA,CACbD,EAAE,CAAC,+BAA+B,CAAC,sCAAAC,MAAA,CAChCD,EAAE,CAAC,+BAA+B,CAAC,EAAA,oBAAA,CAAA,CAAAC,MAAA,CACjDD,EAAE,CAAC,4BAA4B,CAAC,EAAAC,iHAAAA,CAAAA,CAAAA,MAAA,CAKpBD,EAAE,CAAC,+BAA+B,CAAC,2EAAAC,MAAA,CAIlCD,EAAE,CAAC,+BAA+B,CAAC,EAAA,yxBAAA,CAAA,CAAAC,MAAA,CAoBnCD,EAAE,CAAC,gCAAgC,CAAC,EAAAC,oCAAAA,CAAAA,CAAAA,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAA,wbAAA,CAAA,CAAAC,MAAA,CAUtCD,EAAE,CAAC,gCAAgC,CAAC,EAAAC,qCAAAA,CAAAA,CAAAA,MAAA,CACjCD,EAAE,CAAC,gCAAgC,CAAC,EAAA,gWAAA,CAAA,CAAA;AAAA,CAerE,CAAA;AAED,IAAME,OAAO,GAAG;AACZC,EAAAA,IAAI,EAAE,cAAA;AACV,CAAC,CAAA;AAED,sBAAeC,SAAS,CAACC,MAAM,CAAC;AAC5BC,EAAAA,IAAI,EAAE,YAAY;AAClBR,EAAAA,KAAK,EAALA,KAAK;AACLI,EAAAA,OAAO,EAAPA,OAAAA;AACJ,CAAC,CAAC;;;;"}

package/inputmask/InputMask.vue

@@ -1,7 +1,7 @@
 <template>
     <InputText
         :id="id"
-        :value="modelValue"
+        :value="currentVal"
         :class="inputClass"
         :readonly="readonly"
         :disabled="disabled"
@@ -37,6 +37,11 @@ export default {
     inject: {
         $pcFluid: { default: null }
     },
+    data() {
+        return {
+            currentVal: ''
+        };
+    },
     watch: {
         mask(newMask, oldMask) {
             if (oldMask !== newMask) {
@@ -60,7 +65,7 @@ export default {
                 if (this.androidChrome) this.handleAndroidInput(event);
                 else this.handleInputChange(event);
 
-                this.$emit('update:modelValue', event.target.value);
+                this.updateModelValue(event.target.value);
             }
         },
         onFocus(event) {
@@ -96,7 +101,7 @@ export default {
         onBlur(event) {
             this.focus = false;
             this.checkVal();
-            this.updateModel(event);
+            this.updateModelValue(event.target.value);
 
             if (this.$el.value !== this.focusText) {
                 let e = document.createEvent('HTMLEvents');
@@ -133,18 +138,18 @@ export default {
 
                 this.clearBuffer(begin, end);
                 this.shiftL(begin, end - 1);
-                this.updateModel(event);
+                this.updateModelValue(event.target.value);
 
                 event.preventDefault();
             } else if (k === 'Enter') {
                 // enter
                 this.$el.blur();
-                this.updateModel(event);
+                this.updateModelValue(event.target.value);
             } else if (k === 'Escape') {
                 // escape
                 this.$el.value = this.focusText;
                 this.caret(0, this.checkVal());
-                this.updateModel(event);
+                this.updateModelValue(event.target.value);
                 event.preventDefault();
             }
 
@@ -203,7 +208,7 @@ export default {
                 event.preventDefault();
             }
 
-            this.updateModel(event);
+            this.updateModelValue(event.target.value);
 
             if (completed) {
                 this.$emit('complete', event);
@@ -420,7 +425,7 @@ export default {
             var pos = this.checkVal(true);
 
             this.caret(pos);
-            this.updateModel(event);
+            this.updateModelValue(event.target.value);
 
             if (this.isCompleted()) {
                 this.$emit('complete', event);
@@ -439,8 +444,11 @@ export default {
 
             return unmaskedBuffer.join('');
         },
-        updateModel(e) {
-            let val = this.unmask ? this.getUnmaskedValue() : e.target.value;
+
+        updateModelValue(value) {
+            const val = this.unmask ? this.getUnmaskedValue() : value;
+
+            this.currentVal = value;
 
             this.$emit('update:modelValue', this.defaultBuffer !== val ? val : '');
         },
@@ -448,7 +456,7 @@ export default {
             if (this.$el) {
                 if (this.modelValue == null) {
                     this.$el.value = '';
-                    updateModel && this.$emit('update:modelValue', '');
+                    updateModel && this.updateModelValue('');
                 } else {
                     this.$el.value = this.modelValue;
                     this.checkVal();
@@ -458,11 +466,7 @@ export default {
                             this.writeBuffer();
                             this.checkVal();
 
-                            if (updateModel) {
-                                let val = this.unmask ? this.getUnmaskedValue() : this.$el.value;
-
-                                this.$emit('update:modelValue', this.defaultBuffer !== val ? val : '');
-                            }
+                            if (updateModel) this.updateModelValue(this.$el.value);
                         }
                     }, 10);
                 }
@@ -534,7 +538,9 @@ export default {
             return [this.cx('root'), this.class];
         },
         rootPTOptions() {
-            return mergeProps(this.ptmi('root', this.ptmParams), this.ptm('pcInputText', this.ptmParams));
+            return {
+                root: mergeProps(this.ptm('pcInputText', this.ptmParams), this.ptmi('root', this.ptmParams))
+            };
         },
         ptmParams() {
             return {