@davincihealthcare/elty-design-system-vue 1.75.1 → 1.76.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,8 +7,10 @@ export interface ActionButtonProps {
7
7
  color: ElActionButtonColors;
8
8
  status: ElActionButtonStatus;
9
9
  leadingIcon?: InstanceType<typeof ElIcon>['$props'];
10
- trailingIcon?: InstanceType<typeof ElIcon>['$props'];
11
- badge?: InstanceType<typeof ElBadge>['$props'];
10
+ trailingIcon?: InstanceType<typeof ElIcon>['$props'] & {
11
+ name: 'ChevronDownIcon';
12
+ };
13
+ badge?: Omit<InstanceType<typeof ElBadge>['$props'], 'badge'>;
12
14
  onClick?: (() => unknown) | (() => Promise<unknown>);
13
15
  }
14
16
  export declare const elActionButtonSizes: readonly ["base", "l"];
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");;/* 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 o=require("./ElIcon.vue.cjs2.js"),c=require("./ElBadge.vue.cjs2.js");require("./forms/ElInputText.vue.cjs2.js");require("./forms/ElInputCheckbox.vue.cjs2.js");require("./forms/ElInputDate.vue.cjs2.js");require("./forms/ElInputFile.vue.cjs2.js");require("./forms/ElInputMeasureUnit.vue.cjs2.js");require("./forms/ElInputNumber.vue.cjs2.js");require("./forms/ElInputPhone.vue.cjs2.js");require("./forms/ElInputSelect.vue.cjs2.js");require("./forms/ElInputTextarea.vue.cjs2.js");require("./ElToast.vue.cjs2.js");require("./forms/ElInputRadioButton.vue.cjs2.js");require("../node_modules/swiper/shared/swiper-core.cjs.js");;/* empty css */;/* empty css */require("./forms/ElInputSearch.vue.cjs2.js");const d=["data-cy"],p={key:2,class:"h-4 ml-1 relative flex justify-center items-start"},m=["base","l"],g=["primary","secondary"],v=["default","hover","pressed","active"],b=e.defineComponent({__name:"ElActionButton",props:{id:{},label:{},size:{default:"base"},color:{default:"primary"},status:{default:"default"},leadingIcon:{},trailingIcon:{},badge:{},onClick:{}},emits:["click"],setup(l,{emit:n}){const r=l,u=()=>{a.value=!0,i("click",r.onClick)},a=e.ref(r.status==="pressed"),i=n;return(t,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker focus:bg-neutral-pressed focus:ring-neutral-pressed",{"text-sm h-8":r.size==="base","text-base h-10":r.size==="l","border-transparent text-neutral-darker":r.status==="default","border-transparent text-neutral-darker bg-neutral-hover":r.status==="hover","border-transparent bg-neutral-pressed ":(a.value||r.status==="pressed")&&r.status!=="active"&&r.status!=="default"&&r.status!=="hover","text-primary-active bg-primary-light-active border-primary-active":r.status==="active"&&r.color==="primary","text-secondary-active bg-secondary-light-active border-secondary-active":r.status==="active"&&r.color==="secondary"}]),"data-cy":r.label?r.label.trim().replace(/\s+/g,""):"default-action-button",onMouseDown:s[0]||(s[0]=f=>a.value=!0),onClick:u},[t.leadingIcon?(e.openBlock(),e.createBlock(e.unref(o.default),e.mergeProps({key:0},t.leadingIcon,{class:{"h-5 w-5":t.size==="base","h-6 w-6":t.size==="l"}}),null,16,["class"])):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(r.label),1),t.trailingIcon?(e.openBlock(),e.createBlock(e.unref(o.default),e.mergeProps({key:1},t.trailingIcon,{class:{"h-5 w-5":t.size==="base","h-6 w-6":t.size==="l"}}),null,16,["class"])):e.createCommentVNode("",!0),t.badge?(e.openBlock(),e.createElementBlock("div",p,[e.createVNode(e.unref(c.default),e.normalizeProps(e.guardReactiveProps(t.badge)),null,16)])):e.createCommentVNode("",!0)],42,d))}});exports.default=b;exports.elActionButtonColors=g;exports.elActionButtonSizes=m;exports.elActionButtonStatus=v;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");;/* 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 o=require("./ElIcon.vue.cjs2.js"),c=require("./ElBadge.vue.cjs2.js");require("./forms/ElInputText.vue.cjs2.js");require("./forms/ElInputCheckbox.vue.cjs2.js");require("./forms/ElInputDate.vue.cjs2.js");require("./forms/ElInputFile.vue.cjs2.js");require("./forms/ElInputMeasureUnit.vue.cjs2.js");require("./forms/ElInputNumber.vue.cjs2.js");require("./forms/ElInputPhone.vue.cjs2.js");require("./forms/ElInputSelect.vue.cjs2.js");require("./forms/ElInputTextarea.vue.cjs2.js");require("./ElToast.vue.cjs2.js");require("./forms/ElInputRadioButton.vue.cjs2.js");require("../node_modules/swiper/shared/swiper-core.cjs.js");;/* empty css */;/* empty css */require("./forms/ElInputSearch.vue.cjs2.js");const d=["data-cy"],p={key:2,class:"h-4 ml-1 relative flex justify-center items-start"},m=["base","l"],v=["primary","secondary"],b=["default","hover","pressed","active"],g=e.defineComponent({__name:"ElActionButton",props:{id:{},label:{},size:{default:"base"},color:{default:"primary"},status:{default:"default"},leadingIcon:{},trailingIcon:{},badge:{},onClick:{}},emits:["click"],setup(l,{emit:n}){const t=l,i=()=>{a.value=!0,u("click",t.onClick)},a=e.ref(t.status==="pressed"),u=n;return(r,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["transition-colors w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker active:bg-neutral-pressed",{"text-sm h-8":t.size==="base","text-base h-10":t.size==="l","border-transparent text-neutral-darker":t.status==="default","border-transparent text-neutral-darker bg-neutral-hover":t.status==="hover","border-transparent bg-neutral-pressed ":(a.value||t.status==="pressed")&&t.status!=="active"&&t.status!=="default"&&t.status!=="hover","text-primary-active bg-primary-light-active border-primary-active":t.status==="active"&&t.color==="primary","text-secondary-active bg-secondary-light-active border-secondary-active":t.status==="active"&&t.color==="secondary"}]),"data-cy":t.label?t.label.trim().replace(/\s+/g,""):"default-action-button",onMouseDown:s[0]||(s[0]=f=>a.value=!0),onClick:i},[r.leadingIcon?(e.openBlock(),e.createBlock(e.unref(o.default),e.mergeProps({key:0},r.leadingIcon,{class:{"h-4 w-4":r.size==="base","h-5 w-5":r.size==="l"}}),null,16,["class"])):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(t.label),1),r.trailingIcon?(e.openBlock(),e.createBlock(e.unref(o.default),e.mergeProps({key:1},r.trailingIcon,{class:{"h-4 w-4":r.size==="base","h-5 w-5":r.size==="l"}}),null,16,["class"])):e.createCommentVNode("",!0),r.badge?(e.openBlock(),e.createElementBlock("div",p,[e.createVNode(e.unref(c.default),e.mergeProps(r.badge,{color:"red"}),null,16)])):e.createCommentVNode("",!0)],42,d))}});exports.default=g;exports.elActionButtonColors=v;exports.elActionButtonSizes=m;exports.elActionButtonStatus=b;
2
2
  //# sourceMappingURL=ElActionButton.vue.cjs2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElActionButton.vue.cjs2.js","sources":["../../src/ElActionButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elActionButtonSizes = ['base', 'l'] as const;\nexport type ElActionButtonSizes = (typeof elActionButtonSizes)[number];\n\nexport const elActionButtonColors = ['primary', 'secondary'] as const;\nexport type ElActionButtonColors = (typeof elActionButtonColors)[number];\n\nexport const elActionButtonStatus = ['default', 'hover', 'pressed', 'active'] as const;\nexport type ElActionButtonStatus = (typeof elActionButtonStatus)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport { ElBadge, ElIcon } from '.';\nimport { ref } from 'vue';\n\nexport interface ActionButtonProps {\n id?: string;\n label: string;\n size: ElActionButtonSizes;\n color: ElActionButtonColors;\n status: ElActionButtonStatus;\n leadingIcon?: InstanceType<typeof ElIcon>['$props'];\n trailingIcon?: InstanceType<typeof ElIcon>['$props'];\n badge?: InstanceType<typeof ElBadge>['$props'];\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ActionButtonProps>(), {\n size: 'base',\n color: 'primary',\n status: 'default',\n});\n\nconst onClick = () => {\n isPressed.value = true;\n $emits('click', props.onClick);\n};\n\nconst isPressed = ref<boolean>(props.status === 'pressed');\nconst $emits = defineEmits(['click']);\n</script>\n\n<template>\n <button\n class=\"w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker focus:bg-neutral-pressed focus:ring-neutral-pressed\"\n :class=\"{\n 'text-sm h-8': props.size === 'base',\n 'text-base h-10': props.size === 'l',\n 'border-transparent text-neutral-darker': props.status === 'default',\n 'border-transparent text-neutral-darker bg-neutral-hover': props.status === 'hover',\n 'border-transparent bg-neutral-pressed ':\n (isPressed || props.status === 'pressed') && props.status !== 'active' && props.status !== 'default' && props.status !== 'hover',\n 'text-primary-active bg-primary-light-active border-primary-active': props.status === 'active' && props.color === 'primary',\n 'text-secondary-active bg-secondary-light-active border-secondary-active': props.status === 'active' && props.color === 'secondary',\n }\"\n :data-cy=\"props.label ? props.label.trim().replace(/\\s+/g, '') : 'default-action' + '-button'\"\n @mouse-down=\"isPressed = true\"\n @click=\"onClick\"\n >\n <ElIcon\n v-if=\"leadingIcon\"\n v-bind=\"leadingIcon\"\n :class=\"{\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l',\n }\"\n />\n <span> {{ props.label }}</span>\n <ElIcon\n v-if=\"trailingIcon\"\n v-bind=\"trailingIcon\"\n :class=\"{\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l',\n }\"\n />\n <div v-if=\"badge\" class=\"h-4 ml-1 relative flex justify-center items-start\">\n <ElBadge v-bind=\"badge\" />\n </div>\n </button>\n</template>\n"],"names":["elActionButtonSizes","elActionButtonColors","elActionButtonStatus","props","__props","onClick","isPressed","$emits","ref","__emit"],"mappings":"s0CACaA,EAAsB,CAAC,OAAQ,GAAG,EAGlCC,EAAuB,CAAC,UAAW,WAAW,EAG9CC,EAAuB,CAAC,UAAW,QAAS,UAAW,QAAQ,sOAoB5E,MAAMC,EAAQC,EAMRC,EAAU,IAAM,CACpBC,EAAU,MAAQ,GACXC,EAAA,QAASJ,EAAM,OAAO,CAAA,EAGzBG,EAAYE,EAAA,IAAaL,EAAM,SAAW,SAAS,EACnDI,EAASE"}
