@davincihealthcare/elty-design-system-vue 1.72.1 → 1.73.0

package/dist/ElCalendarCell.vue.cjs2.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("vue"),o=require("./ElTooltip.vue.cjs2.js"),r={class:"overflow-hidden"},a={class:"truncate"},n=["purple","orange","brandBlue","green","rose","indigo","red","pink","cyan","sapphire","teal","yellow"],i=["not-available","for-doctors","for-patients"],t=l.defineComponent({__name:"ElCalendarCell",props:{height:{default:48},color:{default:void 0},availability:{default:"not-available"},label:{default:void 0}},setup(s){return(e,u)=>(l.openBlock(),l.createElementBlock("div",{class:l.normalizeClass(["grid max-w-full",{"bg-white":e.availability==="for-doctors","bg-yellow-100":e.availability==="for-patients","bg-neutral-inactive":e.availability==="not-available","grid-cols-[8px_1fr]":e.color!=null,"grid-cols-[1fr]":e.color==null}])},[e.color!=null?(l.openBlock(),l.createElementBlock("div",{key:0,class:l.normalizeClass(["w-2 h-full",{"bg-purple-400":e.color==="purple","bg-orange-400":e.color==="orange","bg-brandBlue-400":e.color==="brandBlue"||e.color==="sapphire","bg-yellow-400":e.color==="yellow","bg-rose-400":e.color==="rose","bg-indigo-400":e.color==="indigo","bg-red-400":e.color==="red","bg-pink-400":e.color==="pink","bg-cyan-400":e.color==="cyan","bg-teal-400":e.color==="teal","bg-green-400":e.color==="green"}])},null,2)):l.createCommentVNode("",!0),l.createElementVNode("div",r,[e.label?(l.openBlock(),l.createBlock(o.default,{key:0,title:e.label},{default:l.withCtx(()=>[l.createElementVNode("div",{class:l.normalizeClass(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":e.color!=null,"px-2":e.color==null}]),style:l.normalizeStyle({height:`${Math.max(12,e.height)}px`})},[l.createElementVNode("span",a,l.toDisplayString(e.label),1)],6)]),_:1},8,["title"])):(l.openBlock(),l.createElementBlock("div",{key:1,class:l.normalizeClass(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":e.color!=null,"px-2":e.color==null}]),style:l.normalizeStyle({height:`${Math.max(12,e.height)}px`})},null,6))])],2))}});exports.default=t;exports.elCalendarCellAvailabilities=i;exports.elCalendarCellColors=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("vue"),o=require("./ElTooltip.vue.cjs2.js"),a={class:"overflow-hidden"},r={class:"truncate"},i=["purple","orange","brandBlue","green","rose","indigo","red","pink","cyan","sapphire","teal","yellow"],n=["not-available","for-doctors","for-patients"],t=l.defineComponent({__name:"ElCalendarCell",props:{height:{default:48},color:{default:void 0},availability:{default:"not-available"},label:{default:void 0},showTooltipOnMobile:{type:Boolean,default:!1}},setup(s){return(e,d)=>(l.openBlock(),l.createElementBlock("div",{class:l.normalizeClass(["grid max-w-full",{"bg-white":e.availability==="for-doctors","bg-yellow-100":e.availability==="for-patients","bg-neutral-inactive":e.availability==="not-available","grid-cols-[8px_1fr]":e.color!=null,"grid-cols-[1fr]":e.color==null}])},[e.color!=null?(l.openBlock(),l.createElementBlock("div",{key:0,class:l.normalizeClass(["w-2 h-full",{"bg-purple-400":e.color==="purple","bg-orange-400":e.color==="orange","bg-brandBlue-400":e.color==="brandBlue"||e.color==="sapphire","bg-yellow-400":e.color==="yellow","bg-rose-400":e.color==="rose","bg-indigo-400":e.color==="indigo","bg-red-400":e.color==="red","bg-pink-400":e.color==="pink","bg-cyan-400":e.color==="cyan","bg-teal-400":e.color==="teal","bg-green-400":e.color==="green"}])},null,2)):l.createCommentVNode("",!0),l.createElementVNode("div",a,[e.label?(l.openBlock(),l.createBlock(o.default,{key:0,title:e.label,"hide-on-mobile":!e.showTooltipOnMobile},{default:l.withCtx(()=>[l.createElementVNode("div",{class:l.normalizeClass(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":e.color!=null,"px-2":e.color==null}]),style:l.normalizeStyle({height:`${Math.max(12,e.height)}px`})},[l.createElementVNode("span",r,l.toDisplayString(e.label),1)],6)]),_:1},8,["title","hide-on-mobile"])):(l.openBlock(),l.createElementBlock("div",{key:1,class:l.normalizeClass(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":e.color!=null,"px-2":e.color==null}]),style:l.normalizeStyle({height:`${Math.max(12,e.height)}px`})},null,6))])],2))}});exports.default=t;exports.elCalendarCellAvailabilities=n;exports.elCalendarCellColors=i;
 //# sourceMappingURL=ElCalendarCell.vue.cjs2.js.map

package/dist/ElCalendarCell.vue.cjs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElCalendarCell.vue.cjs2.js","sources":["../src/ElCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCalendarCellColors = [\n  'purple',\n  'orange',\n  'brandBlue',\n  'green',\n  'rose',\n  'indigo',\n  'red',\n  'pink',\n  'cyan',\n  'sapphire',\n  'teal',\n  'yellow',\n] as const;\nexport type ElCalendarCellColor = (typeof elCalendarCellColors)[number];\n\nexport const elCalendarCellAvailabilities = ['not-available', 'for-doctors', 'for-patients'] as const;\nexport type ElCalendarCellAvailability = (typeof elCalendarCellAvailabilities)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElTooltip from '@/ElTooltip.vue';\n\nwithDefaults(\n  defineProps<{\n    height?: number;\n    color?: ElCalendarCellColor;\n    availability?: ElCalendarCellAvailability;\n    label?: string;\n  }>(),\n  {\n    height: 48,\n    color: undefined,\n    availability: 'not-available',\n    label: undefined,\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"grid max-w-full\"\n    :class=\"{\n      'bg-white': availability === 'for-doctors',\n      'bg-yellow-100': availability === 'for-patients',\n      'bg-neutral-inactive': availability === 'not-available',\n      'grid-cols-[8px_1fr]': color != null,\n      'grid-cols-[1fr]': color == null,\n    }\"\n  >\n    <div\n      v-if=\"color != null\"\n      class=\"w-2 h-full\"\n      :class=\"{\n        'bg-purple-400': color === 'purple',\n        'bg-orange-400': color === 'orange',\n        'bg-brandBlue-400': color === 'brandBlue' || color === 'sapphire',\n        'bg-yellow-400': color === 'yellow',\n        'bg-rose-400': color === 'rose',\n        'bg-indigo-400': color === 'indigo',\n        'bg-red-400': color === 'red',\n        'bg-pink-400': color === 'pink',\n        'bg-cyan-400': color === 'cyan',\n        'bg-teal-400': color === 'teal',\n        'bg-green-400': color === 'green',\n      }\"\n    />\n    <div class=\"overflow-hidden\">\n      <ElTooltip v-if=\"label\" :title=\"label\">\n        <div\n          class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n          :class=\"{\n            'px-1': color != null,\n            'px-2': color == null,\n          }\"\n          :style=\"{ height: `${Math.max(12, height)}px` }\"\n        >\n          <span class=\"truncate\">\n            {{ label }}\n          </span>\n        </div>\n      </ElTooltip>\n      <div\n        v-else\n        class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n        :class=\"{\n          'px-1': color != null,\n          'px-2': color == null,\n        }\"\n        :style=\"{ height: `${Math.max(12, height)}px` }\"\n      />\n    </div>\n  </div>\n</template>\n"],"names":["elCalendarCellColors","elCalendarCellAvailabilities"],"mappings":"yNACaA,EAAuB,CAClC,SACA,SACA,YACA,QACA,OACA,SACA,MACA,OACA,OACA,WACA,OACA,QACF,EAGaC,EAA+B,CAAC,gBAAiB,cAAe,cAAc"}
+{"version":3,"file":"ElCalendarCell.vue.cjs2.js","sources":["../src/ElCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCalendarCellColors = [\n  'purple',\n  'orange',\n  'brandBlue',\n  'green',\n  'rose',\n  'indigo',\n  'red',\n  'pink',\n  'cyan',\n  'sapphire',\n  'teal',\n  'yellow',\n] as const;\nexport type ElCalendarCellColor = (typeof elCalendarCellColors)[number];\n\nexport const elCalendarCellAvailabilities = ['not-available', 'for-doctors', 'for-patients'] as const;\nexport type ElCalendarCellAvailability = (typeof elCalendarCellAvailabilities)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElTooltip from '@/ElTooltip.vue';\n\nwithDefaults(\n  defineProps<{\n    height?: number;\n    color?: ElCalendarCellColor;\n    availability?: ElCalendarCellAvailability;\n    label?: string;\n    showTooltipOnMobile?: boolean;\n  }>(),\n  {\n    height: 48,\n    color: undefined,\n    availability: 'not-available',\n    label: undefined,\n    showTooltipOnMobile: false,\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"grid max-w-full\"\n    :class=\"{\n      'bg-white': availability === 'for-doctors',\n      'bg-yellow-100': availability === 'for-patients',\n      'bg-neutral-inactive': availability === 'not-available',\n      'grid-cols-[8px_1fr]': color != null,\n      'grid-cols-[1fr]': color == null,\n    }\"\n  >\n    <div\n      v-if=\"color != null\"\n      class=\"w-2 h-full\"\n      :class=\"{\n        'bg-purple-400': color === 'purple',\n        'bg-orange-400': color === 'orange',\n        'bg-brandBlue-400': color === 'brandBlue' || color === 'sapphire',\n        'bg-yellow-400': color === 'yellow',\n        'bg-rose-400': color === 'rose',\n        'bg-indigo-400': color === 'indigo',\n        'bg-red-400': color === 'red',\n        'bg-pink-400': color === 'pink',\n        'bg-cyan-400': color === 'cyan',\n        'bg-teal-400': color === 'teal',\n        'bg-green-400': color === 'green',\n      }\"\n    />\n    <div class=\"overflow-hidden\">\n      <ElTooltip v-if=\"label\" :title=\"label\" :hide-on-mobile=\"!showTooltipOnMobile\">\n        <div\n          class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n          :class=\"{\n            'px-1': color != null,\n            'px-2': color == null,\n          }\"\n          :style=\"{ height: `${Math.max(12, height)}px` }\"\n        >\n          <span class=\"truncate\">\n            {{ label }}\n          </span>\n        </div>\n      </ElTooltip>\n      <div\n        v-else\n        class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n        :class=\"{\n          'px-1': color != null,\n          'px-2': color == null,\n        }\"\n        :style=\"{ height: `${Math.max(12, height)}px` }\"\n      />\n    </div>\n  </div>\n</template>\n"],"names":["elCalendarCellColors","elCalendarCellAvailabilities"],"mappings":"yNACaA,EAAuB,CAClC,SACA,SACA,YACA,QACA,OACA,SACA,MACA,OACA,OACA,WACA,OACA,QACF,EAGaC,EAA+B,CAAC,gBAAiB,cAAe,cAAc"}

package/dist/ElCalendarCell.vue.d.ts

@@ -7,25 +7,30 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     color?: ElCalendarCellColor;
     availability?: ElCalendarCellAvailability;
     label?: string;
+    showTooltipOnMobile?: boolean;
 }>, {
     height: number;
     color: undefined;
     availability: string;
     label: undefined;
+    showTooltipOnMobile: boolean;
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     height?: number;
     color?: ElCalendarCellColor;
     availability?: ElCalendarCellAvailability;
     label?: string;
+    showTooltipOnMobile?: boolean;
 }>, {
     height: number;
     color: undefined;
     availability: string;
     label: undefined;
+    showTooltipOnMobile: boolean;
 }>>>, {
     label: string;
     color: ElCalendarCellColor;
     height: number;
+    showTooltipOnMobile: boolean;
     availability: ElCalendarCellAvailability;
 }, {}>;
 export default _default;

package/dist/ElCalendarCell.vue.esm2.js

@@ -1,2 +1,2 @@
-import{defineComponent as n,openBlock as e,createElementBlock as r,normalizeClass as o,createCommentVNode as t,createElementVNode as a,createBlock as s,withCtx as d,normalizeStyle as i,toDisplayString as p}from"vue";import u from"./ElTooltip.vue.esm2.js";const g={class:"overflow-hidden"},c={class:"truncate"},m=["purple","orange","brandBlue","green","rose","indigo","red","pink","cyan","sapphire","teal","yellow"],v=["not-available","for-doctors","for-patients"],k=n({__name:"ElCalendarCell",props:{height:{default:48},color:{default:void 0},availability:{default:"not-available"},label:{default:void 0}},setup(b){return(l,f)=>(e(),r("div",{class:o(["grid max-w-full",{"bg-white":l.availability==="for-doctors","bg-yellow-100":l.availability==="for-patients","bg-neutral-inactive":l.availability==="not-available","grid-cols-[8px_1fr]":l.color!=null,"grid-cols-[1fr]":l.color==null}])},[l.color!=null?(e(),r("div",{key:0,class:o(["w-2 h-full",{"bg-purple-400":l.color==="purple","bg-orange-400":l.color==="orange","bg-brandBlue-400":l.color==="brandBlue"||l.color==="sapphire","bg-yellow-400":l.color==="yellow","bg-rose-400":l.color==="rose","bg-indigo-400":l.color==="indigo","bg-red-400":l.color==="red","bg-pink-400":l.color==="pink","bg-cyan-400":l.color==="cyan","bg-teal-400":l.color==="teal","bg-green-400":l.color==="green"}])},null,2)):t("",!0),a("div",g,[l.label?(e(),s(u,{key:0,title:l.label},{default:d(()=>[a("div",{class:o(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":l.color!=null,"px-2":l.color==null}]),style:i({height:`${Math.max(12,l.height)}px`})},[a("span",c,p(l.label),1)],6)]),_:1},8,["title"])):(e(),r("div",{key:1,class:o(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":l.color!=null,"px-2":l.color==null}]),style:i({height:`${Math.max(12,l.height)}px`})},null,6))])],2))}});export{k as default,v as elCalendarCellAvailabilities,m as elCalendarCellColors};
+import{defineComponent as n,openBlock as e,createElementBlock as r,normalizeClass as o,createCommentVNode as t,createElementVNode as a,createBlock as s,withCtx as d,normalizeStyle as i,toDisplayString as p}from"vue";import u from"./ElTooltip.vue.esm2.js";const b={class:"overflow-hidden"},g={class:"truncate"},y=["purple","orange","brandBlue","green","rose","indigo","red","pink","cyan","sapphire","teal","yellow"],v=["not-available","for-doctors","for-patients"],k=n({__name:"ElCalendarCell",props:{height:{default:48},color:{default:void 0},availability:{default:"not-available"},label:{default:void 0},showTooltipOnMobile:{type:Boolean,default:!1}},setup(c){return(l,f)=>(e(),r("div",{class:o(["grid max-w-full",{"bg-white":l.availability==="for-doctors","bg-yellow-100":l.availability==="for-patients","bg-neutral-inactive":l.availability==="not-available","grid-cols-[8px_1fr]":l.color!=null,"grid-cols-[1fr]":l.color==null}])},[l.color!=null?(e(),r("div",{key:0,class:o(["w-2 h-full",{"bg-purple-400":l.color==="purple","bg-orange-400":l.color==="orange","bg-brandBlue-400":l.color==="brandBlue"||l.color==="sapphire","bg-yellow-400":l.color==="yellow","bg-rose-400":l.color==="rose","bg-indigo-400":l.color==="indigo","bg-red-400":l.color==="red","bg-pink-400":l.color==="pink","bg-cyan-400":l.color==="cyan","bg-teal-400":l.color==="teal","bg-green-400":l.color==="green"}])},null,2)):t("",!0),a("div",b,[l.label?(e(),s(u,{key:0,title:l.label,"hide-on-mobile":!l.showTooltipOnMobile},{default:d(()=>[a("div",{class:o(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":l.color!=null,"px-2":l.color==null}]),style:i({height:`${Math.max(12,l.height)}px`})},[a("span",g,p(l.label),1)],6)]),_:1},8,["title","hide-on-mobile"])):(e(),r("div",{key:1,class:o(["flex flex-col justify-center text-sm text-neutral-darker cursor-pointer",{"px-1":l.color!=null,"px-2":l.color==null}]),style:i({height:`${Math.max(12,l.height)}px`})},null,6))])],2))}});export{k as default,v as elCalendarCellAvailabilities,y as elCalendarCellColors};
 //# sourceMappingURL=ElCalendarCell.vue.esm2.js.map

package/dist/ElCalendarCell.vue.esm2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElCalendarCell.vue.esm2.js","sources":["../src/ElCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCalendarCellColors = [\n  'purple',\n  'orange',\n  'brandBlue',\n  'green',\n  'rose',\n  'indigo',\n  'red',\n  'pink',\n  'cyan',\n  'sapphire',\n  'teal',\n  'yellow',\n] as const;\nexport type ElCalendarCellColor = (typeof elCalendarCellColors)[number];\n\nexport const elCalendarCellAvailabilities = ['not-available', 'for-doctors', 'for-patients'] as const;\nexport type ElCalendarCellAvailability = (typeof elCalendarCellAvailabilities)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElTooltip from '@/ElTooltip.vue';\n\nwithDefaults(\n  defineProps<{\n    height?: number;\n    color?: ElCalendarCellColor;\n    availability?: ElCalendarCellAvailability;\n    label?: string;\n  }>(),\n  {\n    height: 48,\n    color: undefined,\n    availability: 'not-available',\n    label: undefined,\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"grid max-w-full\"\n    :class=\"{\n      'bg-white': availability === 'for-doctors',\n      'bg-yellow-100': availability === 'for-patients',\n      'bg-neutral-inactive': availability === 'not-available',\n      'grid-cols-[8px_1fr]': color != null,\n      'grid-cols-[1fr]': color == null,\n    }\"\n  >\n    <div\n      v-if=\"color != null\"\n      class=\"w-2 h-full\"\n      :class=\"{\n        'bg-purple-400': color === 'purple',\n        'bg-orange-400': color === 'orange',\n        'bg-brandBlue-400': color === 'brandBlue' || color === 'sapphire',\n        'bg-yellow-400': color === 'yellow',\n        'bg-rose-400': color === 'rose',\n        'bg-indigo-400': color === 'indigo',\n        'bg-red-400': color === 'red',\n        'bg-pink-400': color === 'pink',\n        'bg-cyan-400': color === 'cyan',\n        'bg-teal-400': color === 'teal',\n        'bg-green-400': color === 'green',\n      }\"\n    />\n    <div class=\"overflow-hidden\">\n      <ElTooltip v-if=\"label\" :title=\"label\">\n        <div\n          class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n          :class=\"{\n            'px-1': color != null,\n            'px-2': color == null,\n          }\"\n          :style=\"{ height: `${Math.max(12, height)}px` }\"\n        >\n          <span class=\"truncate\">\n            {{ label }}\n          </span>\n        </div>\n      </ElTooltip>\n      <div\n        v-else\n        class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n        :class=\"{\n          'px-1': color != null,\n          'px-2': color == null,\n        }\"\n        :style=\"{ height: `${Math.max(12, height)}px` }\"\n      />\n    </div>\n  </div>\n</template>\n"],"names":["elCalendarCellColors","elCalendarCellAvailabilities"],"mappings":"sTACaA,EAAuB,CAClC,SACA,SACA,YACA,QACA,OACA,SACA,MACA,OACA,OACA,WACA,OACA,QACF,EAGaC,EAA+B,CAAC,gBAAiB,cAAe,cAAc"}
+{"version":3,"file":"ElCalendarCell.vue.esm2.js","sources":["../src/ElCalendarCell.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCalendarCellColors = [\n  'purple',\n  'orange',\n  'brandBlue',\n  'green',\n  'rose',\n  'indigo',\n  'red',\n  'pink',\n  'cyan',\n  'sapphire',\n  'teal',\n  'yellow',\n] as const;\nexport type ElCalendarCellColor = (typeof elCalendarCellColors)[number];\n\nexport const elCalendarCellAvailabilities = ['not-available', 'for-doctors', 'for-patients'] as const;\nexport type ElCalendarCellAvailability = (typeof elCalendarCellAvailabilities)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElTooltip from '@/ElTooltip.vue';\n\nwithDefaults(\n  defineProps<{\n    height?: number;\n    color?: ElCalendarCellColor;\n    availability?: ElCalendarCellAvailability;\n    label?: string;\n    showTooltipOnMobile?: boolean;\n  }>(),\n  {\n    height: 48,\n    color: undefined,\n    availability: 'not-available',\n    label: undefined,\n    showTooltipOnMobile: false,\n  },\n);\n</script>\n\n<template>\n  <div\n    class=\"grid max-w-full\"\n    :class=\"{\n      'bg-white': availability === 'for-doctors',\n      'bg-yellow-100': availability === 'for-patients',\n      'bg-neutral-inactive': availability === 'not-available',\n      'grid-cols-[8px_1fr]': color != null,\n      'grid-cols-[1fr]': color == null,\n    }\"\n  >\n    <div\n      v-if=\"color != null\"\n      class=\"w-2 h-full\"\n      :class=\"{\n        'bg-purple-400': color === 'purple',\n        'bg-orange-400': color === 'orange',\n        'bg-brandBlue-400': color === 'brandBlue' || color === 'sapphire',\n        'bg-yellow-400': color === 'yellow',\n        'bg-rose-400': color === 'rose',\n        'bg-indigo-400': color === 'indigo',\n        'bg-red-400': color === 'red',\n        'bg-pink-400': color === 'pink',\n        'bg-cyan-400': color === 'cyan',\n        'bg-teal-400': color === 'teal',\n        'bg-green-400': color === 'green',\n      }\"\n    />\n    <div class=\"overflow-hidden\">\n      <ElTooltip v-if=\"label\" :title=\"label\" :hide-on-mobile=\"!showTooltipOnMobile\">\n        <div\n          class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n          :class=\"{\n            'px-1': color != null,\n            'px-2': color == null,\n          }\"\n          :style=\"{ height: `${Math.max(12, height)}px` }\"\n        >\n          <span class=\"truncate\">\n            {{ label }}\n          </span>\n        </div>\n      </ElTooltip>\n      <div\n        v-else\n        class=\"flex flex-col justify-center text-sm text-neutral-darker cursor-pointer\"\n        :class=\"{\n          'px-1': color != null,\n          'px-2': color == null,\n        }\"\n        :style=\"{ height: `${Math.max(12, height)}px` }\"\n      />\n    </div>\n  </div>\n</template>\n"],"names":["elCalendarCellColors","elCalendarCellAvailabilities"],"mappings":"sTACaA,EAAuB,CAClC,SACA,SACA,YACA,QACA,OACA,SACA,MACA,OACA,OACA,WACA,OACA,QACF,EAGaC,EAA+B,CAAC,gBAAiB,cAAe,cAAc"}

package/dist/ElIconButton.vue.cjs2.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue"),d=require("./ElIcon.vue.cjs2.js"),u=require("./ElBadge.vue.cjs2.js"),p=require("./ElTooltip.vue.cjs2.js"),c=["data-cy"],m={key:0,class:"inline-flex items-center justify-center"},h=o.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),g=o.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"},null,-1),v=[h,g],f=["xs","sm","base","l","xl"],y=o.defineComponent({__name:"ElIconButton",props:{icon:{},tooltip:{default:void 0},tooltipDelay:{default:600},disabled:{type:Boolean,default:!1},size:{default:"base"},loading:{type:Boolean,default:!1},badge:{type:[String,Boolean],default:!1},badgeColor:{default:"primary"},error:{type:Boolean,default:!1}},emits:["click"],setup(i,{emit:r}){const t=i,a=r,n=o.computed(()=>t.badge!==!1&&!t.error&&!t.disabled&&!t.loading),l=o.computed(()=>t.disabled||t.loading||!1);return(e,s)=>(o.openBlock(),o.createBlock(p.default,{title:e.tooltip??"",position:"top-right","delay-time":t.tooltipDelay,"hide-on-mobile":""},{default:o.withCtx(()=>[o.createElementVNode("button",{class:o.normalizeClass(["relative flex items-center justify-center outline-none",{"h-6 w-6 rounded":e.size==="xs","h-7 w-7 rounded":e.size==="sm","h-8 w-8 rounded-md":e.size==="base","h-10 w-10 rounded-md":e.size==="l","h-12 w-12 rounded-md":e.size==="xl","cursor-not-allowed":l.value,"text-neutral-inactive":l.value,"hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent":!l.value&&e.error,"text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed":!l.value&&!e.error}]),type:"button","data-cy":e.tooltip?`${e.tooltip.trim().replaceAll(" ","")}-icon-button`:"icon-button",onClick:s[0]||(s[0]=b=>l.value?void 0:a("click"))},[e.loading?(o.openBlock(),o.createElementBlock("span",m,[(o.openBlock(),o.createElementBlock("svg",{class:o.normalizeClass(["animate-spin",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},v,2))])):(o.openBlock(),o.createBlock(d.default,{key:1,disabled:l.value,name:e.icon.name,solid:e.icon.solid,class:o.normalizeClass(["transition duration-150 ease-in-out",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}])},null,8,["disabled","name","solid","class"])),n.value?(o.openBlock(),o.createBlock(u.default,{key:2,color:t.badgeColor,value:typeof e.badge=="string"?e.badge:void 0,class:o.normalizeClass({"top-[2px] right-[1px]":e.size==="xs","top-[2px] right-[2px]":e.size==="sm","top-[4px] right-[4px]":e.size==="base","top-[5px] right-[5px]":e.size==="l","top-[6px] right-[6px]":e.size==="xl"})},null,8,["color","value","class"])):o.createCommentVNode("",!0)],10,c)]),_:1},8,["title","delay-time"]))}});exports.default=y;exports.elIconButtonSizes=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue"),d=require("./ElIcon.vue.cjs2.js"),u=require("./ElBadge.vue.cjs2.js"),p=require("./ElTooltip.vue.cjs2.js"),c=["data-cy"],m={key:0,class:"inline-flex items-center justify-center"},h=o.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),g=o.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"},null,-1),v=[h,g],b=["xs","sm","base","l","xl"],f=o.defineComponent({__name:"ElIconButton",props:{icon:{},tooltip:{default:void 0},tooltipDelay:{default:600},disabled:{type:Boolean,default:!1},size:{default:"base"},loading:{type:Boolean,default:!1},badge:{type:[String,Boolean],default:!1},badgeColor:{default:"primary"},error:{type:Boolean,default:!1},showTooltipOnMobile:{type:Boolean,default:!1}},emits:["click"],setup(i,{emit:a}){const l=i,r=a,n=o.computed(()=>l.badge!==!1&&!l.error&&!l.disabled&&!l.loading),t=o.computed(()=>l.disabled||l.loading||!1);return(e,s)=>(o.openBlock(),o.createBlock(p.default,{title:e.tooltip??"",position:"top-right","delay-time":l.tooltipDelay,"hide-on-mobile":!e.showTooltipOnMobile},{default:o.withCtx(()=>[o.createElementVNode("button",{class:o.normalizeClass(["relative flex items-center justify-center outline-none",{"h-6 w-6 rounded":e.size==="xs","h-7 w-7 rounded":e.size==="sm","h-8 w-8 rounded-md":e.size==="base","h-10 w-10 rounded-md":e.size==="l","h-12 w-12 rounded-md":e.size==="xl","cursor-not-allowed":t.value,"text-neutral-inactive":t.value,"hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent":!t.value&&e.error,"text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed":!t.value&&!e.error}]),type:"button","data-cy":e.tooltip?`${e.tooltip.trim().replaceAll(" ","")}-icon-button`:"icon-button",onClick:s[0]||(s[0]=y=>t.value?void 0:r("click"))},[e.loading?(o.openBlock(),o.createElementBlock("span",m,[(o.openBlock(),o.createElementBlock("svg",{class:o.normalizeClass(["animate-spin",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},v,2))])):(o.openBlock(),o.createBlock(d.default,{key:1,disabled:t.value,name:e.icon.name,solid:e.icon.solid,class:o.normalizeClass(["transition duration-150 ease-in-out",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}])},null,8,["disabled","name","solid","class"])),n.value?(o.openBlock(),o.createBlock(u.default,{key:2,color:l.badgeColor,value:typeof e.badge=="string"?e.badge:void 0,class:o.normalizeClass({"top-[2px] right-[1px]":e.size==="xs","top-[2px] right-[2px]":e.size==="sm","top-[4px] right-[4px]":e.size==="base","top-[5px] right-[5px]":e.size==="l","top-[6px] right-[6px]":e.size==="xl"})},null,8,["color","value","class"])):o.createCommentVNode("",!0)],10,c)]),_:1},8,["title","delay-time","hide-on-mobile"]))}});exports.default=f;exports.elIconButtonSizes=b;
 //# sourceMappingURL=ElIconButton.vue.cjs2.js.map

package/dist/ElIconButton.vue.cjs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElIconButton.vue.cjs2.js","sources":["../src/ElIconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elIconButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElIconButtonSize = (typeof elIconButtonSizes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { computed } from 'vue';\nimport ElBadge, { ElBadgeColors } from '@/ElBadge.vue';\nimport ElTooltip from '@/ElTooltip.vue';\n\nexport interface ElIconButtonProps {\n  icon: ElIconProps;\n  tooltip?: string;\n  tooltipDelay?: string | number;\n  disabled?: boolean;\n  size?: ElIconButtonSize;\n  loading?: boolean;\n  badge?: string | boolean;\n  badgeColor?: ElBadgeColors;\n  error?: boolean;\n}\n\nconst props = withDefaults(defineProps<ElIconButtonProps>(), {\n  tooltip: undefined,\n  tooltipDelay: 600,\n  size: 'base',\n  badgeColor: 'primary',\n  disabled: false,\n  loading: false,\n  badge: false,\n  error: false,\n});\n\nconst emit = defineEmits<{\n  (event: 'click'): void;\n}>();\n\nconst showBadge = computed(() => props.badge !== false && !props.error && !props.disabled && !props.loading);\nconst disabled = computed(() => props.disabled || props.loading || false);\n</script>\n\n<template>\n  <ElTooltip :title=\"tooltip ?? ''\" position=\"top-right\" :delay-time=\"props.tooltipDelay\" hide-on-mobile>\n    <button\n      class=\"relative flex items-center justify-center outline-none\"\n      :class=\"{\n        'h-6 w-6 rounded': size === 'xs',\n        'h-7 w-7 rounded': size === 'sm',\n        'h-8 w-8 rounded-md': size === 'base',\n        'h-10 w-10 rounded-md': size === 'l',\n        'h-12 w-12 rounded-md': size === 'xl',\n        'cursor-not-allowed': disabled,\n        'text-neutral-inactive': disabled,\n        'hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent': !disabled && error,\n        'text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed':\n          !disabled && !error,\n      }\"\n      type=\"button\"\n      :data-cy=\"tooltip ? `${tooltip.trim().replaceAll(' ', '')}-icon-button` : 'icon-button'\"\n      @click=\"disabled ? undefined : emit('click')\"\n    >\n      <span v-if=\"loading\" class=\"inline-flex items-center justify-center\">\n        <svg\n          class=\"animate-spin\"\n          :class=\"{\n            'h-4 w-4': size === 'xs',\n            'h-5 w-5': size === 'sm',\n            'h-6 w-6': size === 'base',\n            'h-8 w-8': size === 'l',\n            'h-10 w-10': size === 'xl',\n          }\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n        >\n          <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" />\n          <path\n            class=\"opacity-75\"\n            fill=\"currentColor\"\n            d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n          />\n        </svg>\n      </span>\n\n      <ElIcon\n        v-else\n        :disabled=\"disabled\"\n        :name=\"icon.name\"\n        :solid=\"icon.solid\"\n        class=\"transition duration-150 ease-in-out\"\n        :class=\"{\n          'h-4 w-4': size === 'xs',\n          'h-5 w-5': size === 'sm',\n          'h-6 w-6': size === 'base',\n          'h-8 w-8': size === 'l',\n          'h-10 w-10': size === 'xl',\n        }\"\n      />\n      <ElBadge\n        v-if=\"showBadge\"\n        :color=\"props.badgeColor\"\n        :value=\"typeof badge === 'string' ? badge : undefined\"\n        :class=\"{\n          'top-[2px] right-[1px]': size === 'xs',\n          'top-[2px] right-[2px]': size === 'sm',\n          'top-[4px] right-[4px]': size === 'base',\n          'top-[5px] right-[5px]': size === 'l',\n          'top-[6px] right-[6px]': size === 'xl',\n        }\"\n      />\n    </button>\n  </ElTooltip>\n</template>\n"],"names":["elIconButtonSizes","props","__props","emit","__emit","showBadge","computed","disabled"],"mappings":"+nBACaA,EAAoB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,sVAsB/D,MAAMC,EAAQC,EAWRC,EAAOC,EAIPC,EAAYC,EAAA,SAAS,IAAML,EAAM,QAAU,IAAS,CAACA,EAAM,OAAS,CAACA,EAAM,UAAY,CAACA,EAAM,OAAO,EACrGM,EAAWD,EAAS,SAAA,IAAML,EAAM,UAAYA,EAAM,SAAW,EAAK"}
+{"version":3,"file":"ElIconButton.vue.cjs2.js","sources":["../src/ElIconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elIconButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElIconButtonSize = (typeof elIconButtonSizes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { computed } from 'vue';\nimport ElBadge, { ElBadgeColors } from '@/ElBadge.vue';\nimport ElTooltip from '@/ElTooltip.vue';\n\nexport interface ElIconButtonProps {\n  icon: ElIconProps;\n  tooltip?: string;\n  tooltipDelay?: string | number;\n  disabled?: boolean;\n  size?: ElIconButtonSize;\n  loading?: boolean;\n  badge?: string | boolean;\n  badgeColor?: ElBadgeColors;\n  error?: boolean;\n  showTooltipOnMobile?: boolean;\n}\n\nconst props = withDefaults(defineProps<ElIconButtonProps>(), {\n  tooltip: undefined,\n  tooltipDelay: 600,\n  size: 'base',\n  badgeColor: 'primary',\n  disabled: false,\n  loading: false,\n  badge: false,\n  error: false,\n  showTooltipOnMobile: false,\n});\n\nconst emit = defineEmits<{\n  (event: 'click'): void;\n}>();\n\nconst showBadge = computed(() => props.badge !== false && !props.error && !props.disabled && !props.loading);\nconst disabled = computed(() => props.disabled || props.loading || false);\n</script>\n\n<template>\n  <ElTooltip :title=\"tooltip ?? ''\" position=\"top-right\" :delay-time=\"props.tooltipDelay\" :hide-on-mobile=\"!showTooltipOnMobile\">\n    <button\n      class=\"relative flex items-center justify-center outline-none\"\n      :class=\"{\n        'h-6 w-6 rounded': size === 'xs',\n        'h-7 w-7 rounded': size === 'sm',\n        'h-8 w-8 rounded-md': size === 'base',\n        'h-10 w-10 rounded-md': size === 'l',\n        'h-12 w-12 rounded-md': size === 'xl',\n        'cursor-not-allowed': disabled,\n        'text-neutral-inactive': disabled,\n        'hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent': !disabled && error,\n        'text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed':\n          !disabled && !error,\n      }\"\n      type=\"button\"\n      :data-cy=\"tooltip ? `${tooltip.trim().replaceAll(' ', '')}-icon-button` : 'icon-button'\"\n      @click=\"disabled ? undefined : emit('click')\"\n    >\n      <span v-if=\"loading\" class=\"inline-flex items-center justify-center\">\n        <svg\n          class=\"animate-spin\"\n          :class=\"{\n            'h-4 w-4': size === 'xs',\n            'h-5 w-5': size === 'sm',\n            'h-6 w-6': size === 'base',\n            'h-8 w-8': size === 'l',\n            'h-10 w-10': size === 'xl',\n          }\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n        >\n          <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" />\n          <path\n            class=\"opacity-75\"\n            fill=\"currentColor\"\n            d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n          />\n        </svg>\n      </span>\n\n      <ElIcon\n        v-else\n        :disabled=\"disabled\"\n        :name=\"icon.name\"\n        :solid=\"icon.solid\"\n        class=\"transition duration-150 ease-in-out\"\n        :class=\"{\n          'h-4 w-4': size === 'xs',\n          'h-5 w-5': size === 'sm',\n          'h-6 w-6': size === 'base',\n          'h-8 w-8': size === 'l',\n          'h-10 w-10': size === 'xl',\n        }\"\n      />\n      <ElBadge\n        v-if=\"showBadge\"\n        :color=\"props.badgeColor\"\n        :value=\"typeof badge === 'string' ? badge : undefined\"\n        :class=\"{\n          'top-[2px] right-[1px]': size === 'xs',\n          'top-[2px] right-[2px]': size === 'sm',\n          'top-[4px] right-[4px]': size === 'base',\n          'top-[5px] right-[5px]': size === 'l',\n          'top-[6px] right-[6px]': size === 'xl',\n        }\"\n      />\n    </button>\n  </ElTooltip>\n</template>\n"],"names":["elIconButtonSizes","props","__props","emit","__emit","showBadge","computed","disabled"],"mappings":"+nBACaA,EAAoB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,oYAuB/D,MAAMC,EAAQC,EAYRC,EAAOC,EAIPC,EAAYC,EAAA,SAAS,IAAML,EAAM,QAAU,IAAS,CAACA,EAAM,OAAS,CAACA,EAAM,UAAY,CAACA,EAAM,OAAO,EACrGM,EAAWD,EAAS,SAAA,IAAML,EAAM,UAAYA,EAAM,SAAW,EAAK"}

package/dist/ElIconButton.vue.d.ts

@@ -11,6 +11,7 @@ export interface ElIconButtonProps {
     badge?: string | boolean;
     badgeColor?: ElBadgeColors;
     error?: boolean;
+    showTooltipOnMobile?: boolean;
 }
 export declare const elIconButtonSizes: readonly ["xs", "sm", "base", "l", "xl"];
 export type ElIconButtonSize = (typeof elIconButtonSizes)[number];
@@ -23,6 +24,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     loading: boolean;
     badge: boolean;
     error: boolean;
+    showTooltipOnMobile: boolean;
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     click: () => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ElIconButtonProps>, {
@@ -34,6 +36,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     loading: boolean;
     badge: boolean;
     error: boolean;
+    showTooltipOnMobile: boolean;
 }>>> & {
     onClick?: (() => any) | undefined;
 }, {
@@ -45,6 +48,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     tooltip: string;
     tooltipDelay: string | number;
     badgeColor: ElBadgeColors;
+    showTooltipOnMobile: boolean;
 }, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/dist/ElIconButton.vue.esm2.js

@@ -1,2 +1,2 @@
-import{defineComponent as c,computed as n,openBlock as i,createBlock as l,withCtx as f,createElementVNode as r,normalizeClass as t,createElementBlock as d,createCommentVNode as g}from"vue";import b from"./ElIcon.vue.esm2.js";import y from"./ElBadge.vue.esm2.js";import v from"./ElTooltip.vue.esm2.js";const z=["data-cy"],w={key:0,class:"inline-flex items-center justify-center"},k=r("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),B=r("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"},null,-1),C=[k,B],A=["xs","sm","base","l","xl"],D=c({__name:"ElIconButton",props:{icon:{},tooltip:{default:void 0},tooltipDelay:{default:600},disabled:{type:Boolean,default:!1},size:{default:"base"},loading:{type:Boolean,default:!1},badge:{type:[String,Boolean],default:!1},badgeColor:{default:"primary"},error:{type:Boolean,default:!1}},emits:["click"],setup(p,{emit:m}){const o=p,u=m,h=n(()=>o.badge!==!1&&!o.error&&!o.disabled&&!o.loading),s=n(()=>o.disabled||o.loading||!1);return(e,a)=>(i(),l(v,{title:e.tooltip??"",position:"top-right","delay-time":o.tooltipDelay,"hide-on-mobile":""},{default:f(()=>[r("button",{class:t(["relative flex items-center justify-center outline-none",{"h-6 w-6 rounded":e.size==="xs","h-7 w-7 rounded":e.size==="sm","h-8 w-8 rounded-md":e.size==="base","h-10 w-10 rounded-md":e.size==="l","h-12 w-12 rounded-md":e.size==="xl","cursor-not-allowed":s.value,"text-neutral-inactive":s.value,"hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent":!s.value&&e.error,"text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed":!s.value&&!e.error}]),type:"button","data-cy":e.tooltip?`${e.tooltip.trim().replaceAll(" ","")}-icon-button`:"icon-button",onClick:a[0]||(a[0]=$=>s.value?void 0:u("click"))},[e.loading?(i(),d("span",w,[(i(),d("svg",{class:t(["animate-spin",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},C,2))])):(i(),l(b,{key:1,disabled:s.value,name:e.icon.name,solid:e.icon.solid,class:t(["transition duration-150 ease-in-out",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}])},null,8,["disabled","name","solid","class"])),h.value?(i(),l(y,{key:2,color:o.badgeColor,value:typeof e.badge=="string"?e.badge:void 0,class:t({"top-[2px] right-[1px]":e.size==="xs","top-[2px] right-[2px]":e.size==="sm","top-[4px] right-[4px]":e.size==="base","top-[5px] right-[5px]":e.size==="l","top-[6px] right-[6px]":e.size==="xl"})},null,8,["color","value","class"])):g("",!0)],10,z)]),_:1},8,["title","delay-time"]))}});export{D as default,A as elIconButtonSizes};
+import{defineComponent as c,computed as n,openBlock as s,createBlock as t,withCtx as f,createElementVNode as a,normalizeClass as l,createElementBlock as d,createCommentVNode as g}from"vue";import b from"./ElIcon.vue.esm2.js";import y from"./ElBadge.vue.esm2.js";import v from"./ElTooltip.vue.esm2.js";const w=["data-cy"],z={key:0,class:"inline-flex items-center justify-center"},B=a("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),k=a("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"},null,-1),C=[B,k],j=["xs","sm","base","l","xl"],A=c({__name:"ElIconButton",props:{icon:{},tooltip:{default:void 0},tooltipDelay:{default:600},disabled:{type:Boolean,default:!1},size:{default:"base"},loading:{type:Boolean,default:!1},badge:{type:[String,Boolean],default:!1},badgeColor:{default:"primary"},error:{type:Boolean,default:!1},showTooltipOnMobile:{type:Boolean,default:!1}},emits:["click"],setup(p,{emit:m}){const o=p,u=m,h=n(()=>o.badge!==!1&&!o.error&&!o.disabled&&!o.loading),i=n(()=>o.disabled||o.loading||!1);return(e,r)=>(s(),t(v,{title:e.tooltip??"",position:"top-right","delay-time":o.tooltipDelay,"hide-on-mobile":!e.showTooltipOnMobile},{default:f(()=>[a("button",{class:l(["relative flex items-center justify-center outline-none",{"h-6 w-6 rounded":e.size==="xs","h-7 w-7 rounded":e.size==="sm","h-8 w-8 rounded-md":e.size==="base","h-10 w-10 rounded-md":e.size==="l","h-12 w-12 rounded-md":e.size==="xl","cursor-not-allowed":i.value,"text-neutral-inactive":i.value,"hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent":!i.value&&e.error,"text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed":!i.value&&!e.error}]),type:"button","data-cy":e.tooltip?`${e.tooltip.trim().replaceAll(" ","")}-icon-button`:"icon-button",onClick:r[0]||(r[0]=$=>i.value?void 0:u("click"))},[e.loading?(s(),d("span",z,[(s(),d("svg",{class:l(["animate-spin",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},C,2))])):(s(),t(b,{key:1,disabled:i.value,name:e.icon.name,solid:e.icon.solid,class:l(["transition duration-150 ease-in-out",{"h-4 w-4":e.size==="xs","h-5 w-5":e.size==="sm","h-6 w-6":e.size==="base","h-8 w-8":e.size==="l","h-10 w-10":e.size==="xl"}])},null,8,["disabled","name","solid","class"])),h.value?(s(),t(y,{key:2,color:o.badgeColor,value:typeof e.badge=="string"?e.badge:void 0,class:l({"top-[2px] right-[1px]":e.size==="xs","top-[2px] right-[2px]":e.size==="sm","top-[4px] right-[4px]":e.size==="base","top-[5px] right-[5px]":e.size==="l","top-[6px] right-[6px]":e.size==="xl"})},null,8,["color","value","class"])):g("",!0)],10,w)]),_:1},8,["title","delay-time","hide-on-mobile"]))}});export{A as default,j as elIconButtonSizes};
 //# sourceMappingURL=ElIconButton.vue.esm2.js.map

package/dist/ElIconButton.vue.esm2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElIconButton.vue.esm2.js","sources":["../src/ElIconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elIconButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElIconButtonSize = (typeof elIconButtonSizes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { computed } from 'vue';\nimport ElBadge, { ElBadgeColors } from '@/ElBadge.vue';\nimport ElTooltip from '@/ElTooltip.vue';\n\nexport interface ElIconButtonProps {\n  icon: ElIconProps;\n  tooltip?: string;\n  tooltipDelay?: string | number;\n  disabled?: boolean;\n  size?: ElIconButtonSize;\n  loading?: boolean;\n  badge?: string | boolean;\n  badgeColor?: ElBadgeColors;\n  error?: boolean;\n}\n\nconst props = withDefaults(defineProps<ElIconButtonProps>(), {\n  tooltip: undefined,\n  tooltipDelay: 600,\n  size: 'base',\n  badgeColor: 'primary',\n  disabled: false,\n  loading: false,\n  badge: false,\n  error: false,\n});\n\nconst emit = defineEmits<{\n  (event: 'click'): void;\n}>();\n\nconst showBadge = computed(() => props.badge !== false && !props.error && !props.disabled && !props.loading);\nconst disabled = computed(() => props.disabled || props.loading || false);\n</script>\n\n<template>\n  <ElTooltip :title=\"tooltip ?? ''\" position=\"top-right\" :delay-time=\"props.tooltipDelay\" hide-on-mobile>\n    <button\n      class=\"relative flex items-center justify-center outline-none\"\n      :class=\"{\n        'h-6 w-6 rounded': size === 'xs',\n        'h-7 w-7 rounded': size === 'sm',\n        'h-8 w-8 rounded-md': size === 'base',\n        'h-10 w-10 rounded-md': size === 'l',\n        'h-12 w-12 rounded-md': size === 'xl',\n        'cursor-not-allowed': disabled,\n        'text-neutral-inactive': disabled,\n        'hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent': !disabled && error,\n        'text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed':\n          !disabled && !error,\n      }\"\n      type=\"button\"\n      :data-cy=\"tooltip ? `${tooltip.trim().replaceAll(' ', '')}-icon-button` : 'icon-button'\"\n      @click=\"disabled ? undefined : emit('click')\"\n    >\n      <span v-if=\"loading\" class=\"inline-flex items-center justify-center\">\n        <svg\n          class=\"animate-spin\"\n          :class=\"{\n            'h-4 w-4': size === 'xs',\n            'h-5 w-5': size === 'sm',\n            'h-6 w-6': size === 'base',\n            'h-8 w-8': size === 'l',\n            'h-10 w-10': size === 'xl',\n          }\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n        >\n          <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" />\n          <path\n            class=\"opacity-75\"\n            fill=\"currentColor\"\n            d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n          />\n        </svg>\n      </span>\n\n      <ElIcon\n        v-else\n        :disabled=\"disabled\"\n        :name=\"icon.name\"\n        :solid=\"icon.solid\"\n        class=\"transition duration-150 ease-in-out\"\n        :class=\"{\n          'h-4 w-4': size === 'xs',\n          'h-5 w-5': size === 'sm',\n          'h-6 w-6': size === 'base',\n          'h-8 w-8': size === 'l',\n          'h-10 w-10': size === 'xl',\n        }\"\n      />\n      <ElBadge\n        v-if=\"showBadge\"\n        :color=\"props.badgeColor\"\n        :value=\"typeof badge === 'string' ? badge : undefined\"\n        :class=\"{\n          'top-[2px] right-[1px]': size === 'xs',\n          'top-[2px] right-[2px]': size === 'sm',\n          'top-[4px] right-[4px]': size === 'base',\n          'top-[5px] right-[5px]': size === 'l',\n          'top-[6px] right-[6px]': size === 'xl',\n        }\"\n      />\n    </button>\n  </ElTooltip>\n</template>\n"],"names":["elIconButtonSizes","props","__props","emit","__emit","showBadge","computed","disabled"],"mappings":"+pBACaA,EAAoB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,sUAsB/D,MAAMC,EAAQC,EAWRC,EAAOC,EAIPC,EAAYC,EAAS,IAAML,EAAM,QAAU,IAAS,CAACA,EAAM,OAAS,CAACA,EAAM,UAAY,CAACA,EAAM,OAAO,EACrGM,EAAWD,EAAS,IAAML,EAAM,UAAYA,EAAM,SAAW,EAAK"}
+{"version":3,"file":"ElIconButton.vue.esm2.js","sources":["../src/ElIconButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elIconButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElIconButtonSize = (typeof elIconButtonSizes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { computed } from 'vue';\nimport ElBadge, { ElBadgeColors } from '@/ElBadge.vue';\nimport ElTooltip from '@/ElTooltip.vue';\n\nexport interface ElIconButtonProps {\n  icon: ElIconProps;\n  tooltip?: string;\n  tooltipDelay?: string | number;\n  disabled?: boolean;\n  size?: ElIconButtonSize;\n  loading?: boolean;\n  badge?: string | boolean;\n  badgeColor?: ElBadgeColors;\n  error?: boolean;\n  showTooltipOnMobile?: boolean;\n}\n\nconst props = withDefaults(defineProps<ElIconButtonProps>(), {\n  tooltip: undefined,\n  tooltipDelay: 600,\n  size: 'base',\n  badgeColor: 'primary',\n  disabled: false,\n  loading: false,\n  badge: false,\n  error: false,\n  showTooltipOnMobile: false,\n});\n\nconst emit = defineEmits<{\n  (event: 'click'): void;\n}>();\n\nconst showBadge = computed(() => props.badge !== false && !props.error && !props.disabled && !props.loading);\nconst disabled = computed(() => props.disabled || props.loading || false);\n</script>\n\n<template>\n  <ElTooltip :title=\"tooltip ?? ''\" position=\"top-right\" :delay-time=\"props.tooltipDelay\" :hide-on-mobile=\"!showTooltipOnMobile\">\n    <button\n      class=\"relative flex items-center justify-center outline-none\"\n      :class=\"{\n        'h-6 w-6 rounded': size === 'xs',\n        'h-7 w-7 rounded': size === 'sm',\n        'h-8 w-8 rounded-md': size === 'base',\n        'h-10 w-10 rounded-md': size === 'l',\n        'h-12 w-12 rounded-md': size === 'xl',\n        'cursor-not-allowed': disabled,\n        'text-neutral-inactive': disabled,\n        'hover:bg-error-light-hover focus:bg-error-light-pressed text-error bg-transparent': !disabled && error,\n        'text-primary hover:text-primary-hover focus:text-primary-pressed active:text-primary-pressed hover:bg-primary-light-hover focus:bg-primary-light-pressed active:bg-primary-light-pressed':\n          !disabled && !error,\n      }\"\n      type=\"button\"\n      :data-cy=\"tooltip ? `${tooltip.trim().replaceAll(' ', '')}-icon-button` : 'icon-button'\"\n      @click=\"disabled ? undefined : emit('click')\"\n    >\n      <span v-if=\"loading\" class=\"inline-flex items-center justify-center\">\n        <svg\n          class=\"animate-spin\"\n          :class=\"{\n            'h-4 w-4': size === 'xs',\n            'h-5 w-5': size === 'sm',\n            'h-6 w-6': size === 'base',\n            'h-8 w-8': size === 'l',\n            'h-10 w-10': size === 'xl',\n          }\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n        >\n          <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" />\n          <path\n            class=\"opacity-75\"\n            fill=\"currentColor\"\n            d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n          />\n        </svg>\n      </span>\n\n      <ElIcon\n        v-else\n        :disabled=\"disabled\"\n        :name=\"icon.name\"\n        :solid=\"icon.solid\"\n        class=\"transition duration-150 ease-in-out\"\n        :class=\"{\n          'h-4 w-4': size === 'xs',\n          'h-5 w-5': size === 'sm',\n          'h-6 w-6': size === 'base',\n          'h-8 w-8': size === 'l',\n          'h-10 w-10': size === 'xl',\n        }\"\n      />\n      <ElBadge\n        v-if=\"showBadge\"\n        :color=\"props.badgeColor\"\n        :value=\"typeof badge === 'string' ? badge : undefined\"\n        :class=\"{\n          'top-[2px] right-[1px]': size === 'xs',\n          'top-[2px] right-[2px]': size === 'sm',\n          'top-[4px] right-[4px]': size === 'base',\n          'top-[5px] right-[5px]': size === 'l',\n          'top-[6px] right-[6px]': size === 'xl',\n        }\"\n      />\n    </button>\n  </ElTooltip>\n</template>\n"],"names":["elIconButtonSizes","props","__props","emit","__emit","showBadge","computed","disabled"],"mappings":"+pBACaA,EAAoB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,oXAuB/D,MAAMC,EAAQC,EAYRC,EAAOC,EAIPC,EAAYC,EAAS,IAAML,EAAM,QAAU,IAAS,CAACA,EAAM,OAAS,CAACA,EAAM,UAAY,CAACA,EAAM,OAAO,EACrGM,EAAWD,EAAS,IAAML,EAAM,UAAYA,EAAM,SAAW,EAAK"}

package/dist/forms/ElInputCheckbox.vue.d.ts

@@ -36,6 +36,16 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -103,6 +113,16 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -152,6 +172,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     modelValue: boolean | "indeterminate";
     errorMessage: string | boolean;
     hiddenErrorMessage: boolean;
+    min: number;
+    max: number;
     inputClass: string;
     validation: import('./validation-rules').InputValidation;
 }, {}>, {

package/dist/forms/ElInputDate.vue.d.ts

@@ -21,6 +21,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -77,6 +87,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -125,6 +145,8 @@ declare const _default: import('vue').DefineComponent<{
     step: number;
     errorMessage: string | boolean;
     hiddenErrorMessage: boolean;
+    min: number;
+    max: number;
     validation: import('./validation-rules').InputValidation;
 }, {}>;
 export default _default;

package/dist/forms/ElInputMeasureUnit.vue.d.ts

@@ -34,6 +34,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -100,6 +110,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -147,6 +167,8 @@ declare const _default: import('vue').DefineComponent<{
     step: number;
     errorMessage: string | boolean;
     hiddenErrorMessage: boolean;
+    min: number;
+    max: number;
     validation: import('./validation-rules').InputValidation;
     availableUnitCategory: keyof MeasureUnitTypes;
     defaultUnit: string;

package/dist/forms/ElInputNumber.vue.cjs2.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),M=require("./ElInputContainer.vue.cjs2.js"),o=require("./input.cjs.js"),N=["id","name","type","step","placeholder","disabled","data-cy"],w=e.defineComponent({__name:"ElInputNumber",props:{...o.withNumberElInputProps(),isTwoDecimals:{type:Boolean,default:!1},defaultNullValueToZeroOnBlur:{type:Boolean,default:!0}},emits:["update:modelValue","overlayedBtnClicked","update:formattedAmount"],setup(d,{emit:m}){const r=d,n=m,p=e.ref(!1),f=e.computed(()=>r.modelValue),v=e.computed(()=>[r.validation]),{value:t,errorMessage:c,uuid:s,fieldContext:b}=o.useInput(f,v,r.name,l=>{n("update:modelValue",l),n("update:formattedAmount",u.value)}),u=e.computed({get:()=>t.value===null||t.value===void 0||typeof t.value=="string"&&t.value===""?null:typeof t.value=="string"?Number(t.value):r.isTwoDecimals?parseFloat((t.value/100).toFixed(2)):t.value,set:l=>{if(l===""||l===null){t.value=null;return}const a=Number(l);isNaN(a)||(r.isTwoDecimals?t.value=Math.round(a*100):t.value=a)}}),g=()=>{b.validate(),r.defaultNullValueToZeroOnBlur&&y()},y=()=>{t.value||(t.value=0)};return(l,a)=>(e.openBlock(),e.createBlock(M.default,e.mergeProps(l.$attrs,{name:e.unref(s),label:l.label,"error-message":r.errorMessage===!1?!1:r.errorMessage||e.unref(c),"hidden-error-message":l.hiddenErrorMessage,"set-required-mark":e.unref(o.showRequiredMark)([l.validation])}),{default:e.withCtx(({error:h})=>[e.withDirectives(e.createElementVNode("input",{id:e.unref(s),name:r.name,"onUpdate:modelValue":[a[0]||(a[0]=i=>u.value=i),a[1]||(a[1]=i=>p.value=!0)],type:r.isTwoDecimals?"text":"number",step:l.step,placeholder:l.placeholder,disabled:l.disabled,class:e.normalizeClass(["el-input",{error:h}]),"data-cy":l.label?`${l.label.trim().replaceAll(" ","")}-number-input`:"number-input",onBlur:g},null,42,N),[[e.vModelDynamic,u.value]])]),_:1},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});exports.default=w;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("vue"),M=require("./ElInputContainer.vue.cjs2.js"),o=require("./input.cjs.js"),N=["id","name","type","step","min","max","placeholder","disabled","data-cy"],w=l.defineComponent({__name:"ElInputNumber",props:{...o.withNumberElInputProps(),isTwoDecimals:{type:Boolean,default:!1},defaultNullValueToZeroOnBlur:{type:Boolean,default:!0}},emits:["update:modelValue","overlayedBtnClicked","update:formattedAmount"],setup(d,{emit:m}){const r=d,n=m,p=l.ref(!1),f=l.computed(()=>r.modelValue),v=l.computed(()=>[r.validation]),{value:a,errorMessage:c,uuid:s,fieldContext:b}=o.useInput(f,v,r.name,e=>{n("update:modelValue",e),n("update:formattedAmount",u.value)}),u=l.computed({get:()=>a.value===null||a.value===void 0||typeof a.value=="string"&&a.value===""?null:typeof a.value=="string"?Number(a.value):r.isTwoDecimals?parseFloat((a.value/100).toFixed(2)):a.value,set:e=>{if(e===""||e===null){a.value=null;return}const t=Number(e);isNaN(t)||(r.isTwoDecimals?a.value=Math.round(t*100):a.value=t)}}),g=()=>{b.validate(),r.defaultNullValueToZeroOnBlur&&y()},y=()=>{a.value||(a.value=0)};return(e,t)=>(l.openBlock(),l.createBlock(M.default,l.mergeProps(e.$attrs,{name:l.unref(s),label:e.label,"error-message":r.errorMessage===!1?!1:r.errorMessage||l.unref(c),"hidden-error-message":e.hiddenErrorMessage,"set-required-mark":l.unref(o.showRequiredMark)([e.validation])}),{default:l.withCtx(({error:h})=>[l.withDirectives(l.createElementVNode("input",{id:l.unref(s),name:r.name,"onUpdate:modelValue":[t[0]||(t[0]=i=>u.value=i),t[1]||(t[1]=i=>p.value=!0)],type:r.isTwoDecimals?"text":"number",step:e.step,min:e.min,max:e.max,placeholder:e.placeholder,disabled:e.disabled,class:l.normalizeClass(["el-input",{error:h}]),"data-cy":e.label?`${e.label.trim().replaceAll(" ","")}-number-input`:"number-input",onBlur:g},null,42,N),[[l.vModelDynamic,u.value]])]),_:1},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});exports.default=w;
 //# sourceMappingURL=ElInputNumber.vue.cjs2.js.map

package/dist/forms/ElInputNumber.vue.cjs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputNumber.vue.cjs2.js","sources":["../../src/forms/ElInputNumber.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport { useInput, NumberValueType, showRequiredMark, withNumberElInputProps } from '@/forms/input';\nimport { computed, ref } from 'vue';\n\nconst props = defineProps({\n  ...withNumberElInputProps(),\n  isTwoDecimals: {\n    type: Boolean,\n    default: false,\n  },\n  defaultNullValueToZeroOnBlur: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: NumberValueType): void;\n  (event: 'overlayedBtnClicked'): void;\n  (event: 'update:formattedAmount', value: NumberValueType): void;\n}>();\n\nconst showOverlayedIcon = ref(false);\nconst computedModelValue = computed(() => {\n  return props.modelValue;\n});\n\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue);\n  emit('update:formattedAmount', formattedAmount.value);\n});\n\nconst formattedAmount = computed<number | null>({\n  get: () => {\n    if (value.value === null || value.value === undefined) return null;\n    if (typeof value.value === 'string' && value.value === '') return null;\n    if (typeof value.value === 'string') return Number(value.value);\n\n    if (props.isTwoDecimals) {\n      return parseFloat((value.value / 100).toFixed(2));\n    }\n\n    return value.value;\n  },\n  set: (inputValue: number | null | string) => {\n    if (inputValue === '' || inputValue === null) {\n      value.value = null;\n      return;\n    }\n\n    const numValue = Number(inputValue);\n    if (!isNaN(numValue)) {\n      if (props.isTwoDecimals) {\n        value.value = Math.round(numValue * 100);\n      } else {\n        value.value = numValue;\n      }\n    }\n  },\n});\n\nconst onBlur = () => {\n  fieldContext.validate();\n\n  if (props.defaultNullValueToZeroOnBlur) {\n    resetNullValueToZero();\n  }\n};\n\nconst resetNullValueToZero = () => {\n  if (!value.value) {\n    value.value = 0;\n  }\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"uuid\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n  >\n    <template #default=\"{ error }\">\n      <input\n        :id=\"uuid\"\n        :name=\"props.name\"\n        v-model=\"formattedAmount\"\n        :type=\"props.isTwoDecimals ? 'text' : 'number'\"\n        :step=\"step\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        class=\"el-input\"\n        :class=\"{ error }\"\n        :data-cy=\"label ? `${label.trim().replaceAll(' ', '')}-number-input` : `number-input`\"\n        @blur=\"onBlur\"\n        @update:model-value=\"showOverlayedIcon = true\"\n      />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["props","__props","emit","__emit","showOverlayedIcon","ref","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","formattedAmount","inputValue","numValue","onBlur","resetNullValueToZero"],"mappings":"0hBAKA,MAAMA,EAAQC,EAYRC,EAAOC,EAMPC,EAAoBC,MAAI,EAAK,EAC7BC,EAAqBC,EAAAA,SAAS,IAC3BP,EAAM,UACd,EAEKQ,EAAqBD,EAAAA,SAAS,IAAM,CAACP,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAS,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,WAASP,EAAoBE,EAAoBR,EAAM,KAAkBc,GAAA,CAC3HZ,EAAK,oBAAqBY,CAAQ,EAC7BZ,EAAA,yBAA0Ba,EAAgB,KAAK,CAAA,CACrD,EAEKA,EAAkBR,EAAAA,SAAwB,CAC9C,IAAK,IACCE,EAAM,QAAU,MAAQA,EAAM,QAAU,QACxC,OAAOA,EAAM,OAAU,UAAYA,EAAM,QAAU,GAAW,KAC9D,OAAOA,EAAM,OAAU,SAAiB,OAAOA,EAAM,KAAK,EAE1DT,EAAM,cACD,YAAYS,EAAM,MAAQ,KAAK,QAAQ,CAAC,CAAC,EAG3CA,EAAM,MAEf,IAAMO,GAAuC,CACvC,GAAAA,IAAe,IAAMA,IAAe,KAAM,CAC5CP,EAAM,MAAQ,KACd,MACF,CAEM,MAAAQ,EAAW,OAAOD,CAAU,EAC7B,MAAMC,CAAQ,IACbjB,EAAM,cACRS,EAAM,MAAQ,KAAK,MAAMQ,EAAW,GAAG,EAEvCR,EAAM,MAAQQ,EAGpB,CAAA,CACD,EAEKC,EAAS,IAAM,CACnBN,EAAa,SAAS,EAElBZ,EAAM,8BACamB,GACvB,EAGIA,EAAuB,IAAM,CAC5BV,EAAM,QACTA,EAAM,MAAQ,EAChB"}
+{"version":3,"file":"ElInputNumber.vue.cjs2.js","sources":["../../src/forms/ElInputNumber.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport { useInput, NumberValueType, showRequiredMark, withNumberElInputProps } from '@/forms/input';\nimport { computed, ref } from 'vue';\n\nconst props = defineProps({\n  ...withNumberElInputProps(),\n  isTwoDecimals: {\n    type: Boolean,\n    default: false,\n  },\n  defaultNullValueToZeroOnBlur: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: NumberValueType): void;\n  (event: 'overlayedBtnClicked'): void;\n  (event: 'update:formattedAmount', value: NumberValueType): void;\n}>();\n\nconst showOverlayedIcon = ref(false);\nconst computedModelValue = computed(() => {\n  return props.modelValue;\n});\n\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue);\n  emit('update:formattedAmount', formattedAmount.value);\n});\n\nconst formattedAmount = computed<number | null>({\n  get: () => {\n    if (value.value === null || value.value === undefined) return null;\n    if (typeof value.value === 'string' && value.value === '') return null;\n    if (typeof value.value === 'string') return Number(value.value);\n\n    if (props.isTwoDecimals) {\n      return parseFloat((value.value / 100).toFixed(2));\n    }\n\n    return value.value;\n  },\n  set: (inputValue: number | null | string) => {\n    if (inputValue === '' || inputValue === null) {\n      value.value = null;\n      return;\n    }\n\n    const numValue = Number(inputValue);\n    if (!isNaN(numValue)) {\n      if (props.isTwoDecimals) {\n        value.value = Math.round(numValue * 100);\n      } else {\n        value.value = numValue;\n      }\n    }\n  },\n});\n\nconst onBlur = () => {\n  fieldContext.validate();\n\n  if (props.defaultNullValueToZeroOnBlur) {\n    resetNullValueToZero();\n  }\n};\n\nconst resetNullValueToZero = () => {\n  if (!value.value) {\n    value.value = 0;\n  }\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"uuid\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n  >\n    <template #default=\"{ error }\">\n      <input\n        :id=\"uuid\"\n        :name=\"props.name\"\n        v-model=\"formattedAmount\"\n        :type=\"props.isTwoDecimals ? 'text' : 'number'\"\n        :step=\"step\"\n        :min=\"min\"\n        :max=\"max\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        class=\"el-input\"\n        :class=\"{ error }\"\n        :data-cy=\"label ? `${label.trim().replaceAll(' ', '')}-number-input` : `number-input`\"\n        @blur=\"onBlur\"\n        @update:model-value=\"showOverlayedIcon = true\"\n      />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["props","__props","emit","__emit","showOverlayedIcon","ref","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","formattedAmount","inputValue","numValue","onBlur","resetNullValueToZero"],"mappings":"siBAKA,MAAMA,EAAQC,EAYRC,EAAOC,EAMPC,EAAoBC,MAAI,EAAK,EAC7BC,EAAqBC,EAAAA,SAAS,IAC3BP,EAAM,UACd,EAEKQ,EAAqBD,EAAAA,SAAS,IAAM,CAACP,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAS,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,WAASP,EAAoBE,EAAoBR,EAAM,KAAkBc,GAAA,CAC3HZ,EAAK,oBAAqBY,CAAQ,EAC7BZ,EAAA,yBAA0Ba,EAAgB,KAAK,CAAA,CACrD,EAEKA,EAAkBR,EAAAA,SAAwB,CAC9C,IAAK,IACCE,EAAM,QAAU,MAAQA,EAAM,QAAU,QACxC,OAAOA,EAAM,OAAU,UAAYA,EAAM,QAAU,GAAW,KAC9D,OAAOA,EAAM,OAAU,SAAiB,OAAOA,EAAM,KAAK,EAE1DT,EAAM,cACD,YAAYS,EAAM,MAAQ,KAAK,QAAQ,CAAC,CAAC,EAG3CA,EAAM,MAEf,IAAMO,GAAuC,CACvC,GAAAA,IAAe,IAAMA,IAAe,KAAM,CAC5CP,EAAM,MAAQ,KACd,MACF,CAEM,MAAAQ,EAAW,OAAOD,CAAU,EAC7B,MAAMC,CAAQ,IACbjB,EAAM,cACRS,EAAM,MAAQ,KAAK,MAAMQ,EAAW,GAAG,EAEvCR,EAAM,MAAQQ,EAGpB,CAAA,CACD,EAEKC,EAAS,IAAM,CACnBN,EAAa,SAAS,EAElBZ,EAAM,8BACamB,GACvB,EAGIA,EAAuB,IAAM,CAC5BV,EAAM,QACTA,EAAM,MAAQ,EAChB"}

package/dist/forms/ElInputNumber.vue.d.ts

@@ -22,6 +22,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -83,6 +93,16 @@ declare const _default: import('vue').DefineComponent<{
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;
@@ -131,6 +151,8 @@ declare const _default: import('vue').DefineComponent<{
     step: number;
     errorMessage: string | boolean;
     hiddenErrorMessage: boolean;
+    min: number;
+    max: number;
     validation: import('./validation-rules').InputValidation;
     isTwoDecimals: boolean;
     defaultNullValueToZeroOnBlur: boolean;

package/dist/forms/ElInputNumber.vue.esm2.js

@@ -1,2 +1,2 @@
-import{defineComponent as N,ref as w,computed as u,openBlock as V,createBlock as B,mergeProps as M,unref as t,withCtx as T,withDirectives as k,createElementVNode as D,normalizeClass as C,vModelDynamic as A}from"vue";import E from"./ElInputContainer.vue.esm2.js";import{withNumberElInputProps as I,useInput as $,showRequiredMark as q}from"./input.esm.js";const O=["id","name","type","step","placeholder","disabled","data-cy"],z=N({__name:"ElInputNumber",props:{...I(),isTwoDecimals:{type:Boolean,default:!1},defaultNullValueToZeroOnBlur:{type:Boolean,default:!0}},emits:["update:modelValue","overlayedBtnClicked","update:formattedAmount"],setup(d,{emit:m}){const a=d,n=m,p=w(!1),f=u(()=>a.modelValue),v=u(()=>[a.validation]),{value:l,errorMessage:c,uuid:s,fieldContext:b}=$(f,v,a.name,e=>{n("update:modelValue",e),n("update:formattedAmount",o.value)}),o=u({get:()=>l.value===null||l.value===void 0||typeof l.value=="string"&&l.value===""?null:typeof l.value=="string"?Number(l.value):a.isTwoDecimals?parseFloat((l.value/100).toFixed(2)):l.value,set:e=>{if(e===""||e===null){l.value=null;return}const r=Number(e);isNaN(r)||(a.isTwoDecimals?l.value=Math.round(r*100):l.value=r)}}),g=()=>{b.validate(),a.defaultNullValueToZeroOnBlur&&y()},y=()=>{l.value||(l.value=0)};return(e,r)=>(V(),B(E,M(e.$attrs,{name:t(s),label:e.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||t(c),"hidden-error-message":e.hiddenErrorMessage,"set-required-mark":t(q)([e.validation])}),{default:T(({error:h})=>[k(D("input",{id:t(s),name:a.name,"onUpdate:modelValue":[r[0]||(r[0]=i=>o.value=i),r[1]||(r[1]=i=>p.value=!0)],type:a.isTwoDecimals?"text":"number",step:e.step,placeholder:e.placeholder,disabled:e.disabled,class:C(["el-input",{error:h}]),"data-cy":e.label?`${e.label.trim().replaceAll(" ","")}-number-input`:"number-input",onBlur:g},null,42,O),[[A,o.value]])]),_:1},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});export{z as default};
+import{defineComponent as N,ref as w,computed as u,openBlock as V,createBlock as B,mergeProps as M,unref as t,withCtx as T,withDirectives as k,createElementVNode as D,normalizeClass as C,vModelDynamic as A}from"vue";import E from"./ElInputContainer.vue.esm2.js";import{withNumberElInputProps as I,useInput as $,showRequiredMark as q}from"./input.esm.js";const O=["id","name","type","step","min","max","placeholder","disabled","data-cy"],z=N({__name:"ElInputNumber",props:{...I(),isTwoDecimals:{type:Boolean,default:!1},defaultNullValueToZeroOnBlur:{type:Boolean,default:!0}},emits:["update:modelValue","overlayedBtnClicked","update:formattedAmount"],setup(m,{emit:d}){const a=m,n=d,p=w(!1),f=u(()=>a.modelValue),v=u(()=>[a.validation]),{value:l,errorMessage:c,uuid:s,fieldContext:b}=$(f,v,a.name,e=>{n("update:modelValue",e),n("update:formattedAmount",o.value)}),o=u({get:()=>l.value===null||l.value===void 0||typeof l.value=="string"&&l.value===""?null:typeof l.value=="string"?Number(l.value):a.isTwoDecimals?parseFloat((l.value/100).toFixed(2)):l.value,set:e=>{if(e===""||e===null){l.value=null;return}const r=Number(e);isNaN(r)||(a.isTwoDecimals?l.value=Math.round(r*100):l.value=r)}}),g=()=>{b.validate(),a.defaultNullValueToZeroOnBlur&&y()},y=()=>{l.value||(l.value=0)};return(e,r)=>(V(),B(E,M(e.$attrs,{name:t(s),label:e.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||t(c),"hidden-error-message":e.hiddenErrorMessage,"set-required-mark":t(q)([e.validation])}),{default:T(({error:h})=>[k(D("input",{id:t(s),name:a.name,"onUpdate:modelValue":[r[0]||(r[0]=i=>o.value=i),r[1]||(r[1]=i=>p.value=!0)],type:a.isTwoDecimals?"text":"number",step:e.step,min:e.min,max:e.max,placeholder:e.placeholder,disabled:e.disabled,class:C(["el-input",{error:h}]),"data-cy":e.label?`${e.label.trim().replaceAll(" ","")}-number-input`:"number-input",onBlur:g},null,42,O),[[A,o.value]])]),_:1},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});export{z as default};
 //# sourceMappingURL=ElInputNumber.vue.esm2.js.map

package/dist/forms/ElInputNumber.vue.esm2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputNumber.vue.esm2.js","sources":["../../src/forms/ElInputNumber.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport { useInput, NumberValueType, showRequiredMark, withNumberElInputProps } from '@/forms/input';\nimport { computed, ref } from 'vue';\n\nconst props = defineProps({\n  ...withNumberElInputProps(),\n  isTwoDecimals: {\n    type: Boolean,\n    default: false,\n  },\n  defaultNullValueToZeroOnBlur: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: NumberValueType): void;\n  (event: 'overlayedBtnClicked'): void;\n  (event: 'update:formattedAmount', value: NumberValueType): void;\n}>();\n\nconst showOverlayedIcon = ref(false);\nconst computedModelValue = computed(() => {\n  return props.modelValue;\n});\n\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue);\n  emit('update:formattedAmount', formattedAmount.value);\n});\n\nconst formattedAmount = computed<number | null>({\n  get: () => {\n    if (value.value === null || value.value === undefined) return null;\n    if (typeof value.value === 'string' && value.value === '') return null;\n    if (typeof value.value === 'string') return Number(value.value);\n\n    if (props.isTwoDecimals) {\n      return parseFloat((value.value / 100).toFixed(2));\n    }\n\n    return value.value;\n  },\n  set: (inputValue: number | null | string) => {\n    if (inputValue === '' || inputValue === null) {\n      value.value = null;\n      return;\n    }\n\n    const numValue = Number(inputValue);\n    if (!isNaN(numValue)) {\n      if (props.isTwoDecimals) {\n        value.value = Math.round(numValue * 100);\n      } else {\n        value.value = numValue;\n      }\n    }\n  },\n});\n\nconst onBlur = () => {\n  fieldContext.validate();\n\n  if (props.defaultNullValueToZeroOnBlur) {\n    resetNullValueToZero();\n  }\n};\n\nconst resetNullValueToZero = () => {\n  if (!value.value) {\n    value.value = 0;\n  }\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"uuid\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n  >\n    <template #default=\"{ error }\">\n      <input\n        :id=\"uuid\"\n        :name=\"props.name\"\n        v-model=\"formattedAmount\"\n        :type=\"props.isTwoDecimals ? 'text' : 'number'\"\n        :step=\"step\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        class=\"el-input\"\n        :class=\"{ error }\"\n        :data-cy=\"label ? `${label.trim().replaceAll(' ', '')}-number-input` : `number-input`\"\n        @blur=\"onBlur\"\n        @update:model-value=\"showOverlayedIcon = true\"\n      />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["props","__props","emit","__emit","showOverlayedIcon","ref","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","formattedAmount","inputValue","numValue","onBlur","resetNullValueToZero"],"mappings":"gpBAKA,MAAMA,EAAQC,EAYRC,EAAOC,EAMPC,EAAoBC,EAAI,EAAK,EAC7BC,EAAqBC,EAAS,IAC3BP,EAAM,UACd,EAEKQ,EAAqBD,EAAS,IAAM,CAACP,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAS,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,EAASP,EAAoBE,EAAoBR,EAAM,KAAkBc,GAAA,CAC3HZ,EAAK,oBAAqBY,CAAQ,EAC7BZ,EAAA,yBAA0Ba,EAAgB,KAAK,CAAA,CACrD,EAEKA,EAAkBR,EAAwB,CAC9C,IAAK,IACCE,EAAM,QAAU,MAAQA,EAAM,QAAU,QACxC,OAAOA,EAAM,OAAU,UAAYA,EAAM,QAAU,GAAW,KAC9D,OAAOA,EAAM,OAAU,SAAiB,OAAOA,EAAM,KAAK,EAE1DT,EAAM,cACD,YAAYS,EAAM,MAAQ,KAAK,QAAQ,CAAC,CAAC,EAG3CA,EAAM,MAEf,IAAMO,GAAuC,CACvC,GAAAA,IAAe,IAAMA,IAAe,KAAM,CAC5CP,EAAM,MAAQ,KACd,MACF,CAEM,MAAAQ,EAAW,OAAOD,CAAU,EAC7B,MAAMC,CAAQ,IACbjB,EAAM,cACRS,EAAM,MAAQ,KAAK,MAAMQ,EAAW,GAAG,EAEvCR,EAAM,MAAQQ,EAGpB,CAAA,CACD,EAEKC,EAAS,IAAM,CACnBN,EAAa,SAAS,EAElBZ,EAAM,8BACamB,GACvB,EAGIA,EAAuB,IAAM,CAC5BV,EAAM,QACTA,EAAM,MAAQ,EAChB"}
+{"version":3,"file":"ElInputNumber.vue.esm2.js","sources":["../../src/forms/ElInputNumber.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport { useInput, NumberValueType, showRequiredMark, withNumberElInputProps } from '@/forms/input';\nimport { computed, ref } from 'vue';\n\nconst props = defineProps({\n  ...withNumberElInputProps(),\n  isTwoDecimals: {\n    type: Boolean,\n    default: false,\n  },\n  defaultNullValueToZeroOnBlur: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: NumberValueType): void;\n  (event: 'overlayedBtnClicked'): void;\n  (event: 'update:formattedAmount', value: NumberValueType): void;\n}>();\n\nconst showOverlayedIcon = ref(false);\nconst computedModelValue = computed(() => {\n  return props.modelValue;\n});\n\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue);\n  emit('update:formattedAmount', formattedAmount.value);\n});\n\nconst formattedAmount = computed<number | null>({\n  get: () => {\n    if (value.value === null || value.value === undefined) return null;\n    if (typeof value.value === 'string' && value.value === '') return null;\n    if (typeof value.value === 'string') return Number(value.value);\n\n    if (props.isTwoDecimals) {\n      return parseFloat((value.value / 100).toFixed(2));\n    }\n\n    return value.value;\n  },\n  set: (inputValue: number | null | string) => {\n    if (inputValue === '' || inputValue === null) {\n      value.value = null;\n      return;\n    }\n\n    const numValue = Number(inputValue);\n    if (!isNaN(numValue)) {\n      if (props.isTwoDecimals) {\n        value.value = Math.round(numValue * 100);\n      } else {\n        value.value = numValue;\n      }\n    }\n  },\n});\n\nconst onBlur = () => {\n  fieldContext.validate();\n\n  if (props.defaultNullValueToZeroOnBlur) {\n    resetNullValueToZero();\n  }\n};\n\nconst resetNullValueToZero = () => {\n  if (!value.value) {\n    value.value = 0;\n  }\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"uuid\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n  >\n    <template #default=\"{ error }\">\n      <input\n        :id=\"uuid\"\n        :name=\"props.name\"\n        v-model=\"formattedAmount\"\n        :type=\"props.isTwoDecimals ? 'text' : 'number'\"\n        :step=\"step\"\n        :min=\"min\"\n        :max=\"max\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        class=\"el-input\"\n        :class=\"{ error }\"\n        :data-cy=\"label ? `${label.trim().replaceAll(' ', '')}-number-input` : `number-input`\"\n        @blur=\"onBlur\"\n        @update:model-value=\"showOverlayedIcon = true\"\n      />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["props","__props","emit","__emit","showOverlayedIcon","ref","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","formattedAmount","inputValue","numValue","onBlur","resetNullValueToZero"],"mappings":"4pBAKA,MAAMA,EAAQC,EAYRC,EAAOC,EAMPC,EAAoBC,EAAI,EAAK,EAC7BC,EAAqBC,EAAS,IAC3BP,EAAM,UACd,EAEKQ,EAAqBD,EAAS,IAAM,CAACP,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAS,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,EAASP,EAAoBE,EAAoBR,EAAM,KAAkBc,GAAA,CAC3HZ,EAAK,oBAAqBY,CAAQ,EAC7BZ,EAAA,yBAA0Ba,EAAgB,KAAK,CAAA,CACrD,EAEKA,EAAkBR,EAAwB,CAC9C,IAAK,IACCE,EAAM,QAAU,MAAQA,EAAM,QAAU,QACxC,OAAOA,EAAM,OAAU,UAAYA,EAAM,QAAU,GAAW,KAC9D,OAAOA,EAAM,OAAU,SAAiB,OAAOA,EAAM,KAAK,EAE1DT,EAAM,cACD,YAAYS,EAAM,MAAQ,KAAK,QAAQ,CAAC,CAAC,EAG3CA,EAAM,MAEf,IAAMO,GAAuC,CACvC,GAAAA,IAAe,IAAMA,IAAe,KAAM,CAC5CP,EAAM,MAAQ,KACd,MACF,CAEM,MAAAQ,EAAW,OAAOD,CAAU,EAC7B,MAAMC,CAAQ,IACbjB,EAAM,cACRS,EAAM,MAAQ,KAAK,MAAMQ,EAAW,GAAG,EAEvCR,EAAM,MAAQQ,EAGpB,CAAA,CACD,EAEKC,EAAS,IAAM,CACnBN,EAAa,SAAS,EAElBZ,EAAM,8BACamB,GACvB,EAGIA,EAAuB,IAAM,CAC5BV,EAAM,QACTA,EAAM,MAAQ,EAChB"}

package/dist/forms/ElInputSearch.vue.cjs2.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),g=require("../ElDivider.vue.cjs2.js"),_=require("../ElIcon.vue.cjs2.js"),F=require("../ElVerticalTab.vue.cjs2.js");;/* empty css                */require("../polyfills.cjs.js");require("vee-validate");require("../node_modules/codice-fiscale-js/dist/codice.fiscale.commonjs2.cjs.js");require("../node_modules/lodash/lodash.cjs.js");require("../tailwind.plugin.cjs.js");require("../node_modules/@davincihealthcare/elty-design-system-foundations/dist/index.cjs.js");const T=require("../ElButton.vue.cjs2.js"),A=require("../_CustomTransition.vue.cjs2.js"),b=require("../node_modules/@vueuse/core/index.cjs.js");require("./ElInputText.vue.cjs2.js");require("./ElInputCheckbox.vue.cjs2.js");require("./ElInputDate.vue.cjs2.js");require("./ElInputFile.vue.cjs2.js");require("./ElInputMeasureUnit.vue.cjs2.js");require("./ElInputNumber.vue.cjs2.js");require("./ElInputPhone.vue.cjs2.js");require("./ElInputSelect.vue.cjs2.js");require("./ElInputTextarea.vue.cjs2.js");require("../ElToast.vue.cjs2.js");require("./ElInputRadioButton.vue.cjs2.js");const P=require("../node_modules/@vueuse/components/index.cjs.js"),q=require("./input.cjs.js");require("../node_modules/swiper/shared/swiper-core.cjs.js");;/* empty css                                     */;/* empty css                                                 */const j=require("../node_modules/@vueuse/integrations/useFocusTrap.cjs.js"),z={class:"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl"},H=["name","placeholder"],$={class:"flex flex-col gap-y-6 overflow-y-hidden"},L={key:1,class:"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter"},U={class:"text-sm font-semibold text-neutral-darker"},G={class:"text-sm font-normal"},K={key:2,class:"flex py-2 overflow-y-hidden"},J={key:0,class:"text-sm font-medium text-neutral-darker"},Q={class:"flex flex-col gap-1 w-full"},W={key:0},X={key:1,class:"flex-1 pl-6 overflow-y-auto"},Y={key:3,class:"flex items-center gap-1 self-stretch"},Z={class:"text-sm font-normal text-neutral-darker"},ee={class:"fixed inset-0 transition-opacity"},te={ref:"backdrop",class:"absolute inset-0 bg-gray-500 opacity-75"},oe=["primary","secondary"],re=["default","filled","blank"],le=e.defineComponent({__name:"ElInputSearch",props:e.mergeModels({...q.withTextualElInputProps(),status:{type:String,default:"default"},text:{type:String,default:void 0},results:{type:Array,default:void 0},footer:{type:Object,default:void 0},blankResults:{type:Object,default:void 0},shouldHoverFirstResultOnOpen:{type:Boolean,default:!1},color:{type:String,default:"primary"}},{isOpen:{default:!0,required:!0,type:Boolean},isOpenModifiers:{}}),emits:e.mergeModels(["update:modelValue","onResultClick","onResultHover"],["update:isOpen"]),setup(o,{emit:B}){const l=o,i=B,d=e.useSlots(),E=b.useScrollLock(document.body),f=e.ref(null),V=e.computed(()=>l.modelValue),w=e.computed(()=>[l.validation]),v=e.computed(()=>({default:!l.results,filled:l.results&&l.results.length>0,blank:l.results&&l.results.length===0})),S=e.ref(!1),k=e.ref(!1),y=e.ref([]),s=e.ref(),{value:m,uuid:C,setValue:N}=q.useInput(V,w,l.name,t=>{i("update:modelValue",t==null?void 0:t.trim())}),p=e.ref(),{hasFocus:R,activate:O,deactivate:I}=j.useFocusTrap(p),u=e.useModel(o,"isOpen"),h=()=>{u.value=!1,s.value=void 0},M=t=>{var r,a,n;(n=(a=(r=y.value)==null?void 0:r.at(t))==null?void 0:a.$el)==null||n.scrollIntoView({block:"nearest"})},x=t=>{i("onResultClick",t),N(""),s.value=void 0},c=t=>{s.value=t,M(t),i("onResultHover",t)},D=()=>h();return b.onKeyStroke(["ArrowUp","ArrowDown","Enter","Escape"],t=>{var r;if(t.preventDefault(),t.stopPropagation(),R&&((r=l.results)!=null&&r.length))switch(t.key){case"ArrowUp":const a=Math.max((s.value??0)-1,0);c(a);break;case"ArrowDown":const n=s.value!==void 0?Math.min(s.value+1,l.results.length-1):0;c(n);break;case"Enter":s.value!==void 0&&x(s.value);break}t.key==="Escape"&&h()},{target:p}),e.watch([u,f],async()=>{var t,r;E.value=u.value,u.value?((t=f.value)==null||t.focus(),l.shouldHoverFirstResultOnOpen&&((r=l.results)!=null&&r.length)&&c(0),await e.nextTick(),O()):I()}),(t,r)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.createVNode(A.default,{name:"fade"},{default:e.withCtx(()=>[u.value?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"searchBarRef",ref:p,class:"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0"},[e.withDirectives((e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md",{"gap-6":l.results}])},[e.createElementVNode("div",z,[e.createVNode(_.default,{name:"MagnifyingGlassIcon",class:"text-neutral-lighter w-6 h-6"}),e.withDirectives(e.createElementVNode("input",{ref_key:"searchInput",ref:f,"onUpdate:modelValue":r[0]||(r[0]=a=>e.isRef(m)?m.value=a:null),name:t.id||`${e.unref(C)}`,type:"text",class:"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0",placeholder:t.placeholder,onFocusin:r[1]||(r[1]=()=>{k.value=!0,S.value=!1}),onFocusout:r[2]||(r[2]=()=>{k.value=!1})},null,40,H),[[e.vModelText,e.unref(m)]])]),e.createElementVNode("span",$,[o.results?(e.openBlock(),e.createBlock(g.default,{key:0,direction:"horizontal"})):e.createCommentVNode("",!0),o.blankResults&&v.value.blank?(e.openBlock(),e.createElementBlock("div",L,[e.createVNode(_.default,e.mergeProps(o.blankResults.icon,{class:"w-7 h-7"}),null,16),e.createElementVNode("p",U,e.toDisplayString(o.blankResults.primaryRow),1),e.createElementVNode("p",G,e.toDisplayString(o.blankResults.secondaryRow),1)])):e.createCommentVNode("",!0),o.results&&v.value.filled?(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen",{"pr-6":e.unref(d).info&&o.results.length>0}])},[o.text?(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(o.text),1)):e.createCommentVNode("",!0),e.createElementVNode("div",Q,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.results,(a,n)=>(e.openBlock(),e.createBlock(F.default,e.mergeProps({key:n,ref_for:!0,ref_key:"itemRefs",ref:y,color:o.color},a,{status:s.value===n?"hover":"default",tabindex:"-1",onClick:()=>x(n),onMouseover:()=>c(n)}),null,16,["color","status","onClick","onMouseover"]))),128))])],2),e.unref(d).info?(e.openBlock(),e.createElementBlock("div",W,[e.createVNode(g.default,{direction:"vertical"})])):e.createCommentVNode("",!0),e.unref(d).info?(e.openBlock(),e.createElementBlock("div",X,[e.renderSlot(t.$slots,"info")])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),o.results&&o.footer?(e.openBlock(),e.createElementBlock("div",Y,[e.createElementVNode("span",Z,e.toDisplayString(o.footer.text),1),e.createVNode(e.unref(T.default),e.mergeProps(o.footer.button,{variant:"tertiary"}),null,16)])):e.createCommentVNode("",!0)])],2)),[[e.unref(P.VOnClickOutside),D]]),e.createElementVNode("div",ee,[e.createElementVNode("div",te,null,512)])],512)):e.createCommentVNode("",!0)]),_:3})]))}});exports.default=le;exports.elInputSearchColors=oe;exports.elInputSearchStatus=re;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),g=require("../ElDivider.vue.cjs2.js"),_=require("../ElIcon.vue.cjs2.js"),F=require("../ElVerticalTab.vue.cjs2.js");;/* empty css                */require("../polyfills.cjs.js");require("vee-validate");require("../node_modules/codice-fiscale-js/dist/codice.fiscale.commonjs2.cjs.js");require("../node_modules/lodash/lodash.cjs.js");require("../tailwind.plugin.cjs.js");require("../node_modules/@davincihealthcare/elty-design-system-foundations/dist/index.cjs.js");const T=require("../ElButton.vue.cjs2.js"),A=require("../_CustomTransition.vue.cjs2.js"),b=require("../node_modules/@vueuse/core/index.cjs.js");require("./ElInputText.vue.cjs2.js");require("./ElInputCheckbox.vue.cjs2.js");require("./ElInputDate.vue.cjs2.js");require("./ElInputFile.vue.cjs2.js");require("./ElInputMeasureUnit.vue.cjs2.js");require("./ElInputNumber.vue.cjs2.js");require("./ElInputPhone.vue.cjs2.js");require("./ElInputSelect.vue.cjs2.js");require("./ElInputTextarea.vue.cjs2.js");require("../ElToast.vue.cjs2.js");require("./ElInputRadioButton.vue.cjs2.js");const P=require("../node_modules/@vueuse/components/index.cjs.js"),q=require("./input.cjs.js");require("../node_modules/swiper/shared/swiper-core.cjs.js");;/* empty css                                     */;/* empty css                                                 */const j=require("../node_modules/@vueuse/integrations/useFocusTrap.cjs.js"),z={class:"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl"},H=["name","placeholder"],$={class:"flex flex-col gap-y-6 overflow-y-hidden"},L={key:1,class:"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter"},U={class:"text-sm font-semibold text-neutral-darker"},G={class:"text-sm font-normal"},K={key:2,class:"flex py-2 overflow-y-hidden"},J={key:0,class:"text-sm font-medium text-neutral-darker"},Q={class:"flex flex-col gap-1 w-full"},W={key:0},X={key:1,class:"flex-1 pl-6 overflow-y-auto"},Y={key:3,class:"flex items-center gap-1 self-stretch"},Z={class:"text-sm font-normal text-neutral-darker"},ee={class:"fixed inset-0 transition-opacity"},te={ref:"backdrop",class:"absolute inset-0 bg-gray-500 opacity-75"},oe=["primary","secondary"],re=["default","filled","blank"],le=e.defineComponent({__name:"ElInputSearch",props:e.mergeModels({...q.withTextualElInputProps(),status:{type:String,default:"default"},text:{type:String,default:void 0},results:{type:Array,default:void 0},footer:{type:Object,default:void 0},blankResults:{type:Object,default:void 0},shouldHoverFirstResultOnOpen:{type:Boolean,default:!1},color:{type:String,default:"primary"}},{isOpen:{default:!0,required:!0,type:Boolean},isOpenModifiers:{}}),emits:e.mergeModels(["update:modelValue","onResultClick","onResultHover"],["update:isOpen"]),setup(o,{emit:B}){const l=o,d=B,f=e.useSlots(),E=b.useScrollLock(document.body),m=e.ref(null),V=e.computed(()=>l.modelValue),w=e.computed(()=>[l.validation]),v=e.computed(()=>({default:!l.results,filled:l.results&&l.results.length>0,blank:l.results&&l.results.length===0})),S=e.ref(!1),k=e.ref(!1),y=e.ref([]),s=e.ref(),{value:u,uuid:C,setValue:N}=q.useInput(V,w,l.name,t=>{d("update:modelValue",t==null?void 0:t.trim())}),p=e.ref(),{hasFocus:R,activate:O,deactivate:I}=j.useFocusTrap(p),c=e.useModel(o,"isOpen"),h=()=>{c.value=!1,s.value=void 0,u.value=""},M=t=>{var r,a,n;(n=(a=(r=y.value)==null?void 0:r.at(t))==null?void 0:a.$el)==null||n.scrollIntoView({block:"nearest"})},x=t=>{d("onResultClick",t),N(""),s.value=void 0},i=t=>{s.value=t,M(t),d("onResultHover",t)},D=()=>h();return b.onKeyStroke(["ArrowUp","ArrowDown","Enter","Escape"],t=>{var r;if(t.preventDefault(),t.stopPropagation(),R&&((r=l.results)!=null&&r.length))switch(t.key){case"ArrowUp":const a=Math.max((s.value??0)-1,0);i(a);break;case"ArrowDown":const n=s.value!==void 0?Math.min(s.value+1,l.results.length-1):0;i(n);break;case"Enter":s.value!==void 0&&x(s.value);break}t.key==="Escape"&&h()},{target:p}),e.watch([c,m],async()=>{var t,r;E.value=c.value,c.value?((t=m.value)==null||t.focus(),l.shouldHoverFirstResultOnOpen&&((r=l.results)!=null&&r.length)&&i(0),await e.nextTick(),O()):(I(),u.value="")}),(t,r)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.createVNode(A.default,{name:"fade"},{default:e.withCtx(()=>[c.value?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"searchBarRef",ref:p,class:"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0"},[e.withDirectives((e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md",{"gap-6":l.results}])},[e.createElementVNode("div",z,[e.createVNode(_.default,{name:"MagnifyingGlassIcon",class:"text-neutral-lighter w-6 h-6"}),e.withDirectives(e.createElementVNode("input",{ref_key:"searchInput",ref:m,"onUpdate:modelValue":r[0]||(r[0]=a=>e.isRef(u)?u.value=a:null),name:t.id||`${e.unref(C)}`,type:"text",class:"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0",placeholder:t.placeholder,onFocusin:r[1]||(r[1]=()=>{k.value=!0,S.value=!1}),onFocusout:r[2]||(r[2]=()=>{k.value=!1})},null,40,H),[[e.vModelText,e.unref(u)]])]),e.createElementVNode("span",$,[o.results?(e.openBlock(),e.createBlock(g.default,{key:0,direction:"horizontal"})):e.createCommentVNode("",!0),o.blankResults&&v.value.blank?(e.openBlock(),e.createElementBlock("div",L,[e.createVNode(_.default,e.mergeProps(o.blankResults.icon,{class:"w-7 h-7"}),null,16),e.createElementVNode("p",U,e.toDisplayString(o.blankResults.primaryRow),1),e.createElementVNode("p",G,e.toDisplayString(o.blankResults.secondaryRow),1)])):e.createCommentVNode("",!0),o.results&&v.value.filled?(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen",{"pr-6":e.unref(f).info&&o.results.length>0}])},[o.text?(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(o.text),1)):e.createCommentVNode("",!0),e.createElementVNode("div",Q,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.results,(a,n)=>(e.openBlock(),e.createBlock(F.default,e.mergeProps({key:n,ref_for:!0,ref_key:"itemRefs",ref:y,color:o.color},a,{status:s.value===n?"hover":"default",tabindex:"-1",onClick:()=>x(n),onMouseover:()=>i(n)}),null,16,["color","status","onClick","onMouseover"]))),128))])],2),e.unref(f).info?(e.openBlock(),e.createElementBlock("div",W,[e.createVNode(g.default,{direction:"vertical"})])):e.createCommentVNode("",!0),e.unref(f).info?(e.openBlock(),e.createElementBlock("div",X,[e.renderSlot(t.$slots,"info")])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),o.results&&o.footer?(e.openBlock(),e.createElementBlock("div",Y,[e.createElementVNode("span",Z,e.toDisplayString(o.footer.text),1),e.createVNode(e.unref(T.default),e.mergeProps(o.footer.button,{variant:"tertiary"}),null,16)])):e.createCommentVNode("",!0)])],2)),[[e.unref(P.VOnClickOutside),D]]),e.createElementVNode("div",ee,[e.createElementVNode("div",te,null,512)])],512)):e.createCommentVNode("",!0)]),_:3})]))}});exports.default=le;exports.elInputSearchColors=oe;exports.elInputSearchStatus=re;
 //# sourceMappingURL=ElInputSearch.vue.cjs2.js.map

