primevue/imagecompare/index.mjs.map

PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc

{"version":3,"file":"index.mjs","sources":["../../src/imagecompare/BaseImageCompare.vue","../../src/imagecompare/ImageCompare.vue","../../src/imagecompare/ImageCompare.vue?vue&type=template&id=7e6a8988&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    mutationObserver: null,\n    data() {\n        return {\n            isRTL: false\n        };\n    },\n    beforeUnmount() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n        }\n    },\n    mounted() {\n        this.updateDirection();\n        this.observeDirectionChanges();\n    },\n    methods: {\n        onSlide(event) {\n            const value = event.target.value;\n            const image = event.target.previousElementSibling;\n\n            if (this.isRTL) {\n                image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;\n            } else {\n                image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;\n            }\n        },\n        updateDirection() {\n            this.isRTL = !!this.$el.closest('[dir=\"rtl\"]');\n        },\n        observeDirectionChanges() {\n            const targetNode = document.documentElement;\n            const config = { attributes: true, attributeFilter: ['dir'] };\n\n            this.mutationObserver = new MutationObserver(() => {\n                this.updateDirection();\n            });\n\n            this.mutationObserver.observe(targetNode, config);\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    mutationObserver: null,\n    data() {\n        return {\n            isRTL: false\n        };\n    },\n    beforeUnmount() {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n        }\n    },\n    mounted() {\n        this.updateDirection();\n        this.observeDirectionChanges();\n    },\n    methods: {\n        onSlide(event) {\n            const value = event.target.value;\n            const image = event.target.previousElementSibling;\n\n            if (this.isRTL) {\n                image.style.clipPath = `polygon(${100 - value}% 0, 100% 0, 100% 100%, ${100 - value}% 100%)`;\n            } else {\n                image.style.clipPath = `polygon(0 0, ${value}% 0, ${value}% 100%, 0 100%)`;\n            }\n        },\n        updateDirection() {\n            this.isRTL = !!this.$el.closest('[dir=\"rtl\"]');\n        },\n        observeDirectionChanges() {\n            const targetNode = document.documentElement;\n            const config = { attributes: true, attributeFilter: ['dir'] };\n\n            this.mutationObserver = new MutationObserver(() => {\n                this.updateDirection();\n            });\n\n            this.mutationObserver.observe(targetNode, config);\n        }\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","tabindex","type","Number","ariaLabelledby","String","ariaLabel","style","ImageCompareStyle","provide","$pcImageCompare","$parentInstance","BaseImageCompare","mutationObserver","data","isRTL","beforeUnmount","disconnect","mounted","updateDirection","observeDirectionChanges","methods","onSlide","event","value","target","image","previousElementSibling","clipPath","concat","$el","closest","_this","targetNode","document","documentElement","config","attributes","attributeFilter","MutationObserver","observe","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","$slots","_createElementVNode","min","max","onInput","$options","apply","arguments","ptm"],"mappings":"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"}