1
+ {"version":3,"file":"ElActionButton.vue.cjs2.js","sources":["../../src/ElActionButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elActionButtonSizes = ['base', 'l'] as const;\nexport type ElActionButtonSizes = (typeof elActionButtonSizes)[number];\n\nexport const elActionButtonColors = ['primary', 'secondary'] as const;\nexport type ElActionButtonColors = (typeof elActionButtonColors)[number];\n\nexport const elActionButtonStatus = ['default', 'hover', 'pressed', 'active'] as const;\nexport type ElActionButtonStatus = (typeof elActionButtonStatus)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport { ElBadge, ElIcon } from '.';\nimport { ref } from 'vue';\n\nexport interface ActionButtonProps {\n id?: string;\n label: string;\n size: ElActionButtonSizes;\n color: ElActionButtonColors;\n status: ElActionButtonStatus;\n leadingIcon?: InstanceType<typeof ElIcon>['$props'];\n trailingIcon?: InstanceType<typeof ElIcon>['$props'] & { name: 'ChevronDownIcon' };\n badge?: Omit<InstanceType<typeof ElBadge>['$props'], 'badge'>;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ActionButtonProps>(), {\n size: 'base',\n color: 'primary',\n status: 'default',\n});\n\nconst onClick = () => {\n isPressed.value = true;\n $emits('click', props.onClick);\n};\n\nconst isPressed = ref<boolean>(props.status === 'pressed');\nconst $emits = defineEmits(['click']);\n</script>\n\n<template>\n <button\n class=\"transition-colors w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker active:bg-neutral-pressed\"\n :class=\"{\n 'text-sm h-8': props.size === 'base',\n 'text-base h-10': props.size === 'l',\n 'border-transparent text-neutral-darker': props.status === 'default',\n 'border-transparent text-neutral-darker bg-neutral-hover': props.status === 'hover',\n 'border-transparent bg-neutral-pressed ':\n (isPressed || props.status === 'pressed') && props.status !== 'active' && props.status !== 'default' && props.status !== 'hover',\n 'text-primary-active bg-primary-light-active border-primary-active': props.status === 'active' && props.color === 'primary',\n 'text-secondary-active bg-secondary-light-active border-secondary-active': props.status === 'active' && props.color === 'secondary',\n }\"\n :data-cy=\"props.label ? props.label.trim().replace(/\\s+/g, '') : 'default-action' + '-button'\"\n @mouse-down=\"isPressed = true\"\n @click=\"onClick\"\n >\n <ElIcon\n v-if=\"leadingIcon\"\n v-bind=\"leadingIcon\"\n :class=\"{\n 'h-4 w-4': size === 'base',\n 'h-5 w-5': size === 'l',\n }\"\n />\n <span> {{ props.label }}</span>\n <ElIcon\n v-if=\"trailingIcon\"\n v-bind=\"trailingIcon\"\n :class=\"{\n 'h-4 w-4': size === 'base',\n 'h-5 w-5': size === 'l',\n }\"\n />\n <div v-if=\"badge\" class=\"h-4 ml-1 relative flex justify-center items-start\">\n <ElBadge v-bind=\"badge\" color=\"red\" />\n </div>\n </button>\n</template>\n"],"names":["elActionButtonSizes","elActionButtonColors","elActionButtonStatus","props","__props","onClick","isPressed","$emits","ref","__emit"],"mappings":"s0CACaA,EAAsB,CAAC,OAAQ,GAAG,EAGlCC,EAAuB,CAAC,UAAW,WAAW,EAG9CC,EAAuB,CAAC,UAAW,QAAS,UAAW,QAAQ,sOAoB5E,MAAMC,EAAQC,EAMRC,EAAU,IAAM,CACpBC,EAAU,MAAQ,GACXC,EAAA,QAASJ,EAAM,OAAO,CAAA,EAGzBG,EAAYE,EAAA,IAAaL,EAAM,SAAW,SAAS,EACnDI,EAASE"}
@@ -1,2 +1,2 @@
1
- import{defineComponent as f,ref as g,openBlock as r,createElementBlock as n,normalizeClass as v,createBlock as l,unref as a,mergeProps as c,createCommentVNode as s,createElementVNode as y,toDisplayString as h,createVNode as k,normalizeProps as z,guardReactiveProps as B}from"vue";/* 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 u from"./ElIcon.vue.esm2.js";import C from"./ElBadge.vue.esm2.js";import"./forms/ElInputText.vue.esm2.js";import"./forms/ElInputCheckbox.vue.esm2.js";import"./forms/ElInputDate.vue.esm2.js";import"./forms/ElInputFile.vue.esm2.js";import"./forms/ElInputMeasureUnit.vue.esm2.js";import"./forms/ElInputNumber.vue.esm2.js";import"./forms/ElInputPhone.vue.esm2.js";import"./forms/ElInputSelect.vue.esm2.js";import"./forms/ElInputTextarea.vue.esm2.js";import"./ElToast.vue.esm2.js";import"./forms/ElInputRadioButton.vue.esm2.js";import"../node_modules/swiper/shared/swiper-core.esm.js";/* empty css *//* empty css */import"./forms/ElInputSearch.vue.esm2.js";const w=["data-cy"],I={key:2,class:"h-4 ml-1 relative flex justify-center items-start"},Y=["base","l"],Z=["primary","secondary"],ee=["default","hover","pressed","active"],te=f({__name:"ElActionButton",props:{id:{},label:{},size:{default:"base"},color:{default:"primary"},status:{default:"default"},leadingIcon:{},trailingIcon:{},badge:{},onClick:{}},emits:["click"],setup(p,{emit:m}){const e=p,d=()=>{o.value=!0,b("click",e.onClick)},o=g(e.status==="pressed"),b=m;return(t,i)=>(r(),n("button",{class:v(["w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker focus:bg-neutral-pressed focus:ring-neutral-pressed",{"text-sm h-8":e.size==="base","text-base h-10":e.size==="l","border-transparent text-neutral-darker":e.status==="default","border-transparent text-neutral-darker bg-neutral-hover":e.status==="hover","border-transparent bg-neutral-pressed ":(o.value||e.status==="pressed")&&e.status!=="active"&&e.status!=="default"&&e.status!=="hover","text-primary-active bg-primary-light-active border-primary-active":e.status==="active"&&e.color==="primary","text-secondary-active bg-secondary-light-active border-secondary-active":e.status==="active"&&e.color==="secondary"}]),"data-cy":e.label?e.label.trim().replace(/\s+/g,""):"default-action-button",onMouseDown:i[0]||(i[0]=A=>o.value=!0),onClick:d},[t.leadingIcon?(r(),l(a(u),c({key:0},t.leadingIcon,{class:{"h-5 w-5":t.size==="base","h-6 w-6":t.size==="l"}}),null,16,["class"])):s("",!0),y("span",null,h(e.label),1),t.trailingIcon?(r(),l(a(u),c({key:1},t.trailingIcon,{class:{"h-5 w-5":t.size==="base","h-6 w-6":t.size==="l"}}),null,16,["class"])):s("",!0),t.badge?(r(),n("div",I,[k(a(C),z(B(t.badge)),null,16)])):s("",!0)],42,w))}});export{te as default,Z as elActionButtonColors,Y as elActionButtonSizes,ee as elActionButtonStatus};
1
+ import{defineComponent as f,ref as v,openBlock as r,createElementBlock as l,normalizeClass as g,createBlock as c,unref as a,mergeProps as s,createCommentVNode as i,createElementVNode as y,toDisplayString as h,createVNode as k}from"vue";/* 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 m from"./ElIcon.vue.esm2.js";import z from"./ElBadge.vue.esm2.js";import"./forms/ElInputText.vue.esm2.js";import"./forms/ElInputCheckbox.vue.esm2.js";import"./forms/ElInputDate.vue.esm2.js";import"./forms/ElInputFile.vue.esm2.js";import"./forms/ElInputMeasureUnit.vue.esm2.js";import"./forms/ElInputNumber.vue.esm2.js";import"./forms/ElInputPhone.vue.esm2.js";import"./forms/ElInputSelect.vue.esm2.js";import"./forms/ElInputTextarea.vue.esm2.js";import"./ElToast.vue.esm2.js";import"./forms/ElInputRadioButton.vue.esm2.js";import"../node_modules/swiper/shared/swiper-core.esm.js";/* empty css *//* empty css */import"./forms/ElInputSearch.vue.esm2.js";const B=["data-cy"],C={key:2,class:"h-4 ml-1 relative flex justify-center items-start"},W=["base","l"],X=["primary","secondary"],Y=["default","hover","pressed","active"],Z=f({__name:"ElActionButton",props:{id:{},label:{},size:{default:"base"},color:{default:"primary"},status:{default:"default"},leadingIcon:{},trailingIcon:{},badge:{},onClick:{}},emits:["click"],setup(p,{emit:u}){const e=p,d=()=>{o.value=!0,b("click",e.onClick)},o=v(e.status==="pressed"),b=u;return(t,n)=>(r(),l("button",{class:g(["transition-colors w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker active:bg-neutral-pressed",{"text-sm h-8":e.size==="base","text-base h-10":e.size==="l","border-transparent text-neutral-darker":e.status==="default","border-transparent text-neutral-darker bg-neutral-hover":e.status==="hover","border-transparent bg-neutral-pressed ":(o.value||e.status==="pressed")&&e.status!=="active"&&e.status!=="default"&&e.status!=="hover","text-primary-active bg-primary-light-active border-primary-active":e.status==="active"&&e.color==="primary","text-secondary-active bg-secondary-light-active border-secondary-active":e.status==="active"&&e.color==="secondary"}]),"data-cy":e.label?e.label.trim().replace(/\s+/g,""):"default-action-button",onMouseDown:n[0]||(n[0]=w=>o.value=!0),onClick:d},[t.leadingIcon?(r(),c(a(m),s({key:0},t.leadingIcon,{class:{"h-4 w-4":t.size==="base","h-5 w-5":t.size==="l"}}),null,16,["class"])):i("",!0),y("span",null,h(e.label),1),t.trailingIcon?(r(),c(a(m),s({key:1},t.trailingIcon,{class:{"h-4 w-4":t.size==="base","h-5 w-5":t.size==="l"}}),null,16,["class"])):i("",!0),t.badge?(r(),l("div",C,[k(a(z),s(t.badge,{color:"red"}),null,16)])):i("",!0)],42,B))}});export{Z as default,X as elActionButtonColors,W as elActionButtonSizes,Y as elActionButtonStatus};
2
2
  //# sourceMappingURL=ElActionButton.vue.esm2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElActionButton.vue.esm2.js","sources":["../../src/ElActionButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elActionButtonSizes = ['base', 'l'] as const;\nexport type ElActionButtonSizes = (typeof elActionButtonSizes)[number];\n\nexport const elActionButtonColors = ['primary', 'secondary'] as const;\nexport type ElActionButtonColors = (typeof elActionButtonColors)[number];\n\nexport const elActionButtonStatus = ['default', 'hover', 'pressed', 'active'] as const;\nexport type ElActionButtonStatus = (typeof elActionButtonStatus)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport { ElBadge, ElIcon } from '.';\nimport { ref } from 'vue';\n\nexport interface ActionButtonProps {\n id?: string;\n label: string;\n size: ElActionButtonSizes;\n color: ElActionButtonColors;\n status: ElActionButtonStatus;\n leadingIcon?: InstanceType<typeof ElIcon>['$props'];\n trailingIcon?: InstanceType<typeof ElIcon>['$props'];\n badge?: InstanceType<typeof ElBadge>['$props'];\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ActionButtonProps>(), {\n size: 'base',\n color: 'primary',\n status: 'default',\n});\n\nconst onClick = () => {\n isPressed.value = true;\n $emits('click', props.onClick);\n};\n\nconst isPressed = ref<boolean>(props.status === 'pressed');\nconst $emits = defineEmits(['click']);\n</script>\n\n<template>\n <button\n class=\"w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker focus:bg-neutral-pressed focus:ring-neutral-pressed\"\n :class=\"{\n 'text-sm h-8': props.size === 'base',\n 'text-base h-10': props.size === 'l',\n 'border-transparent text-neutral-darker': props.status === 'default',\n 'border-transparent text-neutral-darker bg-neutral-hover': props.status === 'hover',\n 'border-transparent bg-neutral-pressed ':\n (isPressed || props.status === 'pressed') && props.status !== 'active' && props.status !== 'default' && props.status !== 'hover',\n 'text-primary-active bg-primary-light-active border-primary-active': props.status === 'active' && props.color === 'primary',\n 'text-secondary-active bg-secondary-light-active border-secondary-active': props.status === 'active' && props.color === 'secondary',\n }\"\n :data-cy=\"props.label ? props.label.trim().replace(/\\s+/g, '') : 'default-action' + '-button'\"\n @mouse-down=\"isPressed = true\"\n @click=\"onClick\"\n >\n <ElIcon\n v-if=\"leadingIcon\"\n v-bind=\"leadingIcon\"\n :class=\"{\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l',\n }\"\n />\n <span> {{ props.label }}</span>\n <ElIcon\n v-if=\"trailingIcon\"\n v-bind=\"trailingIcon\"\n :class=\"{\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l',\n }\"\n />\n <div v-if=\"badge\" class=\"h-4 ml-1 relative flex justify-center items-start\">\n <ElBadge v-bind=\"badge\" />\n </div>\n </button>\n</template>\n"],"names":["elActionButtonSizes","elActionButtonColors","elActionButtonStatus","props","__props","onClick","isPressed","$emits","ref","__emit"],"mappings":"u5CACaA,EAAsB,CAAC,OAAQ,GAAG,EAGlCC,EAAuB,CAAC,UAAW,WAAW,EAG9CC,GAAuB,CAAC,UAAW,QAAS,UAAW,QAAQ,uNAoB5E,MAAMC,EAAQC,EAMRC,EAAU,IAAM,CACpBC,EAAU,MAAQ,GACXC,EAAA,QAASJ,EAAM,OAAO,CAAA,EAGzBG,EAAYE,EAAaL,EAAM,SAAW,SAAS,EACnDI,EAASE"}