package/dist/forms/ElInputSearch.vue.cjs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputSearch.vue.cjs2.js","sources":["../../src/forms/ElInputSearch.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputSearchColors = ['primary', 'secondary'] as const;\nexport type ElInputSearchColors = (typeof elInputSearchColors)[number];\n\nexport const elInputSearchStatus = ['default', 'filled', 'blank'] as const;\nexport type ElInputSearchStatus = (typeof elInputSearchStatus)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElDivider from '@/ElDivider.vue';\nimport ElIcon from '@/ElIcon.vue';\nimport ElVerticalTab from '@/ElVerticalTab.vue';\nimport { ElButton } from '..';\nimport { computed, PropType, ref, useSlots, watch, nextTick } from 'vue';\nimport { useInput, withTextualElInputProps } from './input';\nimport { vOnClickOutside } from '@vueuse/components';\nimport CustomTransition from '@/_CustomTransition.vue';\nimport { onKeyStroke, useScrollLock } from '@vueuse/core';\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  status: {\n    type: String as PropType<ElInputSearchStatus>,\n    default: 'default',\n  },\n  text: {\n    type: String,\n    default: undefined,\n  },\n  results: {\n    type: Array as PropType<InstanceType<typeof ElVerticalTab>['$props'][]>,\n    default: undefined,\n  },\n  footer: {\n    type: Object as PropType<{\n      text: string;\n      button: InstanceType<typeof ElButton>['$props'];\n    }>,\n    default: undefined,\n  },\n  blankResults: {\n    type: Object as PropType<{\n      icon: InstanceType<typeof ElIcon>['$props'];\n      primaryRow: string;\n      secondaryRow?: string;\n    }>,\n    default: undefined,\n  },\n  shouldHoverFirstResultOnOpen: {\n    type: Boolean,\n    default: false,\n  },\n  color: {\n    type: String as PropType<ElInputSearchColors>,\n    default: 'primary',\n  },\n});\n\nconst emit = defineEmits(['update:modelValue', 'onResultClick', 'onResultHover']);\nconst slots = useSlots();\nconst isBodyScrollLocked = useScrollLock(document.body);\n\nconst searchInput = ref<HTMLInputElement | null>(null);\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\nconst computedStatus = computed(() => ({\n  default: !props.results,\n  filled: props.results && props.results.length > 0,\n  blank: props.results && props.results.length === 0,\n}));\nconst isClickOutside = ref(false);\nconst isSearchFocused = ref(false);\n\nconst itemRefs = ref<InstanceType<typeof ElVerticalTab>[]>([]);\nconst activeResult = ref<number | undefined>();\n\nconst { value, uuid, setValue } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst searchBarRef = ref<HTMLInputElement>();\nconst { hasFocus, activate, deactivate } = useFocusTrap(searchBarRef as any);\n\nconst isOpen = defineModel('isOpen', {\n  default: true,\n  required: true,\n  type: Boolean,\n});\n\nconst closeSearchBar = () => {\n  isOpen.value = false;\n  activeResult.value = undefined;\n};\n\nconst scrollToFocusedIndex = (index: number) => {\n  itemRefs.value?.at(index)?.$el?.scrollIntoView({ block: 'nearest' });\n};\n\nconst onResultClick = (index: number) => {\n  emit('onResultClick', index);\n  setValue('');\n  activeResult.value = undefined;\n};\n\nconst onResultHover = (index: number) => {\n  activeResult.value = index;\n  scrollToFocusedIndex(index);\n  emit('onResultHover', index);\n};\n\nconst onClickOutside = () => closeSearchBar();\n\nonKeyStroke(\n  ['ArrowUp', 'ArrowDown', 'Enter', 'Escape'],\n  e => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (hasFocus && props.results?.length) {\n      switch (e.key) {\n        case 'ArrowUp':\n          const previousActiveIndex = Math.max((activeResult.value ?? 0) - 1, 0);\n          onResultHover(previousActiveIndex);\n          break;\n        case 'ArrowDown':\n          const nextActiveIndex = activeResult.value !== undefined ? Math.min(activeResult.value + 1, props.results.length - 1) : 0;\n          onResultHover(nextActiveIndex);\n          break;\n        case 'Enter':\n          if (activeResult.value !== undefined) {\n            onResultClick(activeResult.value);\n          }\n          break;\n      }\n    }\n\n    if (e.key === 'Escape') {\n      closeSearchBar();\n    }\n  },\n  { target: searchBarRef },\n);\n\nwatch([isOpen, searchInput], async () => {\n  isBodyScrollLocked.value = isOpen.value;\n\n  if (isOpen.value) {\n    searchInput.value?.focus();\n\n    if (props.shouldHoverFirstResultOnOpen && props.results?.length) {\n      onResultHover(0);\n    }\n\n    await nextTick();\n    activate();\n  } else {\n    deactivate();\n  }\n});\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <CustomTransition name=\"fade\">\n      <div\n        v-if=\"isOpen\"\n        ref=\"searchBarRef\"\n        class=\"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0\"\n      >\n        <div\n          v-on-click-outside=\"onClickOutside\"\n          class=\"m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md\"\n          :class=\"{\n            'gap-6': props.results,\n          }\"\n        >\n          <!-- Search bar -->\n          <div class=\"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl\">\n            <ElIcon name=\"MagnifyingGlassIcon\" class=\"text-neutral-lighter w-6 h-6\" />\n            <input\n              ref=\"searchInput\"\n              v-model=\"value\"\n              :name=\"id || `${uuid}`\"\n              type=\"text\"\n              class=\"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0\"\n              :placeholder=\"placeholder\"\n              @focusin=\"\n                () => {\n                  isSearchFocused = true; // Set search focused\n                  isClickOutside = false; // Set click outside to false\n                }\n              \"\n              @focusout=\"\n                () => {\n                  isSearchFocused = false;\n                }\n              \"\n            />\n          </div>\n\n          <span class=\"flex flex-col gap-y-6 overflow-y-hidden\">\n            <ElDivider v-if=\"results\" direction=\"horizontal\" />\n            <div\n              v-if=\"blankResults && computedStatus.blank\"\n              class=\"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter\"\n            >\n              <ElIcon v-bind=\"blankResults.icon\" class=\"w-7 h-7\" />\n              <p class=\"text-sm font-semibold text-neutral-darker\">{{ blankResults.primaryRow }}</p>\n              <p class=\"text-sm font-normal\">{{ blankResults.secondaryRow }}</p>\n            </div>\n            <div v-if=\"results && computedStatus.filled\" class=\"flex py-2 overflow-y-hidden\">\n              <!-- Results Left column  -->\n              <div\n                class=\"flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen\"\n                :class=\"{ 'pr-6': slots.info && results.length > 0 }\"\n              >\n                <span v-if=\"text\" class=\"text-sm font-medium text-neutral-darker\">{{ text }}</span>\n                <div class=\"flex flex-col gap-1 w-full\">\n                  <ElVerticalTab\n                    v-for=\"(result, index) in results\"\n                    :key=\"index\"\n                    ref=\"itemRefs\"\n                    :color=\"color\"\n                    v-bind=\"result\"\n                    :status=\"activeResult === index ? 'hover' : 'default'\"\n                    tabindex=\"-1\"\n                    @click=\"() => onResultClick(index)\"\n                    @mouseover=\"() => onResultHover(index)\"\n                  />\n                </div>\n              </div>\n              <!-- Blank Results -->\n\n              <div v-if=\"slots.info\">\n                <ElDivider direction=\"vertical\" />\n              </div>\n              <div v-if=\"slots.info\" class=\"flex-1 pl-6 overflow-y-auto\">\n                <slot name=\"info\"></slot>\n              </div>\n            </div>\n            <div v-if=\"results && footer\" class=\"flex items-center gap-1 self-stretch\">\n              <span class=\"text-sm font-normal text-neutral-darker\">{{ footer.text }}</span>\n              <ElButton v-bind=\"footer.button\" variant=\"tertiary\" />\n            </div>\n          </span>\n        </div>\n\n        <!-- Backdrop -->\n        <div class=\"fixed inset-0 transition-opacity\">\n          <div ref=\"backdrop\" class=\"absolute inset-0 bg-gray-500 opacity-75\"></div>\n        </div>\n      </div>\n    </CustomTransition>\n  </Teleport>\n</template>\n"],"names":["elInputSearchColors","elInputSearchStatus","props","__props","emit","__emit","slots","useSlots","isBodyScrollLocked","useScrollLock","searchInput","ref","computedModelValue","computed","computedValidation","computedStatus","isClickOutside","isSearchFocused","itemRefs","activeResult","value","uuid","setValue","useInput","newValue","searchBarRef","hasFocus","activate","deactivate","useFocusTrap","isOpen","_useModel","closeSearchBar","scrollToFocusedIndex","index","_c","_b","_a","onResultClick","onResultHover","onClickOutside","onKeyStroke","e","previousActiveIndex","nextActiveIndex","watch","nextTick"],"mappings":"kuEACaA,GAAsB,CAAC,UAAW,WAAW,EAG7CC,GAAsB,CAAC,UAAW,SAAU,OAAO,8iBAgBhE,MAAMC,EAAQC,EAuCRC,EAAOC,EACPC,EAAQC,EAAAA,WACRC,EAAqBC,EAAAA,cAAc,SAAS,IAAI,EAEhDC,EAAcC,MAA6B,IAAI,EAC/CC,EAAqBC,EAAA,SAAS,IAAMX,EAAM,UAAU,EACpDY,EAAqBD,EAAAA,SAAS,IAAM,CAACX,EAAM,UAAU,CAAC,EACtDa,EAAiBF,EAAAA,SAAS,KAAO,CACrC,QAAS,CAACX,EAAM,QAChB,OAAQA,EAAM,SAAWA,EAAM,QAAQ,OAAS,EAChD,MAAOA,EAAM,SAAWA,EAAM,QAAQ,SAAW,CACjD,EAAA,EACIc,EAAiBL,MAAI,EAAK,EAC1BM,EAAkBN,MAAI,EAAK,EAE3BO,EAAWP,MAA0C,CAAA,CAAE,EACvDQ,EAAeR,EAAAA,MAEf,CAAE,MAAAS,EAAO,KAAAC,EAAM,SAAAC,GAAaC,EAAAA,SAASX,EAAoBE,EAAoBZ,EAAM,KAAkBsB,GAAA,CACpGpB,EAAA,oBAAqBoB,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAed,EAAAA,MACf,CAAE,SAAAe,EAAU,SAAAC,EAAU,WAAAC,CAAW,EAAIC,EAAAA,aAAaJ,CAAmB,EAErEK,EAASC,EAAAA,SAAY5B,EAAA,QAI1B,EAEK6B,EAAiB,IAAM,CAC3BF,EAAO,MAAQ,GACfX,EAAa,MAAQ,MAAA,EAGjBc,EAAwBC,GAAkB,YACrCC,GAAAC,GAAAC,EAAAnB,EAAA,QAAA,YAAAmB,EAAO,GAAGH,KAAV,YAAAE,EAAkB,MAAlB,MAAAD,EAAuB,eAAe,CAAE,MAAO,SAAA,EAAW,EAG/DG,EAAiBJ,GAAkB,CACvC9B,EAAK,gBAAiB8B,CAAK,EAC3BZ,EAAS,EAAE,EACXH,EAAa,MAAQ,MAAA,EAGjBoB,EAAiBL,GAAkB,CACvCf,EAAa,MAAQe,EACrBD,EAAqBC,CAAK,EAC1B9B,EAAK,gBAAiB8B,CAAK,CAAA,EAGvBM,EAAiB,IAAMR,IAE7BS,OAAAA,EAAA,YACE,CAAC,UAAW,YAAa,QAAS,QAAQ,EACrCC,GAAA,OAIC,GAHJA,EAAE,eAAe,EACjBA,EAAE,gBAAgB,EAEdhB,KAAYW,EAAAnC,EAAM,UAAN,MAAAmC,EAAe,QAC7B,OAAQK,EAAE,IAAK,CACb,IAAK,UACH,MAAMC,EAAsB,KAAK,KAAKxB,EAAa,OAAS,GAAK,EAAG,CAAC,EACrEoB,EAAcI,CAAmB,EACjC,MACF,IAAK,YACH,MAAMC,EAAkBzB,EAAa,QAAU,OAAY,KAAK,IAAIA,EAAa,MAAQ,EAAGjB,EAAM,QAAQ,OAAS,CAAC,EAAI,EACxHqC,EAAcK,CAAe,EAC7B,MACF,IAAK,QACCzB,EAAa,QAAU,QACzBmB,EAAcnB,EAAa,KAAK,EAElC,KACJ,CAGEuB,EAAE,MAAQ,UACGV,GAEnB,EACA,CAAE,OAAQP,CAAa,CAAA,EAGzBoB,EAAAA,MAAM,CAACf,EAAQpB,CAAW,EAAG,SAAY,SACvCF,EAAmB,MAAQsB,EAAO,MAE9BA,EAAO,QACTO,EAAA3B,EAAY,QAAZ,MAAA2B,EAAmB,QAEfnC,EAAM,gCAAgCkC,EAAAlC,EAAM,UAAN,MAAAkC,EAAe,SACvDG,EAAc,CAAC,EAGjB,MAAMO,EAAS,SAAA,EACNnB,KAEEC,GACb,CACD"}
+{"version":3,"file":"ElInputSearch.vue.cjs2.js","sources":["../../src/forms/ElInputSearch.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputSearchColors = ['primary', 'secondary'] as const;\nexport type ElInputSearchColors = (typeof elInputSearchColors)[number];\n\nexport const elInputSearchStatus = ['default', 'filled', 'blank'] as const;\nexport type ElInputSearchStatus = (typeof elInputSearchStatus)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElDivider from '@/ElDivider.vue';\nimport ElIcon from '@/ElIcon.vue';\nimport ElVerticalTab from '@/ElVerticalTab.vue';\nimport { ElButton } from '..';\nimport { computed, PropType, ref, useSlots, watch, nextTick } from 'vue';\nimport { useInput, withTextualElInputProps } from './input';\nimport { vOnClickOutside } from '@vueuse/components';\nimport CustomTransition from '@/_CustomTransition.vue';\nimport { onKeyStroke, useScrollLock } from '@vueuse/core';\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  status: {\n    type: String as PropType<ElInputSearchStatus>,\n    default: 'default',\n  },\n  text: {\n    type: String,\n    default: undefined,\n  },\n  results: {\n    type: Array as PropType<InstanceType<typeof ElVerticalTab>['$props'][]>,\n    default: undefined,\n  },\n  footer: {\n    type: Object as PropType<{\n      text: string;\n      button: InstanceType<typeof ElButton>['$props'];\n    }>,\n    default: undefined,\n  },\n  blankResults: {\n    type: Object as PropType<{\n      icon: InstanceType<typeof ElIcon>['$props'];\n      primaryRow: string;\n      secondaryRow?: string;\n    }>,\n    default: undefined,\n  },\n  shouldHoverFirstResultOnOpen: {\n    type: Boolean,\n    default: false,\n  },\n  color: {\n    type: String as PropType<ElInputSearchColors>,\n    default: 'primary',\n  },\n});\n\nconst emit = defineEmits(['update:modelValue', 'onResultClick', 'onResultHover']);\nconst slots = useSlots();\nconst isBodyScrollLocked = useScrollLock(document.body);\n\nconst searchInput = ref<HTMLInputElement | null>(null);\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\nconst computedStatus = computed(() => ({\n  default: !props.results,\n  filled: props.results && props.results.length > 0,\n  blank: props.results && props.results.length === 0,\n}));\nconst isClickOutside = ref(false);\nconst isSearchFocused = ref(false);\n\nconst itemRefs = ref<InstanceType<typeof ElVerticalTab>[]>([]);\nconst activeResult = ref<number | undefined>();\n\nconst { value, uuid, setValue } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst searchBarRef = ref<HTMLInputElement>();\nconst { hasFocus, activate, deactivate } = useFocusTrap(searchBarRef as any);\n\nconst isOpen = defineModel('isOpen', {\n  default: true,\n  required: true,\n  type: Boolean,\n});\n\nconst closeSearchBar = () => {\n  isOpen.value = false;\n  activeResult.value = undefined;\n  value.value = '';\n};\n\nconst scrollToFocusedIndex = (index: number) => {\n  itemRefs.value?.at(index)?.$el?.scrollIntoView({ block: 'nearest' });\n};\n\nconst onResultClick = (index: number) => {\n  emit('onResultClick', index);\n  setValue('');\n  activeResult.value = undefined;\n};\n\nconst onResultHover = (index: number) => {\n  activeResult.value = index;\n  scrollToFocusedIndex(index);\n  emit('onResultHover', index);\n};\n\nconst onClickOutside = () => closeSearchBar();\n\nonKeyStroke(\n  ['ArrowUp', 'ArrowDown', 'Enter', 'Escape'],\n  e => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (hasFocus && props.results?.length) {\n      switch (e.key) {\n        case 'ArrowUp':\n          const previousActiveIndex = Math.max((activeResult.value ?? 0) - 1, 0);\n          onResultHover(previousActiveIndex);\n          break;\n        case 'ArrowDown':\n          const nextActiveIndex = activeResult.value !== undefined ? Math.min(activeResult.value + 1, props.results.length - 1) : 0;\n          onResultHover(nextActiveIndex);\n          break;\n        case 'Enter':\n          if (activeResult.value !== undefined) {\n            onResultClick(activeResult.value);\n          }\n          break;\n      }\n    }\n\n    if (e.key === 'Escape') {\n      closeSearchBar();\n    }\n  },\n  { target: searchBarRef },\n);\n\nwatch([isOpen, searchInput], async () => {\n  isBodyScrollLocked.value = isOpen.value;\n\n  if (isOpen.value) {\n    searchInput.value?.focus();\n\n    if (props.shouldHoverFirstResultOnOpen && props.results?.length) {\n      onResultHover(0);\n    }\n\n    await nextTick();\n    activate();\n  } else {\n    deactivate();\n    value.value = '';\n  }\n});\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <CustomTransition name=\"fade\">\n      <div\n        v-if=\"isOpen\"\n        ref=\"searchBarRef\"\n        class=\"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0\"\n      >\n        <div\n          v-on-click-outside=\"onClickOutside\"\n          class=\"m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md\"\n          :class=\"{\n            'gap-6': props.results,\n          }\"\n        >\n          <!-- Search bar -->\n          <div class=\"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl\">\n            <ElIcon name=\"MagnifyingGlassIcon\" class=\"text-neutral-lighter w-6 h-6\" />\n            <input\n              ref=\"searchInput\"\n              v-model=\"value\"\n              :name=\"id || `${uuid}`\"\n              type=\"text\"\n              class=\"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0\"\n              :placeholder=\"placeholder\"\n              @focusin=\"\n                () => {\n                  isSearchFocused = true; // Set search focused\n                  isClickOutside = false; // Set click outside to false\n                }\n              \"\n              @focusout=\"\n                () => {\n                  isSearchFocused = false;\n                }\n              \"\n            />\n          </div>\n\n          <span class=\"flex flex-col gap-y-6 overflow-y-hidden\">\n            <ElDivider v-if=\"results\" direction=\"horizontal\" />\n            <div\n              v-if=\"blankResults && computedStatus.blank\"\n              class=\"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter\"\n            >\n              <ElIcon v-bind=\"blankResults.icon\" class=\"w-7 h-7\" />\n              <p class=\"text-sm font-semibold text-neutral-darker\">{{ blankResults.primaryRow }}</p>\n              <p class=\"text-sm font-normal\">{{ blankResults.secondaryRow }}</p>\n            </div>\n            <div v-if=\"results && computedStatus.filled\" class=\"flex py-2 overflow-y-hidden\">\n              <!-- Results Left column  -->\n              <div\n                class=\"flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen\"\n                :class=\"{ 'pr-6': slots.info && results.length > 0 }\"\n              >\n                <span v-if=\"text\" class=\"text-sm font-medium text-neutral-darker\">{{ text }}</span>\n                <div class=\"flex flex-col gap-1 w-full\">\n                  <ElVerticalTab\n                    v-for=\"(result, index) in results\"\n                    :key=\"index\"\n                    ref=\"itemRefs\"\n                    :color=\"color\"\n                    v-bind=\"result\"\n                    :status=\"activeResult === index ? 'hover' : 'default'\"\n                    tabindex=\"-1\"\n                    @click=\"() => onResultClick(index)\"\n                    @mouseover=\"() => onResultHover(index)\"\n                  />\n                </div>\n              </div>\n              <!-- Blank Results -->\n\n              <div v-if=\"slots.info\">\n                <ElDivider direction=\"vertical\" />\n              </div>\n              <div v-if=\"slots.info\" class=\"flex-1 pl-6 overflow-y-auto\">\n                <slot name=\"info\"></slot>\n              </div>\n            </div>\n            <div v-if=\"results && footer\" class=\"flex items-center gap-1 self-stretch\">\n              <span class=\"text-sm font-normal text-neutral-darker\">{{ footer.text }}</span>\n              <ElButton v-bind=\"footer.button\" variant=\"tertiary\" />\n            </div>\n          </span>\n        </div>\n\n        <!-- Backdrop -->\n        <div class=\"fixed inset-0 transition-opacity\">\n          <div ref=\"backdrop\" class=\"absolute inset-0 bg-gray-500 opacity-75\"></div>\n        </div>\n      </div>\n    </CustomTransition>\n  </Teleport>\n</template>\n"],"names":["elInputSearchColors","elInputSearchStatus","props","__props","emit","__emit","slots","useSlots","isBodyScrollLocked","useScrollLock","searchInput","ref","computedModelValue","computed","computedValidation","computedStatus","isClickOutside","isSearchFocused","itemRefs","activeResult","value","uuid","setValue","useInput","newValue","searchBarRef","hasFocus","activate","deactivate","useFocusTrap","isOpen","_useModel","closeSearchBar","scrollToFocusedIndex","index","_c","_b","_a","onResultClick","onResultHover","onClickOutside","onKeyStroke","e","previousActiveIndex","nextActiveIndex","watch","nextTick"],"mappings":"kuEACaA,GAAsB,CAAC,UAAW,WAAW,EAG7CC,GAAsB,CAAC,UAAW,SAAU,OAAO,8iBAgBhE,MAAMC,EAAQC,EAuCRC,EAAOC,EACPC,EAAQC,EAAAA,WACRC,EAAqBC,EAAAA,cAAc,SAAS,IAAI,EAEhDC,EAAcC,MAA6B,IAAI,EAC/CC,EAAqBC,EAAA,SAAS,IAAMX,EAAM,UAAU,EACpDY,EAAqBD,EAAAA,SAAS,IAAM,CAACX,EAAM,UAAU,CAAC,EACtDa,EAAiBF,EAAAA,SAAS,KAAO,CACrC,QAAS,CAACX,EAAM,QAChB,OAAQA,EAAM,SAAWA,EAAM,QAAQ,OAAS,EAChD,MAAOA,EAAM,SAAWA,EAAM,QAAQ,SAAW,CACjD,EAAA,EACIc,EAAiBL,MAAI,EAAK,EAC1BM,EAAkBN,MAAI,EAAK,EAE3BO,EAAWP,MAA0C,CAAA,CAAE,EACvDQ,EAAeR,EAAAA,MAEf,CAAE,MAAAS,EAAO,KAAAC,EAAM,SAAAC,GAAaC,EAAAA,SAASX,EAAoBE,EAAoBZ,EAAM,KAAkBsB,GAAA,CACpGpB,EAAA,oBAAqBoB,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAed,EAAAA,MACf,CAAE,SAAAe,EAAU,SAAAC,EAAU,WAAAC,CAAW,EAAIC,EAAAA,aAAaJ,CAAmB,EAErEK,EAASC,EAAAA,SAAY5B,EAAA,QAI1B,EAEK6B,EAAiB,IAAM,CAC3BF,EAAO,MAAQ,GACfX,EAAa,MAAQ,OACrBC,EAAM,MAAQ,EAAA,EAGVa,EAAwBC,GAAkB,YACrCC,GAAAC,GAAAC,EAAAnB,EAAA,QAAA,YAAAmB,EAAO,GAAGH,KAAV,YAAAE,EAAkB,MAAlB,MAAAD,EAAuB,eAAe,CAAE,MAAO,SAAA,EAAW,EAG/DG,EAAiBJ,GAAkB,CACvC9B,EAAK,gBAAiB8B,CAAK,EAC3BZ,EAAS,EAAE,EACXH,EAAa,MAAQ,MAAA,EAGjBoB,EAAiBL,GAAkB,CACvCf,EAAa,MAAQe,EACrBD,EAAqBC,CAAK,EAC1B9B,EAAK,gBAAiB8B,CAAK,CAAA,EAGvBM,EAAiB,IAAMR,IAE7BS,OAAAA,EAAA,YACE,CAAC,UAAW,YAAa,QAAS,QAAQ,EACrCC,GAAA,OAIC,GAHJA,EAAE,eAAe,EACjBA,EAAE,gBAAgB,EAEdhB,KAAYW,EAAAnC,EAAM,UAAN,MAAAmC,EAAe,QAC7B,OAAQK,EAAE,IAAK,CACb,IAAK,UACH,MAAMC,EAAsB,KAAK,KAAKxB,EAAa,OAAS,GAAK,EAAG,CAAC,EACrEoB,EAAcI,CAAmB,EACjC,MACF,IAAK,YACH,MAAMC,EAAkBzB,EAAa,QAAU,OAAY,KAAK,IAAIA,EAAa,MAAQ,EAAGjB,EAAM,QAAQ,OAAS,CAAC,EAAI,EACxHqC,EAAcK,CAAe,EAC7B,MACF,IAAK,QACCzB,EAAa,QAAU,QACzBmB,EAAcnB,EAAa,KAAK,EAElC,KACJ,CAGEuB,EAAE,MAAQ,UACGV,GAEnB,EACA,CAAE,OAAQP,CAAa,CAAA,EAGzBoB,EAAAA,MAAM,CAACf,EAAQpB,CAAW,EAAG,SAAY,SACvCF,EAAmB,MAAQsB,EAAO,MAE9BA,EAAO,QACTO,EAAA3B,EAAY,QAAZ,MAAA2B,EAAmB,QAEfnC,EAAM,gCAAgCkC,EAAAlC,EAAM,UAAN,MAAAkC,EAAe,SACvDG,EAAc,CAAC,EAGjB,MAAMO,EAAS,SAAA,EACNnB,MAEEC,IACXR,EAAM,MAAQ,GAChB,CACD"}

package/dist/forms/ElInputSearch.vue.esm2.js

@@ -1,2 +1,2 @@
-import{defineComponent as K,mergeModels as B,useSlots as J,ref as f,computed as w,useModel as Q,watch as W,nextTick as X,openBlock as l,createBlock as R,Teleport as Y,createVNode as p,withCtx as Z,createElementBlock as i,withDirectives as F,normalizeClass as E,createElementVNode as r,isRef as ee,unref as d,vModelText as te,createCommentVNode as c,mergeProps as O,toDisplayString as h,Fragment as oe,renderList as se,renderSlot as le}from"vue";import V from"../ElDivider.vue.esm2.js";import $ from"../ElIcon.vue.esm2.js";import re from"../ElVerticalTab.vue.esm2.js";/* empty css              */import"../polyfills.esm.js";import"vee-validate";import"../node_modules/codice-fiscale-js/dist/codice.fiscale.commonjs2.esm.js";import"../node_modules/lodash/lodash.esm.js";import"../tailwind.plugin.esm.js";import"../node_modules/@davincihealthcare/elty-design-system-foundations/dist/index.esm.js";import ae from"../ElButton.vue.esm2.js";import ne from"../_CustomTransition.vue.esm2.js";import{useScrollLock as ie,onKeyStroke as ue}from"../node_modules/@vueuse/core/index.esm.js";import"./ElInputText.vue.esm2.js";import"./ElInputCheckbox.vue.esm2.js";import"./ElInputDate.vue.esm2.js";import"./ElInputFile.vue.esm2.js";import"./ElInputMeasureUnit.vue.esm2.js";import"./ElInputNumber.vue.esm2.js";import"./ElInputPhone.vue.esm2.js";import"./ElInputSelect.vue.esm2.js";import"./ElInputTextarea.vue.esm2.js";import"../ElToast.vue.esm2.js";import"./ElInputRadioButton.vue.esm2.js";import{VOnClickOutside as ce}from"../node_modules/@vueuse/components/index.esm.js";import{withTextualElInputProps as de,useInput as fe}from"./input.esm.js";import"../node_modules/swiper/shared/swiper-core.esm.js";/* empty css                                   *//* empty css                                               */import{useFocusTrap as me}from"../node_modules/@vueuse/integrations/useFocusTrap.esm.js";const pe={class:"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl"},ve=["name","placeholder"],he={class:"flex flex-col gap-y-6 overflow-y-hidden"},ye={key:1,class:"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter"},xe={class:"text-sm font-semibold text-neutral-darker"},ke={class:"text-sm font-normal"},ge={key:2,class:"flex py-2 overflow-y-hidden"},be={key:0,class:"text-sm font-medium text-neutral-darker"},we={class:"flex flex-col gap-1 w-full"},Re={key:0},Oe={key:1,class:"flex-1 pl-6 overflow-y-auto"},Se={key:3,class:"flex items-center gap-1 self-stretch"},Ce={class:"text-sm font-normal text-neutral-darker"},Ie={class:"fixed inset-0 transition-opacity"},Me={ref:"backdrop",class:"absolute inset-0 bg-gray-500 opacity-75"},at=["primary","secondary"],nt=["default","filled","blank"],it=K({__name:"ElInputSearch",props:B({...de(),status:{type:String,default:"default"},text:{type:String,default:void 0},results:{type:Array,default:void 0},footer:{type:Object,default:void 0},blankResults:{type:Object,default:void 0},shouldHoverFirstResultOnOpen:{type:Boolean,default:!1},color:{type:String,default:"primary"}},{isOpen:{default:!0,required:!0,type:Boolean},isOpenModifiers:{}}),emits:B(["update:modelValue","onResultClick","onResultHover"],["update:isOpen"]),setup(t,{emit:A}){const s=t,y=A,x=J(),T=ie(document.body),k=f(null),D=w(()=>s.modelValue),H=w(()=>[s.validation]),S=w(()=>({default:!s.results,filled:s.results&&s.results.length>0,blank:s.results&&s.results.length===0})),j=f(!1),C=f(!1),I=f([]),a=f(),{value:g,uuid:z,setValue:L}=fe(D,H,s.name,e=>{y("update:modelValue",e==null?void 0:e.trim())}),b=f(),{hasFocus:N,activate:P,deactivate:U}=me(b),m=Q(t,"isOpen"),M=()=>{m.value=!1,a.value=void 0},q=e=>{var o,u,n;(n=(u=(o=I.value)==null?void 0:o.at(e))==null?void 0:u.$el)==null||n.scrollIntoView({block:"nearest"})},_=e=>{y("onResultClick",e),L(""),a.value=void 0},v=e=>{a.value=e,q(e),y("onResultHover",e)},G=()=>M();return ue(["ArrowUp","ArrowDown","Enter","Escape"],e=>{var o;if(e.preventDefault(),e.stopPropagation(),N&&((o=s.results)!=null&&o.length))switch(e.key){case"ArrowUp":const u=Math.max((a.value??0)-1,0);v(u);break;case"ArrowDown":const n=a.value!==void 0?Math.min(a.value+1,s.results.length-1):0;v(n);break;case"Enter":a.value!==void 0&&_(a.value);break}e.key==="Escape"&&M()},{target:b}),W([m,k],async()=>{var e,o;T.value=m.value,m.value?((e=k.value)==null||e.focus(),s.shouldHoverFirstResultOnOpen&&((o=s.results)!=null&&o.length)&&v(0),await X(),P()):U()}),(e,o)=>(l(),R(Y,{to:"body"},[p(ne,{name:"fade"},{default:Z(()=>[m.value?(l(),i("div",{key:0,ref_key:"searchBarRef",ref:b,class:"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0"},[F((l(),i("div",{class:E(["m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md",{"gap-6":s.results}])},[r("div",pe,[p($,{name:"MagnifyingGlassIcon",class:"text-neutral-lighter w-6 h-6"}),F(r("input",{ref_key:"searchInput",ref:k,"onUpdate:modelValue":o[0]||(o[0]=u=>ee(g)?g.value=u:null),name:e.id||`${d(z)}`,type:"text",class:"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0",placeholder:e.placeholder,onFocusin:o[1]||(o[1]=()=>{C.value=!0,j.value=!1}),onFocusout:o[2]||(o[2]=()=>{C.value=!1})},null,40,ve),[[te,d(g)]])]),r("span",he,[t.results?(l(),R(V,{key:0,direction:"horizontal"})):c("",!0),t.blankResults&&S.value.blank?(l(),i("div",ye,[p($,O(t.blankResults.icon,{class:"w-7 h-7"}),null,16),r("p",xe,h(t.blankResults.primaryRow),1),r("p",ke,h(t.blankResults.secondaryRow),1)])):c("",!0),t.results&&S.value.filled?(l(),i("div",ge,[r("div",{class:E(["flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen",{"pr-6":d(x).info&&t.results.length>0}])},[t.text?(l(),i("span",be,h(t.text),1)):c("",!0),r("div",we,[(l(!0),i(oe,null,se(t.results,(u,n)=>(l(),R(re,O({key:n,ref_for:!0,ref_key:"itemRefs",ref:I,color:t.color},u,{status:a.value===n?"hover":"default",tabindex:"-1",onClick:()=>_(n),onMouseover:()=>v(n)}),null,16,["color","status","onClick","onMouseover"]))),128))])],2),d(x).info?(l(),i("div",Re,[p(V,{direction:"vertical"})])):c("",!0),d(x).info?(l(),i("div",Oe,[le(e.$slots,"info")])):c("",!0)])):c("",!0),t.results&&t.footer?(l(),i("div",Se,[r("span",Ce,h(t.footer.text),1),p(d(ae),O(t.footer.button,{variant:"tertiary"}),null,16)])):c("",!0)])],2)),[[d(ce),G]]),r("div",Ie,[r("div",Me,null,512)])],512)):c("",!0)]),_:3})]))}});export{it as default,at as elInputSearchColors,nt as elInputSearchStatus};
+import{defineComponent as K,mergeModels as B,useSlots as J,ref as f,computed as w,useModel as Q,watch as W,nextTick as X,openBlock as l,createBlock as R,Teleport as Y,createVNode as v,withCtx as Z,createElementBlock as i,withDirectives as F,normalizeClass as E,createElementVNode as r,isRef as ee,unref as d,vModelText as te,createCommentVNode as c,mergeProps as O,toDisplayString as y,Fragment as oe,renderList as se,renderSlot as le}from"vue";import V from"../ElDivider.vue.esm2.js";import $ from"../ElIcon.vue.esm2.js";import re from"../ElVerticalTab.vue.esm2.js";/* empty css              */import"../polyfills.esm.js";import"vee-validate";import"../node_modules/codice-fiscale-js/dist/codice.fiscale.commonjs2.esm.js";import"../node_modules/lodash/lodash.esm.js";import"../tailwind.plugin.esm.js";import"../node_modules/@davincihealthcare/elty-design-system-foundations/dist/index.esm.js";import ae from"../ElButton.vue.esm2.js";import ne from"../_CustomTransition.vue.esm2.js";import{useScrollLock as ie,onKeyStroke as ue}from"../node_modules/@vueuse/core/index.esm.js";import"./ElInputText.vue.esm2.js";import"./ElInputCheckbox.vue.esm2.js";import"./ElInputDate.vue.esm2.js";import"./ElInputFile.vue.esm2.js";import"./ElInputMeasureUnit.vue.esm2.js";import"./ElInputNumber.vue.esm2.js";import"./ElInputPhone.vue.esm2.js";import"./ElInputSelect.vue.esm2.js";import"./ElInputTextarea.vue.esm2.js";import"../ElToast.vue.esm2.js";import"./ElInputRadioButton.vue.esm2.js";import{VOnClickOutside as ce}from"../node_modules/@vueuse/components/index.esm.js";import{withTextualElInputProps as de,useInput as fe}from"./input.esm.js";import"../node_modules/swiper/shared/swiper-core.esm.js";/* empty css                                   *//* empty css                                               */import{useFocusTrap as me}from"../node_modules/@vueuse/integrations/useFocusTrap.esm.js";const pe={class:"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl"},ve=["name","placeholder"],he={class:"flex flex-col gap-y-6 overflow-y-hidden"},ye={key:1,class:"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter"},xe={class:"text-sm font-semibold text-neutral-darker"},ke={class:"text-sm font-normal"},ge={key:2,class:"flex py-2 overflow-y-hidden"},be={key:0,class:"text-sm font-medium text-neutral-darker"},we={class:"flex flex-col gap-1 w-full"},Re={key:0},Oe={key:1,class:"flex-1 pl-6 overflow-y-auto"},Se={key:3,class:"flex items-center gap-1 self-stretch"},Ce={class:"text-sm font-normal text-neutral-darker"},Ie={class:"fixed inset-0 transition-opacity"},Me={ref:"backdrop",class:"absolute inset-0 bg-gray-500 opacity-75"},at=["primary","secondary"],nt=["default","filled","blank"],it=K({__name:"ElInputSearch",props:B({...de(),status:{type:String,default:"default"},text:{type:String,default:void 0},results:{type:Array,default:void 0},footer:{type:Object,default:void 0},blankResults:{type:Object,default:void 0},shouldHoverFirstResultOnOpen:{type:Boolean,default:!1},color:{type:String,default:"primary"}},{isOpen:{default:!0,required:!0,type:Boolean},isOpenModifiers:{}}),emits:B(["update:modelValue","onResultClick","onResultHover"],["update:isOpen"]),setup(t,{emit:A}){const s=t,x=A,k=J(),T=ie(document.body),g=f(null),D=w(()=>s.modelValue),H=w(()=>[s.validation]),S=w(()=>({default:!s.results,filled:s.results&&s.results.length>0,blank:s.results&&s.results.length===0})),j=f(!1),C=f(!1),I=f([]),a=f(),{value:m,uuid:z,setValue:L}=fe(D,H,s.name,e=>{x("update:modelValue",e==null?void 0:e.trim())}),b=f(),{hasFocus:N,activate:P,deactivate:U}=me(b),p=Q(t,"isOpen"),M=()=>{p.value=!1,a.value=void 0,m.value=""},q=e=>{var o,u,n;(n=(u=(o=I.value)==null?void 0:o.at(e))==null?void 0:u.$el)==null||n.scrollIntoView({block:"nearest"})},_=e=>{x("onResultClick",e),L(""),a.value=void 0},h=e=>{a.value=e,q(e),x("onResultHover",e)},G=()=>M();return ue(["ArrowUp","ArrowDown","Enter","Escape"],e=>{var o;if(e.preventDefault(),e.stopPropagation(),N&&((o=s.results)!=null&&o.length))switch(e.key){case"ArrowUp":const u=Math.max((a.value??0)-1,0);h(u);break;case"ArrowDown":const n=a.value!==void 0?Math.min(a.value+1,s.results.length-1):0;h(n);break;case"Enter":a.value!==void 0&&_(a.value);break}e.key==="Escape"&&M()},{target:b}),W([p,g],async()=>{var e,o;T.value=p.value,p.value?((e=g.value)==null||e.focus(),s.shouldHoverFirstResultOnOpen&&((o=s.results)!=null&&o.length)&&h(0),await X(),P()):(U(),m.value="")}),(e,o)=>(l(),R(Y,{to:"body"},[v(ne,{name:"fade"},{default:Z(()=>[p.value?(l(),i("div",{key:0,ref_key:"searchBarRef",ref:b,class:"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0"},[F((l(),i("div",{class:E(["m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md",{"gap-6":s.results}])},[r("div",pe,[v($,{name:"MagnifyingGlassIcon",class:"text-neutral-lighter w-6 h-6"}),F(r("input",{ref_key:"searchInput",ref:g,"onUpdate:modelValue":o[0]||(o[0]=u=>ee(m)?m.value=u:null),name:e.id||`${d(z)}`,type:"text",class:"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0",placeholder:e.placeholder,onFocusin:o[1]||(o[1]=()=>{C.value=!0,j.value=!1}),onFocusout:o[2]||(o[2]=()=>{C.value=!1})},null,40,ve),[[te,d(m)]])]),r("span",he,[t.results?(l(),R(V,{key:0,direction:"horizontal"})):c("",!0),t.blankResults&&S.value.blank?(l(),i("div",ye,[v($,O(t.blankResults.icon,{class:"w-7 h-7"}),null,16),r("p",xe,y(t.blankResults.primaryRow),1),r("p",ke,y(t.blankResults.secondaryRow),1)])):c("",!0),t.results&&S.value.filled?(l(),i("div",ge,[r("div",{class:E(["flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen",{"pr-6":d(k).info&&t.results.length>0}])},[t.text?(l(),i("span",be,y(t.text),1)):c("",!0),r("div",we,[(l(!0),i(oe,null,se(t.results,(u,n)=>(l(),R(re,O({key:n,ref_for:!0,ref_key:"itemRefs",ref:I,color:t.color},u,{status:a.value===n?"hover":"default",tabindex:"-1",onClick:()=>_(n),onMouseover:()=>h(n)}),null,16,["color","status","onClick","onMouseover"]))),128))])],2),d(k).info?(l(),i("div",Re,[v(V,{direction:"vertical"})])):c("",!0),d(k).info?(l(),i("div",Oe,[le(e.$slots,"info")])):c("",!0)])):c("",!0),t.results&&t.footer?(l(),i("div",Se,[r("span",Ce,y(t.footer.text),1),v(d(ae),O(t.footer.button,{variant:"tertiary"}),null,16)])):c("",!0)])],2)),[[d(ce),G]]),r("div",Ie,[r("div",Me,null,512)])],512)):c("",!0)]),_:3})]))}});export{it as default,at as elInputSearchColors,nt as elInputSearchStatus};
 //# sourceMappingURL=ElInputSearch.vue.esm2.js.map