1
+ {"version":3,"file":"ElActionButton.vue.esm2.js","sources":["../../src/ElActionButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elActionButtonSizes = ['base', 'l'] as const;\nexport type ElActionButtonSizes = (typeof elActionButtonSizes)[number];\n\nexport const elActionButtonColors = ['primary', 'secondary'] as const;\nexport type ElActionButtonColors = (typeof elActionButtonColors)[number];\n\nexport const elActionButtonStatus = ['default', 'hover', 'pressed', 'active'] as const;\nexport type ElActionButtonStatus = (typeof elActionButtonStatus)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport { ElBadge, ElIcon } from '.';\nimport { ref } from 'vue';\n\nexport interface ActionButtonProps {\n id?: string;\n label: string;\n size: ElActionButtonSizes;\n color: ElActionButtonColors;\n status: ElActionButtonStatus;\n leadingIcon?: InstanceType<typeof ElIcon>['$props'];\n trailingIcon?: InstanceType<typeof ElIcon>['$props'] & { name: 'ChevronDownIcon' };\n badge?: Omit<InstanceType<typeof ElBadge>['$props'], 'badge'>;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ActionButtonProps>(), {\n size: 'base',\n color: 'primary',\n status: 'default',\n});\n\nconst onClick = () => {\n isPressed.value = true;\n $emits('click', props.onClick);\n};\n\nconst isPressed = ref<boolean>(props.status === 'pressed');\nconst $emits = defineEmits(['click']);\n</script>\n\n<template>\n <button\n class=\"transition-colors w-fit border flex flex-1 justify-center items-center gap-1 font-semibold leading-6 rounded-lg px-3 hover:bg-neutral-hover hover:text-neutral-darker active:bg-neutral-pressed\"\n :class=\"{\n 'text-sm h-8': props.size === 'base',\n 'text-base h-10': props.size === 'l',\n 'border-transparent text-neutral-darker': props.status === 'default',\n 'border-transparent text-neutral-darker bg-neutral-hover': props.status === 'hover',\n 'border-transparent bg-neutral-pressed ':\n (isPressed || props.status === 'pressed') && props.status !== 'active' && props.status !== 'default' && props.status !== 'hover',\n 'text-primary-active bg-primary-light-active border-primary-active': props.status === 'active' && props.color === 'primary',\n 'text-secondary-active bg-secondary-light-active border-secondary-active': props.status === 'active' && props.color === 'secondary',\n }\"\n :data-cy=\"props.label ? props.label.trim().replace(/\\s+/g, '') : 'default-action' + '-button'\"\n @mouse-down=\"isPressed = true\"\n @click=\"onClick\"\n >\n <ElIcon\n v-if=\"leadingIcon\"\n v-bind=\"leadingIcon\"\n :class=\"{\n 'h-4 w-4': size === 'base',\n 'h-5 w-5': size === 'l',\n }\"\n />\n <span> {{ props.label }}</span>\n <ElIcon\n v-if=\"trailingIcon\"\n v-bind=\"trailingIcon\"\n :class=\"{\n 'h-4 w-4': size === 'base',\n 'h-5 w-5': size === 'l',\n }\"\n />\n <div v-if=\"badge\" class=\"h-4 ml-1 relative flex justify-center items-start\">\n <ElBadge v-bind=\"badge\" color=\"red\" />\n </div>\n </button>\n</template>\n"],"names":["elActionButtonSizes","elActionButtonColors","elActionButtonStatus","props","__props","onClick","isPressed","$emits","ref","__emit"],"mappings":"22CACaA,EAAsB,CAAC,OAAQ,GAAG,EAGlCC,EAAuB,CAAC,UAAW,WAAW,EAG9CC,EAAuB,CAAC,UAAW,QAAS,UAAW,QAAQ,sNAoB5E,MAAMC,EAAQC,EAMRC,EAAU,IAAM,CACpBC,EAAU,MAAQ,GACXC,EAAA,QAASJ,EAAM,OAAO,CAAA,EAGzBG,EAAYE,EAAaL,EAAM,SAAW,SAAS,EACnDI,EAASE"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),d=require("./ElIcon.vue.cjs2.js"),u=["disabled","type","data-cy"],p={class:"font-semibold"},b={key:1,class:"inline-flex items-center"},m=r.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),h=r.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=[m,h],y=r.createElementVNode("span",{class:"font-semibold"},"Un attimo...",-1),f=["xs","sm","base","l","xl"],g=["primary","secondary","tertiary"],c=r.defineComponent({__name:"ElButton",props:{disabled:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{default:void 0},iconRight:{type:Boolean},error:{type:Boolean,default:!1},label:{default:""},size:{default:"base"},variant:{default:"primary"},type:{default:"button"},loadOnClick:{type:Boolean,default:!1},onClick:{type:Function,default:void 0}},setup(n){const a=n,o=r.ref(!1),l=r.ref(!1),s=r.computed(()=>o.value||l.value||a.loading),t=async()=>{var e;o.value||s.value||(l.value=o.value=a.loadOnClick,setTimeout(()=>{l.value=!1},3e3),await((e=a.onClick)==null?void 0:e.call(a)),o.value=!1)};return(e,z)=>{var i;return r.openBlock(),r.createElementBlock("button",{disabled:e.disabled||e.loading,type:e.type,class:r.normalizeClass(["inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out",{"h-6 rounded text-xs":e.size==="xs","h-7 rounded text-xs":e.size==="sm","h-8 rounded-md text-sm":e.size==="base","text-base h-10 rounded-md ":e.size==="l","text-base h-12 rounded-md ":e.size==="xl","cursor-pointer":!s.value&&!e.disabled,"cursor-wait":s.value&&!e.disabled,"px-4":e.variant!=="tertiary"&&(e.size==="base"||e.size==="l"||e.size==="xl"),"px-3":e.variant!=="tertiary"&&(e.size==="sm"||e.size==="xs")||e.variant==="tertiary"&&(e.size==="l"||e.size==="xl"),"px-2":e.variant==="tertiary"&&(e.size==="xs"||e.size==="sm"||e.size==="base"),...e.dark?{"bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none":e.variant==="primary"&&!e.disabled,"bg-alpha-100 text-alpha-400 cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none":e.variant==="secondary"&&!e.error&&!e.disabled,"text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none":e.variant==="secondary"&&e.disabled,"bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none":e.variant==="tertiary"&&e.disabled}:{"bg-primary hover:bg-primary-hover focus:bg-primary-pressed focus:outlined-primary text-white":e.variant==="primary"&&!e.error&&!e.disabled,"bg-error hover:bg-error-hover focus:bg-error-pressed focus:outlined-error text-white":e.variant==="primary"&&e.error&&!e.disabled,"bg-neutral-inactive text-neutral-inactive cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover focus:text-primary-pressed focus:bg-primary-light focus:border-primary-pressed text-primary focus:outlined-primary":e.variant==="secondary"&&!e.error&&!e.disabled,"border-error text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border bg-white":e.variant==="secondary"&&e.error&&!e.disabled,"text-neutral-inactive border-neutral-inactive cursor-not-allowed border":e.variant==="secondary"&&e.disabled,"text-primary hover:text-primary-hover hover:bg-primary-light-hover focus:text-primary-pressed focus:bg-primary-light-pressed focus:outlined-primary border-none bg-transparent":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border-none":e.variant==="tertiary"&&e.error&&!e.disabled,"text-neutral-inactive cursor-not-allowed border-none bg-transparent":e.variant==="tertiary"&&e.disabled}}]),"data-cy":`${(i=e.label.trim())==null?void 0:i.replaceAll(" ","").replaceAll(",","")}-button`,onClick:t},[s.value?(r.openBlock(),r.createElementBlock("span",b,[(r.openBlock(),r.createElementBlock("svg",{class:r.normalizeClass(["animate-spin",{"mr-1 h-[14px] w-[14px]":e.size==="xs","mr-2 h-4 w-4":e.size==="sm","mr-2 h-5 w-5":e.size==="base","mr-3 h-6 w-6":e.size==="l"||e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},v,2)),y])):(r.openBlock(),r.createElementBlock("span",{key:0,class:r.normalizeClass(["inline-flex items-center",e.iconRight?"flex-row-reverse":"flex-row"])},[e.icon?(r.openBlock(),r.createBlock(d.default,{key:0,name:e.icon.name,solid:e.icon.solid,class:r.normalizeClass({"h-[14px] w-[14px]":e.size==="xs","h-4 w-4":e.size==="sm","h-5 w-5":e.size==="base","h-6 w-6":e.size==="l"||e.size==="xl"})},null,8,["name","solid","class"])):r.createCommentVNode("",!0),e.icon&&e.label!==""?(r.openBlock(),r.createElementBlock("span",{key:1,class:r.normalizeClass({"w-1":e.size==="xs","w-2":e.size==="sm"||e.size==="base","w-3":e.size==="l"||e.size==="xl"})},null,2)):r.createCommentVNode("",!0),r.createElementVNode("span",p,r.toDisplayString(e.label),1)],2))],10,u)}}});exports.default=c;exports.elButtonSizes=f;exports.elButtonVariants=g;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),d=require("./ElIcon.vue.cjs2.js"),u=["disabled","type","data-cy"],p={class:"font-semibold"},b={key:1,class:"inline-flex items-center"},v=r.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),m=r.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),h=[v,m],y=r.createElementVNode("span",{class:"font-semibold"},"Un attimo...",-1),g=["xs","sm","base","l","xl"],c=["primary","secondary","tertiary"],f=r.defineComponent({__name:"ElButton",props:{disabled:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{default:void 0},iconRight:{type:Boolean},error:{type:Boolean,default:!1},label:{default:""},size:{default:"base"},variant:{default:"primary"},type:{default:"button"},loadOnClick:{type:Boolean,default:!1},onClick:{type:Function,default:void 0}},setup(t){const a=t,o=r.ref(!1),l=r.ref(!1),i=r.computed(()=>o.value||l.value||a.loading),n=async()=>{var e;o.value||i.value||(l.value=o.value=a.loadOnClick,setTimeout(()=>{l.value=!1},3e3),await((e=a.onClick)==null?void 0:e.call(a)),o.value=!1)};return(e,z)=>{var s;return r.openBlock(),r.createElementBlock("button",{disabled:e.disabled||e.loading,type:e.type,class:r.normalizeClass(["inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out",{"h-6 rounded text-xs":e.size==="xs","h-7 rounded text-xs":e.size==="sm","h-8 rounded-md text-sm":e.size==="base","text-base h-10 rounded-md ":e.size==="l","text-base h-12 rounded-md ":e.size==="xl","cursor-pointer":!i.value&&!e.disabled,"cursor-wait":i.value&&!e.disabled,"px-4":e.variant!=="tertiary"&&(e.size==="base"||e.size==="l"||e.size==="xl"),"px-3":e.variant!=="tertiary"&&(e.size==="sm"||e.size==="xs")||e.variant==="tertiary"&&(e.size==="l"||e.size==="xl"),"px-2":e.variant==="tertiary"&&(e.size==="xs"||e.size==="sm"||e.size==="base"),...e.dark?{"bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none":e.variant==="primary"&&!e.disabled,"bg-alpha-100 text-alpha-400 cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none":e.variant==="secondary"&&!e.error&&!e.disabled,"text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none":e.variant==="secondary"&&e.disabled,"bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none":e.variant==="tertiary"&&e.disabled}:{"bg-primary hover:bg-primary-hover active:bg-primary-pressed active:outlined-primary text-white":e.variant==="primary"&&!e.error&&!e.disabled,"bg-error hover:bg-error-hover active:bg-error-pressed active:outlined-error text-white":e.variant==="primary"&&e.error&&!e.disabled,"bg-neutral-inactive text-neutral-inactive cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover active:text-primary-pressed active:bg-primary-light active:border-primary-pressed text-primary active:outlined-primary":e.variant==="secondary"&&!e.error&&!e.disabled,"border-error text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border bg-white":e.variant==="secondary"&&e.error&&!e.disabled,"text-neutral-inactive border-neutral-inactive cursor-not-allowed border":e.variant==="secondary"&&e.disabled,"text-primary hover:text-primary-hover hover:bg-primary-light-hover active:text-primary-pressed active:bg-primary-light-pressed active:outlined-primary border-none bg-transparent":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border-none":e.variant==="tertiary"&&e.error&&!e.disabled,"text-neutral-inactive cursor-not-allowed border-none bg-transparent":e.variant==="tertiary"&&e.disabled}}]),"data-cy":`${(s=e.label.trim())==null?void 0:s.replaceAll(" ","").replaceAll(",","")}-button`,onClick:n},[i.value?(r.openBlock(),r.createElementBlock("span",b,[(r.openBlock(),r.createElementBlock("svg",{class:r.normalizeClass(["animate-spin",{"mr-1 h-[14px] w-[14px]":e.size==="xs","mr-2 h-4 w-4":e.size==="sm","mr-2 h-5 w-5":e.size==="base","mr-3 h-6 w-6":e.size==="l"||e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},h,2)),y])):(r.openBlock(),r.createElementBlock("span",{key:0,class:r.normalizeClass(["inline-flex items-center",e.iconRight?"flex-row-reverse":"flex-row"])},[e.icon?(r.openBlock(),r.createBlock(d.default,{key:0,name:e.icon.name,solid:e.icon.solid,class:r.normalizeClass({"h-[14px] w-[14px]":e.size==="xs","h-4 w-4":e.size==="sm","h-5 w-5":e.size==="base","h-6 w-6":e.size==="l"||e.size==="xl"})},null,8,["name","solid","class"])):r.createCommentVNode("",!0),e.icon&&e.label!==""?(r.openBlock(),r.createElementBlock("span",{key:1,class:r.normalizeClass({"w-1":e.size==="xs","w-2":e.size==="sm"||e.size==="base","w-3":e.size==="l"||e.size==="xl"})},null,2)):r.createCommentVNode("",!0),r.createElementVNode("span",p,r.toDisplayString(e.label),1)],2))],10,u)}}});exports.default=f;exports.elButtonSizes=g;exports.elButtonVariants=c;
2
2
  //# sourceMappingURL=ElButton.vue.cjs2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElButton.vue.cjs2.js","sources":["../../src/ElButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElButtonSize = (typeof elButtonSizes)[number];\n\nexport const elButtonVariants = ['primary', 'secondary', 'tertiary'] as const;\nexport type ElButtonVariant = (typeof elButtonVariants)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { ref, computed, ButtonHTMLAttributes } from 'vue';\n\nexport interface ElButtonProps {\n disabled?: boolean;\n dark?: boolean;\n loading?: boolean;\n icon?: ElIconProps;\n iconRight?: boolean;\n error?: boolean;\n label: string;\n size?: ElButtonSize;\n variant?: ElButtonVariant;\n type?: ButtonHTMLAttributes['type'];\n loadOnClick?: boolean;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ElButtonProps>(), {\n disabled: false,\n dark: false,\n loading: false,\n error: false,\n label: '',\n icon: undefined,\n size: 'base',\n variant: 'primary',\n type: 'button',\n loadOnClick: false,\n onClick: undefined,\n});\n\nconst callbackLoading = ref<boolean>(false);\nconst defaultLoading = ref<boolean>(false);\nconst computedLoading = computed(() => callbackLoading.value || defaultLoading.value || props.loading);\n\nconst onClick = async () => {\n if (callbackLoading.value || computedLoading.value) return;\n defaultLoading.value = callbackLoading.value = props.loadOnClick;\n setTimeout(() => {\n defaultLoading.value = false;\n }, 3000);\n await props.onClick?.();\n callbackLoading.value = false;\n};\n</script>\n\n<template>\n <button\n :disabled=\"disabled || loading\"\n :type=\"type\"\n class=\"inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out\"\n :class=\"{\n 'h-6 rounded text-xs': size === 'xs',\n 'h-7 rounded text-xs': size === 'sm',\n 'h-8 rounded-md text-sm': size === 'base',\n 'text-base h-10 rounded-md ': size === 'l',\n 'text-base h-12 rounded-md ': size === 'xl',\n 'cursor-pointer': !computedLoading && !disabled,\n 'cursor-wait': computedLoading && !disabled,\n 'px-4': variant !== 'tertiary' && (size === 'base' || size === 'l' || size === 'xl'),\n 'px-3': (variant !== 'tertiary' && (size === 'sm' || size === 'xs')) || (variant === 'tertiary' && (size === 'l' || size === 'xl')),\n 'px-2': variant === 'tertiary' && (size === 'xs' || size === 'sm' || size === 'base'),\n ...(dark\n ? {\n 'bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none':\n variant === 'primary' && !disabled,\n 'bg-alpha-100 text-alpha-400 cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none':\n variant === 'secondary' && !error && !disabled,\n 'text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none': variant === 'secondary' && disabled,\n 'bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none':\n variant === 'tertiary' && !error && !disabled,\n 'text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none': variant === 'tertiary' && disabled,\n }\n : {\n 'bg-primary hover:bg-primary-hover focus:bg-primary-pressed focus:outlined-primary text-white':\n variant === 'primary' && !error && !disabled,\n 'bg-error hover:bg-error-hover focus:bg-error-pressed focus:outlined-error text-white':\n variant === 'primary' && error && !disabled,\n 'bg-neutral-inactive text-neutral-inactive cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover focus:text-primary-pressed focus:bg-primary-light focus:border-primary-pressed text-primary focus:outlined-primary':\n variant === 'secondary' && !error && !disabled,\n 'border-error text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border bg-white':\n variant === 'secondary' && error && !disabled,\n 'text-neutral-inactive border-neutral-inactive cursor-not-allowed border': variant === 'secondary' && disabled,\n 'text-primary hover:text-primary-hover hover:bg-primary-light-hover focus:text-primary-pressed focus:bg-primary-light-pressed focus:outlined-primary border-none bg-transparent':\n variant === 'tertiary' && !error && !disabled,\n 'text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border-none':\n variant === 'tertiary' && error && !disabled,\n 'text-neutral-inactive cursor-not-allowed border-none bg-transparent': variant === 'tertiary' && disabled,\n }),\n }\"\n :data-cy=\"`${label.trim()?.replaceAll(' ', '').replaceAll(',', '')}-button`\"\n @click=\"onClick\"\n >\n <span v-if=\"!computedLoading\" class=\"inline-flex items-center\" :class=\"iconRight ? 'flex-row-reverse' : 'flex-row'\">\n <ElIcon\n v-if=\"icon\"\n :name=\"icon.name\"\n :solid=\"icon.solid\"\n :class=\"{\n 'h-[14px] w-[14px]': size === 'xs',\n 'h-4 w-4': size === 'sm',\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l' || size === 'xl',\n }\"\n />\n <span\n v-if=\"icon && label !== ''\"\n :class=\"{\n 'w-1': size === 'xs',\n 'w-2': size === 'sm' || size === 'base',\n 'w-3': size === 'l' || size === 'xl',\n }\"\n ></span>\n <span class=\"font-semibold\">{{ label }}</span>\n </span>\n <span v-else class=\"inline-flex items-center\">\n <svg\n class=\"animate-spin\"\n :class=\"{\n 'mr-1 h-[14px] w-[14px]': size === 'xs',\n 'mr-2 h-4 w-4': size === 'sm',\n 'mr-2 h-5 w-5': size === 'base',\n 'mr-3 h-6 w-6': size === 'l' || 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 class=\"font-semibold\">Un attimo...</span>\n </span>\n </button>\n</template>\n"],"names":["elButtonSizes","elButtonVariants","props","__props","callbackLoading","ref","defaultLoading","computedLoading","computed","onClick","_a"],"mappings":"6pBACaA,EAAgB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,EAG9CC,EAAmB,CAAC,UAAW,YAAa,UAAU,uZAuBnE,MAAMC,EAAQC,EAcRC,EAAkBC,MAAa,EAAK,EACpCC,EAAiBD,MAAa,EAAK,EACnCE,EAAkBC,WAAS,IAAMJ,EAAgB,OAASE,EAAe,OAASJ,EAAM,OAAO,EAE/FO,EAAU,SAAY,OACtBL,EAAgB,OAASG,EAAgB,QAC9BD,EAAA,MAAQF,EAAgB,MAAQF,EAAM,YACrD,WAAW,IAAM,CACfI,EAAe,MAAQ,IACtB,GAAI,EACP,OAAMI,EAAAR,EAAM,UAAN,YAAAQ,EAAA,KAAAR,IACNE,EAAgB,MAAQ,GAAA"}
1
+ {"version":3,"file":"ElButton.vue.cjs2.js","sources":["../../src/ElButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElButtonSize = (typeof elButtonSizes)[number];\n\nexport const elButtonVariants = ['primary', 'secondary', 'tertiary'] as const;\nexport type ElButtonVariant = (typeof elButtonVariants)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { ref, computed, ButtonHTMLAttributes } from 'vue';\n\nexport interface ElButtonProps {\n disabled?: boolean;\n dark?: boolean;\n loading?: boolean;\n icon?: ElIconProps;\n iconRight?: boolean;\n error?: boolean;\n label: string;\n size?: ElButtonSize;\n variant?: ElButtonVariant;\n type?: ButtonHTMLAttributes['type'];\n loadOnClick?: boolean;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ElButtonProps>(), {\n disabled: false,\n dark: false,\n loading: false,\n error: false,\n label: '',\n icon: undefined,\n size: 'base',\n variant: 'primary',\n type: 'button',\n loadOnClick: false,\n onClick: undefined,\n});\n\nconst callbackLoading = ref<boolean>(false);\nconst defaultLoading = ref<boolean>(false);\nconst computedLoading = computed(() => callbackLoading.value || defaultLoading.value || props.loading);\n\nconst onClick = async () => {\n if (callbackLoading.value || computedLoading.value) return;\n defaultLoading.value = callbackLoading.value = props.loadOnClick;\n setTimeout(() => {\n defaultLoading.value = false;\n }, 3000);\n await props.onClick?.();\n callbackLoading.value = false;\n};\n</script>\n\n<template>\n <button\n :disabled=\"disabled || loading\"\n :type=\"type\"\n class=\"inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out\"\n :class=\"{\n 'h-6 rounded text-xs': size === 'xs',\n 'h-7 rounded text-xs': size === 'sm',\n 'h-8 rounded-md text-sm': size === 'base',\n 'text-base h-10 rounded-md ': size === 'l',\n 'text-base h-12 rounded-md ': size === 'xl',\n 'cursor-pointer': !computedLoading && !disabled,\n 'cursor-wait': computedLoading && !disabled,\n 'px-4': variant !== 'tertiary' && (size === 'base' || size === 'l' || size === 'xl'),\n 'px-3': (variant !== 'tertiary' && (size === 'sm' || size === 'xs')) || (variant === 'tertiary' && (size === 'l' || size === 'xl')),\n 'px-2': variant === 'tertiary' && (size === 'xs' || size === 'sm' || size === 'base'),\n ...(dark\n ? {\n 'bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none':\n variant === 'primary' && !disabled,\n 'bg-alpha-100 text-alpha-400 cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none':\n variant === 'secondary' && !error && !disabled,\n 'text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none': variant === 'secondary' && disabled,\n 'bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none':\n variant === 'tertiary' && !error && !disabled,\n 'text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none': variant === 'tertiary' && disabled,\n }\n : {\n 'bg-primary hover:bg-primary-hover active:bg-primary-pressed active:outlined-primary text-white':\n variant === 'primary' && !error && !disabled,\n 'bg-error hover:bg-error-hover active:bg-error-pressed active:outlined-error text-white':\n variant === 'primary' && error && !disabled,\n 'bg-neutral-inactive text-neutral-inactive cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover active:text-primary-pressed active:bg-primary-light active:border-primary-pressed text-primary active:outlined-primary':\n variant === 'secondary' && !error && !disabled,\n 'border-error text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border bg-white':\n variant === 'secondary' && error && !disabled,\n 'text-neutral-inactive border-neutral-inactive cursor-not-allowed border': variant === 'secondary' && disabled,\n 'text-primary hover:text-primary-hover hover:bg-primary-light-hover active:text-primary-pressed active:bg-primary-light-pressed active:outlined-primary border-none bg-transparent':\n variant === 'tertiary' && !error && !disabled,\n 'text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border-none':\n variant === 'tertiary' && error && !disabled,\n 'text-neutral-inactive cursor-not-allowed border-none bg-transparent': variant === 'tertiary' && disabled,\n }),\n }\"\n :data-cy=\"`${label.trim()?.replaceAll(' ', '').replaceAll(',', '')}-button`\"\n @click=\"onClick\"\n >\n <span v-if=\"!computedLoading\" class=\"inline-flex items-center\" :class=\"iconRight ? 'flex-row-reverse' : 'flex-row'\">\n <ElIcon\n v-if=\"icon\"\n :name=\"icon.name\"\n :solid=\"icon.solid\"\n :class=\"{\n 'h-[14px] w-[14px]': size === 'xs',\n 'h-4 w-4': size === 'sm',\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l' || size === 'xl',\n }\"\n />\n <span\n v-if=\"icon && label !== ''\"\n :class=\"{\n 'w-1': size === 'xs',\n 'w-2': size === 'sm' || size === 'base',\n 'w-3': size === 'l' || size === 'xl',\n }\"\n ></span>\n <span class=\"font-semibold\">{{ label }}</span>\n </span>\n <span v-else class=\"inline-flex items-center\">\n <svg\n class=\"animate-spin\"\n :class=\"{\n 'mr-1 h-[14px] w-[14px]': size === 'xs',\n 'mr-2 h-4 w-4': size === 'sm',\n 'mr-2 h-5 w-5': size === 'base',\n 'mr-3 h-6 w-6': size === 'l' || 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 class=\"font-semibold\">Un attimo...</span>\n </span>\n </button>\n</template>\n"],"names":["elButtonSizes","elButtonVariants","props","__props","callbackLoading","ref","defaultLoading","computedLoading","computed","onClick","_a"],"mappings":"6pBACaA,EAAgB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,EAG9CC,EAAmB,CAAC,UAAW,YAAa,UAAU,uZAuBnE,MAAMC,EAAQC,EAcRC,EAAkBC,MAAa,EAAK,EACpCC,EAAiBD,MAAa,EAAK,EACnCE,EAAkBC,WAAS,IAAMJ,EAAgB,OAASE,EAAe,OAASJ,EAAM,OAAO,EAE/FO,EAAU,SAAY,OACtBL,EAAgB,OAASG,EAAgB,QAC9BD,EAAA,MAAQF,EAAgB,MAAQF,EAAM,YACrD,WAAW,IAAM,CACfI,EAAe,MAAQ,IACtB,GAAI,EACP,OAAMI,EAAAR,EAAM,UAAN,YAAAQ,EAAA,KAAAR,IACNE,EAAgB,MAAQ,GAAA"}
@@ -1,2 +1,2 @@
1
- import{defineComponent as m,ref as u,computed as y,openBlock as r,createElementBlock as o,normalizeClass as s,createBlock as f,createCommentVNode as p,createElementVNode as n,toDisplayString as v}from"vue";import g from"./ElIcon.vue.esm2.js";const z=["disabled","type","data-cy"],w={class:"font-semibold"},c={key:1,class:"inline-flex items-center"},k=n("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),B=n("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],V=n("span",{class:"font-semibold"},"Un attimo...",-1),N=["xs","sm","base","l","xl"],O=["primary","secondary","tertiary"],R=m({__name:"ElButton",props:{disabled:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{default:void 0},iconRight:{type:Boolean},error:{type:Boolean,default:!1},label:{default:""},size:{default:"base"},variant:{default:"primary"},type:{default:"button"},loadOnClick:{type:Boolean,default:!1},onClick:{type:Function,default:void 0}},setup(b){const a=b,i=u(!1),t=u(!1),l=y(()=>i.value||t.value||a.loading),h=async()=>{var e;i.value||l.value||(t.value=i.value=a.loadOnClick,setTimeout(()=>{t.value=!1},3e3),await((e=a.onClick)==null?void 0:e.call(a)),i.value=!1)};return(e,A)=>{var d;return r(),o("button",{disabled:e.disabled||e.loading,type:e.type,class:s(["inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out",{"h-6 rounded text-xs":e.size==="xs","h-7 rounded text-xs":e.size==="sm","h-8 rounded-md text-sm":e.size==="base","text-base h-10 rounded-md ":e.size==="l","text-base h-12 rounded-md ":e.size==="xl","cursor-pointer":!l.value&&!e.disabled,"cursor-wait":l.value&&!e.disabled,"px-4":e.variant!=="tertiary"&&(e.size==="base"||e.size==="l"||e.size==="xl"),"px-3":e.variant!=="tertiary"&&(e.size==="sm"||e.size==="xs")||e.variant==="tertiary"&&(e.size==="l"||e.size==="xl"),"px-2":e.variant==="tertiary"&&(e.size==="xs"||e.size==="sm"||e.size==="base"),...e.dark?{"bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none":e.variant==="primary"&&!e.disabled,"bg-alpha-100 text-alpha-400 cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none":e.variant==="secondary"&&!e.error&&!e.disabled,"text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none":e.variant==="secondary"&&e.disabled,"bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none":e.variant==="tertiary"&&e.disabled}:{"bg-primary hover:bg-primary-hover focus:bg-primary-pressed focus:outlined-primary text-white":e.variant==="primary"&&!e.error&&!e.disabled,"bg-error hover:bg-error-hover focus:bg-error-pressed focus:outlined-error text-white":e.variant==="primary"&&e.error&&!e.disabled,"bg-neutral-inactive text-neutral-inactive cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover focus:text-primary-pressed focus:bg-primary-light focus:border-primary-pressed text-primary focus:outlined-primary":e.variant==="secondary"&&!e.error&&!e.disabled,"border-error text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border bg-white":e.variant==="secondary"&&e.error&&!e.disabled,"text-neutral-inactive border-neutral-inactive cursor-not-allowed border":e.variant==="secondary"&&e.disabled,"text-primary hover:text-primary-hover hover:bg-primary-light-hover focus:text-primary-pressed focus:bg-primary-light-pressed focus:outlined-primary border-none bg-transparent":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border-none":e.variant==="tertiary"&&e.error&&!e.disabled,"text-neutral-inactive cursor-not-allowed border-none bg-transparent":e.variant==="tertiary"&&e.disabled}}]),"data-cy":`${(d=e.label.trim())==null?void 0:d.replaceAll(" ","").replaceAll(",","")}-button`,onClick:h},[l.value?(r(),o("span",c,[(r(),o("svg",{class:s(["animate-spin",{"mr-1 h-[14px] w-[14px]":e.size==="xs","mr-2 h-4 w-4":e.size==="sm","mr-2 h-5 w-5":e.size==="base","mr-3 h-6 w-6":e.size==="l"||e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},C,2)),V])):(r(),o("span",{key:0,class:s(["inline-flex items-center",e.iconRight?"flex-row-reverse":"flex-row"])},[e.icon?(r(),f(g,{key:0,name:e.icon.name,solid:e.icon.solid,class:s({"h-[14px] w-[14px]":e.size==="xs","h-4 w-4":e.size==="sm","h-5 w-5":e.size==="base","h-6 w-6":e.size==="l"||e.size==="xl"})},null,8,["name","solid","class"])):p("",!0),e.icon&&e.label!==""?(r(),o("span",{key:1,class:s({"w-1":e.size==="xs","w-2":e.size==="sm"||e.size==="base","w-3":e.size==="l"||e.size==="xl"})},null,2)):p("",!0),n("span",w,v(e.label),1)],2))],10,z)}}});export{R as default,N as elButtonSizes,O as elButtonVariants};
1
+ import{defineComponent as h,ref as p,computed as m,openBlock as r,createElementBlock as i,normalizeClass as o,createBlock as y,createCommentVNode as b,createElementVNode as n,toDisplayString as g}from"vue";import f from"./ElIcon.vue.esm2.js";const z=["disabled","type","data-cy"],w={class:"font-semibold"},c={key:1,class:"inline-flex items-center"},k=n("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor","stroke-width":"4"},null,-1),B=n("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],V=n("span",{class:"font-semibold"},"Un attimo...",-1),N=["xs","sm","base","l","xl"],O=["primary","secondary","tertiary"],R=h({__name:"ElButton",props:{disabled:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},icon:{default:void 0},iconRight:{type:Boolean},error:{type:Boolean,default:!1},label:{default:""},size:{default:"base"},variant:{default:"primary"},type:{default:"button"},loadOnClick:{type:Boolean,default:!1},onClick:{type:Function,default:void 0}},setup(u){const a=u,s=p(!1),t=p(!1),l=m(()=>s.value||t.value||a.loading),v=async()=>{var e;s.value||l.value||(t.value=s.value=a.loadOnClick,setTimeout(()=>{t.value=!1},3e3),await((e=a.onClick)==null?void 0:e.call(a)),s.value=!1)};return(e,A)=>{var d;return r(),i("button",{disabled:e.disabled||e.loading,type:e.type,class:o(["inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out",{"h-6 rounded text-xs":e.size==="xs","h-7 rounded text-xs":e.size==="sm","h-8 rounded-md text-sm":e.size==="base","text-base h-10 rounded-md ":e.size==="l","text-base h-12 rounded-md ":e.size==="xl","cursor-pointer":!l.value&&!e.disabled,"cursor-wait":l.value&&!e.disabled,"px-4":e.variant!=="tertiary"&&(e.size==="base"||e.size==="l"||e.size==="xl"),"px-3":e.variant!=="tertiary"&&(e.size==="sm"||e.size==="xs")||e.variant==="tertiary"&&(e.size==="l"||e.size==="xl"),"px-2":e.variant==="tertiary"&&(e.size==="xs"||e.size==="sm"||e.size==="base"),...e.dark?{"bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none":e.variant==="primary"&&!e.disabled,"bg-alpha-100 text-alpha-400 cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none":e.variant==="secondary"&&!e.error&&!e.disabled,"text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none":e.variant==="secondary"&&e.disabled,"bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none":e.variant==="tertiary"&&e.disabled}:{"bg-primary hover:bg-primary-hover active:bg-primary-pressed active:outlined-primary text-white":e.variant==="primary"&&!e.error&&!e.disabled,"bg-error hover:bg-error-hover active:bg-error-pressed active:outlined-error text-white":e.variant==="primary"&&e.error&&!e.disabled,"bg-neutral-inactive text-neutral-inactive cursor-not-allowed":e.variant==="primary"&&e.disabled,"bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover active:text-primary-pressed active:bg-primary-light active:border-primary-pressed text-primary active:outlined-primary":e.variant==="secondary"&&!e.error&&!e.disabled,"border-error text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border bg-white":e.variant==="secondary"&&e.error&&!e.disabled,"text-neutral-inactive border-neutral-inactive cursor-not-allowed border":e.variant==="secondary"&&e.disabled,"text-primary hover:text-primary-hover hover:bg-primary-light-hover active:text-primary-pressed active:bg-primary-light-pressed active:outlined-primary border-none bg-transparent":e.variant==="tertiary"&&!e.error&&!e.disabled,"text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border-none":e.variant==="tertiary"&&e.error&&!e.disabled,"text-neutral-inactive cursor-not-allowed border-none bg-transparent":e.variant==="tertiary"&&e.disabled}}]),"data-cy":`${(d=e.label.trim())==null?void 0:d.replaceAll(" ","").replaceAll(",","")}-button`,onClick:v},[l.value?(r(),i("span",c,[(r(),i("svg",{class:o(["animate-spin",{"mr-1 h-[14px] w-[14px]":e.size==="xs","mr-2 h-4 w-4":e.size==="sm","mr-2 h-5 w-5":e.size==="base","mr-3 h-6 w-6":e.size==="l"||e.size==="xl"}]),xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},C,2)),V])):(r(),i("span",{key:0,class:o(["inline-flex items-center",e.iconRight?"flex-row-reverse":"flex-row"])},[e.icon?(r(),y(f,{key:0,name:e.icon.name,solid:e.icon.solid,class:o({"h-[14px] w-[14px]":e.size==="xs","h-4 w-4":e.size==="sm","h-5 w-5":e.size==="base","h-6 w-6":e.size==="l"||e.size==="xl"})},null,8,["name","solid","class"])):b("",!0),e.icon&&e.label!==""?(r(),i("span",{key:1,class:o({"w-1":e.size==="xs","w-2":e.size==="sm"||e.size==="base","w-3":e.size==="l"||e.size==="xl"})},null,2)):b("",!0),n("span",w,g(e.label),1)],2))],10,z)}}});export{R as default,N as elButtonSizes,O as elButtonVariants};
2
2
  //# sourceMappingURL=ElButton.vue.esm2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElButton.vue.esm2.js","sources":["../../src/ElButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElButtonSize = (typeof elButtonSizes)[number];\n\nexport const elButtonVariants = ['primary', 'secondary', 'tertiary'] as const;\nexport type ElButtonVariant = (typeof elButtonVariants)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { ref, computed, ButtonHTMLAttributes } from 'vue';\n\nexport interface ElButtonProps {\n disabled?: boolean;\n dark?: boolean;\n loading?: boolean;\n icon?: ElIconProps;\n iconRight?: boolean;\n error?: boolean;\n label: string;\n size?: ElButtonSize;\n variant?: ElButtonVariant;\n type?: ButtonHTMLAttributes['type'];\n loadOnClick?: boolean;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ElButtonProps>(), {\n disabled: false,\n dark: false,\n loading: false,\n error: false,\n label: '',\n icon: undefined,\n size: 'base',\n variant: 'primary',\n type: 'button',\n loadOnClick: false,\n onClick: undefined,\n});\n\nconst callbackLoading = ref<boolean>(false);\nconst defaultLoading = ref<boolean>(false);\nconst computedLoading = computed(() => callbackLoading.value || defaultLoading.value || props.loading);\n\nconst onClick = async () => {\n if (callbackLoading.value || computedLoading.value) return;\n defaultLoading.value = callbackLoading.value = props.loadOnClick;\n setTimeout(() => {\n defaultLoading.value = false;\n }, 3000);\n await props.onClick?.();\n callbackLoading.value = false;\n};\n</script>\n\n<template>\n <button\n :disabled=\"disabled || loading\"\n :type=\"type\"\n class=\"inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out\"\n :class=\"{\n 'h-6 rounded text-xs': size === 'xs',\n 'h-7 rounded text-xs': size === 'sm',\n 'h-8 rounded-md text-sm': size === 'base',\n 'text-base h-10 rounded-md ': size === 'l',\n 'text-base h-12 rounded-md ': size === 'xl',\n 'cursor-pointer': !computedLoading && !disabled,\n 'cursor-wait': computedLoading && !disabled,\n 'px-4': variant !== 'tertiary' && (size === 'base' || size === 'l' || size === 'xl'),\n 'px-3': (variant !== 'tertiary' && (size === 'sm' || size === 'xs')) || (variant === 'tertiary' && (size === 'l' || size === 'xl')),\n 'px-2': variant === 'tertiary' && (size === 'xs' || size === 'sm' || size === 'base'),\n ...(dark\n ? {\n 'bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none':\n variant === 'primary' && !disabled,\n 'bg-alpha-100 text-alpha-400 cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none':\n variant === 'secondary' && !error && !disabled,\n 'text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none': variant === 'secondary' && disabled,\n 'bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none':\n variant === 'tertiary' && !error && !disabled,\n 'text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none': variant === 'tertiary' && disabled,\n }\n : {\n 'bg-primary hover:bg-primary-hover focus:bg-primary-pressed focus:outlined-primary text-white':\n variant === 'primary' && !error && !disabled,\n 'bg-error hover:bg-error-hover focus:bg-error-pressed focus:outlined-error text-white':\n variant === 'primary' && error && !disabled,\n 'bg-neutral-inactive text-neutral-inactive cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover focus:text-primary-pressed focus:bg-primary-light focus:border-primary-pressed text-primary focus:outlined-primary':\n variant === 'secondary' && !error && !disabled,\n 'border-error text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border bg-white':\n variant === 'secondary' && error && !disabled,\n 'text-neutral-inactive border-neutral-inactive cursor-not-allowed border': variant === 'secondary' && disabled,\n 'text-primary hover:text-primary-hover hover:bg-primary-light-hover focus:text-primary-pressed focus:bg-primary-light-pressed focus:outlined-primary border-none bg-transparent':\n variant === 'tertiary' && !error && !disabled,\n 'text-error hover:bg-error-light-hover focus:bg-error-light-pressed focus:outlined-error border-none':\n variant === 'tertiary' && error && !disabled,\n 'text-neutral-inactive cursor-not-allowed border-none bg-transparent': variant === 'tertiary' && disabled,\n }),\n }\"\n :data-cy=\"`${label.trim()?.replaceAll(' ', '').replaceAll(',', '')}-button`\"\n @click=\"onClick\"\n >\n <span v-if=\"!computedLoading\" class=\"inline-flex items-center\" :class=\"iconRight ? 'flex-row-reverse' : 'flex-row'\">\n <ElIcon\n v-if=\"icon\"\n :name=\"icon.name\"\n :solid=\"icon.solid\"\n :class=\"{\n 'h-[14px] w-[14px]': size === 'xs',\n 'h-4 w-4': size === 'sm',\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l' || size === 'xl',\n }\"\n />\n <span\n v-if=\"icon && label !== ''\"\n :class=\"{\n 'w-1': size === 'xs',\n 'w-2': size === 'sm' || size === 'base',\n 'w-3': size === 'l' || size === 'xl',\n }\"\n ></span>\n <span class=\"font-semibold\">{{ label }}</span>\n </span>\n <span v-else class=\"inline-flex items-center\">\n <svg\n class=\"animate-spin\"\n :class=\"{\n 'mr-1 h-[14px] w-[14px]': size === 'xs',\n 'mr-2 h-4 w-4': size === 'sm',\n 'mr-2 h-5 w-5': size === 'base',\n 'mr-3 h-6 w-6': size === 'l' || 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 class=\"font-semibold\">Un attimo...</span>\n </span>\n </button>\n</template>\n"],"names":["elButtonSizes","elButtonVariants","props","__props","callbackLoading","ref","defaultLoading","computedLoading","computed","onClick","_a"],"mappings":"urBACaA,EAAgB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,EAG9CC,EAAmB,CAAC,UAAW,YAAa,UAAU,uYAuBnE,MAAMC,EAAQC,EAcRC,EAAkBC,EAAa,EAAK,EACpCC,EAAiBD,EAAa,EAAK,EACnCE,EAAkBC,EAAS,IAAMJ,EAAgB,OAASE,EAAe,OAASJ,EAAM,OAAO,EAE/FO,EAAU,SAAY,OACtBL,EAAgB,OAASG,EAAgB,QAC9BD,EAAA,MAAQF,EAAgB,MAAQF,EAAM,YACrD,WAAW,IAAM,CACfI,EAAe,MAAQ,IACtB,GAAI,EACP,OAAMI,EAAAR,EAAM,UAAN,YAAAQ,EAAA,KAAAR,IACNE,EAAgB,MAAQ,GAAA"}
1
+ {"version":3,"file":"ElButton.vue.esm2.js","sources":["../../src/ElButton.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elButtonSizes = ['xs', 'sm', 'base', 'l', 'xl'] as const;\nexport type ElButtonSize = (typeof elButtonSizes)[number];\n\nexport const elButtonVariants = ['primary', 'secondary', 'tertiary'] as const;\nexport type ElButtonVariant = (typeof elButtonVariants)[number];\n</script>\n\n<script setup lang=\"ts\">\nimport ElIcon, { ElIconProps } from '@/ElIcon.vue';\nimport { ref, computed, ButtonHTMLAttributes } from 'vue';\n\nexport interface ElButtonProps {\n disabled?: boolean;\n dark?: boolean;\n loading?: boolean;\n icon?: ElIconProps;\n iconRight?: boolean;\n error?: boolean;\n label: string;\n size?: ElButtonSize;\n variant?: ElButtonVariant;\n type?: ButtonHTMLAttributes['type'];\n loadOnClick?: boolean;\n onClick?: (() => unknown) | (() => Promise<unknown>);\n}\n\nconst props = withDefaults(defineProps<ElButtonProps>(), {\n disabled: false,\n dark: false,\n loading: false,\n error: false,\n label: '',\n icon: undefined,\n size: 'base',\n variant: 'primary',\n type: 'button',\n loadOnClick: false,\n onClick: undefined,\n});\n\nconst callbackLoading = ref<boolean>(false);\nconst defaultLoading = ref<boolean>(false);\nconst computedLoading = computed(() => callbackLoading.value || defaultLoading.value || props.loading);\n\nconst onClick = async () => {\n if (callbackLoading.value || computedLoading.value) return;\n defaultLoading.value = callbackLoading.value = props.loadOnClick;\n setTimeout(() => {\n defaultLoading.value = false;\n }, 3000);\n await props.onClick?.();\n callbackLoading.value = false;\n};\n</script>\n\n<template>\n <button\n :disabled=\"disabled || loading\"\n :type=\"type\"\n class=\"inline-flex items-center justify-center py-0 font-semibold leading-4 transition duration-150 ease-in-out\"\n :class=\"{\n 'h-6 rounded text-xs': size === 'xs',\n 'h-7 rounded text-xs': size === 'sm',\n 'h-8 rounded-md text-sm': size === 'base',\n 'text-base h-10 rounded-md ': size === 'l',\n 'text-base h-12 rounded-md ': size === 'xl',\n 'cursor-pointer': !computedLoading && !disabled,\n 'cursor-wait': computedLoading && !disabled,\n 'px-4': variant !== 'tertiary' && (size === 'base' || size === 'l' || size === 'xl'),\n 'px-3': (variant !== 'tertiary' && (size === 'sm' || size === 'xs')) || (variant === 'tertiary' && (size === 'l' || size === 'xl')),\n 'px-2': variant === 'tertiary' && (size === 'xs' || size === 'sm' || size === 'base'),\n ...(dark\n ? {\n 'bg-alpha-200 text-white hover:bg-alpha-300 focus:bg-alpha-300 focus:border focus:border-alpha-400 focus:outline-none':\n variant === 'primary' && !disabled,\n 'bg-alpha-100 text-alpha-400 cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-black border border-alpha-500 hover:bg-alpha-100 focus:bg-alpha-100 text-white focus:outline-none':\n variant === 'secondary' && !error && !disabled,\n 'text-alpha-400 bg-alpha-100 cursor-not-allowed focus:outline-none': variant === 'secondary' && disabled,\n 'bg-transparent hover:bg-alpha-100 focus:bg-alpha-100 border-none text-white focus:outline-none':\n variant === 'tertiary' && !error && !disabled,\n 'text-alpha-400 cursor-not-allowed border-none bg-transparent focus:outline-none': variant === 'tertiary' && disabled,\n }\n : {\n 'bg-primary hover:bg-primary-hover active:bg-primary-pressed active:outlined-primary text-white':\n variant === 'primary' && !error && !disabled,\n 'bg-error hover:bg-error-hover active:bg-error-pressed active:outlined-error text-white':\n variant === 'primary' && error && !disabled,\n 'bg-neutral-inactive text-neutral-inactive cursor-not-allowed': variant === 'primary' && disabled,\n 'bg-white border border-primary hover:border-primary-hover hover:bg-primary-light-hover hover:text-primary-hover active:text-primary-pressed active:bg-primary-light active:border-primary-pressed text-primary active:outlined-primary':\n variant === 'secondary' && !error && !disabled,\n 'border-error text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border bg-white':\n variant === 'secondary' && error && !disabled,\n 'text-neutral-inactive border-neutral-inactive cursor-not-allowed border': variant === 'secondary' && disabled,\n 'text-primary hover:text-primary-hover hover:bg-primary-light-hover active:text-primary-pressed active:bg-primary-light-pressed active:outlined-primary border-none bg-transparent':\n variant === 'tertiary' && !error && !disabled,\n 'text-error hover:bg-error-light-hover active:bg-error-light-pressed active:outlined-error border-none':\n variant === 'tertiary' && error && !disabled,\n 'text-neutral-inactive cursor-not-allowed border-none bg-transparent': variant === 'tertiary' && disabled,\n }),\n }\"\n :data-cy=\"`${label.trim()?.replaceAll(' ', '').replaceAll(',', '')}-button`\"\n @click=\"onClick\"\n >\n <span v-if=\"!computedLoading\" class=\"inline-flex items-center\" :class=\"iconRight ? 'flex-row-reverse' : 'flex-row'\">\n <ElIcon\n v-if=\"icon\"\n :name=\"icon.name\"\n :solid=\"icon.solid\"\n :class=\"{\n 'h-[14px] w-[14px]': size === 'xs',\n 'h-4 w-4': size === 'sm',\n 'h-5 w-5': size === 'base',\n 'h-6 w-6': size === 'l' || size === 'xl',\n }\"\n />\n <span\n v-if=\"icon && label !== ''\"\n :class=\"{\n 'w-1': size === 'xs',\n 'w-2': size === 'sm' || size === 'base',\n 'w-3': size === 'l' || size === 'xl',\n }\"\n ></span>\n <span class=\"font-semibold\">{{ label }}</span>\n </span>\n <span v-else class=\"inline-flex items-center\">\n <svg\n class=\"animate-spin\"\n :class=\"{\n 'mr-1 h-[14px] w-[14px]': size === 'xs',\n 'mr-2 h-4 w-4': size === 'sm',\n 'mr-2 h-5 w-5': size === 'base',\n 'mr-3 h-6 w-6': size === 'l' || 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 class=\"font-semibold\">Un attimo...</span>\n </span>\n </button>\n</template>\n"],"names":["elButtonSizes","elButtonVariants","props","__props","callbackLoading","ref","defaultLoading","computedLoading","computed","onClick","_a"],"mappings":"urBACaA,EAAgB,CAAC,KAAM,KAAM,OAAQ,IAAK,IAAI,EAG9CC,EAAmB,CAAC,UAAW,YAAa,UAAU,uYAuBnE,MAAMC,EAAQC,EAcRC,EAAkBC,EAAa,EAAK,EACpCC,EAAiBD,EAAa,EAAK,EACnCE,EAAkBC,EAAS,IAAMJ,EAAgB,OAASE,EAAe,OAASJ,EAAM,OAAO,EAE/FO,EAAU,SAAY,OACtBL,EAAgB,OAASG,EAAgB,QAC9BD,EAAA,MAAQF,EAAgB,MAAQF,EAAM,YACrD,WAAW,IAAM,CACfI,EAAe,MAAQ,IACtB,GAAI,EACP,OAAMI,EAAAR,EAAM,UAAN,YAAAQ,EAAA,KAAAR,IACNE,EAAgB,MAAQ,GAAA"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("../node_modules/swiper/modules/keyboard.cjs.js"),f=require("../node_modules/swiper/modules/navigation.cjs.js"),p=require("../node_modules/swiper/modules/pagination.cjs.js"),u=require("../node_modules/swiper/swiper-vue.cjs.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 g=require("./ElButton.vue.cjs2.js");require("./forms/ElInputText.vue.cjs2.js");const o=require("./utils.cjs.js"),n=require("./ElIconButton.vue.cjs2.js");require("./forms/ElInputCheckbox.vue.cjs2.js");require("./forms/ElInputDate.vue.cjs2.js");require("./forms/ElInputFile.vue.cjs2.js");require("./forms/ElInputMeasureUnit.vue.cjs2.js");require("./forms/ElInputNumber.vue.cjs2.js");require("./forms/ElInputPhone.vue.cjs2.js");require("./forms/ElInputSelect.vue.cjs2.js");require("./forms/ElInputTextarea.vue.cjs2.js");require("./ElToast.vue.cjs2.js");require("./forms/ElInputRadioButton.vue.cjs2.js");;/* empty css */;/* empty css */require("./forms/ElInputSearch.vue.cjs2.js");const v={key:0,class:"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl"},w={class:"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl"},q={class:"py-2 md:py-3 lg:py-4"},x={class:"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between"},b={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},y={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},z=["sm","md","lg"],h=e.defineComponent({__name:"ElCarousel",props:{size:{},slides:{},opacity:{type:Boolean}},setup(_){const a=o.useMatchDevice(),d=e.computed(()=>{switch(a.value){case o.Device.Desktop:return"xl";case o.Device.Tablet:return"l";default:return"sm"}}),s=e.ref(),c=e.ref([f.default,p.default,m.default]);return(t,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["w-full relative",{"max-w-2xl":t.size==="md","max-w-7xl":t.size==="lg"}])},[e.createVNode(e.unref(u.Swiper),{"space-between":30,"slides-per-view":1,keyboard:{enabled:!0},pagination:{clickable:!0},loop:!0,navigation:!0,modules:c.value,class:"",onSwiper:i[0]||(i[0]=r=>s.value=r)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.slides,(r,l)=>(e.openBlock(),e.createBlock(e.unref(u.SwiperSlide),{key:l},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24",{"justify-end items-end h-auto":t.size==="sm","h-96":t.size==="md","h-auto":t.size==="lg"}]),style:e.normalizeStyle({backgroundImage:"url("+r.picture+")"})},[t.opacity?(e.openBlock(),e.createElementBlock("div",v)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl",{"w-full":t.size==="sm","max-w-80":t.size==="md","max-w-96":t.size==="lg"}])},[e.createElementVNode("h1",w,e.toDisplayString(r.title),1),e.createElementVNode("p",{class:e.normalizeClass(["text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96",{"w-full":t.size==="sm","w-80 max-w-80":t.size==="md","w-96 max-w-96":t.size==="lg"}])},e.toDisplayString(r.description),3),e.createElementVNode("div",q,[e.createVNode(e.unref(g.default),e.mergeProps({ref_for:!0},r.button,{size:d.value}),null,16,["size"])])],2)],6)]),_:2},1024))),128))]),_:1},8,["modules"]),e.createElementVNode("div",x,[e.createElementVNode("div",b,[e.createVNode(e.unref(n.default),{icon:{name:"ArrowSmallLeftIcon"},onClick:i[1]||(i[1]=r=>{var l;return(l=s.value)==null?void 0:l.slidePrev()})})]),e.createElementVNode("div",y,[e.createVNode(e.unref(n.default),{icon:{name:"ArrowSmallRightIcon"},onClick:i[2]||(i[2]=r=>{var l;return(l=s.value)==null?void 0:l.slideNext()})})])])],2))}});exports.default=h;exports.elCarouselSizes=z;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m=require("../node_modules/swiper/modules/keyboard.cjs.js"),f=require("../node_modules/swiper/modules/navigation.cjs.js"),p=require("../node_modules/swiper/modules/pagination.cjs.js"),n=require("../node_modules/swiper/swiper-vue.cjs.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 g=require("./ElButton.vue.cjs2.js");require("./forms/ElInputText.vue.cjs2.js");const o=require("./utils.cjs.js"),u=require("./ElIconButton.vue.cjs2.js");require("./forms/ElInputCheckbox.vue.cjs2.js");require("./forms/ElInputDate.vue.cjs2.js");require("./forms/ElInputFile.vue.cjs2.js");require("./forms/ElInputMeasureUnit.vue.cjs2.js");require("./forms/ElInputNumber.vue.cjs2.js");require("./forms/ElInputPhone.vue.cjs2.js");require("./forms/ElInputSelect.vue.cjs2.js");require("./forms/ElInputTextarea.vue.cjs2.js");require("./ElToast.vue.cjs2.js");require("./forms/ElInputRadioButton.vue.cjs2.js");;/* empty css */;/* empty css */require("./forms/ElInputSearch.vue.cjs2.js");const v={key:0,class:"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl"},w={class:"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl"},q={class:"py-2 md:py-3 lg:py-4"},b={key:0,class:"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between"},x={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},y={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},z=["sm","md","lg"],h=e.defineComponent({__name:"ElCarousel",props:{size:{},slides:{},opacity:{type:Boolean}},setup(k){const a=o.useMatchDevice(),d=e.computed(()=>{switch(a.value){case o.Device.Desktop:return"xl";case o.Device.Tablet:return"l";default:return"sm"}}),i=e.ref(),c=e.ref([f.default,p.default,m.default]);return(t,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["w-full relative",{"max-w-2xl":t.size==="md","max-w-7xl":t.size==="lg"}])},[e.createVNode(e.unref(n.Swiper),{"space-between":30,"slides-per-view":1,keyboard:{enabled:!0},pagination:{clickable:!0},loop:!0,navigation:!0,modules:c.value,class:"",onSwiper:s[0]||(s[0]=r=>i.value=r)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.slides,(r,l)=>(e.openBlock(),e.createBlock(e.unref(n.SwiperSlide),{key:l},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24",{"justify-end items-end h-auto":t.size==="sm","h-96":t.size==="md","h-auto":t.size==="lg"}]),style:e.normalizeStyle({backgroundImage:"url("+r.picture+")"})},[t.opacity?(e.openBlock(),e.createElementBlock("div",v)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl",{"w-full":t.size==="sm","max-w-80":t.size==="md","max-w-96":t.size==="lg"}])},[e.createElementVNode("h1",w,e.toDisplayString(r.title),1),e.createElementVNode("p",{class:e.normalizeClass(["text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96",{"w-full":t.size==="sm","w-80 max-w-80":t.size==="md","w-96 max-w-96":t.size==="lg"}])},e.toDisplayString(r.description),3),e.createElementVNode("div",q,[e.createVNode(e.unref(g.default),e.mergeProps({ref_for:!0},r.button,{size:d.value}),null,16,["size"])])],2)],6)]),_:2},1024))),128))]),_:1},8,["modules"]),t.slides.length>1?(e.openBlock(),e.createElementBlock("div",b,[e.createElementVNode("div",x,[e.createVNode(e.unref(u.default),{icon:{name:"ArrowSmallLeftIcon"},onClick:s[1]||(s[1]=r=>{var l;return(l=i.value)==null?void 0:l.slidePrev()})})]),e.createElementVNode("div",y,[e.createVNode(e.unref(u.default),{icon:{name:"ArrowSmallRightIcon"},onClick:s[2]||(s[2]=r=>{var l;return(l=i.value)==null?void 0:l.slideNext()})})])])):e.createCommentVNode("",!0)],2))}});exports.default=h;exports.elCarouselSizes=z;
2
2
  //# sourceMappingURL=ElCarousel.vue.cjs2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElCarousel.vue.cjs2.js","sources":["../../src/ElCarousel.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCarouselSizes = ['sm', 'md', 'lg'] as const;\nexport type ElCarouselSizes = (typeof elCarouselSizes)[number];\n\nexport interface CarouselProps {\n size?: ElCarouselSizes;\n slides: CarouselSlide[];\n opacity?: boolean;\n}\n\nexport interface CarouselSlide {\n title: string;\n description: string;\n picture: string;\n button: InstanceType<typeof ElButton>['$props'];\n}\n</script>\n\n<script lang=\"ts\" setup>\nimport { Keyboard, Navigation, Pagination } from 'swiper/modules';\nimport { Swiper, SwiperSlide } from 'swiper/vue';\nimport { ElButton, ElIconButton } from '.';\n\nimport 'swiper/css';\nimport 'swiper/css/pagination';\nimport { computed, ref } from 'vue';\nimport { Device, useMatchDevice } from './utils';\n\ndefineProps<CarouselProps>();\n\nconst device = useMatchDevice();\n\nconst buttonSize = computed(() => {\n switch (device.value) {\n case Device.Desktop:\n return 'xl';\n case Device.Tablet:\n return 'l';\n default:\n return 'sm';\n }\n});\n\nconst swiperInstance = ref();\nconst modules = ref([Navigation, Pagination, Keyboard]);\n</script>\n\n<template>\n <div\n class=\"w-full relative\"\n :class=\"{\n 'max-w-2xl': size === 'md',\n 'max-w-7xl': size === 'lg',\n }\"\n >\n <swiper\n :space-between=\"30\"\n :slides-per-view=\"1\"\n :keyboard=\"{\n enabled: true,\n }\"\n :pagination=\"{\n clickable: true,\n }\"\n :loop=\"true\"\n :navigation=\"true\"\n :modules=\"modules\"\n class=\"\"\n @swiper=\"swiperInstance = $event\"\n >\n <swiper-slide v-for=\"(slide, index) in slides\" :key=\"index\">\n <div\n class=\"flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24\"\n :style=\"{\n backgroundImage: 'url(' + slide.picture + ')',\n }\"\n :class=\"{\n 'justify-end items-end h-auto': size === 'sm',\n 'h-96': size === 'md',\n 'h-auto': size === 'lg',\n }\"\n >\n <div v-if=\"opacity\" class=\"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl\"></div>\n\n <div\n class=\"z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl\"\n :class=\"{\n 'w-full': size === 'sm',\n 'max-w-80': size === 'md',\n 'max-w-96': size === 'lg',\n }\"\n >\n <h1 class=\"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl\">\n {{ slide.title }}\n </h1>\n <p\n class=\"text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96\"\n :class=\"{\n 'w-full': size === 'sm',\n 'w-80 max-w-80': size === 'md',\n 'w-96 max-w-96': size === 'lg',\n }\"\n >\n {{ slide.description }}\n </p>\n <div class=\"py-2 md:py-3 lg:py-4\">\n <ElButton v-bind=\"slide.button\" :size=\"buttonSize\" />\n </div>\n </div>\n </div>\n </swiper-slide>\n </swiper>\n <div class=\"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between\">\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallLeftIcon' }\" @click=\"swiperInstance?.slidePrev()\" />\n </div>\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallRightIcon' }\" @click=\"swiperInstance?.slideNext()\" />\n </div>\n </div>\n </div>\n</template>\n"],"names":["elCarouselSizes","device","useMatchDevice","buttonSize","computed","Device","swiperInstance","ref","modules","Navigation","Pagination","Keyboard"],"mappings":"47DACaA,EAAkB,CAAC,KAAM,KAAM,IAAI,qGA6BhD,MAAMC,EAASC,EAAAA,iBAETC,EAAaC,EAAAA,SAAS,IAAM,CAChC,OAAQH,EAAO,MAAO,CACpB,KAAKI,EAAO,OAAA,QACH,MAAA,KACT,KAAKA,EAAO,OAAA,OACH,MAAA,IACT,QACS,MAAA,IACX,CAAA,CACD,EAEKC,EAAiBC,EAAAA,MACjBC,EAAUD,EAAAA,IAAI,CAACE,EAAY,QAAAC,EAAA,QAAYC,EAAQ,OAAA,CAAC"}
1
+ {"version":3,"file":"ElCarousel.vue.cjs2.js","sources":["../../src/ElCarousel.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCarouselSizes = ['sm', 'md', 'lg'] as const;\nexport type ElCarouselSizes = (typeof elCarouselSizes)[number];\n\nexport interface CarouselProps {\n size?: ElCarouselSizes;\n slides: CarouselSlide[];\n opacity?: boolean;\n}\n\nexport interface CarouselSlide {\n title: string;\n description: string;\n picture: string;\n button: InstanceType<typeof ElButton>['$props'];\n}\n</script>\n\n<script lang=\"ts\" setup>\nimport { Keyboard, Navigation, Pagination } from 'swiper/modules';\nimport { Swiper, SwiperSlide } from 'swiper/vue';\nimport { ElButton, ElIconButton } from '.';\n\nimport 'swiper/css';\nimport 'swiper/css/pagination';\nimport { computed, ref } from 'vue';\nimport { Device, useMatchDevice } from './utils';\n\ndefineProps<CarouselProps>();\n\nconst device = useMatchDevice();\n\nconst buttonSize = computed(() => {\n switch (device.value) {\n case Device.Desktop:\n return 'xl';\n case Device.Tablet:\n return 'l';\n default:\n return 'sm';\n }\n});\n\nconst swiperInstance = ref();\nconst modules = ref([Navigation, Pagination, Keyboard]);\n</script>\n\n<template>\n <div\n class=\"w-full relative\"\n :class=\"{\n 'max-w-2xl': size === 'md',\n 'max-w-7xl': size === 'lg',\n }\"\n >\n <swiper\n :space-between=\"30\"\n :slides-per-view=\"1\"\n :keyboard=\"{\n enabled: true,\n }\"\n :pagination=\"{\n clickable: true,\n }\"\n :loop=\"true\"\n :navigation=\"true\"\n :modules=\"modules\"\n class=\"\"\n @swiper=\"swiperInstance = $event\"\n >\n <swiper-slide v-for=\"(slide, index) in slides\" :key=\"index\">\n <div\n class=\"flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24\"\n :style=\"{\n backgroundImage: 'url(' + slide.picture + ')',\n }\"\n :class=\"{\n 'justify-end items-end h-auto': size === 'sm',\n 'h-96': size === 'md',\n 'h-auto': size === 'lg',\n }\"\n >\n <div v-if=\"opacity\" class=\"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl\"></div>\n\n <div\n class=\"z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl\"\n :class=\"{\n 'w-full': size === 'sm',\n 'max-w-80': size === 'md',\n 'max-w-96': size === 'lg',\n }\"\n >\n <h1 class=\"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl\">\n {{ slide.title }}\n </h1>\n <p\n class=\"text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96\"\n :class=\"{\n 'w-full': size === 'sm',\n 'w-80 max-w-80': size === 'md',\n 'w-96 max-w-96': size === 'lg',\n }\"\n >\n {{ slide.description }}\n </p>\n <div class=\"py-2 md:py-3 lg:py-4\">\n <ElButton v-bind=\"slide.button\" :size=\"buttonSize\" />\n </div>\n </div>\n </div>\n </swiper-slide>\n </swiper>\n <div v-if=\"slides.length > 1\" class=\"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between\">\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallLeftIcon' }\" @click=\"swiperInstance?.slidePrev()\" />\n </div>\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallRightIcon' }\" @click=\"swiperInstance?.slideNext()\" />\n </div>\n </div>\n </div>\n</template>\n"],"names":["elCarouselSizes","device","useMatchDevice","buttonSize","computed","Device","swiperInstance","ref","modules","Navigation","Pagination","Keyboard"],"mappings":"k8DACaA,EAAkB,CAAC,KAAM,KAAM,IAAI,qGA6BhD,MAAMC,EAASC,EAAAA,iBAETC,EAAaC,EAAAA,SAAS,IAAM,CAChC,OAAQH,EAAO,MAAO,CACpB,KAAKI,EAAO,OAAA,QACH,MAAA,KACT,KAAKA,EAAO,OAAA,OACH,MAAA,IACT,QACS,MAAA,IACX,CAAA,CACD,EAEKC,EAAiBC,EAAAA,MACjBC,EAAUD,EAAAA,IAAI,CAACE,EAAY,QAAAC,EAAA,QAAYC,EAAQ,OAAA,CAAC"}
@@ -1,2 +1,2 @@
1
- import{defineComponent as b,computed as y,ref as p,openBlock as s,createElementBlock as d,normalizeClass as m,createVNode as n,unref as r,withCtx as u,Fragment as z,renderList as h,createBlock as k,createElementVNode as o,normalizeStyle as S,createCommentVNode as C,toDisplayString as f,mergeProps as _}from"vue";import j from"../node_modules/swiper/modules/keyboard.esm.js";import N from"../node_modules/swiper/modules/navigation.esm.js";import B from"../node_modules/swiper/modules/pagination.esm.js";import{Swiper as D,SwiperSlide as I}from"../node_modules/swiper/swiper-vue.esm.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 $ from"./ElButton.vue.esm2.js";import"./forms/ElInputText.vue.esm2.js";import{useMatchDevice as E,Device as c}from"./utils.esm.js";import w from"./ElIconButton.vue.esm2.js";import"./forms/ElInputCheckbox.vue.esm2.js";import"./forms/ElInputDate.vue.esm2.js";import"./forms/ElInputFile.vue.esm2.js";import"./forms/ElInputMeasureUnit.vue.esm2.js";import"./forms/ElInputNumber.vue.esm2.js";import"./forms/ElInputPhone.vue.esm2.js";import"./forms/ElInputSelect.vue.esm2.js";import"./forms/ElInputTextarea.vue.esm2.js";import"./ElToast.vue.esm2.js";import"./forms/ElInputRadioButton.vue.esm2.js";/* empty css *//* empty css */import"./forms/ElInputSearch.vue.esm2.js";const P={key:0,class:"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl"},V={class:"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl"},A={class:"py-2 md:py-3 lg:py-4"},L={class:"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between"},F={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},K={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},ge=["sm","md","lg"],ve=b({__name:"ElCarousel",props:{size:{},slides:{},opacity:{type:Boolean}},setup(M){const g=E(),v=y(()=>{switch(g.value){case c.Desktop:return"xl";case c.Tablet:return"l";default:return"sm"}}),a=p(),x=p([N,B,j]);return(e,l)=>(s(),d("div",{class:m(["w-full relative",{"max-w-2xl":e.size==="md","max-w-7xl":e.size==="lg"}])},[n(r(D),{"space-between":30,"slides-per-view":1,keyboard:{enabled:!0},pagination:{clickable:!0},loop:!0,navigation:!0,modules:x.value,class:"",onSwiper:l[0]||(l[0]=t=>a.value=t)},{default:u(()=>[(s(!0),d(z,null,h(e.slides,(t,i)=>(s(),k(r(I),{key:i},{default:u(()=>[o("div",{class:m(["flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24",{"justify-end items-end h-auto":e.size==="sm","h-96":e.size==="md","h-auto":e.size==="lg"}]),style:S({backgroundImage:"url("+t.picture+")"})},[e.opacity?(s(),d("div",P)):C("",!0),o("div",{class:m(["z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl",{"w-full":e.size==="sm","max-w-80":e.size==="md","max-w-96":e.size==="lg"}])},[o("h1",V,f(t.title),1),o("p",{class:m(["text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96",{"w-full":e.size==="sm","w-80 max-w-80":e.size==="md","w-96 max-w-96":e.size==="lg"}])},f(t.description),3),o("div",A,[n(r($),_({ref_for:!0},t.button,{size:v.value}),null,16,["size"])])],2)],6)]),_:2},1024))),128))]),_:1},8,["modules"]),o("div",L,[o("div",F,[n(r(w),{icon:{name:"ArrowSmallLeftIcon"},onClick:l[1]||(l[1]=t=>{var i;return(i=a.value)==null?void 0:i.slidePrev()})})]),o("div",K,[n(r(w),{icon:{name:"ArrowSmallRightIcon"},onClick:l[2]||(l[2]=t=>{var i;return(i=a.value)==null?void 0:i.slideNext()})})])])],2))}});export{ve as default,ge as elCarouselSizes};
1
+ import{defineComponent as y,computed as h,ref as p,openBlock as s,createElementBlock as m,normalizeClass as n,createVNode as a,unref as r,withCtx as u,Fragment as z,renderList as k,createBlock as S,createElementVNode as l,normalizeStyle as C,createCommentVNode as f,toDisplayString as c,mergeProps as _}from"vue";import j from"../node_modules/swiper/modules/keyboard.esm.js";import N from"../node_modules/swiper/modules/navigation.esm.js";import B from"../node_modules/swiper/modules/pagination.esm.js";import{Swiper as D,SwiperSlide as I}from"../node_modules/swiper/swiper-vue.esm.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 $ from"./ElButton.vue.esm2.js";import"./forms/ElInputText.vue.esm2.js";import{useMatchDevice as E,Device as w}from"./utils.esm.js";import g from"./ElIconButton.vue.esm2.js";import"./forms/ElInputCheckbox.vue.esm2.js";import"./forms/ElInputDate.vue.esm2.js";import"./forms/ElInputFile.vue.esm2.js";import"./forms/ElInputMeasureUnit.vue.esm2.js";import"./forms/ElInputNumber.vue.esm2.js";import"./forms/ElInputPhone.vue.esm2.js";import"./forms/ElInputSelect.vue.esm2.js";import"./forms/ElInputTextarea.vue.esm2.js";import"./ElToast.vue.esm2.js";import"./forms/ElInputRadioButton.vue.esm2.js";/* empty css *//* empty css */import"./forms/ElInputSearch.vue.esm2.js";const P={key:0,class:"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl"},V={class:"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl"},A={class:"py-2 md:py-3 lg:py-4"},L={key:0,class:"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between"},F={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},K={class:"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden"},ge=["sm","md","lg"],ve=y({__name:"ElCarousel",props:{size:{},slides:{},opacity:{type:Boolean}},setup(M){const v=E(),x=h(()=>{switch(v.value){case w.Desktop:return"xl";case w.Tablet:return"l";default:return"sm"}}),d=p(),b=p([N,B,j]);return(e,i)=>(s(),m("div",{class:n(["w-full relative",{"max-w-2xl":e.size==="md","max-w-7xl":e.size==="lg"}])},[a(r(D),{"space-between":30,"slides-per-view":1,keyboard:{enabled:!0},pagination:{clickable:!0},loop:!0,navigation:!0,modules:b.value,class:"",onSwiper:i[0]||(i[0]=t=>d.value=t)},{default:u(()=>[(s(!0),m(z,null,k(e.slides,(t,o)=>(s(),S(r(I),{key:o},{default:u(()=>[l("div",{class:n(["flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24",{"justify-end items-end h-auto":e.size==="sm","h-96":e.size==="md","h-auto":e.size==="lg"}]),style:C({backgroundImage:"url("+t.picture+")"})},[e.opacity?(s(),m("div",P)):f("",!0),l("div",{class:n(["z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl",{"w-full":e.size==="sm","max-w-80":e.size==="md","max-w-96":e.size==="lg"}])},[l("h1",V,c(t.title),1),l("p",{class:n(["text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96",{"w-full":e.size==="sm","w-80 max-w-80":e.size==="md","w-96 max-w-96":e.size==="lg"}])},c(t.description),3),l("div",A,[a(r($),_({ref_for:!0},t.button,{size:x.value}),null,16,["size"])])],2)],6)]),_:2},1024))),128))]),_:1},8,["modules"]),e.slides.length>1?(s(),m("div",L,[l("div",F,[a(r(g),{icon:{name:"ArrowSmallLeftIcon"},onClick:i[1]||(i[1]=t=>{var o;return(o=d.value)==null?void 0:o.slidePrev()})})]),l("div",K,[a(r(g),{icon:{name:"ArrowSmallRightIcon"},onClick:i[2]||(i[2]=t=>{var o;return(o=d.value)==null?void 0:o.slideNext()})})])])):f("",!0)],2))}});export{ve as default,ge as elCarouselSizes};
2
2
  //# sourceMappingURL=ElCarousel.vue.esm2.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ElCarousel.vue.esm2.js","sources":["../../src/ElCarousel.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCarouselSizes = ['sm', 'md', 'lg'] as const;\nexport type ElCarouselSizes = (typeof elCarouselSizes)[number];\n\nexport interface CarouselProps {\n size?: ElCarouselSizes;\n slides: CarouselSlide[];\n opacity?: boolean;\n}\n\nexport interface CarouselSlide {\n title: string;\n description: string;\n picture: string;\n button: InstanceType<typeof ElButton>['$props'];\n}\n</script>\n\n<script lang=\"ts\" setup>\nimport { Keyboard, Navigation, Pagination } from 'swiper/modules';\nimport { Swiper, SwiperSlide } from 'swiper/vue';\nimport { ElButton, ElIconButton } from '.';\n\nimport 'swiper/css';\nimport 'swiper/css/pagination';\nimport { computed, ref } from 'vue';\nimport { Device, useMatchDevice } from './utils';\n\ndefineProps<CarouselProps>();\n\nconst device = useMatchDevice();\n\nconst buttonSize = computed(() => {\n switch (device.value) {\n case Device.Desktop:\n return 'xl';\n case Device.Tablet:\n return 'l';\n default:\n return 'sm';\n }\n});\n\nconst swiperInstance = ref();\nconst modules = ref([Navigation, Pagination, Keyboard]);\n</script>\n\n<template>\n <div\n class=\"w-full relative\"\n :class=\"{\n 'max-w-2xl': size === 'md',\n 'max-w-7xl': size === 'lg',\n }\"\n >\n <swiper\n :space-between=\"30\"\n :slides-per-view=\"1\"\n :keyboard=\"{\n enabled: true,\n }\"\n :pagination=\"{\n clickable: true,\n }\"\n :loop=\"true\"\n :navigation=\"true\"\n :modules=\"modules\"\n class=\"\"\n @swiper=\"swiperInstance = $event\"\n >\n <swiper-slide v-for=\"(slide, index) in slides\" :key=\"index\">\n <div\n class=\"flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24\"\n :style=\"{\n backgroundImage: 'url(' + slide.picture + ')',\n }\"\n :class=\"{\n 'justify-end items-end h-auto': size === 'sm',\n 'h-96': size === 'md',\n 'h-auto': size === 'lg',\n }\"\n >\n <div v-if=\"opacity\" class=\"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl\"></div>\n\n <div\n class=\"z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl\"\n :class=\"{\n 'w-full': size === 'sm',\n 'max-w-80': size === 'md',\n 'max-w-96': size === 'lg',\n }\"\n >\n <h1 class=\"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl\">\n {{ slide.title }}\n </h1>\n <p\n class=\"text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96\"\n :class=\"{\n 'w-full': size === 'sm',\n 'w-80 max-w-80': size === 'md',\n 'w-96 max-w-96': size === 'lg',\n }\"\n >\n {{ slide.description }}\n </p>\n <div class=\"py-2 md:py-3 lg:py-4\">\n <ElButton v-bind=\"slide.button\" :size=\"buttonSize\" />\n </div>\n </div>\n </div>\n </swiper-slide>\n </swiper>\n <div class=\"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between\">\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallLeftIcon' }\" @click=\"swiperInstance?.slidePrev()\" />\n </div>\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallRightIcon' }\" @click=\"swiperInstance?.slideNext()\" />\n </div>\n </div>\n </div>\n</template>\n"],"names":["elCarouselSizes","device","useMatchDevice","buttonSize","computed","Device","swiperInstance","ref","modules","Navigation","Pagination","Keyboard"],"mappings":"8mEACaA,GAAkB,CAAC,KAAM,KAAM,IAAI,sFA6BhD,MAAMC,EAASC,IAETC,EAAaC,EAAS,IAAM,CAChC,OAAQH,EAAO,MAAO,CACpB,KAAKI,EAAO,QACH,MAAA,KACT,KAAKA,EAAO,OACH,MAAA,IACT,QACS,MAAA,IACX,CAAA,CACD,EAEKC,EAAiBC,IACjBC,EAAUD,EAAI,CAACE,EAAYC,EAAYC,CAAQ,CAAC"}