package/dist/forms/ElInputSearch.vue.esm2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputSearch.vue.esm2.js","sources":["../../src/forms/ElInputSearch.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputSearchColors = ['primary', 'secondary'] as const;\nexport type ElInputSearchColors = (typeof elInputSearchColors)[number];\n\nexport const elInputSearchStatus = ['default', 'filled', 'blank'] as const;\nexport type ElInputSearchStatus = (typeof elInputSearchStatus)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElDivider from '@/ElDivider.vue';\nimport ElIcon from '@/ElIcon.vue';\nimport ElVerticalTab from '@/ElVerticalTab.vue';\nimport { ElButton } from '..';\nimport { computed, PropType, ref, useSlots, watch, nextTick } from 'vue';\nimport { useInput, withTextualElInputProps } from './input';\nimport { vOnClickOutside } from '@vueuse/components';\nimport CustomTransition from '@/_CustomTransition.vue';\nimport { onKeyStroke, useScrollLock } from '@vueuse/core';\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  status: {\n    type: String as PropType<ElInputSearchStatus>,\n    default: 'default',\n  },\n  text: {\n    type: String,\n    default: undefined,\n  },\n  results: {\n    type: Array as PropType<InstanceType<typeof ElVerticalTab>['$props'][]>,\n    default: undefined,\n  },\n  footer: {\n    type: Object as PropType<{\n      text: string;\n      button: InstanceType<typeof ElButton>['$props'];\n    }>,\n    default: undefined,\n  },\n  blankResults: {\n    type: Object as PropType<{\n      icon: InstanceType<typeof ElIcon>['$props'];\n      primaryRow: string;\n      secondaryRow?: string;\n    }>,\n    default: undefined,\n  },\n  shouldHoverFirstResultOnOpen: {\n    type: Boolean,\n    default: false,\n  },\n  color: {\n    type: String as PropType<ElInputSearchColors>,\n    default: 'primary',\n  },\n});\n\nconst emit = defineEmits(['update:modelValue', 'onResultClick', 'onResultHover']);\nconst slots = useSlots();\nconst isBodyScrollLocked = useScrollLock(document.body);\n\nconst searchInput = ref<HTMLInputElement | null>(null);\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\nconst computedStatus = computed(() => ({\n  default: !props.results,\n  filled: props.results && props.results.length > 0,\n  blank: props.results && props.results.length === 0,\n}));\nconst isClickOutside = ref(false);\nconst isSearchFocused = ref(false);\n\nconst itemRefs = ref<InstanceType<typeof ElVerticalTab>[]>([]);\nconst activeResult = ref<number | undefined>();\n\nconst { value, uuid, setValue } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst searchBarRef = ref<HTMLInputElement>();\nconst { hasFocus, activate, deactivate } = useFocusTrap(searchBarRef as any);\n\nconst isOpen = defineModel('isOpen', {\n  default: true,\n  required: true,\n  type: Boolean,\n});\n\nconst closeSearchBar = () => {\n  isOpen.value = false;\n  activeResult.value = undefined;\n};\n\nconst scrollToFocusedIndex = (index: number) => {\n  itemRefs.value?.at(index)?.$el?.scrollIntoView({ block: 'nearest' });\n};\n\nconst onResultClick = (index: number) => {\n  emit('onResultClick', index);\n  setValue('');\n  activeResult.value = undefined;\n};\n\nconst onResultHover = (index: number) => {\n  activeResult.value = index;\n  scrollToFocusedIndex(index);\n  emit('onResultHover', index);\n};\n\nconst onClickOutside = () => closeSearchBar();\n\nonKeyStroke(\n  ['ArrowUp', 'ArrowDown', 'Enter', 'Escape'],\n  e => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (hasFocus && props.results?.length) {\n      switch (e.key) {\n        case 'ArrowUp':\n          const previousActiveIndex = Math.max((activeResult.value ?? 0) - 1, 0);\n          onResultHover(previousActiveIndex);\n          break;\n        case 'ArrowDown':\n          const nextActiveIndex = activeResult.value !== undefined ? Math.min(activeResult.value + 1, props.results.length - 1) : 0;\n          onResultHover(nextActiveIndex);\n          break;\n        case 'Enter':\n          if (activeResult.value !== undefined) {\n            onResultClick(activeResult.value);\n          }\n          break;\n      }\n    }\n\n    if (e.key === 'Escape') {\n      closeSearchBar();\n    }\n  },\n  { target: searchBarRef },\n);\n\nwatch([isOpen, searchInput], async () => {\n  isBodyScrollLocked.value = isOpen.value;\n\n  if (isOpen.value) {\n    searchInput.value?.focus();\n\n    if (props.shouldHoverFirstResultOnOpen && props.results?.length) {\n      onResultHover(0);\n    }\n\n    await nextTick();\n    activate();\n  } else {\n    deactivate();\n  }\n});\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <CustomTransition name=\"fade\">\n      <div\n        v-if=\"isOpen\"\n        ref=\"searchBarRef\"\n        class=\"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0\"\n      >\n        <div\n          v-on-click-outside=\"onClickOutside\"\n          class=\"m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md\"\n          :class=\"{\n            'gap-6': props.results,\n          }\"\n        >\n          <!-- Search bar -->\n          <div class=\"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl\">\n            <ElIcon name=\"MagnifyingGlassIcon\" class=\"text-neutral-lighter w-6 h-6\" />\n            <input\n              ref=\"searchInput\"\n              v-model=\"value\"\n              :name=\"id || `${uuid}`\"\n              type=\"text\"\n              class=\"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0\"\n              :placeholder=\"placeholder\"\n              @focusin=\"\n                () => {\n                  isSearchFocused = true; // Set search focused\n                  isClickOutside = false; // Set click outside to false\n                }\n              \"\n              @focusout=\"\n                () => {\n                  isSearchFocused = false;\n                }\n              \"\n            />\n          </div>\n\n          <span class=\"flex flex-col gap-y-6 overflow-y-hidden\">\n            <ElDivider v-if=\"results\" direction=\"horizontal\" />\n            <div\n              v-if=\"blankResults && computedStatus.blank\"\n              class=\"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter\"\n            >\n              <ElIcon v-bind=\"blankResults.icon\" class=\"w-7 h-7\" />\n              <p class=\"text-sm font-semibold text-neutral-darker\">{{ blankResults.primaryRow }}</p>\n              <p class=\"text-sm font-normal\">{{ blankResults.secondaryRow }}</p>\n            </div>\n            <div v-if=\"results && computedStatus.filled\" class=\"flex py-2 overflow-y-hidden\">\n              <!-- Results Left column  -->\n              <div\n                class=\"flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen\"\n                :class=\"{ 'pr-6': slots.info && results.length > 0 }\"\n              >\n                <span v-if=\"text\" class=\"text-sm font-medium text-neutral-darker\">{{ text }}</span>\n                <div class=\"flex flex-col gap-1 w-full\">\n                  <ElVerticalTab\n                    v-for=\"(result, index) in results\"\n                    :key=\"index\"\n                    ref=\"itemRefs\"\n                    :color=\"color\"\n                    v-bind=\"result\"\n                    :status=\"activeResult === index ? 'hover' : 'default'\"\n                    tabindex=\"-1\"\n                    @click=\"() => onResultClick(index)\"\n                    @mouseover=\"() => onResultHover(index)\"\n                  />\n                </div>\n              </div>\n              <!-- Blank Results -->\n\n              <div v-if=\"slots.info\">\n                <ElDivider direction=\"vertical\" />\n              </div>\n              <div v-if=\"slots.info\" class=\"flex-1 pl-6 overflow-y-auto\">\n                <slot name=\"info\"></slot>\n              </div>\n            </div>\n            <div v-if=\"results && footer\" class=\"flex items-center gap-1 self-stretch\">\n              <span class=\"text-sm font-normal text-neutral-darker\">{{ footer.text }}</span>\n              <ElButton v-bind=\"footer.button\" variant=\"tertiary\" />\n            </div>\n          </span>\n        </div>\n\n        <!-- Backdrop -->\n        <div class=\"fixed inset-0 transition-opacity\">\n          <div ref=\"backdrop\" class=\"absolute inset-0 bg-gray-500 opacity-75\"></div>\n        </div>\n      </div>\n    </CustomTransition>\n  </Teleport>\n</template>\n"],"names":["elInputSearchColors","elInputSearchStatus","props","__props","emit","__emit","slots","useSlots","isBodyScrollLocked","useScrollLock","searchInput","ref","computedModelValue","computed","computedValidation","computedStatus","isClickOutside","isSearchFocused","itemRefs","activeResult","value","uuid","setValue","useInput","newValue","searchBarRef","hasFocus","activate","deactivate","useFocusTrap","isOpen","_useModel","closeSearchBar","scrollToFocusedIndex","index","_c","_b","_a","onResultClick","onResultHover","onClickOutside","onKeyStroke","previousActiveIndex","nextActiveIndex","watch","nextTick"],"mappings":"umFACaA,GAAsB,CAAC,UAAW,WAAW,EAG7CC,GAAsB,CAAC,UAAW,SAAU,OAAO,+eAgBhE,MAAMC,EAAQC,EAuCRC,EAAOC,EACPC,EAAQC,IACRC,EAAqBC,GAAc,SAAS,IAAI,EAEhDC,EAAcC,EAA6B,IAAI,EAC/CC,EAAqBC,EAAS,IAAMX,EAAM,UAAU,EACpDY,EAAqBD,EAAS,IAAM,CAACX,EAAM,UAAU,CAAC,EACtDa,EAAiBF,EAAS,KAAO,CACrC,QAAS,CAACX,EAAM,QAChB,OAAQA,EAAM,SAAWA,EAAM,QAAQ,OAAS,EAChD,MAAOA,EAAM,SAAWA,EAAM,QAAQ,SAAW,CACjD,EAAA,EACIc,EAAiBL,EAAI,EAAK,EAC1BM,EAAkBN,EAAI,EAAK,EAE3BO,EAAWP,EAA0C,CAAA,CAAE,EACvDQ,EAAeR,IAEf,CAAE,MAAAS,EAAO,KAAAC,EAAM,SAAAC,GAAaC,GAASX,EAAoBE,EAAoBZ,EAAM,KAAkBsB,GAAA,CACpGpB,EAAA,oBAAqBoB,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAed,IACf,CAAE,SAAAe,EAAU,SAAAC,EAAU,WAAAC,CAAW,EAAIC,GAAaJ,CAAmB,EAErEK,EAASC,EAAY5B,EAAA,QAI1B,EAEK6B,EAAiB,IAAM,CAC3BF,EAAO,MAAQ,GACfX,EAAa,MAAQ,MAAA,EAGjBc,EAAwBC,GAAkB,YACrCC,GAAAC,GAAAC,EAAAnB,EAAA,QAAA,YAAAmB,EAAO,GAAGH,KAAV,YAAAE,EAAkB,MAAlB,MAAAD,EAAuB,eAAe,CAAE,MAAO,SAAA,EAAW,EAG/DG,EAAiBJ,GAAkB,CACvC9B,EAAK,gBAAiB8B,CAAK,EAC3BZ,EAAS,EAAE,EACXH,EAAa,MAAQ,MAAA,EAGjBoB,EAAiBL,GAAkB,CACvCf,EAAa,MAAQe,EACrBD,EAAqBC,CAAK,EAC1B9B,EAAK,gBAAiB8B,CAAK,CAAA,EAGvBM,EAAiB,IAAMR,IAE7B,OAAAS,GACE,CAAC,UAAW,YAAa,QAAS,QAAQ,EACrC,GAAA,OAIC,GAHJ,EAAE,eAAe,EACjB,EAAE,gBAAgB,EAEdf,KAAYW,EAAAnC,EAAM,UAAN,MAAAmC,EAAe,QAC7B,OAAQ,EAAE,IAAK,CACb,IAAK,UACH,MAAMK,EAAsB,KAAK,KAAKvB,EAAa,OAAS,GAAK,EAAG,CAAC,EACrEoB,EAAcG,CAAmB,EACjC,MACF,IAAK,YACH,MAAMC,EAAkBxB,EAAa,QAAU,OAAY,KAAK,IAAIA,EAAa,MAAQ,EAAGjB,EAAM,QAAQ,OAAS,CAAC,EAAI,EACxHqC,EAAcI,CAAe,EAC7B,MACF,IAAK,QACCxB,EAAa,QAAU,QACzBmB,EAAcnB,EAAa,KAAK,EAElC,KACJ,CAGE,EAAE,MAAQ,UACGa,GAEnB,EACA,CAAE,OAAQP,CAAa,CAAA,EAGzBmB,EAAM,CAACd,EAAQpB,CAAW,EAAG,SAAY,SACvCF,EAAmB,MAAQsB,EAAO,MAE9BA,EAAO,QACTO,EAAA3B,EAAY,QAAZ,MAAA2B,EAAmB,QAEfnC,EAAM,gCAAgCkC,EAAAlC,EAAM,UAAN,MAAAkC,EAAe,SACvDG,EAAc,CAAC,EAGjB,MAAMM,EAAS,EACNlB,KAEEC,GACb,CACD"}
+{"version":3,"file":"ElInputSearch.vue.esm2.js","sources":["../../src/forms/ElInputSearch.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputSearchColors = ['primary', 'secondary'] as const;\nexport type ElInputSearchColors = (typeof elInputSearchColors)[number];\n\nexport const elInputSearchStatus = ['default', 'filled', 'blank'] as const;\nexport type ElInputSearchStatus = (typeof elInputSearchStatus)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport ElDivider from '@/ElDivider.vue';\nimport ElIcon from '@/ElIcon.vue';\nimport ElVerticalTab from '@/ElVerticalTab.vue';\nimport { ElButton } from '..';\nimport { computed, PropType, ref, useSlots, watch, nextTick } from 'vue';\nimport { useInput, withTextualElInputProps } from './input';\nimport { vOnClickOutside } from '@vueuse/components';\nimport CustomTransition from '@/_CustomTransition.vue';\nimport { onKeyStroke, useScrollLock } from '@vueuse/core';\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  status: {\n    type: String as PropType<ElInputSearchStatus>,\n    default: 'default',\n  },\n  text: {\n    type: String,\n    default: undefined,\n  },\n  results: {\n    type: Array as PropType<InstanceType<typeof ElVerticalTab>['$props'][]>,\n    default: undefined,\n  },\n  footer: {\n    type: Object as PropType<{\n      text: string;\n      button: InstanceType<typeof ElButton>['$props'];\n    }>,\n    default: undefined,\n  },\n  blankResults: {\n    type: Object as PropType<{\n      icon: InstanceType<typeof ElIcon>['$props'];\n      primaryRow: string;\n      secondaryRow?: string;\n    }>,\n    default: undefined,\n  },\n  shouldHoverFirstResultOnOpen: {\n    type: Boolean,\n    default: false,\n  },\n  color: {\n    type: String as PropType<ElInputSearchColors>,\n    default: 'primary',\n  },\n});\n\nconst emit = defineEmits(['update:modelValue', 'onResultClick', 'onResultHover']);\nconst slots = useSlots();\nconst isBodyScrollLocked = useScrollLock(document.body);\n\nconst searchInput = ref<HTMLInputElement | null>(null);\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\nconst computedStatus = computed(() => ({\n  default: !props.results,\n  filled: props.results && props.results.length > 0,\n  blank: props.results && props.results.length === 0,\n}));\nconst isClickOutside = ref(false);\nconst isSearchFocused = ref(false);\n\nconst itemRefs = ref<InstanceType<typeof ElVerticalTab>[]>([]);\nconst activeResult = ref<number | undefined>();\n\nconst { value, uuid, setValue } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst searchBarRef = ref<HTMLInputElement>();\nconst { hasFocus, activate, deactivate } = useFocusTrap(searchBarRef as any);\n\nconst isOpen = defineModel('isOpen', {\n  default: true,\n  required: true,\n  type: Boolean,\n});\n\nconst closeSearchBar = () => {\n  isOpen.value = false;\n  activeResult.value = undefined;\n  value.value = '';\n};\n\nconst scrollToFocusedIndex = (index: number) => {\n  itemRefs.value?.at(index)?.$el?.scrollIntoView({ block: 'nearest' });\n};\n\nconst onResultClick = (index: number) => {\n  emit('onResultClick', index);\n  setValue('');\n  activeResult.value = undefined;\n};\n\nconst onResultHover = (index: number) => {\n  activeResult.value = index;\n  scrollToFocusedIndex(index);\n  emit('onResultHover', index);\n};\n\nconst onClickOutside = () => closeSearchBar();\n\nonKeyStroke(\n  ['ArrowUp', 'ArrowDown', 'Enter', 'Escape'],\n  e => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    if (hasFocus && props.results?.length) {\n      switch (e.key) {\n        case 'ArrowUp':\n          const previousActiveIndex = Math.max((activeResult.value ?? 0) - 1, 0);\n          onResultHover(previousActiveIndex);\n          break;\n        case 'ArrowDown':\n          const nextActiveIndex = activeResult.value !== undefined ? Math.min(activeResult.value + 1, props.results.length - 1) : 0;\n          onResultHover(nextActiveIndex);\n          break;\n        case 'Enter':\n          if (activeResult.value !== undefined) {\n            onResultClick(activeResult.value);\n          }\n          break;\n      }\n    }\n\n    if (e.key === 'Escape') {\n      closeSearchBar();\n    }\n  },\n  { target: searchBarRef },\n);\n\nwatch([isOpen, searchInput], async () => {\n  isBodyScrollLocked.value = isOpen.value;\n\n  if (isOpen.value) {\n    searchInput.value?.focus();\n\n    if (props.shouldHoverFirstResultOnOpen && props.results?.length) {\n      onResultHover(0);\n    }\n\n    await nextTick();\n    activate();\n  } else {\n    deactivate();\n    value.value = '';\n  }\n});\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <CustomTransition name=\"fade\">\n      <div\n        v-if=\"isOpen\"\n        ref=\"searchBarRef\"\n        class=\"fixed inset-x-0 top-0 z-40 flex justify-center max-h-full overflow-y-auto px-4 pt-20 pb-6 max-sm:p-0\"\n      >\n        <div\n          v-on-click-outside=\"onClickOutside\"\n          class=\"m-10 z-50 md:max-w-3xl w-full flex flex-col p-6 border rounded-2xl border-neutral-surface bg-neutral-surface shadow-md\"\n          :class=\"{\n            'gap-6': props.results,\n          }\"\n        >\n          <!-- Search bar -->\n          <div class=\"flex flex-row items-center gap-3 bg-neutral-surface rounded-2xl\">\n            <ElIcon name=\"MagnifyingGlassIcon\" class=\"text-neutral-lighter w-6 h-6\" />\n            <input\n              ref=\"searchInput\"\n              v-model=\"value\"\n              :name=\"id || `${uuid}`\"\n              type=\"text\"\n              class=\"p-0 text-lg font-normal flex-1 outline-none border-none bg-neutral-surface focus:ring-none focus:border-none focus:outline-none border-transparent focus:border-transparent focus:ring-0\"\n              :placeholder=\"placeholder\"\n              @focusin=\"\n                () => {\n                  isSearchFocused = true; // Set search focused\n                  isClickOutside = false; // Set click outside to false\n                }\n              \"\n              @focusout=\"\n                () => {\n                  isSearchFocused = false;\n                }\n              \"\n            />\n          </div>\n\n          <span class=\"flex flex-col gap-y-6 overflow-y-hidden\">\n            <ElDivider v-if=\"results\" direction=\"horizontal\" />\n            <div\n              v-if=\"blankResults && computedStatus.blank\"\n              class=\"flex flex-col items-center justify-center flex-1 gap-4 py-8 text-neutral-lighter\"\n            >\n              <ElIcon v-bind=\"blankResults.icon\" class=\"w-7 h-7\" />\n              <p class=\"text-sm font-semibold text-neutral-darker\">{{ blankResults.primaryRow }}</p>\n              <p class=\"text-sm font-normal\">{{ blankResults.secondaryRow }}</p>\n            </div>\n            <div v-if=\"results && computedStatus.filled\" class=\"flex py-2 overflow-y-hidden\">\n              <!-- Results Left column  -->\n              <div\n                class=\"flex flex-col items-start flex-1 gap-6 overflow-y-auto max-h-50-screen\"\n                :class=\"{ 'pr-6': slots.info && results.length > 0 }\"\n              >\n                <span v-if=\"text\" class=\"text-sm font-medium text-neutral-darker\">{{ text }}</span>\n                <div class=\"flex flex-col gap-1 w-full\">\n                  <ElVerticalTab\n                    v-for=\"(result, index) in results\"\n                    :key=\"index\"\n                    ref=\"itemRefs\"\n                    :color=\"color\"\n                    v-bind=\"result\"\n                    :status=\"activeResult === index ? 'hover' : 'default'\"\n                    tabindex=\"-1\"\n                    @click=\"() => onResultClick(index)\"\n                    @mouseover=\"() => onResultHover(index)\"\n                  />\n                </div>\n              </div>\n              <!-- Blank Results -->\n\n              <div v-if=\"slots.info\">\n                <ElDivider direction=\"vertical\" />\n              </div>\n              <div v-if=\"slots.info\" class=\"flex-1 pl-6 overflow-y-auto\">\n                <slot name=\"info\"></slot>\n              </div>\n            </div>\n            <div v-if=\"results && footer\" class=\"flex items-center gap-1 self-stretch\">\n              <span class=\"text-sm font-normal text-neutral-darker\">{{ footer.text }}</span>\n              <ElButton v-bind=\"footer.button\" variant=\"tertiary\" />\n            </div>\n          </span>\n        </div>\n\n        <!-- Backdrop -->\n        <div class=\"fixed inset-0 transition-opacity\">\n          <div ref=\"backdrop\" class=\"absolute inset-0 bg-gray-500 opacity-75\"></div>\n        </div>\n      </div>\n    </CustomTransition>\n  </Teleport>\n</template>\n"],"names":["elInputSearchColors","elInputSearchStatus","props","__props","emit","__emit","slots","useSlots","isBodyScrollLocked","useScrollLock","searchInput","ref","computedModelValue","computed","computedValidation","computedStatus","isClickOutside","isSearchFocused","itemRefs","activeResult","value","uuid","setValue","useInput","newValue","searchBarRef","hasFocus","activate","deactivate","useFocusTrap","isOpen","_useModel","closeSearchBar","scrollToFocusedIndex","index","_c","_b","_a","onResultClick","onResultHover","onClickOutside","onKeyStroke","previousActiveIndex","nextActiveIndex","watch","nextTick"],"mappings":"umFACaA,GAAsB,CAAC,UAAW,WAAW,EAG7CC,GAAsB,CAAC,UAAW,SAAU,OAAO,+eAgBhE,MAAMC,EAAQC,EAuCRC,EAAOC,EACPC,EAAQC,IACRC,EAAqBC,GAAc,SAAS,IAAI,EAEhDC,EAAcC,EAA6B,IAAI,EAC/CC,EAAqBC,EAAS,IAAMX,EAAM,UAAU,EACpDY,EAAqBD,EAAS,IAAM,CAACX,EAAM,UAAU,CAAC,EACtDa,EAAiBF,EAAS,KAAO,CACrC,QAAS,CAACX,EAAM,QAChB,OAAQA,EAAM,SAAWA,EAAM,QAAQ,OAAS,EAChD,MAAOA,EAAM,SAAWA,EAAM,QAAQ,SAAW,CACjD,EAAA,EACIc,EAAiBL,EAAI,EAAK,EAC1BM,EAAkBN,EAAI,EAAK,EAE3BO,EAAWP,EAA0C,CAAA,CAAE,EACvDQ,EAAeR,IAEf,CAAE,MAAAS,EAAO,KAAAC,EAAM,SAAAC,GAAaC,GAASX,EAAoBE,EAAoBZ,EAAM,KAAkBsB,GAAA,CACpGpB,EAAA,oBAAqBoB,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAed,IACf,CAAE,SAAAe,EAAU,SAAAC,EAAU,WAAAC,CAAW,EAAIC,GAAaJ,CAAmB,EAErEK,EAASC,EAAY5B,EAAA,QAI1B,EAEK6B,EAAiB,IAAM,CAC3BF,EAAO,MAAQ,GACfX,EAAa,MAAQ,OACrBC,EAAM,MAAQ,EAAA,EAGVa,EAAwBC,GAAkB,YACrCC,GAAAC,GAAAC,EAAAnB,EAAA,QAAA,YAAAmB,EAAO,GAAGH,KAAV,YAAAE,EAAkB,MAAlB,MAAAD,EAAuB,eAAe,CAAE,MAAO,SAAA,EAAW,EAG/DG,EAAiBJ,GAAkB,CACvC9B,EAAK,gBAAiB8B,CAAK,EAC3BZ,EAAS,EAAE,EACXH,EAAa,MAAQ,MAAA,EAGjBoB,EAAiBL,GAAkB,CACvCf,EAAa,MAAQe,EACrBD,EAAqBC,CAAK,EAC1B9B,EAAK,gBAAiB8B,CAAK,CAAA,EAGvBM,EAAiB,IAAMR,IAE7B,OAAAS,GACE,CAAC,UAAW,YAAa,QAAS,QAAQ,EACrC,GAAA,OAIC,GAHJ,EAAE,eAAe,EACjB,EAAE,gBAAgB,EAEdf,KAAYW,EAAAnC,EAAM,UAAN,MAAAmC,EAAe,QAC7B,OAAQ,EAAE,IAAK,CACb,IAAK,UACH,MAAMK,EAAsB,KAAK,KAAKvB,EAAa,OAAS,GAAK,EAAG,CAAC,EACrEoB,EAAcG,CAAmB,EACjC,MACF,IAAK,YACH,MAAMC,EAAkBxB,EAAa,QAAU,OAAY,KAAK,IAAIA,EAAa,MAAQ,EAAGjB,EAAM,QAAQ,OAAS,CAAC,EAAI,EACxHqC,EAAcI,CAAe,EAC7B,MACF,IAAK,QACCxB,EAAa,QAAU,QACzBmB,EAAcnB,EAAa,KAAK,EAElC,KACJ,CAGE,EAAE,MAAQ,UACGa,GAEnB,EACA,CAAE,OAAQP,CAAa,CAAA,EAGzBmB,EAAM,CAACd,EAAQpB,CAAW,EAAG,SAAY,SACvCF,EAAmB,MAAQsB,EAAO,MAE9BA,EAAO,QACTO,EAAA3B,EAAY,QAAZ,MAAA2B,EAAmB,QAEfnC,EAAM,gCAAgCkC,EAAAlC,EAAM,UAAN,MAAAkC,EAAe,SACvDG,EAAc,CAAC,EAGjB,MAAMM,EAAS,EACNlB,MAEEC,IACXR,EAAM,MAAQ,GAChB,CACD"}