1
+ {"version":3,"file":"ElCarousel.vue.esm2.js","sources":["../../src/ElCarousel.vue"],"sourcesContent":["<script lang=\"ts\">\nexport const elCarouselSizes = ['sm', 'md', 'lg'] as const;\nexport type ElCarouselSizes = (typeof elCarouselSizes)[number];\n\nexport interface CarouselProps {\n size?: ElCarouselSizes;\n slides: CarouselSlide[];\n opacity?: boolean;\n}\n\nexport interface CarouselSlide {\n title: string;\n description: string;\n picture: string;\n button: InstanceType<typeof ElButton>['$props'];\n}\n</script>\n\n<script lang=\"ts\" setup>\nimport { Keyboard, Navigation, Pagination } from 'swiper/modules';\nimport { Swiper, SwiperSlide } from 'swiper/vue';\nimport { ElButton, ElIconButton } from '.';\n\nimport 'swiper/css';\nimport 'swiper/css/pagination';\nimport { computed, ref } from 'vue';\nimport { Device, useMatchDevice } from './utils';\n\ndefineProps<CarouselProps>();\n\nconst device = useMatchDevice();\n\nconst buttonSize = computed(() => {\n switch (device.value) {\n case Device.Desktop:\n return 'xl';\n case Device.Tablet:\n return 'l';\n default:\n return 'sm';\n }\n});\n\nconst swiperInstance = ref();\nconst modules = ref([Navigation, Pagination, Keyboard]);\n</script>\n\n<template>\n <div\n class=\"w-full relative\"\n :class=\"{\n 'max-w-2xl': size === 'md',\n 'max-w-7xl': size === 'lg',\n }\"\n >\n <swiper\n :space-between=\"30\"\n :slides-per-view=\"1\"\n :keyboard=\"{\n enabled: true,\n }\"\n :pagination=\"{\n clickable: true,\n }\"\n :loop=\"true\"\n :navigation=\"true\"\n :modules=\"modules\"\n class=\"\"\n @swiper=\"swiperInstance = $event\"\n >\n <swiper-slide v-for=\"(slide, index) in slides\" :key=\"index\">\n <div\n class=\"flex items-center isolate overflow-hidden w-full bg-left bg-cover bg-no-repeat bg-black rounded-2xl p-6 md:p-7 lg:p-24\"\n :style=\"{\n backgroundImage: 'url(' + slide.picture + ')',\n }\"\n :class=\"{\n 'justify-end items-end h-auto': size === 'sm',\n 'h-96': size === 'md',\n 'h-auto': size === 'lg',\n }\"\n >\n <div v-if=\"opacity\" class=\"bg-black opacity-30 left-0 absolute w-full h-full top-0 rounded-2xl\"></div>\n\n <div\n class=\"z-10 flex flex-col justify-end md:justify-center gap-3 lg:gap-4 items-start flex-1 self-stretch md:my-8 text-white text-sm md:text-base lg:text-xl\"\n :class=\"{\n 'w-full': size === 'sm',\n 'max-w-80': size === 'md',\n 'max-w-96': size === 'lg',\n }\"\n >\n <h1 class=\"font-semibold text-neutral-inverse text-xl md:text-2xl lg:text-4xl\">\n {{ slide.title }}\n </h1>\n <p\n class=\"text-neutral-inverse font-medium text-sm md:text-base md:max-w-80 lg:text-xl lg:max-w-96\"\n :class=\"{\n 'w-full': size === 'sm',\n 'w-80 max-w-80': size === 'md',\n 'w-96 max-w-96': size === 'lg',\n }\"\n >\n {{ slide.description }}\n </p>\n <div class=\"py-2 md:py-3 lg:py-4\">\n <ElButton v-bind=\"slide.button\" :size=\"buttonSize\" />\n </div>\n </div>\n </div>\n </swiper-slide>\n </swiper>\n <div v-if=\"slides.length > 1\" class=\"px-6 w-full mb-20 hidden md:absolute md:mt-0 lg:top-60 md:bottom-0 lg:flex justify-between\">\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallLeftIcon' }\" @click=\"swiperInstance?.slidePrev()\" />\n </div>\n <div class=\"w-9 h-9 flex justify-center items-center bg-white rounded-full z-10 overflow-hidden\">\n <ElIconButton :icon=\"{ name: 'ArrowSmallRightIcon' }\" @click=\"swiperInstance?.slideNext()\" />\n </div>\n </div>\n </div>\n</template>\n"],"names":["elCarouselSizes","device","useMatchDevice","buttonSize","computed","Device","swiperInstance","ref","modules","Navigation","Pagination","Keyboard"],"mappings":"onEACaA,GAAkB,CAAC,KAAM,KAAM,IAAI,sFA6BhD,MAAMC,EAASC,IAETC,EAAaC,EAAS,IAAM,CAChC,OAAQH,EAAO,MAAO,CACpB,KAAKI,EAAO,QACH,MAAA,KACT,KAAKA,EAAO,OACH,MAAA,IACT,QACS,MAAA,IACX,CAAA,CACD,EAEKC,EAAiBC,IACjBC,EAAUD,EAAI,CAACE,EAAYC,EAAYC,CAAQ,CAAC"}
@@ -1,2 +1,2 @@
1
- "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;
1
+ "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 active:text-primary-pressed hover:bg-primary-light-hover 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;
2
2
  //# sourceMappingURL=ElIconButton.vue.cjs2.js.map
@@ -1 +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 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"}
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 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 active:text-primary-pressed hover:bg-primary-light-hover 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"}
@@ -1,2 +1,2 @@
1
- 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};
1
+ import{defineComponent as c,computed as n,openBlock as i,createBlock as t,withCtx as f,createElementVNode as a,normalizeClass as s,createElementBlock as d,createCommentVNode as b}from"vue";import g 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],x=["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),l=n(()=>o.disabled||o.loading||!1);return(e,r)=>(i(),t(v,{title:e.tooltip??"",position:"top-right","delay-time":o.tooltipDelay,"hide-on-mobile":!e.showTooltipOnMobile},{default:f(()=>[a("button",{class:s(["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 active:text-primary-pressed hover:bg-primary-light-hover active:bg-primary-light-pressed":!l.value&&!e.error}]),type:"button","data-cy":e.tooltip?`${e.tooltip.trim().replaceAll(" ","")}-icon-button`:"icon-button",onClick:r[0]||(r[0]=$=>l.value?void 0:u("click"))},[e.loading?(i(),d("span",z,[(i(),d("svg",{class:s(["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(),t(g,{key:1,disabled:l.value,name:e.icon.name,solid:e.icon.solid,class:s(["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(),t(y,{key:2,color:o.badgeColor,value:typeof e.badge=="string"?e.badge:void 0,class:s({"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"])):b("",!0)],10,w)]),_:1},8,["title","delay-time","hide-on-mobile"]))}});export{A as default,x as elIconButtonSizes};
2
2
  //# sourceMappingURL=ElIconButton.vue.esm2.js.map
@@ -1 +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 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"}
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 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 active:text-primary-pressed hover:bg-primary-light-hover 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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),t=e.defineComponent({__name:"ElSuggestionChip",props:{label:{},focused:{type:Boolean}},setup(o){return(r,i)=>(e.openBlock(),e.createElementBlock("button",{type:"button",class:e.normalizeClass(["h-8 items-center justify-center px-4 min-w-20 rounded-md text-sm font-semibold leading-4 border text-primary bg-white border-primary hover:text-primary-hover hover:bg-primary-light-hover hover:border-primary-hover",{"text-primary-pressed bg-primary-light-pressed border-primary-pressed outlined-primary":r.focused}])},e.toDisplayString(r.label),3))}});exports.default=t;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),t=e.defineComponent({__name:"ElSuggestionChip",props:{label:{},focused:{type:Boolean}},setup(o){return(r,i)=>(e.openBlock(),e.createElementBlock("button",{type:"button",class:e.normalizeClass(["transition-colors h-8 items-center justify-center px-4 min-w-20 rounded-md text-sm font-semibold leading-4 border text-primary bg-white border-primary hover:text-primary-hover hover:bg-primary-light-hover hover:border-primary-hover active:text-primary-pressed active:bg-primary-light-pressed active:border-primary-pressed",{"text-primary-pressed bg-primary-light-pressed border-primary-pressed outlined-primary":r.focused}])},e.toDisplayString(r.label),3))}});exports.default=t;
2
2
  //# sourceMappingURL=ElSuggestionChip.vue.cjs2.js.map
@@ -1,2 +1,2 @@
1
- import{defineComponent as r,openBlock as t,createElementBlock as o,normalizeClass as i,toDisplayString as p}from"vue";const m=r({__name:"ElSuggestionChip",props:{label:{},focused:{type:Boolean}},setup(s){return(e,a)=>(t(),o("button",{type:"button",class:i(["h-8 items-center justify-center px-4 min-w-20 rounded-md text-sm font-semibold leading-4 border text-primary bg-white border-primary hover:text-primary-hover hover:bg-primary-light-hover hover:border-primary-hover",{"text-primary-pressed bg-primary-light-pressed border-primary-pressed outlined-primary":e.focused}])},p(e.label),3))}});export{m as default};
1
+ import{defineComponent as r,openBlock as t,createElementBlock as o,normalizeClass as i,toDisplayString as p}from"vue";const m=r({__name:"ElSuggestionChip",props:{label:{},focused:{type:Boolean}},setup(s){return(e,a)=>(t(),o("button",{type:"button",class:i(["transition-colors h-8 items-center justify-center px-4 min-w-20 rounded-md text-sm font-semibold leading-4 border text-primary bg-white border-primary hover:text-primary-hover hover:bg-primary-light-hover hover:border-primary-hover active:text-primary-pressed active:bg-primary-light-pressed active:border-primary-pressed",{"text-primary-pressed bg-primary-light-pressed border-primary-pressed outlined-primary":e.focused}])},p(e.label),3))}});export{m as default};
2
2
  //# sourceMappingURL=ElSuggestionChip.vue.esm2.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),s=require("./ElAvatar.vue.cjs2.js"),r=require("./ElIcon.vue.cjs2.js"),o=require("./ElBadge.vue.cjs2.js"),l={class:"text-sm font-semibold line-clamp-1"},i={key:0,class:"text-neutral-lighter text-sm font-normal line-clamp-1"},n={class:"flex flex-col space-y-1 justify-center items-center self-stretch"},c=["datetime"],u={class:"flex justify-center items-center flex-grow"},d={key:1,class:"h-4 relative flex justify-center items-end"},m=["primary","secondary"],p=["default","hover","active"],y=t.defineComponent({__name:"ElVerticalTab",props:{icon:{},avatar:{},primaryRow:{},secondaryRow:{},tertiaryRow:{},lineClamp:{},time:{},badge:{},color:{},status:{}},setup(v){return(e,a)=>(t.openBlock(),t.createElementBlock("button",{class:t.normalizeClass(["p-3 w-full max-h-28 flex justify-start items-center gap-3 bg-disabled rounded-lg hover:bg-neutral-hover focus:bg-neutral-pressed",{"border border-primary-active bg-primary-light-active":e.color==="primary"&&e.status==="active","border border-secondary-active bg-secondary-light-active":e.color==="secondary"&&e.status==="active","border border-white bg-white":e.status==="default","border border-transparent bg-neutral-hover":e.status==="hover"}])},[e.icon?(t.openBlock(),t.createBlock(r.default,t.mergeProps({key:0},e.icon,{class:["w-6 h-6 flex-shrink-0",{"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}]}),null,16,["class"])):t.createCommentVNode("",!0),e.avatar?(t.openBlock(),t.createBlock(s.default,t.normalizeProps(t.mergeProps({key:1},e.avatar)),null,16)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(["flex-1 flex flex-col items-start text-left",{[`text-${e.color}-active`]:e.status==="active","gap-1":e.secondaryRow||e.tertiaryRow,"text-neutral-darker":!e.status||e.status==="default"}])},[t.createElementVNode("p",l,t.toDisplayString(e.primaryRow),1),t.createElementVNode("p",{class:t.normalizeClass(["text-sm font-normal",{"line-clamp-1":e.lineClamp===1,"line-clamp-2":e.lineClamp===2}])},t.toDisplayString(e.secondaryRow),3),e.tertiaryRow?(t.openBlock(),t.createElementBlock("span",i,t.toDisplayString(e.tertiaryRow),1)):t.createCommentVNode("",!0)],2),t.createElementVNode("div",n,[e.time?(t.openBlock(),t.createElementBlock("time",{key:0,datetime:e.time,class:t.normalizeClass(["text-primary text-xs font-normal leading-5",{"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}])},t.toDisplayString(e.time),11,c)):t.createCommentVNode("",!0),t.createElementVNode("div",u,[t.createElementVNode("span",{class:t.normalizeClass({"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}),onClick:a[0]||(a[0]=t.withModifiers(()=>{},["stop"]))},[t.renderSlot(e.$slots,"traling-slot",{},()=>[t.createVNode(r.default,{class:"w-5 h-5 flex-shrink-0",name:"ChevronRightIcon"})])],2)]),e.badge?(t.openBlock(),t.createElementBlock("div",d,[t.createVNode(o.default,t.normalizeProps(t.guardReactiveProps(e.badge)),null,16)])):t.createCommentVNode("",!0)])],2))}});exports.default=y;exports.elVerticalTabColors=m;exports.elVerticalTabStatus=p;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),s=require("./ElAvatar.vue.cjs2.js"),r=require("./ElIcon.vue.cjs2.js"),o=require("./ElBadge.vue.cjs2.js"),l={class:"text-sm font-semibold line-clamp-1"},i={key:0,class:"text-neutral-lighter text-sm font-normal line-clamp-1"},n={class:"flex flex-col space-y-1 justify-center items-center self-stretch"},c=["datetime"],u={class:"flex justify-center items-center flex-grow"},d={key:1,class:"h-4 relative flex justify-center items-end"},m=["primary","secondary"],p=["default","hover","active"],y=t.defineComponent({__name:"ElVerticalTab",props:{icon:{},avatar:{},primaryRow:{},secondaryRow:{},tertiaryRow:{},lineClamp:{},time:{},badge:{},color:{},status:{}},setup(v){return(e,a)=>(t.openBlock(),t.createElementBlock("button",{class:t.normalizeClass(["p-3 w-full max-h-28 flex justify-start items-center gap-3 bg-disabled rounded-lg hover:bg-neutral-hover active:bg-neutral-pressed",{"border border-primary-active bg-primary-light-active":e.color==="primary"&&e.status==="active","border border-secondary-active bg-secondary-light-active":e.color==="secondary"&&e.status==="active","border border-white bg-white":e.status==="default","border border-transparent bg-neutral-hover":e.status==="hover"}])},[e.icon?(t.openBlock(),t.createBlock(r.default,t.mergeProps({key:0},e.icon,{class:["w-6 h-6 flex-shrink-0",{"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}]}),null,16,["class"])):t.createCommentVNode("",!0),e.avatar?(t.openBlock(),t.createBlock(s.default,t.normalizeProps(t.mergeProps({key:1},e.avatar)),null,16)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:t.normalizeClass(["flex-1 flex flex-col items-start text-left",{[`text-${e.color}-active`]:e.status==="active","gap-1":e.secondaryRow||e.tertiaryRow,"text-neutral-darker":!e.status||e.status==="default"}])},[t.createElementVNode("p",l,t.toDisplayString(e.primaryRow),1),t.createElementVNode("p",{class:t.normalizeClass(["text-sm font-normal",{"line-clamp-1":e.lineClamp===1,"line-clamp-2":e.lineClamp===2}])},t.toDisplayString(e.secondaryRow),3),e.tertiaryRow?(t.openBlock(),t.createElementBlock("span",i,t.toDisplayString(e.tertiaryRow),1)):t.createCommentVNode("",!0)],2),t.createElementVNode("div",n,[e.time?(t.openBlock(),t.createElementBlock("time",{key:0,datetime:e.time,class:t.normalizeClass(["text-primary text-xs font-normal leading-5",{"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}])},t.toDisplayString(e.time),11,c)):t.createCommentVNode("",!0),t.createElementVNode("div",u,[t.createElementVNode("span",{class:t.normalizeClass({"text-primary-active":e.color==="primary"&&e.status==="active","text-secondary-active":e.color==="secondary"&&e.status==="active","text-neutral-darker":!e.status||e.status==="default"}),onClick:a[0]||(a[0]=t.withModifiers(()=>{},["stop"]))},[t.renderSlot(e.$slots,"traling-slot",{},()=>[t.createVNode(r.default,{class:"w-5 h-5 flex-shrink-0",name:"ChevronRightIcon"})])],2)]),e.badge?(t.openBlock(),t.createElementBlock("div",d,[t.createVNode(o.default,t.normalizeProps(t.guardReactiveProps(e.badge)),null,16)])):t.createCommentVNode("",!0)])],2))}});exports.default=y;exports.elVerticalTabColors=m;exports.elVerticalTabStatus=p;
2
2
  //# sourceMappingURL=ElVerticalTab.vue.cjs2.js.map