package/dist/forms/ElInputText.vue.cjs2.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("./input.cjs.js"),v=require("../ElIcon.vue.cjs2.js"),M=require("./ElInputContainer.vue.cjs2.js"),B=require("../ElIconButton.vue.cjs2.js"),$={class:"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"},q={key:0},V=["id","name","type","placeholder","disabled","autocomplete","data-cy"],N={key:0},x={key:1},P=["text","password"],T=e.defineComponent({__name:"ElInputText",props:{...d.withTextualElInputProps(),type:{type:String,default:"text"},leadingIcon:{type:Object,default:void 0,required:!1},trailingIcon:{type:Object,default:void 0,required:!1},focusOnMount:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"}},emits:["update:modelValue"],setup(l,{emit:y}){const a=l,o=e.ref(a.type),c=e.ref(null);e.onMounted(()=>{var t;a.focusOnMount&&((t=c.value)==null||t.focus())});const I=y,h=e.computed(()=>a.modelValue),k=e.computed(()=>[a.validation]),{value:s,errorMessage:b,uuid:u,fieldContext:E}=d.useInput(h,k,a.name,t=>{I("update:modelValue",t==null?void 0:t.trim())}),i=e.computed(()=>a.label?a.label.trim().replaceAll(" ",""):a.type),C=()=>{o.value=o.value==="text"?"password":"text"};return(t,r)=>(e.openBlock(),e.createBlock(M.default,e.mergeProps(t.$attrs,{name:t.id||`${e.unref(u)}-${i.value}`,label:t.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||e.unref(b),"hidden-error-message":t.hiddenErrorMessage,"set-required-mark":e.unref(d.showRequiredMark)([t.validation]),class:"relative"}),{leading:e.withCtx(({error:n})=>{var m,p,f;return[e.createElementVNode("div",$,[l.leadingIcon?(e.openBlock(),e.createElementBlock("div",q,[e.createVNode(v.default,{name:l.leadingIcon.name,solid:l.leadingIcon.solid,class:e.normalizeClass(["h-5 w-5",{"text-neutral-lighter":!n,"text-error":n}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"leading",e.normalizeProps(e.guardReactiveProps({error:n}))),e.withDirectives(e.createElementVNode("input",{id:t.id||`${e.unref(u)}-${i.value}`,ref_key:"inputRef",ref:c,"onUpdate:modelValue":r[0]||(r[0]=g=>e.isRef(s)?s.value=g:null),name:a.name||t.id||`${e.unref(u)}-${i.value}`,type:o.value,class:e.normalizeClass(["el-input",{error:n,"!pl-10":(m=l.leadingIcon)==null?void 0:m.name,"!pl-3":!((p=l.leadingIcon)!=null&&p.name),"!pr-10":(f=l.trailingIcon)==null?void 0:f.name}]),placeholder:t.placeholder,disabled:t.disabled,autocomplete:l.autocomplete,"data-cy":`${i.value}-input`,onBlur:r[1]||(r[1]=g=>e.unref(E).validate())},null,42,V),[[e.vModelDynamic,e.unref(s)]])]}),trailing:e.withCtx(({error:n})=>[l.trailingIcon?(e.openBlock(),e.createElementBlock("span",N,[e.createVNode(v.default,{name:l.trailingIcon.name,solid:l.trailingIcon.solid,class:e.normalizeClass(["h-5 w-5",{"text-neutral-lighter":!n,"text-error":n}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):e.createCommentVNode("",!0),l.type==="password"?(e.openBlock(),e.createElementBlock("span",x,[e.createVNode(B.default,{error:n,icon:{name:o.value==="text"?"EyeSlashIcon":"EyeIcon"},type:"button",tooltip:o.value==="text"?"Nascondi":"Mostra",onClick:C},null,8,["error","icon","tooltip"])])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"trailing",e.normalizeProps(e.guardReactiveProps({error:n})))]),_:3},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});exports.default=T;exports.elInputTextTypes=P;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("./input.cjs.js"),v=require("../ElIcon.vue.cjs2.js"),M=require("./ElInputContainer.vue.cjs2.js"),B=require("../ElIconButton.vue.cjs2.js"),$={class:"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"},q={key:0},V=["id","name","type","placeholder","disabled","autocomplete","data-cy"],N={key:0},x={key:1},P=["text","password"],T=e.defineComponent({__name:"ElInputText",props:{...d.withTextualElInputProps(),type:{type:String,default:"text"},leadingIcon:{type:Object,default:void 0,required:!1},trailingIcon:{type:Object,default:void 0,required:!1},focusOnMount:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"}},emits:["update:modelValue"],setup(l,{emit:y}){const a=l,o=e.ref(a.type),c=e.ref(null);e.onMounted(()=>{var t;a.focusOnMount&&((t=c.value)==null||t.focus())});const I=y,h=e.computed(()=>a.modelValue),k=e.computed(()=>[a.validation]),{value:s,errorMessage:b,uuid:u,fieldContext:E}=d.useInput(h,k,a.name,t=>{I("update:modelValue",t==null?void 0:t.trim())}),i=e.computed(()=>a.label?a.label.trim().replaceAll(" ",""):a.type),C=()=>{o.value=o.value==="text"?"password":"text"};return(t,r)=>(e.openBlock(),e.createBlock(M.default,e.mergeProps(t.$attrs,{name:t.id||`${e.unref(u)}-${i.value}`,label:t.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||e.unref(b),"hidden-error-message":t.hiddenErrorMessage,"set-required-mark":e.unref(d.showRequiredMark)([t.validation]),class:"relative"}),{leading:e.withCtx(({error:n})=>{var m,p,f;return[e.createElementVNode("div",$,[l.leadingIcon?(e.openBlock(),e.createElementBlock("div",q,[e.createVNode(v.default,{name:l.leadingIcon.name,solid:l.leadingIcon.solid,class:e.normalizeClass(["h-5 w-5",{"text-neutral-lighter":!n,"text-error":n}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"leading",e.normalizeProps(e.guardReactiveProps({error:n}))),e.withDirectives(e.createElementVNode("input",{id:t.id||`${e.unref(u)}-${i.value}`,ref_key:"inputRef",ref:c,"onUpdate:modelValue":r[0]||(r[0]=g=>e.isRef(s)?s.value=g:null),name:a.name||t.id||`${e.unref(u)}-${i.value}`,type:o.value,class:e.normalizeClass(["el-input truncate",{error:n,"!pl-10":(m=l.leadingIcon)==null?void 0:m.name,"!pl-3":!((p=l.leadingIcon)!=null&&p.name),"!pr-10":(f=l.trailingIcon)==null?void 0:f.name}]),placeholder:t.placeholder,disabled:t.disabled,autocomplete:l.autocomplete,"data-cy":`${i.value}-input`,onBlur:r[1]||(r[1]=g=>e.unref(E).validate())},null,42,V),[[e.vModelDynamic,e.unref(s)]])]}),trailing:e.withCtx(({error:n})=>[l.trailingIcon?(e.openBlock(),e.createElementBlock("span",N,[e.createVNode(v.default,{name:l.trailingIcon.name,solid:l.trailingIcon.solid,class:e.normalizeClass(["h-5 w-5",{"text-neutral-lighter":!n,"text-error":n}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):e.createCommentVNode("",!0),l.type==="password"?(e.openBlock(),e.createElementBlock("span",x,[e.createVNode(B.default,{error:n,icon:{name:o.value==="text"?"EyeSlashIcon":"EyeIcon"},type:"button",tooltip:o.value==="text"?"Nascondi":"Mostra",onClick:C},null,8,["error","icon","tooltip"])])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"trailing",e.normalizeProps(e.guardReactiveProps({error:n})))]),_:3},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});exports.default=T;exports.elInputTextTypes=P;
 //# sourceMappingURL=ElInputText.vue.cjs2.js.map

package/dist/forms/ElInputText.vue.cjs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputText.vue.cjs2.js","sources":["../../src/forms/ElInputText.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputTextTypes = ['text', 'password'] as const;\nexport type ElInputTextType = (typeof elInputTextTypes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport { useInput, showRequiredMark, TextualValueType, withTextualElInputProps } from '@/forms/input';\nimport { computed, onMounted, PropType, ref } from 'vue';\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport ElIconButton from '@/ElIconButton.vue';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  type: {\n    type: String as PropType<ElInputTextType>,\n    default: 'text',\n  },\n  leadingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  trailingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  focusOnMount: {\n    type: Boolean,\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n});\n\nconst inputType = ref<ElInputTextType>(props.type);\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nonMounted(() => {\n  if (props.focusOnMount) {\n    inputRef.value?.focus();\n  }\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: TextualValueType): void;\n}>();\n\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst defaultId = computed(() => (props.label ? props.label.trim().replaceAll(' ', '') : props.type));\n\nconst handleEyesPasswordClick = () => {\n  inputType.value = inputType.value === 'text' ? 'password' : 'text';\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"id || `${uuid}-${defaultId}`\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n    class=\"relative\"\n  >\n    <template #leading=\"{ error }\">\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <div v-if=\"leadingIcon\">\n          <ElIcon\n            :name=\"leadingIcon.name\"\n            :solid=\"leadingIcon.solid\"\n            class=\"h-5 w-5\"\n            aria-hidden=\"true\"\n            :class=\"{\n              'text-neutral-lighter': !error,\n              'text-error': error,\n            }\"\n          />\n        </div>\n      </div>\n\n      <slot name=\"leading\" v-bind=\"{ error }\" />\n\n      <input\n        :id=\"id || `${uuid}-${defaultId}`\"\n        ref=\"inputRef\"\n        v-model=\"value\"\n        :name=\"props.name || id || `${uuid}-${defaultId}`\"\n        :type=\"inputType\"\n        class=\"el-input\"\n        :class=\"{\n          error,\n          '!pl-10': leadingIcon?.name,\n          '!pl-3': !leadingIcon?.name,\n          '!pr-10': trailingIcon?.name,\n        }\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :autocomplete=\"autocomplete\"\n        :data-cy=\"`${defaultId}-input`\"\n        @blur=\"fieldContext.validate()\"\n      />\n    </template>\n\n    <template #trailing=\"{ error }\">\n      <span v-if=\"trailingIcon\">\n        <ElIcon\n          :name=\"trailingIcon.name\"\n          :solid=\"trailingIcon.solid\"\n          class=\"h-5 w-5\"\n          aria-hidden=\"true\"\n          :class=\"{\n            'text-neutral-lighter': !error,\n            'text-error': error,\n          }\"\n        />\n      </span>\n\n      <span v-if=\"type === 'password'\">\n        <ElIconButton\n          :error=\"error\"\n          :icon=\"{\n            name: inputType === 'text' ? 'EyeSlashIcon' : 'EyeIcon',\n          }\"\n          type=\"button\"\n          :tooltip=\"inputType === 'text' ? 'Nascondi' : 'Mostra'\"\n          @click=\"handleEyesPasswordClick\"\n        />\n      </span>\n\n      <slot name=\"trailing\" v-bind=\"{ error }\" />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["elInputTextTypes","props","__props","inputType","ref","inputRef","onMounted","_a","emit","__emit","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","defaultId","handleEyesPasswordClick"],"mappings":"+cACaA,EAAmB,CAAC,OAAQ,UAAU,8VAWnD,MAAMC,EAAQC,EA0BRC,EAAYC,EAAAA,IAAqBH,EAAM,IAAI,EAC3CI,EAAWD,MAA6B,IAAI,EAElDE,EAAAA,UAAU,IAAM,OACVL,EAAM,gBACRM,EAAAF,EAAS,QAAT,MAAAE,EAAgB,QAClB,CACD,EAED,MAAMC,EAAOC,EAIPC,EAAqBC,EAAA,SAAS,IAAMV,EAAM,UAAU,EACpDW,EAAqBD,EAAAA,SAAS,IAAM,CAACV,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAY,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,WAASP,EAAoBE,EAAoBX,EAAM,KAAkBiB,GAAA,CACtHV,EAAA,oBAAqBU,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAYR,EAAAA,SAAS,IAAOV,EAAM,MAAQA,EAAM,MAAM,KAAK,EAAE,WAAW,IAAK,EAAE,EAAIA,EAAM,IAAK,EAE9FmB,EAA0B,IAAM,CACpCjB,EAAU,MAAQA,EAAU,QAAU,OAAS,WAAa,MAAA"}
+{"version":3,"file":"ElInputText.vue.cjs2.js","sources":["../../src/forms/ElInputText.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputTextTypes = ['text', 'password'] as const;\nexport type ElInputTextType = (typeof elInputTextTypes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport { useInput, showRequiredMark, TextualValueType, withTextualElInputProps } from '@/forms/input';\nimport { computed, onMounted, PropType, ref } from 'vue';\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport ElIconButton from '@/ElIconButton.vue';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  type: {\n    type: String as PropType<ElInputTextType>,\n    default: 'text',\n  },\n  leadingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  trailingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  focusOnMount: {\n    type: Boolean,\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n});\n\nconst inputType = ref<ElInputTextType>(props.type);\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nonMounted(() => {\n  if (props.focusOnMount) {\n    inputRef.value?.focus();\n  }\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: TextualValueType): void;\n}>();\n\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst defaultId = computed(() => (props.label ? props.label.trim().replaceAll(' ', '') : props.type));\n\nconst handleEyesPasswordClick = () => {\n  inputType.value = inputType.value === 'text' ? 'password' : 'text';\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"id || `${uuid}-${defaultId}`\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n    class=\"relative\"\n  >\n    <template #leading=\"{ error }\">\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <div v-if=\"leadingIcon\">\n          <ElIcon\n            :name=\"leadingIcon.name\"\n            :solid=\"leadingIcon.solid\"\n            class=\"h-5 w-5\"\n            aria-hidden=\"true\"\n            :class=\"{\n              'text-neutral-lighter': !error,\n              'text-error': error,\n            }\"\n          />\n        </div>\n      </div>\n\n      <slot name=\"leading\" v-bind=\"{ error }\" />\n\n      <input\n        :id=\"id || `${uuid}-${defaultId}`\"\n        ref=\"inputRef\"\n        v-model=\"value\"\n        :name=\"props.name || id || `${uuid}-${defaultId}`\"\n        :type=\"inputType\"\n        class=\"el-input truncate\"\n        :class=\"{\n          error,\n          '!pl-10': leadingIcon?.name,\n          '!pl-3': !leadingIcon?.name,\n          '!pr-10': trailingIcon?.name,\n        }\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :autocomplete=\"autocomplete\"\n        :data-cy=\"`${defaultId}-input`\"\n        @blur=\"fieldContext.validate()\"\n      />\n    </template>\n\n    <template #trailing=\"{ error }\">\n      <span v-if=\"trailingIcon\">\n        <ElIcon\n          :name=\"trailingIcon.name\"\n          :solid=\"trailingIcon.solid\"\n          class=\"h-5 w-5\"\n          aria-hidden=\"true\"\n          :class=\"{\n            'text-neutral-lighter': !error,\n            'text-error': error,\n          }\"\n        />\n      </span>\n\n      <span v-if=\"type === 'password'\">\n        <ElIconButton\n          :error=\"error\"\n          :icon=\"{\n            name: inputType === 'text' ? 'EyeSlashIcon' : 'EyeIcon',\n          }\"\n          type=\"button\"\n          :tooltip=\"inputType === 'text' ? 'Nascondi' : 'Mostra'\"\n          @click=\"handleEyesPasswordClick\"\n        />\n      </span>\n\n      <slot name=\"trailing\" v-bind=\"{ error }\" />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["elInputTextTypes","props","__props","inputType","ref","inputRef","onMounted","_a","emit","__emit","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","defaultId","handleEyesPasswordClick"],"mappings":"+cACaA,EAAmB,CAAC,OAAQ,UAAU,8VAWnD,MAAMC,EAAQC,EA0BRC,EAAYC,EAAAA,IAAqBH,EAAM,IAAI,EAC3CI,EAAWD,MAA6B,IAAI,EAElDE,EAAAA,UAAU,IAAM,OACVL,EAAM,gBACRM,EAAAF,EAAS,QAAT,MAAAE,EAAgB,QAClB,CACD,EAED,MAAMC,EAAOC,EAIPC,EAAqBC,EAAA,SAAS,IAAMV,EAAM,UAAU,EACpDW,EAAqBD,EAAAA,SAAS,IAAM,CAACV,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAY,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,WAASP,EAAoBE,EAAoBX,EAAM,KAAkBiB,GAAA,CACtHV,EAAA,oBAAqBU,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAYR,EAAAA,SAAS,IAAOV,EAAM,MAAQA,EAAM,MAAM,KAAK,EAAE,WAAW,IAAK,EAAE,EAAIA,EAAM,IAAK,EAE9FmB,EAA0B,IAAM,CACpCjB,EAAU,MAAQA,EAAU,QAAU,OAAS,WAAa,MAAA"}

package/dist/forms/ElInputText.vue.esm2.js

@@ -1,2 +1,2 @@
-import{defineComponent as O,ref as b,onMounted as S,computed as m,openBlock as d,createBlock as j,mergeProps as z,unref as n,withCtx as k,createElementVNode as M,createElementBlock as c,createVNode as p,normalizeClass as f,createCommentVNode as g,renderSlot as E,normalizeProps as x,guardReactiveProps as C,withDirectives as D,isRef as A,vModelDynamic as U}from"vue";import{withTextualElInputProps as F,useInput as G,showRequiredMark as H}from"./input.esm.js";import w from"../ElIcon.vue.esm2.js";import J from"./ElInputContainer.vue.esm2.js";import K from"../ElIconButton.vue.esm2.js";const L={class:"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"},Q={key:0},W=["id","name","type","placeholder","disabled","autocomplete","data-cy"],X={key:0},Y={key:1},le=["text","password"],ne=O({__name:"ElInputText",props:{...F(),type:{type:String,default:"text"},leadingIcon:{type:Object,default:void 0,required:!1},trailingIcon:{type:Object,default:void 0,required:!1},focusOnMount:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"}},emits:["update:modelValue"],setup(t,{emit:q}){const a=t,o=b(a.type),v=b(null);S(()=>{var e;a.focusOnMount&&((e=v.value)==null||e.focus())});const B=q,P=m(()=>a.modelValue),R=m(()=>[a.validation]),{value:r,errorMessage:T,uuid:u,fieldContext:V}=G(P,R,a.name,e=>{B("update:modelValue",e==null?void 0:e.trim())}),i=m(()=>a.label?a.label.trim().replaceAll(" ",""):a.type),N=()=>{o.value=o.value==="text"?"password":"text"};return(e,s)=>(d(),j(J,z(e.$attrs,{name:e.id||`${n(u)}-${i.value}`,label:e.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||n(T),"hidden-error-message":e.hiddenErrorMessage,"set-required-mark":n(H)([e.validation]),class:"relative"}),{leading:k(({error:l})=>{var y,h,I;return[M("div",L,[t.leadingIcon?(d(),c("div",Q,[p(w,{name:t.leadingIcon.name,solid:t.leadingIcon.solid,class:f(["h-5 w-5",{"text-neutral-lighter":!l,"text-error":l}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):g("",!0)]),E(e.$slots,"leading",x(C({error:l}))),D(M("input",{id:e.id||`${n(u)}-${i.value}`,ref_key:"inputRef",ref:v,"onUpdate:modelValue":s[0]||(s[0]=$=>A(r)?r.value=$:null),name:a.name||e.id||`${n(u)}-${i.value}`,type:o.value,class:f(["el-input",{error:l,"!pl-10":(y=t.leadingIcon)==null?void 0:y.name,"!pl-3":!((h=t.leadingIcon)!=null&&h.name),"!pr-10":(I=t.trailingIcon)==null?void 0:I.name}]),placeholder:e.placeholder,disabled:e.disabled,autocomplete:t.autocomplete,"data-cy":`${i.value}-input`,onBlur:s[1]||(s[1]=$=>n(V).validate())},null,42,W),[[U,n(r)]])]}),trailing:k(({error:l})=>[t.trailingIcon?(d(),c("span",X,[p(w,{name:t.trailingIcon.name,solid:t.trailingIcon.solid,class:f(["h-5 w-5",{"text-neutral-lighter":!l,"text-error":l}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):g("",!0),t.type==="password"?(d(),c("span",Y,[p(K,{error:l,icon:{name:o.value==="text"?"EyeSlashIcon":"EyeIcon"},type:"button",tooltip:o.value==="text"?"Nascondi":"Mostra",onClick:N},null,8,["error","icon","tooltip"])])):g("",!0),E(e.$slots,"trailing",x(C({error:l})))]),_:3},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});export{ne as default,le as elInputTextTypes};
+import{defineComponent as O,ref as b,onMounted as S,computed as m,openBlock as d,createBlock as j,mergeProps as z,unref as n,withCtx as k,createElementVNode as M,createElementBlock as c,createVNode as p,normalizeClass as f,createCommentVNode as g,renderSlot as E,normalizeProps as x,guardReactiveProps as C,withDirectives as D,isRef as A,vModelDynamic as U}from"vue";import{withTextualElInputProps as F,useInput as G,showRequiredMark as H}from"./input.esm.js";import w from"../ElIcon.vue.esm2.js";import J from"./ElInputContainer.vue.esm2.js";import K from"../ElIconButton.vue.esm2.js";const L={class:"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"},Q={key:0},W=["id","name","type","placeholder","disabled","autocomplete","data-cy"],X={key:0},Y={key:1},le=["text","password"],ne=O({__name:"ElInputText",props:{...F(),type:{type:String,default:"text"},leadingIcon:{type:Object,default:void 0,required:!1},trailingIcon:{type:Object,default:void 0,required:!1},focusOnMount:{type:Boolean,default:!1},autocomplete:{type:String,default:"off"}},emits:["update:modelValue"],setup(t,{emit:q}){const a=t,o=b(a.type),v=b(null);S(()=>{var e;a.focusOnMount&&((e=v.value)==null||e.focus())});const B=q,P=m(()=>a.modelValue),R=m(()=>[a.validation]),{value:r,errorMessage:T,uuid:u,fieldContext:V}=G(P,R,a.name,e=>{B("update:modelValue",e==null?void 0:e.trim())}),i=m(()=>a.label?a.label.trim().replaceAll(" ",""):a.type),N=()=>{o.value=o.value==="text"?"password":"text"};return(e,s)=>(d(),j(J,z(e.$attrs,{name:e.id||`${n(u)}-${i.value}`,label:e.label,"error-message":a.errorMessage===!1?!1:a.errorMessage||n(T),"hidden-error-message":e.hiddenErrorMessage,"set-required-mark":n(H)([e.validation]),class:"relative"}),{leading:k(({error:l})=>{var y,h,I;return[M("div",L,[t.leadingIcon?(d(),c("div",Q,[p(w,{name:t.leadingIcon.name,solid:t.leadingIcon.solid,class:f(["h-5 w-5",{"text-neutral-lighter":!l,"text-error":l}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):g("",!0)]),E(e.$slots,"leading",x(C({error:l}))),D(M("input",{id:e.id||`${n(u)}-${i.value}`,ref_key:"inputRef",ref:v,"onUpdate:modelValue":s[0]||(s[0]=$=>A(r)?r.value=$:null),name:a.name||e.id||`${n(u)}-${i.value}`,type:o.value,class:f(["el-input truncate",{error:l,"!pl-10":(y=t.leadingIcon)==null?void 0:y.name,"!pl-3":!((h=t.leadingIcon)!=null&&h.name),"!pr-10":(I=t.trailingIcon)==null?void 0:I.name}]),placeholder:e.placeholder,disabled:e.disabled,autocomplete:t.autocomplete,"data-cy":`${i.value}-input`,onBlur:s[1]||(s[1]=$=>n(V).validate())},null,42,W),[[U,n(r)]])]}),trailing:k(({error:l})=>[t.trailingIcon?(d(),c("span",X,[p(w,{name:t.trailingIcon.name,solid:t.trailingIcon.solid,class:f(["h-5 w-5",{"text-neutral-lighter":!l,"text-error":l}]),"aria-hidden":"true"},null,8,["name","solid","class"])])):g("",!0),t.type==="password"?(d(),c("span",Y,[p(K,{error:l,icon:{name:o.value==="text"?"EyeSlashIcon":"EyeIcon"},type:"button",tooltip:o.value==="text"?"Nascondi":"Mostra",onClick:N},null,8,["error","icon","tooltip"])])):g("",!0),E(e.$slots,"trailing",x(C({error:l})))]),_:3},16,["name","label","error-message","hidden-error-message","set-required-mark"]))}});export{ne as default,le as elInputTextTypes};
 //# sourceMappingURL=ElInputText.vue.esm2.js.map

package/dist/forms/ElInputText.vue.esm2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElInputText.vue.esm2.js","sources":["../../src/forms/ElInputText.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputTextTypes = ['text', 'password'] as const;\nexport type ElInputTextType = (typeof elInputTextTypes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport { useInput, showRequiredMark, TextualValueType, withTextualElInputProps } from '@/forms/input';\nimport { computed, onMounted, PropType, ref } from 'vue';\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport ElIconButton from '@/ElIconButton.vue';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  type: {\n    type: String as PropType<ElInputTextType>,\n    default: 'text',\n  },\n  leadingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  trailingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  focusOnMount: {\n    type: Boolean,\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n});\n\nconst inputType = ref<ElInputTextType>(props.type);\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nonMounted(() => {\n  if (props.focusOnMount) {\n    inputRef.value?.focus();\n  }\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: TextualValueType): void;\n}>();\n\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst defaultId = computed(() => (props.label ? props.label.trim().replaceAll(' ', '') : props.type));\n\nconst handleEyesPasswordClick = () => {\n  inputType.value = inputType.value === 'text' ? 'password' : 'text';\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"id || `${uuid}-${defaultId}`\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n    class=\"relative\"\n  >\n    <template #leading=\"{ error }\">\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <div v-if=\"leadingIcon\">\n          <ElIcon\n            :name=\"leadingIcon.name\"\n            :solid=\"leadingIcon.solid\"\n            class=\"h-5 w-5\"\n            aria-hidden=\"true\"\n            :class=\"{\n              'text-neutral-lighter': !error,\n              'text-error': error,\n            }\"\n          />\n        </div>\n      </div>\n\n      <slot name=\"leading\" v-bind=\"{ error }\" />\n\n      <input\n        :id=\"id || `${uuid}-${defaultId}`\"\n        ref=\"inputRef\"\n        v-model=\"value\"\n        :name=\"props.name || id || `${uuid}-${defaultId}`\"\n        :type=\"inputType\"\n        class=\"el-input\"\n        :class=\"{\n          error,\n          '!pl-10': leadingIcon?.name,\n          '!pl-3': !leadingIcon?.name,\n          '!pr-10': trailingIcon?.name,\n        }\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :autocomplete=\"autocomplete\"\n        :data-cy=\"`${defaultId}-input`\"\n        @blur=\"fieldContext.validate()\"\n      />\n    </template>\n\n    <template #trailing=\"{ error }\">\n      <span v-if=\"trailingIcon\">\n        <ElIcon\n          :name=\"trailingIcon.name\"\n          :solid=\"trailingIcon.solid\"\n          class=\"h-5 w-5\"\n          aria-hidden=\"true\"\n          :class=\"{\n            'text-neutral-lighter': !error,\n            'text-error': error,\n          }\"\n        />\n      </span>\n\n      <span v-if=\"type === 'password'\">\n        <ElIconButton\n          :error=\"error\"\n          :icon=\"{\n            name: inputType === 'text' ? 'EyeSlashIcon' : 'EyeIcon',\n          }\"\n          type=\"button\"\n          :tooltip=\"inputType === 'text' ? 'Nascondi' : 'Mostra'\"\n          @click=\"handleEyesPasswordClick\"\n        />\n      </span>\n\n      <slot name=\"trailing\" v-bind=\"{ error }\" />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["elInputTextTypes","props","__props","inputType","ref","inputRef","onMounted","_a","emit","__emit","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","defaultId","handleEyesPasswordClick"],"mappings":"wwBACaA,GAAmB,CAAC,OAAQ,UAAU,uTAWnD,MAAMC,EAAQC,EA0BRC,EAAYC,EAAqBH,EAAM,IAAI,EAC3CI,EAAWD,EAA6B,IAAI,EAElDE,EAAU,IAAM,OACVL,EAAM,gBACRM,EAAAF,EAAS,QAAT,MAAAE,EAAgB,QAClB,CACD,EAED,MAAMC,EAAOC,EAIPC,EAAqBC,EAAS,IAAMV,EAAM,UAAU,EACpDW,EAAqBD,EAAS,IAAM,CAACV,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAY,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,EAASP,EAAoBE,EAAoBX,EAAM,KAAkBiB,GAAA,CACtHV,EAAA,oBAAqBU,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAYR,EAAS,IAAOV,EAAM,MAAQA,EAAM,MAAM,KAAK,EAAE,WAAW,IAAK,EAAE,EAAIA,EAAM,IAAK,EAE9FmB,EAA0B,IAAM,CACpCjB,EAAU,MAAQA,EAAU,QAAU,OAAS,WAAa,MAAA"}
+{"version":3,"file":"ElInputText.vue.esm2.js","sources":["../../src/forms/ElInputText.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elInputTextTypes = ['text', 'password'] as const;\nexport type ElInputTextType = (typeof elInputTextTypes)[number];\n</script>\n\n<script lang=\"ts\" setup>\nimport { useInput, showRequiredMark, TextualValueType, withTextualElInputProps } from '@/forms/input';\nimport { computed, onMounted, PropType, ref } from 'vue';\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport ElInputContainer from '@/forms/ElInputContainer.vue';\nimport ElIconButton from '@/ElIconButton.vue';\n\nconst props = defineProps({\n  ...withTextualElInputProps(),\n  type: {\n    type: String as PropType<ElInputTextType>,\n    default: 'text',\n  },\n  leadingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  trailingIcon: {\n    type: Object as PropType<ElIconProps>,\n    default: undefined,\n    required: false,\n  },\n  focusOnMount: {\n    type: Boolean,\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n});\n\nconst inputType = ref<ElInputTextType>(props.type);\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nonMounted(() => {\n  if (props.focusOnMount) {\n    inputRef.value?.focus();\n  }\n});\n\nconst emit = defineEmits<{\n  (event: 'update:modelValue', value: TextualValueType): void;\n}>();\n\nconst computedModelValue = computed(() => props.modelValue);\nconst computedValidation = computed(() => [props.validation]);\n\nconst { value, errorMessage, uuid, fieldContext } = useInput(computedModelValue, computedValidation, props.name, newValue => {\n  emit('update:modelValue', newValue?.trim());\n});\n\nconst defaultId = computed(() => (props.label ? props.label.trim().replaceAll(' ', '') : props.type));\n\nconst handleEyesPasswordClick = () => {\n  inputType.value = inputType.value === 'text' ? 'password' : 'text';\n};\n</script>\n\n<template>\n  <ElInputContainer\n    v-bind=\"$attrs\"\n    :name=\"id || `${uuid}-${defaultId}`\"\n    :label=\"label\"\n    :error-message=\"props.errorMessage === false ? false : props.errorMessage || errorMessage\"\n    :hidden-error-message=\"hiddenErrorMessage\"\n    :set-required-mark=\"showRequiredMark([validation])\"\n    class=\"relative\"\n  >\n    <template #leading=\"{ error }\">\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <div v-if=\"leadingIcon\">\n          <ElIcon\n            :name=\"leadingIcon.name\"\n            :solid=\"leadingIcon.solid\"\n            class=\"h-5 w-5\"\n            aria-hidden=\"true\"\n            :class=\"{\n              'text-neutral-lighter': !error,\n              'text-error': error,\n            }\"\n          />\n        </div>\n      </div>\n\n      <slot name=\"leading\" v-bind=\"{ error }\" />\n\n      <input\n        :id=\"id || `${uuid}-${defaultId}`\"\n        ref=\"inputRef\"\n        v-model=\"value\"\n        :name=\"props.name || id || `${uuid}-${defaultId}`\"\n        :type=\"inputType\"\n        class=\"el-input truncate\"\n        :class=\"{\n          error,\n          '!pl-10': leadingIcon?.name,\n          '!pl-3': !leadingIcon?.name,\n          '!pr-10': trailingIcon?.name,\n        }\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :autocomplete=\"autocomplete\"\n        :data-cy=\"`${defaultId}-input`\"\n        @blur=\"fieldContext.validate()\"\n      />\n    </template>\n\n    <template #trailing=\"{ error }\">\n      <span v-if=\"trailingIcon\">\n        <ElIcon\n          :name=\"trailingIcon.name\"\n          :solid=\"trailingIcon.solid\"\n          class=\"h-5 w-5\"\n          aria-hidden=\"true\"\n          :class=\"{\n            'text-neutral-lighter': !error,\n            'text-error': error,\n          }\"\n        />\n      </span>\n\n      <span v-if=\"type === 'password'\">\n        <ElIconButton\n          :error=\"error\"\n          :icon=\"{\n            name: inputType === 'text' ? 'EyeSlashIcon' : 'EyeIcon',\n          }\"\n          type=\"button\"\n          :tooltip=\"inputType === 'text' ? 'Nascondi' : 'Mostra'\"\n          @click=\"handleEyesPasswordClick\"\n        />\n      </span>\n\n      <slot name=\"trailing\" v-bind=\"{ error }\" />\n    </template>\n  </ElInputContainer>\n</template>\n"],"names":["elInputTextTypes","props","__props","inputType","ref","inputRef","onMounted","_a","emit","__emit","computedModelValue","computed","computedValidation","value","errorMessage","uuid","fieldContext","useInput","newValue","defaultId","handleEyesPasswordClick"],"mappings":"wwBACaA,GAAmB,CAAC,OAAQ,UAAU,uTAWnD,MAAMC,EAAQC,EA0BRC,EAAYC,EAAqBH,EAAM,IAAI,EAC3CI,EAAWD,EAA6B,IAAI,EAElDE,EAAU,IAAM,OACVL,EAAM,gBACRM,EAAAF,EAAS,QAAT,MAAAE,EAAgB,QAClB,CACD,EAED,MAAMC,EAAOC,EAIPC,EAAqBC,EAAS,IAAMV,EAAM,UAAU,EACpDW,EAAqBD,EAAS,IAAM,CAACV,EAAM,UAAU,CAAC,EAEtD,CAAE,MAAAY,EAAO,aAAAC,EAAc,KAAAC,EAAM,aAAAC,CAAiB,EAAAC,EAASP,EAAoBE,EAAoBX,EAAM,KAAkBiB,GAAA,CACtHV,EAAA,oBAAqBU,GAAA,YAAAA,EAAU,MAAM,CAAA,CAC3C,EAEKC,EAAYR,EAAS,IAAOV,EAAM,MAAQA,EAAM,MAAM,KAAK,EAAE,WAAW,IAAK,EAAE,EAAIA,EAAM,IAAK,EAE9FmB,EAA0B,IAAM,CACpCjB,EAAU,MAAQA,EAAU,QAAU,OAAS,WAAa,MAAA"}

package/dist/forms/input.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("vee-validate"),a=require("vue");let n=0;const p=()=>({getID:()=>(n++,`elty-input-${n.toString()}`)}),i=()=>({label:{type:String,required:!1,default:""},disabled:{type:Boolean,required:!1,default:!1},validation:{type:String,default:"",required:!1},hideRequiredMark:{type:Boolean,required:!1,default:!1},hiddenErrorMessage:{type:Boolean,required:!1,default:!1},helpTooltip:{type:Object,required:!1,default:void 0}}),c=()=>({...i(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),d=()=>({name:{type:String,required:!1,default:""},id:{type:String,required:!1,default:""},label:{type:String,required:!1,default:""},validation:{type:String,default:"",required:!1},disabled:{type:Boolean,required:!1,default:!1},errorMessage:{type:[String,Boolean],required:!1,default:void 0},hiddenErrorMessage:{type:Boolean,required:!1,default:!1}}),m=()=>({...d(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),y=()=>({...i(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}}),g=()=>({...d(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}});function h(t,r,l="",o){const s=p().getID(),f=a.computed(()=>r.value&&r.value.join("|")),e=q.useField(l||s,f,{initialValue:t,validateOnValueUpdate:!1});return a.watch(t,u=>{e.setValue(u)}),a.watch(e.value,u=>{o&&o(u),e.errorMessage.value&&e.validate()}),{fieldContext:e,errorMessage:e.errorMessage,value:e.value,uuid:s,meta:e.meta,setValue:e.setValue}}function I(t,r){if(r)return!1;for(const l of t)if(l.match(/(?:^required)|required\||(?:\|required$)/))return!0;return!1}exports.UniqueID=p;exports.showRequiredMark=I;exports.useInput=h;exports.withCommonElInputProps=d;exports.withCommonInputProps=i;exports.withNumberElInputProps=g;exports.withNumberInputProps=y;exports.withTextualElInputProps=m;exports.withTextualInputProps=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("vee-validate"),a=require("vue");let n=0;const f=()=>({getID:()=>(n++,`elty-input-${n.toString()}`)}),i=()=>({label:{type:String,required:!1,default:""},disabled:{type:Boolean,required:!1,default:!1},validation:{type:String,default:"",required:!1},hideRequiredMark:{type:Boolean,required:!1,default:!1},hiddenErrorMessage:{type:Boolean,required:!1,default:!1},helpTooltip:{type:Object,required:!1,default:void 0}}),m=()=>({...i(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),d=()=>({name:{type:String,required:!1,default:""},id:{type:String,required:!1,default:""},label:{type:String,required:!1,default:""},validation:{type:String,default:"",required:!1},disabled:{type:Boolean,required:!1,default:!1},errorMessage:{type:[String,Boolean],required:!1,default:void 0},hiddenErrorMessage:{type:Boolean,required:!1,default:!1}}),y=()=>({...d(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),c=()=>({...i(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}}),g=()=>({...d(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1},min:{type:Number,default:void 0,required:!1},max:{type:Number,default:void 0,required:!1}});function h(t,r,u="",o){const s=f().getID(),p=a.computed(()=>r.value&&r.value.join("|")),e=q.useField(u||s,p,{initialValue:t,validateOnValueUpdate:!1});return a.watch(t,l=>{e.setValue(l)}),a.watch(e.value,l=>{o&&o(l),e.errorMessage.value&&e.validate()}),{fieldContext:e,errorMessage:e.errorMessage,value:e.value,uuid:s,meta:e.meta,setValue:e.setValue}}function I(t,r){if(r)return!1;for(const u of t)if(u.match(/(?:^required)|required\||(?:\|required$)/))return!0;return!1}exports.UniqueID=f;exports.showRequiredMark=I;exports.useInput=h;exports.withCommonElInputProps=d;exports.withCommonInputProps=i;exports.withNumberElInputProps=g;exports.withNumberInputProps=c;exports.withTextualElInputProps=y;exports.withTextualInputProps=m;
 //# sourceMappingURL=input.cjs.js.map

package/dist/forms/input.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.cjs.js","sources":["../../src/forms/input.ts"],"sourcesContent":["import { InputValidation } from '@/forms/validation-rules';\nimport { useField } from 'vee-validate';\n\nlet UUID = 0;\n\nexport const UniqueID = () => {\n  const getID = () => {\n    UUID++;\n    return `elty-input-${UUID.toString()}`;\n  };\n  return {\n    getID,\n  };\n};\n\nimport { computed, ComputedRef, PropType, Ref, watch } from 'vue';\n\nexport type TextualValueType = string | null | undefined;\nexport type NumberValueType = number | null | undefined;\n\nexport const withCommonInputProps = () => ({\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  hideRequiredMark: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  helpTooltip: {\n    type: Object as PropType<{\n      title: string;\n      text: string;\n    }>,\n    required: false,\n    default: undefined,\n  },\n});\n\nexport const withTextualInputProps = () => ({\n  ...withCommonInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withCommonElInputProps = () => ({\n  name: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  id: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  errorMessage: {\n    type: [String, Boolean],\n    required: false,\n    default: undefined,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\n\nexport const withTextualElInputProps = () => ({\n  ...withCommonElInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withNumberInputProps = () => ({\n  ...withCommonInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport const withNumberElInputProps = () => ({\n  ...withCommonElInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport function useInput<T = string>(\n  initialValue: Ref<T>,\n  validations: Ref<string[]> | ComputedRef<string[]>,\n  inputName: string = '',\n  onChange?: (value: T) => void,\n) {\n  const uuid = UniqueID().getID();\n  const validationsString = computed(() => validations.value && validations.value.join('|'));\n\n  // if a name is not provided it generates a random one\n  const field = useField<T>(inputName || uuid, validationsString, {\n    // empty string counts as a forced blank value\n    initialValue,\n    // validation is performed manually on value change, only if there are errors\n    validateOnValueUpdate: false,\n  });\n\n  watch(initialValue, newValue => {\n    field.setValue(newValue);\n  });\n\n  watch(field.value, val => {\n    if (onChange) {\n      onChange(val);\n    }\n    if (field.errorMessage.value) {\n      field.validate();\n    }\n  });\n\n  return {\n    fieldContext: field,\n    errorMessage: field.errorMessage,\n    value: field.value,\n    uuid,\n    meta: field.meta,\n    setValue: field.setValue,\n  };\n}\n\nexport function showRequiredMark(validations: string[], forceHideMark?: boolean | undefined): boolean {\n  if (forceHideMark) return false;\n\n  for (const v of validations) {\n    if (v.match(/(?:^required)|required\\||(?:\\|required$)/)) {\n      return true;\n    }\n  }\n  return false;\n}\n"],"names":["UUID","UniqueID","withCommonInputProps","withTextualInputProps","withCommonElInputProps","withTextualElInputProps","withNumberInputProps","withNumberElInputProps","useInput","initialValue","validations","inputName","onChange","uuid","validationsString","computed","field","useField","watch","newValue","val","showRequiredMark","forceHideMark","v"],"mappings":"iIAGA,IAAIA,EAAO,EAEJ,MAAMC,EAAW,KAKf,CACL,MALY,KACZD,IACO,cAAcA,EAAK,SAAA,CAAU,GAGpC,GASSE,EAAuB,KAAO,CACzC,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,iBAAkB,CAChB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,YAAa,CACX,KAAM,OAIN,SAAU,GACV,QAAS,MACX,CACF,GAEaC,EAAwB,KAAO,CAC1C,GAAGD,EAAqB,EAExB,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAyB,KAAO,CAC3C,KAAM,CACJ,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,GAAI,CACF,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAO,EACtB,SAAU,GACV,QAAS,MACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,CACF,GAEaC,EAA0B,KAAO,CAC5C,GAAGD,EAAuB,EAE1B,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAuB,KAAO,CACzC,GAAGJ,EAAqB,EACxB,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEaK,EAAyB,KAAO,CAC3C,GAAGH,EAAuB,EAC1B,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEO,SAASI,EACdC,EACAC,EACAC,EAAoB,GACpBC,EACA,CACM,MAAAC,EAAOZ,IAAW,QAClBa,EAAoBC,WAAS,IAAML,EAAY,OAASA,EAAY,MAAM,KAAK,GAAG,CAAC,EAGnFM,EAAQC,EAAA,SAAYN,GAAaE,EAAMC,EAAmB,CAE9D,aAAAL,EAEA,sBAAuB,EAAA,CACxB,EAEDS,OAAAA,QAAMT,EAA0BU,GAAA,CAC9BH,EAAM,SAASG,CAAQ,CAAA,CACxB,EAEKD,EAAAA,MAAAF,EAAM,MAAcI,GAAA,CACpBR,GACFA,EAASQ,CAAG,EAEVJ,EAAM,aAAa,OACrBA,EAAM,SAAS,CACjB,CACD,EAEM,CACL,aAAcA,EACd,aAAcA,EAAM,aACpB,MAAOA,EAAM,MACb,KAAAH,EACA,KAAMG,EAAM,KACZ,SAAUA,EAAM,QAAA,CAEpB,CAEgB,SAAAK,EAAiBX,EAAuBY,EAA8C,CAChG,GAAAA,EAAsB,MAAA,GAE1B,UAAWC,KAAKb,EACV,GAAAa,EAAE,MAAM,0CAA0C,EAC7C,MAAA,GAGJ,MAAA,EACT"}
+{"version":3,"file":"input.cjs.js","sources":["../../src/forms/input.ts"],"sourcesContent":["import { InputValidation } from '@/forms/validation-rules';\nimport { useField } from 'vee-validate';\n\nlet UUID = 0;\n\nexport const UniqueID = () => {\n  const getID = () => {\n    UUID++;\n    return `elty-input-${UUID.toString()}`;\n  };\n  return {\n    getID,\n  };\n};\n\nimport { computed, ComputedRef, PropType, Ref, watch } from 'vue';\n\nexport type TextualValueType = string | null | undefined;\nexport type NumberValueType = number | null | undefined;\n\nexport const withCommonInputProps = () => ({\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  hideRequiredMark: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  helpTooltip: {\n    type: Object as PropType<{\n      title: string;\n      text: string;\n    }>,\n    required: false,\n    default: undefined,\n  },\n});\n\nexport const withTextualInputProps = () => ({\n  ...withCommonInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withCommonElInputProps = () => ({\n  name: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  id: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  errorMessage: {\n    type: [String, Boolean],\n    required: false,\n    default: undefined,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\n\nexport const withTextualElInputProps = () => ({\n  ...withCommonElInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withNumberInputProps = () => ({\n  ...withCommonInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport const withNumberElInputProps = () => ({\n  ...withCommonElInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n  min: {\n    type: Number,\n    default: undefined,\n    required: false,\n  },\n  max: {\n    type: Number,\n    default: undefined,\n    required: false,\n  },\n});\n\nexport function useInput<T = string>(\n  initialValue: Ref<T>,\n  validations: Ref<string[]> | ComputedRef<string[]>,\n  inputName: string = '',\n  onChange?: (value: T) => void,\n) {\n  const uuid = UniqueID().getID();\n  const validationsString = computed(() => validations.value && validations.value.join('|'));\n\n  // if a name is not provided it generates a random one\n  const field = useField<T>(inputName || uuid, validationsString, {\n    // empty string counts as a forced blank value\n    initialValue,\n    // validation is performed manually on value change, only if there are errors\n    validateOnValueUpdate: false,\n  });\n\n  watch(initialValue, newValue => {\n    field.setValue(newValue);\n  });\n\n  watch(field.value, val => {\n    if (onChange) {\n      onChange(val);\n    }\n    if (field.errorMessage.value) {\n      field.validate();\n    }\n  });\n\n  return {\n    fieldContext: field,\n    errorMessage: field.errorMessage,\n    value: field.value,\n    uuid,\n    meta: field.meta,\n    setValue: field.setValue,\n  };\n}\n\nexport function showRequiredMark(validations: string[], forceHideMark?: boolean | undefined): boolean {\n  if (forceHideMark) return false;\n\n  for (const v of validations) {\n    if (v.match(/(?:^required)|required\\||(?:\\|required$)/)) {\n      return true;\n    }\n  }\n  return false;\n}\n"],"names":["UUID","UniqueID","withCommonInputProps","withTextualInputProps","withCommonElInputProps","withTextualElInputProps","withNumberInputProps","withNumberElInputProps","useInput","initialValue","validations","inputName","onChange","uuid","validationsString","computed","field","useField","watch","newValue","val","showRequiredMark","forceHideMark","v"],"mappings":"iIAGA,IAAIA,EAAO,EAEJ,MAAMC,EAAW,KAKf,CACL,MALY,KACZD,IACO,cAAcA,EAAK,SAAA,CAAU,GAGpC,GASSE,EAAuB,KAAO,CACzC,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,iBAAkB,CAChB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,YAAa,CACX,KAAM,OAIN,SAAU,GACV,QAAS,MACX,CACF,GAEaC,EAAwB,KAAO,CAC1C,GAAGD,EAAqB,EAExB,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAyB,KAAO,CAC3C,KAAM,CACJ,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,GAAI,CACF,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAO,EACtB,SAAU,GACV,QAAS,MACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,CACF,GAEaC,EAA0B,KAAO,CAC5C,GAAGD,EAAuB,EAE1B,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAuB,KAAO,CACzC,GAAGJ,EAAqB,EACxB,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEaK,EAAyB,KAAO,CAC3C,GAAGH,EAAuB,EAC1B,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,EACA,IAAK,CACH,KAAM,OACN,QAAS,OACT,SAAU,EACZ,EACA,IAAK,CACH,KAAM,OACN,QAAS,OACT,SAAU,EACZ,CACF,GAEO,SAASI,EACdC,EACAC,EACAC,EAAoB,GACpBC,EACA,CACM,MAAAC,EAAOZ,IAAW,QAClBa,EAAoBC,WAAS,IAAML,EAAY,OAASA,EAAY,MAAM,KAAK,GAAG,CAAC,EAGnFM,EAAQC,EAAA,SAAYN,GAAaE,EAAMC,EAAmB,CAE9D,aAAAL,EAEA,sBAAuB,EAAA,CACxB,EAEDS,OAAAA,QAAMT,EAA0BU,GAAA,CAC9BH,EAAM,SAASG,CAAQ,CAAA,CACxB,EAEKD,EAAAA,MAAAF,EAAM,MAAcI,GAAA,CACpBR,GACFA,EAASQ,CAAG,EAEVJ,EAAM,aAAa,OACrBA,EAAM,SAAS,CACjB,CACD,EAEM,CACL,aAAcA,EACd,aAAcA,EAAM,aACpB,MAAOA,EAAM,MACb,KAAAH,EACA,KAAMG,EAAM,KACZ,SAAUA,EAAM,QAAA,CAEpB,CAEgB,SAAAK,EAAiBX,EAAuBY,EAA8C,CAChG,GAAAA,EAAsB,MAAA,GAE1B,UAAWC,KAAKb,EACV,GAAAa,EAAE,MAAM,0CAA0C,EAC7C,MAAA,GAGJ,MAAA,EACT"}

package/dist/forms/input.d.ts

@@ -230,6 +230,16 @@ export declare const withNumberElInputProps: () => {
         default: number;
         required: boolean;
     };
+    min: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
+    max: {
+        type: NumberConstructor;
+        default: undefined;
+        required: boolean;
+    };
     name: {
         type: StringConstructor;
         required: boolean;

package/dist/forms/input.esm.js

@@ -1,2 +1,2 @@
-import{useField as p}from"vee-validate";import{computed as q,watch as i}from"vue";let o=0;const y=()=>({getID:()=>(o++,`elty-input-${o.toString()}`)}),s=()=>({label:{type:String,required:!1,default:""},disabled:{type:Boolean,required:!1,default:!1},validation:{type:String,default:"",required:!1},hideRequiredMark:{type:Boolean,required:!1,default:!1},hiddenErrorMessage:{type:Boolean,required:!1,default:!1},helpTooltip:{type:Object,required:!1,default:void 0}}),c=()=>({...s(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),f=()=>({name:{type:String,required:!1,default:""},id:{type:String,required:!1,default:""},label:{type:String,required:!1,default:""},validation:{type:String,default:"",required:!1},disabled:{type:Boolean,required:!1,default:!1},errorMessage:{type:[String,Boolean],required:!1,default:void 0},hiddenErrorMessage:{type:Boolean,required:!1,default:!1}}),h=()=>({...f(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),S=()=>({...s(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}}),v=()=>({...f(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}});function I(t,r,l="",u){const d=y().getID(),n=q(()=>r.value&&r.value.join("|")),e=p(l||d,n,{initialValue:t,validateOnValueUpdate:!1});return i(t,a=>{e.setValue(a)}),i(e.value,a=>{u&&u(a),e.errorMessage.value&&e.validate()}),{fieldContext:e,errorMessage:e.errorMessage,value:e.value,uuid:d,meta:e.meta,setValue:e.setValue}}function b(t,r){if(r)return!1;for(const l of t)if(l.match(/(?:^required)|required\||(?:\|required$)/))return!0;return!1}export{y as UniqueID,b as showRequiredMark,I as useInput,f as withCommonElInputProps,s as withCommonInputProps,v as withNumberElInputProps,S as withNumberInputProps,h as withTextualElInputProps,c as withTextualInputProps};
+import{useField as p}from"vee-validate";import{computed as m,watch as i}from"vue";let o=0;const q=()=>({getID:()=>(o++,`elty-input-${o.toString()}`)}),s=()=>({label:{type:String,required:!1,default:""},disabled:{type:Boolean,required:!1,default:!1},validation:{type:String,default:"",required:!1},hideRequiredMark:{type:Boolean,required:!1,default:!1},hiddenErrorMessage:{type:Boolean,required:!1,default:!1},helpTooltip:{type:Object,required:!1,default:void 0}}),c=()=>({...s(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),f=()=>({name:{type:String,required:!1,default:""},id:{type:String,required:!1,default:""},label:{type:String,required:!1,default:""},validation:{type:String,default:"",required:!1},disabled:{type:Boolean,required:!1,default:!1},errorMessage:{type:[String,Boolean],required:!1,default:void 0},hiddenErrorMessage:{type:Boolean,required:!1,default:!1}}),h=()=>({...f(),modelValue:{type:String,default:""},placeholder:{type:String,default:"",required:!1}}),v=()=>({...s(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1}}),S=()=>({...f(),modelValue:{type:Number},placeholder:{type:String,default:"",required:!1},step:{type:Number,default:1,required:!1},min:{type:Number,default:void 0,required:!1},max:{type:Number,default:void 0,required:!1}});function b(t,r,l="",u){const d=q().getID(),n=m(()=>r.value&&r.value.join("|")),e=p(l||d,n,{initialValue:t,validateOnValueUpdate:!1});return i(t,a=>{e.setValue(a)}),i(e.value,a=>{u&&u(a),e.errorMessage.value&&e.validate()}),{fieldContext:e,errorMessage:e.errorMessage,value:e.value,uuid:d,meta:e.meta,setValue:e.setValue}}function I(t,r){if(r)return!1;for(const l of t)if(l.match(/(?:^required)|required\||(?:\|required$)/))return!0;return!1}export{q as UniqueID,I as showRequiredMark,b as useInput,f as withCommonElInputProps,s as withCommonInputProps,S as withNumberElInputProps,v as withNumberInputProps,h as withTextualElInputProps,c as withTextualInputProps};
 //# sourceMappingURL=input.esm.js.map

package/dist/forms/input.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.esm.js","sources":["../../src/forms/input.ts"],"sourcesContent":["import { InputValidation } from '@/forms/validation-rules';\nimport { useField } from 'vee-validate';\n\nlet UUID = 0;\n\nexport const UniqueID = () => {\n  const getID = () => {\n    UUID++;\n    return `elty-input-${UUID.toString()}`;\n  };\n  return {\n    getID,\n  };\n};\n\nimport { computed, ComputedRef, PropType, Ref, watch } from 'vue';\n\nexport type TextualValueType = string | null | undefined;\nexport type NumberValueType = number | null | undefined;\n\nexport const withCommonInputProps = () => ({\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  hideRequiredMark: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  helpTooltip: {\n    type: Object as PropType<{\n      title: string;\n      text: string;\n    }>,\n    required: false,\n    default: undefined,\n  },\n});\n\nexport const withTextualInputProps = () => ({\n  ...withCommonInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withCommonElInputProps = () => ({\n  name: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  id: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  errorMessage: {\n    type: [String, Boolean],\n    required: false,\n    default: undefined,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\n\nexport const withTextualElInputProps = () => ({\n  ...withCommonElInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withNumberInputProps = () => ({\n  ...withCommonInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport const withNumberElInputProps = () => ({\n  ...withCommonElInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport function useInput<T = string>(\n  initialValue: Ref<T>,\n  validations: Ref<string[]> | ComputedRef<string[]>,\n  inputName: string = '',\n  onChange?: (value: T) => void,\n) {\n  const uuid = UniqueID().getID();\n  const validationsString = computed(() => validations.value && validations.value.join('|'));\n\n  // if a name is not provided it generates a random one\n  const field = useField<T>(inputName || uuid, validationsString, {\n    // empty string counts as a forced blank value\n    initialValue,\n    // validation is performed manually on value change, only if there are errors\n    validateOnValueUpdate: false,\n  });\n\n  watch(initialValue, newValue => {\n    field.setValue(newValue);\n  });\n\n  watch(field.value, val => {\n    if (onChange) {\n      onChange(val);\n    }\n    if (field.errorMessage.value) {\n      field.validate();\n    }\n  });\n\n  return {\n    fieldContext: field,\n    errorMessage: field.errorMessage,\n    value: field.value,\n    uuid,\n    meta: field.meta,\n    setValue: field.setValue,\n  };\n}\n\nexport function showRequiredMark(validations: string[], forceHideMark?: boolean | undefined): boolean {\n  if (forceHideMark) return false;\n\n  for (const v of validations) {\n    if (v.match(/(?:^required)|required\\||(?:\\|required$)/)) {\n      return true;\n    }\n  }\n  return false;\n}\n"],"names":["UUID","UniqueID","withCommonInputProps","withTextualInputProps","withCommonElInputProps","withTextualElInputProps","withNumberInputProps","withNumberElInputProps","useInput","initialValue","validations","inputName","onChange","uuid","validationsString","computed","field","useField","watch","newValue","val","showRequiredMark","forceHideMark","v"],"mappings":"kFAGA,IAAIA,EAAO,EAEJ,MAAMC,EAAW,KAKf,CACL,MALY,KACZD,IACO,cAAcA,EAAK,SAAA,CAAU,GAGpC,GASSE,EAAuB,KAAO,CACzC,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,iBAAkB,CAChB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,YAAa,CACX,KAAM,OAIN,SAAU,GACV,QAAS,MACX,CACF,GAEaC,EAAwB,KAAO,CAC1C,GAAGD,EAAqB,EAExB,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAyB,KAAO,CAC3C,KAAM,CACJ,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,GAAI,CACF,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAO,EACtB,SAAU,GACV,QAAS,MACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,CACF,GAEaC,EAA0B,KAAO,CAC5C,GAAGD,EAAuB,EAE1B,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAuB,KAAO,CACzC,GAAGJ,EAAqB,EACxB,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEaK,EAAyB,KAAO,CAC3C,GAAGH,EAAuB,EAC1B,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEO,SAASI,EACdC,EACAC,EACAC,EAAoB,GACpBC,EACA,CACM,MAAAC,EAAOZ,IAAW,QAClBa,EAAoBC,EAAS,IAAML,EAAY,OAASA,EAAY,MAAM,KAAK,GAAG,CAAC,EAGnFM,EAAQC,EAAYN,GAAaE,EAAMC,EAAmB,CAE9D,aAAAL,EAEA,sBAAuB,EAAA,CACxB,EAED,OAAAS,EAAMT,EAA0BU,GAAA,CAC9BH,EAAM,SAASG,CAAQ,CAAA,CACxB,EAEKD,EAAAF,EAAM,MAAcI,GAAA,CACpBR,GACFA,EAASQ,CAAG,EAEVJ,EAAM,aAAa,OACrBA,EAAM,SAAS,CACjB,CACD,EAEM,CACL,aAAcA,EACd,aAAcA,EAAM,aACpB,MAAOA,EAAM,MACb,KAAAH,EACA,KAAMG,EAAM,KACZ,SAAUA,EAAM,QAAA,CAEpB,CAEgB,SAAAK,EAAiBX,EAAuBY,EAA8C,CAChG,GAAAA,EAAsB,MAAA,GAE1B,UAAWC,KAAKb,EACV,GAAAa,EAAE,MAAM,0CAA0C,EAC7C,MAAA,GAGJ,MAAA,EACT"}
+{"version":3,"file":"input.esm.js","sources":["../../src/forms/input.ts"],"sourcesContent":["import { InputValidation } from '@/forms/validation-rules';\nimport { useField } from 'vee-validate';\n\nlet UUID = 0;\n\nexport const UniqueID = () => {\n  const getID = () => {\n    UUID++;\n    return `elty-input-${UUID.toString()}`;\n  };\n  return {\n    getID,\n  };\n};\n\nimport { computed, ComputedRef, PropType, Ref, watch } from 'vue';\n\nexport type TextualValueType = string | null | undefined;\nexport type NumberValueType = number | null | undefined;\n\nexport const withCommonInputProps = () => ({\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  hideRequiredMark: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  helpTooltip: {\n    type: Object as PropType<{\n      title: string;\n      text: string;\n    }>,\n    required: false,\n    default: undefined,\n  },\n});\n\nexport const withTextualInputProps = () => ({\n  ...withCommonInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withCommonElInputProps = () => ({\n  name: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  id: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  label: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  validation: {\n    type: String as PropType<InputValidation>,\n    default: '',\n    required: false,\n  },\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  errorMessage: {\n    type: [String, Boolean],\n    required: false,\n    default: undefined,\n  },\n  hiddenErrorMessage: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n});\n\nexport const withTextualElInputProps = () => ({\n  ...withCommonElInputProps(),\n  // v-model binding will always be done to a single string. every component will treat the string as he wishes\n  modelValue: {\n    type: String as PropType<TextualValueType>,\n    default: '',\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n});\n\nexport const withNumberInputProps = () => ({\n  ...withCommonInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n});\n\nexport const withNumberElInputProps = () => ({\n  ...withCommonElInputProps(),\n  modelValue: {\n    type: Number as PropType<NumberValueType>,\n  },\n  placeholder: {\n    type: String,\n    default: '',\n    required: false,\n  },\n  step: {\n    type: Number,\n    default: 1,\n    required: false,\n  },\n  min: {\n    type: Number,\n    default: undefined,\n    required: false,\n  },\n  max: {\n    type: Number,\n    default: undefined,\n    required: false,\n  },\n});\n\nexport function useInput<T = string>(\n  initialValue: Ref<T>,\n  validations: Ref<string[]> | ComputedRef<string[]>,\n  inputName: string = '',\n  onChange?: (value: T) => void,\n) {\n  const uuid = UniqueID().getID();\n  const validationsString = computed(() => validations.value && validations.value.join('|'));\n\n  // if a name is not provided it generates a random one\n  const field = useField<T>(inputName || uuid, validationsString, {\n    // empty string counts as a forced blank value\n    initialValue,\n    // validation is performed manually on value change, only if there are errors\n    validateOnValueUpdate: false,\n  });\n\n  watch(initialValue, newValue => {\n    field.setValue(newValue);\n  });\n\n  watch(field.value, val => {\n    if (onChange) {\n      onChange(val);\n    }\n    if (field.errorMessage.value) {\n      field.validate();\n    }\n  });\n\n  return {\n    fieldContext: field,\n    errorMessage: field.errorMessage,\n    value: field.value,\n    uuid,\n    meta: field.meta,\n    setValue: field.setValue,\n  };\n}\n\nexport function showRequiredMark(validations: string[], forceHideMark?: boolean | undefined): boolean {\n  if (forceHideMark) return false;\n\n  for (const v of validations) {\n    if (v.match(/(?:^required)|required\\||(?:\\|required$)/)) {\n      return true;\n    }\n  }\n  return false;\n}\n"],"names":["UUID","UniqueID","withCommonInputProps","withTextualInputProps","withCommonElInputProps","withTextualElInputProps","withNumberInputProps","withNumberElInputProps","useInput","initialValue","validations","inputName","onChange","uuid","validationsString","computed","field","useField","watch","newValue","val","showRequiredMark","forceHideMark","v"],"mappings":"kFAGA,IAAIA,EAAO,EAEJ,MAAMC,EAAW,KAKf,CACL,MALY,KACZD,IACO,cAAcA,EAAK,SAAA,CAAU,GAGpC,GASSE,EAAuB,KAAO,CACzC,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,iBAAkB,CAChB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,YAAa,CACX,KAAM,OAIN,SAAU,GACV,QAAS,MACX,CACF,GAEaC,EAAwB,KAAO,CAC1C,GAAGD,EAAqB,EAExB,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAyB,KAAO,CAC3C,KAAM,CACJ,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,GAAI,CACF,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,MAAO,CACL,KAAM,OACN,SAAU,GACV,QAAS,EACX,EACA,WAAY,CACV,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,SAAU,CACR,KAAM,QACN,SAAU,GACV,QAAS,EACX,EACA,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAO,EACtB,SAAU,GACV,QAAS,MACX,EACA,mBAAoB,CAClB,KAAM,QACN,SAAU,GACV,QAAS,EACX,CACF,GAEaC,EAA0B,KAAO,CAC5C,GAAGD,EAAuB,EAE1B,WAAY,CACV,KAAM,OACN,QAAS,EACX,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,CACF,GAEaE,EAAuB,KAAO,CACzC,GAAGJ,EAAqB,EACxB,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,CACF,GAEaK,EAAyB,KAAO,CAC3C,GAAGH,EAAuB,EAC1B,WAAY,CACV,KAAM,MACR,EACA,YAAa,CACX,KAAM,OACN,QAAS,GACT,SAAU,EACZ,EACA,KAAM,CACJ,KAAM,OACN,QAAS,EACT,SAAU,EACZ,EACA,IAAK,CACH,KAAM,OACN,QAAS,OACT,SAAU,EACZ,EACA,IAAK,CACH,KAAM,OACN,QAAS,OACT,SAAU,EACZ,CACF,GAEO,SAASI,EACdC,EACAC,EACAC,EAAoB,GACpBC,EACA,CACM,MAAAC,EAAOZ,IAAW,QAClBa,EAAoBC,EAAS,IAAML,EAAY,OAASA,EAAY,MAAM,KAAK,GAAG,CAAC,EAGnFM,EAAQC,EAAYN,GAAaE,EAAMC,EAAmB,CAE9D,aAAAL,EAEA,sBAAuB,EAAA,CACxB,EAED,OAAAS,EAAMT,EAA0BU,GAAA,CAC9BH,EAAM,SAASG,CAAQ,CAAA,CACxB,EAEKD,EAAAF,EAAM,MAAcI,GAAA,CACpBR,GACFA,EAASQ,CAAG,EAEVJ,EAAM,aAAa,OACrBA,EAAM,SAAS,CACjB,CACD,EAEM,CACL,aAAcA,EACd,aAAcA,EAAM,aACpB,MAAOA,EAAM,MACb,KAAAH,EACA,KAAMG,EAAM,KACZ,SAAUA,EAAM,QAAA,CAEpB,CAEgB,SAAAK,EAAiBX,EAAuBY,EAA8C,CAChG,GAAAA,EAAsB,MAAA,GAE1B,UAAWC,KAAKb,EACV,GAAAa,EAAE,MAAM,0CAA0C,EAC7C,MAAA,GAGJ,MAAA,EACT"}

package/dist/table/ElServerSideResponsiveTable.vue.d.ts

@@ -151,6 +151,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRu
                 tooltip?: string | undefined;
                 tooltipDelay?: (string | number) | undefined;
                 badgeColor?: import('..').ElBadgeColors | undefined;
+                showTooltipOnMobile?: boolean | undefined;
                 key?: (string | number | symbol) | undefined;
                 ref?: any;
                 ref_for?: boolean | undefined;
@@ -216,6 +217,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRu
                     tooltip?: string | undefined;
                     tooltipDelay?: (string | number) | undefined;
                     badgeColor?: import('..').ElBadgeColors | undefined;
+                    showTooltipOnMobile?: boolean | undefined;
                     key?: (string | number | symbol) | undefined;
                     ref?: any;
                     ref_for?: boolean | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@davincihealthcare/elty-design-system-vue",
-  "version": "1.72.1",
+  "version": "1.73.0",
   "license": "UNLICENSED",
   "main": "dist/index.umd.cjs",
   "types": "dist/index.d.ts",