@fiscozen/composables 0.1.38-beta.0 → 0.1.39-next.0
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.
- package/dist/composables.js +1451 -0
- package/dist/composables.umd.cjs +1 -0
- package/package.json +2 -2
- package/src/composables/useCurrency.ts +7 -113
- package/src/utils/number/index.ts +70 -13
|
@@ -0,0 +1 @@
|
|
|
1
|
+
(function(y,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],a):(y=typeof globalThis<"u"?globalThis:y||self,a(y.FzComposables={},y.Vue))})(this,function(y,a){"use strict";const $=e=>t=>{if(t===null)return"";const o={maximumFractionDigits:e.maximumFractionDigits||2,minimumFractionDigits:e.minimumFractionDigits,useGrouping:e.useGrouping||!1};return t.toLocaleString("it-IT",o)},N=e=>{if(!e||typeof e!="string")return NaN;let t=e.trim();return t.includes(",")&&(t=t.replace(/\./g,""),t=t.replace(",",".")),parseFloat(t)},U=(e,t)=>{let o=t;const l=t%e,r=t>=0?e:-e;return l!==0&&(o=Math.abs(l)>=e/2?t+r-l:t-l),o},O=new DOMRect(0,0,window.innerWidth,window.innerHeight),z=(e,t,o,l,r)=>{let i=r?"bottom":"right",x=r?"bottom-start":"right-start";O.width=window.innerWidth,O.height=window.innerHeight,O.x=0,O.y=0;const p=e?e.getBoundingClientRect():O,n=t.getBoundingClientRect(),m=o.getBoundingClientRect(),c=(m.left-p.left-n.width)/p.width,f=(p.right-m.right-n.width)/p.width,u=(m.top-p.top-n.height)/p.height,g=(p.bottom-m.bottom-n.height)/p.height;let b=[{key:"right",space:f},{key:"top",space:u},{key:"bottom",space:g},{key:"left",space:c}].sort((s,v)=>v.space-s.space);if(r&&(b=b.filter(s=>s.key==="top"||s.key==="bottom")),i=b[0].key,!l){const s=(n.height-m.height)/2;switch(i){case"right":case"left":p.top>m.top-s&&(l="end"),p.bottom<m.top-s&&(l="start");break}}return x=l?`${i}-${l}`:i,x},W=(e,t,o,l)=>({x:t.x+e.width*o/100,y:t.y+e.height*l/100}),D=e=>{const t=a.ref(null),o=a.ref(null),l=a.ref(null),r=a.ref(),i=a.ref(),x=a.ref("auto"),p=a.ref(),n=a.reactive({position:{x:0,y:0}}),m={root:null,rootMargin:"0px",threshold:1,...e.element.value.intersectionOptions},c=(b,s)=>{},f=a.ref(new IntersectionObserver(c,m)),u=a.ref(),g=(b=!1)=>a.nextTick(()=>{var P,d,w,k,F,C,B,T,q,j,G,K,Q,_,X;if(u.value=e.position?e.position.value:"auto",t.value=typeof e.element.value.domRef.value=="string"?document.querySelector(e.element.value.domRef.value):e.element.value.domRef.value,(P=e.container)!=null&&P.value?(o.value=typeof((d=e.container.value)==null?void 0:d.domRef.value)=="string"?document.querySelector(e.container.value.domRef.value):(w=e.container.value)==null?void 0:w.domRef.value,o.value??(o.value=document.body)):o.value=document.body,!t.value)throw new Error("missing reference element for floating behavior");(k=e.opener)!=null&&k.value&&(l.value=typeof((F=e.opener.value)==null?void 0:F.domRef.value)=="string"?document.querySelector(e.opener.value.domRef.value):(C=e.opener.value)==null?void 0:C.domRef.value),p.value=t.value.getBoundingClientRect(),r.value=(B=l.value)==null?void 0:B.getBoundingClientRect(),i.value=o.value.getBoundingClientRect();const s=window.getComputedStyle(t.value);f.value.observe(t.value),f.value.observe(o.value);let v=0,h=0;if((T=e.opener)!=null&&T.value&&l.value&&(r!=null&&r.value)){const S=r.value.left-parseFloat(s.marginLeft)-parseFloat(s.marginRight),Y=r.value.left-parseFloat(s.marginLeft),L=r.value.top-parseFloat(s.marginTop)-parseFloat(s.marginBottom),J=r.value.top-parseFloat(s.marginTop);switch(u.value){case"auto":u.value=z((q=e.useViewport)!=null&&q.value?null:o.value,t.value,l.value);break;case"auto-vertical":u.value=z((j=e.useViewport)!=null&&j.value?null:o.value,t.value,l.value,void 0,!0);break;case"auto-start":u.value=z((G=e.useViewport)!=null&&G.value?null:o.value,t.value,l.value,"start");break;case"auto-vertical-start":u.value=z((K=e.useViewport)!=null&&K.value?null:o.value,t.value,l.value,"start",!0);break;case"auto-end":u.value=z((Q=e.useViewport)!=null&&Q.value?null:o.value,t.value,l.value,"end");break;case"auto-vertical-end":u.value=z((_=e.useViewport)!=null&&_.value?null:o.value,t.value,l.value,"end",!0);break}switch(u.value){case"bottom":n.position.y=r.value.bottom,n.position.x=Y+r.value.width/2,h=-50,v=0;break;case"bottom-start":n.position.y=r.value.bottom,n.position.x=S,h=0,v=0;break;case"bottom-end":n.position.y=r.value.bottom,n.position.x=r.value.right,h=-100,v=0;break;case"left-start":n.position.y=L,n.position.x=S,h=-100,v=0;break;case"left":n.position.y=J+r.value.height/2,n.position.x=S,v=-50,h=-100;break;case"left-end":n.position.y=r.value.bottom,n.position.x=S,v=-100,h=-100;break;case"top-start":n.position.y=L,n.position.x=S,v=-100,h=0;break;case"top":n.position.y=L,n.position.x=Y+r.value.width/2,h=-50,v=-100;break;case"top-end":n.position.y=L,n.position.x=r.value.right,h=-100,v=-100;break;case"right-start":n.position.y=L,n.position.x=r.value.right,h=0,v=0;break;case"right":n.position.y=J+r.value.height/2,n.position.x=r.value.right,v=-50,h=0;break;case"right-end":n.position.y=r.value.bottom,n.position.x=r.value.right,v=-100,h=0;break}}else switch(u.value){case"bottom":n.position.y=i.value.bottom-p.value.height,n.position.x=i.value.left+i.value.width/2,h=-50;break;case"left-end":case"bottom-start":n.position.y=i.value.bottom-p.value.height,n.position.x=i.value.left;break;case"right-end":case"bottom-end":n.position.y=i.value.bottom-p.value.height,n.position.x=i.value.right-p.value.width;break;case"left":n.position.y=i.value.top+(i.value.height-p.value.height)/2,n.position.x=i.value.left;break;case"top-start":case"left-start":n.position.y=i.value.top,n.position.x=i.value.left;break;case"top":n.position.y=i.value.top,n.position.x=i.value.left+(i.value.width-p.value.width)/2;break;case"top-end":case"right-start":n.position.y=i.value.top,n.position.x=i.value.right-p.value.width;case"right":n.position.y=i.value.top+(i.value.height-p.value.height)/2,n.position.x=i.value.right-p.value.width;break}const E=W(p.value,n.position,h,v);if(n.position.x=E.x,n.position.y=E.y,E.x<i.value.left&&(n.position.x=i.value.left,h=0),E.x+p.value.width>i.value.right){const S=i.value.right-p.value.width;S>0&&(n.position.x=S),h=0}if(E.y<i.value.top&&(n.position.y=i.value.top,v=0),E.y+p.value.height>i.value.bottom){const S=i.value.bottom-p.value.height;S>0&&(n.position.y=S),v=0}t.value.style.top=`${n.position.y}px`,t.value.style.left=`${n.position.x}px`,t.value.style.position="fixed",t.value.style.display="flex",p.value=t.value.getBoundingClientRect(),(X=e.callback)!=null&&X.value&&!b&&e.callback.value(p,r,i,x,u)});return a.onUnmounted(()=>{f.value.disconnect()}),{float:n,rect:p,setPosition:g,position:x,actualPosition:u,openerRect:r,containerRect:i}};function M(e){const t=window.matchMedia(e),o=a.ref(t.matches);function l(r){o.value=r.matches}return a.onMounted(()=>{t.addEventListener("change",l)}),a.onUnmounted(()=>{t.removeEventListener("change",l)}),a.computed(()=>o.value)}function Z(e){return{isGreater(t){return M(`(min-width: ${e[t]})`)},isSmaller(t){return M(`(max-width: ${e[t]})`)},isInBetween(t,o){return M(`(min-width: ${e[t]}) and (max-width: ${e[o]})`)}}}function V(e,t,o){if(!e)throw new Error("A target component has to be provided.");if(!t)throw new Error("A callback has to be provided.");const l=r=>{!e.value||r.target===e.value||r.composedPath().includes(e.value)||typeof t=="function"&&t()};o&&a.watch(o,(r,i)=>{i&&i.removeEventListener("click",l),r==null||r.addEventListener("click",l)}),a.onMounted(()=>{o||document.addEventListener("click",l)}),a.onBeforeUnmount(()=>{var r;if(o){(r=o.value)==null||r.removeEventListener("click",l);return}document.removeEventListener("click",l)})}function ee(e,t){if(!e)throw new Error("A target component has to be provided.");if(!t||typeof t!="function")throw new Error("A callback has to be provided.");const o=l=>{t(l)};a.onMounted(()=>{e.value.addEventListener("keydown",o)}),a.onBeforeUnmount(()=>{e.value.removeEventListener("keydown",o)})}function te(e,t){if(!e||typeof e!="function")throw new Error("A callback has to be provided.");const o=l=>{e(l)};a.onMounted(()=>{if(!t){document.addEventListener("keyup",o);return}t.value.addEventListener("keyup",o)}),a.onBeforeUnmount(()=>{if(!t){document.removeEventListener("keyup",o);return}t.value.removeEventListener("keyup",o)})}const oe=e=>{const t=a.ref(null),o=a.getCurrentInstance(),l=a.computed(()=>o==null?void 0:o.props.amount),r=a.ref(),i=$(e),x=c=>{if(!Number.isNaN(c)&&o){if(r.value=c,o.props.nullOnEmpty&&!c){o.emit("update:amount",null);return}o.emit("update:amount",c)}},p=c=>{setTimeout(()=>{t.value&&(t.value.value=c)},0)},n=c=>f=>{if(!t.value||!f.target)return;let{value:u}=c;u=u.replace(/[^0-9,.-]/g,"");const g=N(u);p(u);const b=o!=null&&o.props.nullOnEmpty&&u===""?null:g;x(Number.isNaN(b)?0:b)},m=c=>{if(!t.value||!c.target)return;const f=c.target.value.replace(/,/g,".");let u;f===""&&(o!=null&&o.props.nullOnEmpty)?u=null:(u=N(f),Number.isNaN(u)&&(u=0),e.step&&(o!=null&&o.props.forceStep)&&(u=U(e.step,u)),e.min&&e.min>u&&(u=e.min),e.max&&e.max<u&&(u=e.max));const g=i(u);p(g),x(N(g))};return a.watch(t,(c,f)=>{c&&(f&&(f==null||f.removeEventListener("input",n(c)),f==null||f.removeEventListener("blur",m)),c.addEventListener("input",n(c)),c.addEventListener("blur",m),o!=null&&o.props.amount&&(c.value=i(l.value)))}),a.watch(l,c=>{a.nextTick(()=>{if(!(!t.value||c===null||c===void 0)&&r.value!==c){const f=i(c);t.value.value=f,r.value=c}})}),{inputRef:t,parse:N,format:i,emitAmount:x,setValue:p}};function A(e,t){if(!(e==null||e==="")){if(typeof e=="number")return e;if(typeof e=="string"){console.warn(`[useCurrencyModel] String values in v-model are deprecated and will be removed in a future version. Please use number | undefined instead. Received: "${e}". The string format is deprecated and will be replaced by "number | undefined". Parsing as number for retrocompatibility.`);const o=t(e);return isNaN(o)||!isFinite(o)?void 0:o}}}function ae(e){const{model:t,displayModel:o,inputRef:l,nullOnEmpty:r=!1,onModelUpdate:i,...x}=e,p=$(x),n=N,m=a.ref(!1),c=a.ref(!1),f=a.ref(!1);let u=!1;const g=()=>{u||(u=!0,a.nextTick(()=>{f.value=!1,u=!1}))},b=d=>A(d,n),s=d=>{const w=!d||d.trim()==="";if(m.value&&!c.value&&t.value===void 0&&!w)return p(0)},v=(d,w)=>{if(d===void 0){if(c.value){o.value=void 0,l!=null&&l.value&&(l.value.value="");return}const k=s(w);o.value=k,l!=null&&l.value&&(l.value.value=k||"")}else{const k=p(d);o.value=k,l!=null&&l.value&&(l.value.value=k)}},h=d=>{if(c.value=!0,!(d!=null&&d.trim())){o.value=void 0,l!=null&&l.value&&(l.value.value="");const C=r?void 0:0;f.value=!0,i?i(C):t.value=C,g();return}o.value=d;const w=n(d),k=isNaN(w)||!isFinite(w)?void 0:w;if(b(t.value)!==k){f.value=!0;const C=k!==void 0?k:0;i?i(C):t.value=C,g()}},E=()=>{c.value=!0};return a.watch(()=>t.value,(d,w)=>{var B;if(f.value){g();return}const k=b(d),F=b(w);if(k===F)return;d===void 0&&(m.value=!0);const C=((B=l==null?void 0:l.value)==null?void 0:B.value)||o.value||"";v(k,C),d!==void 0&&typeof d=="number"&&(c.value=!0)}),{format:p,parse:n,normalize:b,handleInputUpdate:h,markUserModified:E,initialize:()=>{var d;if(m.value=t.value===void 0,(d=l==null?void 0:l.value)!=null&&d.value)o.value=l.value.value,c.value=!0;else if(t.value!==void 0&&t.value!==null&&t.value!==""){const w=b(t.value);w===void 0?o.value=void 0:(o.value=p(w),c.value=!0)}else t.value===void 0?o.value=p(0):o.value=void 0},resetInternalUpdateFlag:g,isInternalUpdate:a.computed(()=>f.value),userHasModified:a.computed(()=>c.value),initialValueWasUndefined:a.computed(()=>m.value)}}const H={global:{blue:{50:{value:"#eff1ff",type:"color"},100:{value:"#dee2ff",type:"color"},200:{value:"#bdc5ff",type:"color"},300:{value:"#9ca8ff",type:"color"},400:{value:"#7b8bff",type:"color"},500:{value:"#5a6eff",type:"color"},600:{value:"#4858cc",type:"color"},700:{value:"#364299",type:"color"},800:{value:"#242c66",type:"color"},900:{value:"#1b214c",type:"color"}},purple:{50:{value:"#f8f4ff",type:"color"},100:{value:"#f0e9ff",type:"color"},200:{value:"#e1d3ff",type:"color"},300:{value:"#d2bdff",type:"color"},400:{value:"#c3a7ff",type:"color"},500:{value:"#b491ff",type:"color"},600:{value:"#9074cc",type:"color"},700:{value:"#6c5799",type:"color"},800:{value:"#483a66",type:"color"},900:{value:"#241d33",type:"color"}},orange:{50:{value:"#fff2ef",type:"color"},100:{value:"#ffe4de",type:"color"},200:{value:"#ffc9bd",type:"color"},300:{value:"#ffae9c",type:"color"},400:{value:"#ff937b",type:"color"},500:{value:"#ff785a",type:"color"},600:{value:"#cc6048",type:"color"},700:{value:"#994836",type:"color"},800:{value:"#663024",type:"color"},900:{value:"#331812",type:"color"}},pink:{50:{value:"#fff5f5",type:"color"},100:{value:"#ffe0e0",type:"color"},200:{value:"#ffcbcb",type:"color"},300:{value:"#ffc0c0",type:"color"},400:{value:"#ffabab",type:"color"},500:{value:"#ff9696",type:"color"},600:{value:"#cc7878",type:"color"},700:{value:"#995a5a",type:"color"},800:{value:"#663c3c",type:"color"},900:{value:"#331e1e",type:"color"}},yellow:{50:{value:"#fffbf4",type:"color"},100:{value:"#fff3de",type:"color"},200:{value:"#ffebc8",type:"color"},300:{value:"#ffe7bd",type:"color"},400:{value:"#ffdfa7",type:"color"},500:{value:"#ffd791",type:"color"},600:{value:"#ccac74",type:"color"},700:{value:"#998157",type:"color"},800:{value:"#806c49",type:"color"},900:{value:"#4c402b",type:"color"}},semantic:{error:{50:{value:"#fef3f3",type:"color"},100:{value:"#f8baba",type:"color"},200:{value:"#f04242",type:"color"},300:{value:"#aa2f2f",type:"color"}},warning:{50:{value:"#fff8f3",type:"color"},100:{value:"#ffdabd",type:"color"},200:{value:"#ffae4f",type:"color"},300:{value:"#b47b38",type:"color"}},success:{50:{value:"#f2f8f6",type:"color"},100:{value:"#b5d8ce",type:"color"},200:{value:"#0fa88c",type:"color"},300:{value:"#0b7763",type:"color"}},info:{50:{value:"#f3f7ff",type:"color"},100:{value:"#b4c8e1",type:"color"},200:{value:"#4e9fff",type:"color"},300:{value:"#3770b4",type:"color"}}},background:{"white-smoke":{value:"#f7f6f3",type:"color"},seashell:{value:"#f8ece7",type:"color"},"pale-purple":{value:"#f2e6ff",type:"color"},"alice-blue":{value:"#ecf2fc",type:"color"}},grey:{100:{value:"#e9edf0",type:"color"},200:{value:"#d1dde6",type:"color"},300:{value:"#9da9b2",type:"color"},400:{value:"#6e777e",type:"color"},500:{value:"#596167",type:"color"}},core:{white:{value:"#ffffff",type:"color"},black:{value:"#2c282f",type:"color"}},"font-sans":{"sharp-grotesk":{value:'"Sharp Grotesk", sans-serif',type:"fontFamilies"},inter:{value:'"Inter", sans-serif',type:"fontFamilies"}},font:{light:{value:"300",type:"fontWeights"},normal:{value:"400",type:"fontWeights"},medium:{value:"500",type:"fontWeights"}},spacing:{0:{value:"0px",type:"spacing"},1:{value:"1px",type:"spacing"},2:{value:"2px",type:"spacing"},4:{value:"4px",type:"spacing"},6:{value:"6px",type:"spacing"},8:{value:"8px",type:"spacing"},10:{value:"10px",type:"spacing"},12:{value:"12px",type:"spacing"},14:{value:"14px",type:"spacing"},16:{value:"16px",type:"spacing"},20:{value:"20px",type:"spacing"},24:{value:"24px",type:"spacing"},28:{value:"28px",type:"spacing"},32:{value:"32px",type:"spacing"},36:{value:"36px",type:"spacing"},40:{value:"40px",type:"spacing"},44:{value:"44px",type:"spacing"},48:{value:"48px",type:"spacing"},56:{value:"56px",type:"spacing"},64:{value:"64px",type:"spacing"},80:{value:"80px",type:"spacing"},96:{value:"96px",type:"spacing"},112:{value:"112px",type:"spacing"},128:{value:"128px",type:"spacing"},144:{value:"144px",type:"spacing"},160:{value:"160px",type:"spacing"},176:{value:"176px",type:"spacing"},192:{value:"192px",type:"spacing"},208:{value:"208px",type:"spacing"},224:{value:"224px",type:"spacing"},240:{value:"240px",type:"spacing"},256:{value:"256px",type:"spacing"},288:{value:"288px",type:"spacing"},320:{value:"320px",type:"spacing"},384:{value:"384px",type:"spacing"}},border:{0:{value:"0px",type:"borderWidth"},1:{value:"1px",type:"borderWidth"},2:{value:"2px",type:"borderWidth"},4:{value:"4px",type:"borderWidth"},8:{value:"8px",type:"borderWidth"}},rounded:{none:{value:"0px",type:"borderRadius"},sm:{value:"2px",type:"borderRadius"},base:{value:"4px",type:"borderRadius"},md:{value:"6px",type:"borderRadius"},lg:{value:"8px",type:"borderRadius"},xl:{value:"12px",type:"borderRadius"},"2xl":{value:"16px",type:"borderRadius"},"3xl":{value:"24px",type:"borderRadius"},full:{value:"9999px",type:"borderRadius"}},breakpoint:{xs:{value:"376px",type:"sizing"},sm:{value:"640px",type:"sizing"},md:{value:"768px",type:"sizing"},lg:{value:"1024px",type:"sizing"},xl:{value:"1280px",type:"sizing"},"2xl":{value:"1440px",type:"sizing"},"3xl":{value:"1536px",type:"sizing"}},shadow:{none:{value:{color:"#000000",type:"dropShadow",x:"0",y:"0",blur:"0",spread:"0"},type:"boxShadow"},sm:{value:{color:"#0000000d",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},type:"boxShadow"},base:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"1",blur:"2",spread:"0"},{color:"#0000001a",type:"dropShadow",x:"0",y:"1",blur:"3",spread:"0"}],type:"boxShadow"},md:{value:[{color:"#0000000f",type:"dropShadow",x:"0",y:"2",blur:"4",spread:"-1"},{color:"#0000001a",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-1"}],type:"boxShadow"},lg:{value:[{color:"#0000000d",type:"dropShadow",x:"0",y:"4",blur:"6",spread:"-2"},{color:"#0000001a",type:"dropShadow",x:"0",y:"10",blur:"15",spread:"-3"}],type:"boxShadow"},xl:{value:[{color:"#0000000a",type:"dropShadow",x:"0",y:"10",blur:"10",spread:"-5"},{color:"#0000001a",type:"dropShadow",x:"0",y:"20",blur:"25",spread:"-5"}],type:"boxShadow"},"2xl":{value:{color:"#00000040",type:"dropShadow",x:"0",y:"25",blur:"50",spread:"-12"},type:"boxShadow"},inner:{value:{color:"#0000000f",type:"innerShadow",x:"0",y:"2",blur:"4",spread:"0"},type:"boxShadow"}},underline:{value:"underline",type:"textDecoration"},text:{xs:{value:"12px",type:"fontSizes"},sm:{value:"14px",type:"fontSizes"},base:{value:"16px",type:"fontSizes"},lg:{value:"18px",type:"fontSizes"},xl:{value:"20px",type:"fontSizes"},"2xl":{value:"24px",type:"fontSizes"},"3xl":{value:"30px",type:"fontSizes"},"4xl":{value:"36px",type:"fontSizes"},"5xl":{value:"48px",type:"fontSizes"},"6xl":{value:"60px",type:"fontSizes"},"7xl":{value:"72px",type:"fontSizes"},"8xl":{value:"96px",type:"fontSizes"},"9xl":{value:"128px",type:"fontSizes"}},leading:{xs:{value:"16px",type:"lineHeights"},sm:{value:"18px",type:"lineHeights"},base:{value:"20px",type:"lineHeights"},lg:{value:"24px",type:"lineHeights"},xl:{value:"28px",type:"lineHeights"},"2xl":{value:"32px",type:"lineHeights"},"3xl":{value:"36px",type:"lineHeights"},"4xl":{value:"40px",type:"lineHeights"},"5xl":{value:"48px",type:"lineHeights"},"6xl":{value:"60px",type:"lineHeights"},"7xl":{value:"72px",type:"lineHeights"},"8xl":{value:"96px",type:"lineHeights"},"9xl":{value:"128px",type:"lineHeights"}}}},le={safeColorNames:["blue","purple","orange","pink","yellow","grey","core"]},ne={semanticColorNames:["error","warning","success","info"]},ie=le.safeColorNames,re=ne.semanticColorNames,R={};ie.forEach(e=>{const t=H.global[e];t&&Object.keys(t).forEach(o=>{var r;const l=(r=t[o])==null?void 0:r.value;l&&(R[e]||(R[e]={}),R[e][o]=l)})});const I=H.global.semantic;I&&re.forEach(e=>{const t=I[e];t&&typeof t=="object"&&Object.keys(t).forEach(o=>{var r;const l=(r=t[o])==null?void 0:r.value;if(l){const i=`semantic-${e}`;R[i]||(R[i]={}),R[i][o]=l}})});const ue=Object.entries(H.global.breakpoint).reduce((e,[t,o])=>(e[t]=o.value,e),{}),se=a.defineComponent({__name:"FzFloating",props:{isOpen:{type:Boolean,default:!1},position:{default:"auto"},container:{},contentClass:{},openerClass:{},overrideContentClass:{type:Boolean},overrideOpener:{},teleport:{type:Boolean,default:!1},useViewport:{type:Boolean}},emits:["fzfloating:setPosition"],setup(e,{expose:t,emit:o}){const l=e,r=o,i=a.ref(null),x=a.ref(null),p=a.useSlots(),n=M(`(max-width: ${ue.xs})`);let m=!1;const c={position:l.position,element:{domRef:i},container:{domRef:a.toRef(l.container||document.body)},opener:{domRef:a.toRef(null)},useViewport:l.useViewport,callback(...s){r("fzfloating:setPosition",...s)}},f=a.toRefs(c);p.opener&&(c.opener={domRef:x});const u=D(f),g=()=>{m||(m=!0,requestAnimationFrame(()=>{l.isOpen&&u.setPosition(),m=!1}))};a.watch(()=>l.position,()=>g()),a.watch(()=>l.isOpen,s=>{var h;if(!s||!i.value){window.removeEventListener("scroll",g);return}window.addEventListener("scroll",g);const v=(h=x.value)==null?void 0:h.getBoundingClientRect();i.value.style.top="0px",i.value.style.left="0px",i.value.style.transform="none",i.value.style.width=n.value?(v==null?void 0:v.width)+"px":"auto",u.setPosition()}),a.watch(()=>l.overrideOpener,s=>{s&&f.opener&&f.opener.value&&(f.opener.value={domRef:s})}),a.onBeforeUnmount(()=>{window.removeEventListener("scroll",g)});const b=a.computed(()=>l.overrideContentClass?l.contentClass:["bg-core-white fixed p-4",l.contentClass]);return t({setPosition:u.setPosition}),(s,v)=>(a.openBlock(),a.createElementBlock("div",null,[a.renderSlot(s.$slots,"opener-start"),a.createElementVNode("div",{ref_key:"opener",ref:x,class:"inline-flex w-full sm:w-auto"},[a.renderSlot(s.$slots,"opener",{isOpen:s.isOpen,floating:a.unref(u)})],512),a.renderSlot(s.$slots,"opener-end"),s.teleport?a.createCommentVNode("",!0):a.withDirectives((a.openBlock(),a.createElementBlock("div",{key:0,ref_key:"content",ref:i,class:a.normalizeClass(["fz__floating__content w-full sm:w-auto",b.value])},[a.renderSlot(s.$slots,"default",{isOpen:s.isOpen,floating:a.unref(u)})],2)),[[a.vShow,s.$slots.default&&(!s.$slots.opener||s.$slots.opener&&s.isOpen)]]),s.teleport?(a.openBlock(),a.createBlock(a.Teleport,{key:1,to:"body"},[a.withDirectives(a.createElementVNode("div",{ref_key:"content",ref:i,class:a.normalizeClass(["fz__floating__content",b.value])},[a.renderSlot(s.$slots,"default",{isOpen:s.isOpen,floating:a.unref(u)})],2),[[a.vShow,s.$slots.default&&(!s.$slots.opener||s.$slots.opener&&s.isOpen)]])])):a.createCommentVNode("",!0)]))}});y.FzFloating=se,y.calcRealPos=W,y.format=$,y.getHighestAvailableSpacePos=z,y.normalizeModelValue=A,y.parse=N,y.roundTo=U,y.useBreakpoints=Z,y.useClickOutside=V,y.useCurrency=oe,y.useCurrencyModel=ae,y.useFloating=D,y.useKeyDown=ee,y.useKeyUp=te,y.useMediaQuery=M,Object.defineProperty(y,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fiscozen/composables",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.39-next.0",
|
|
4
4
|
"description": "Design System utility composables",
|
|
5
5
|
"main": "src/index.ts",
|
|
6
6
|
"type": "module",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"vite": "^5.0.10",
|
|
29
29
|
"vitest": "^1.2.0",
|
|
30
30
|
"vue-tsc": "^1.8.25",
|
|
31
|
-
"@fiscozen/prettier-config": "^0.1.0",
|
|
32
31
|
"@fiscozen/eslint-config": "^0.1.0",
|
|
32
|
+
"@fiscozen/prettier-config": "^0.1.0",
|
|
33
33
|
"@fiscozen/tsconfig": "^0.1.0"
|
|
34
34
|
},
|
|
35
35
|
"license": "ISC",
|
|
@@ -1,119 +1,13 @@
|
|
|
1
|
-
import { Ref, watch, getCurrentInstance, computed, ref, nextTick } from 'vue'
|
|
2
1
|
import { FzUseCurrencyOptions } from '../types'
|
|
3
|
-
import { format
|
|
4
|
-
|
|
5
|
-
export const useCurrency = (options: FzUseCurrencyOptions) => {
|
|
6
|
-
const inputRef: Ref<HTMLInputElement | null | undefined> = ref(null)
|
|
7
|
-
const vm = getCurrentInstance()
|
|
8
|
-
|
|
9
|
-
const computedModel = computed<number | null>(() => vm?.props.amount as number | null)
|
|
10
|
-
const internalVal = ref<number | null>()
|
|
11
|
-
|
|
12
|
-
const format = formatNumber(options)
|
|
13
|
-
|
|
14
|
-
const emitAmount = (val: number | null) => {
|
|
15
|
-
if (Number.isNaN(val)) {
|
|
16
|
-
return
|
|
17
|
-
}
|
|
18
|
-
if (vm) {
|
|
19
|
-
internalVal.value = val
|
|
20
|
-
if (vm.props.nullOnEmpty && !val) {
|
|
21
|
-
vm.emit('update:amount', null)
|
|
22
|
-
return
|
|
23
|
-
}
|
|
24
|
-
vm.emit('update:amount', val)
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
const setValue = (val: string) => {
|
|
29
|
-
// nextTick doesn't seem to work
|
|
30
|
-
setTimeout(() => {
|
|
31
|
-
if (!inputRef.value) {
|
|
32
|
-
return
|
|
33
|
-
}
|
|
34
|
-
inputRef.value.value = val
|
|
35
|
-
}, 0)
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
const onInput = (el: HTMLInputElement) => (e: Event) => {
|
|
39
|
-
if (!inputRef.value || !e.target) {
|
|
40
|
-
return
|
|
41
|
-
}
|
|
42
|
-
let { value } = el
|
|
43
|
-
value = value.replace(/[^0-9,.-]/g, '')
|
|
44
|
-
const parsed: number = parse(value);
|
|
45
|
-
|
|
46
|
-
setValue(value)
|
|
47
|
-
const numberValue = vm?.props.nullOnEmpty && value === '' ? null : parsed
|
|
48
|
-
emitAmount(Number.isNaN(numberValue) ? 0 : numberValue)
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
const onBlur = (e: FocusEvent) => {
|
|
52
|
-
if (!inputRef.value || !e.target) {
|
|
53
|
-
return
|
|
54
|
-
}
|
|
55
|
-
const rawValue = (e.target as HTMLInputElement).value.replace(/,/g, '.')
|
|
56
|
-
let number: number | null
|
|
57
|
-
|
|
58
|
-
if (rawValue === '' && vm?.props.nullOnEmpty) {
|
|
59
|
-
number = null
|
|
60
|
-
} else {
|
|
61
|
-
number = parse(rawValue)
|
|
62
|
-
if (Number.isNaN(number)) {
|
|
63
|
-
number = 0
|
|
64
|
-
}
|
|
65
|
-
if (options.step && vm?.props.forceStep) {
|
|
66
|
-
number = roundTo(options.step, number)
|
|
67
|
-
}
|
|
68
|
-
if (options.min && options.min > number) {
|
|
69
|
-
number = options.min
|
|
70
|
-
}
|
|
71
|
-
if (options.max && options.max < number) {
|
|
72
|
-
number = options.max
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
const text = format(number)
|
|
76
|
-
setValue(text)
|
|
77
|
-
emitAmount(parse(text))
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
watch(inputRef, (newVal, oldVal) => {
|
|
81
|
-
if (!newVal) {
|
|
82
|
-
return
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
if (oldVal) {
|
|
86
|
-
oldVal?.removeEventListener('input', onInput(newVal))
|
|
87
|
-
oldVal?.removeEventListener('blur', onBlur)
|
|
88
|
-
}
|
|
89
|
-
newVal.addEventListener('input', onInput(newVal))
|
|
90
|
-
newVal.addEventListener('blur', onBlur)
|
|
91
|
-
|
|
92
|
-
if (vm?.props.amount) {
|
|
93
|
-
newVal.value = format(computedModel.value)
|
|
94
|
-
}
|
|
95
|
-
})
|
|
96
|
-
|
|
97
|
-
watch(computedModel, (newVal) => {
|
|
98
|
-
nextTick(() => {
|
|
99
|
-
if (!inputRef.value || newVal === null || newVal === undefined) {
|
|
100
|
-
return
|
|
101
|
-
}
|
|
102
|
-
// we need to format here only if someone externally set the
|
|
103
|
-
// value of the amount model
|
|
104
|
-
if (internalVal.value !== newVal) {
|
|
105
|
-
const formatted = format(newVal)
|
|
106
|
-
inputRef.value.value = formatted
|
|
107
|
-
internalVal.value = newVal
|
|
108
|
-
}
|
|
109
|
-
})
|
|
110
|
-
})
|
|
2
|
+
import { format, parse } from '../utils'
|
|
111
3
|
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated This composable is deprecated.
|
|
6
|
+
* You can use `format` and `parse` directly from `composables/utils`.
|
|
7
|
+
*/
|
|
8
|
+
export const useCurrency = (_options: FzUseCurrencyOptions) => {
|
|
112
9
|
return {
|
|
113
|
-
inputRef,
|
|
114
|
-
parse,
|
|
115
10
|
format,
|
|
116
|
-
|
|
117
|
-
setValue
|
|
11
|
+
parse
|
|
118
12
|
}
|
|
119
13
|
}
|
|
@@ -1,21 +1,74 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Truncates a number to the specified maximum decimal places (without rounding)
|
|
3
|
+
*
|
|
4
|
+
* @param value - Number to truncate
|
|
5
|
+
* @param maxDecimals - Maximum number of decimal places
|
|
6
|
+
* @returns Truncated number
|
|
7
|
+
*/
|
|
8
|
+
export const truncateDecimals = (value: number, maxDecimals: number): number => {
|
|
9
|
+
const factor = Math.pow(10, maxDecimals);
|
|
10
|
+
return Math.trunc(value * factor) / factor;
|
|
11
|
+
};
|
|
2
12
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
13
|
+
/**
|
|
14
|
+
* Formats a number value using provided options
|
|
15
|
+
*
|
|
16
|
+
* Uses Italian locale format (comma as decimal separator, point as thousand separator).
|
|
17
|
+
* Can truncate (not round) decimal places to maximumFractionDigits before formatting
|
|
18
|
+
* based on roundDecimals option.
|
|
19
|
+
*
|
|
20
|
+
* @param value - Number value to format
|
|
21
|
+
* @param options - Formatting options
|
|
22
|
+
* @param options.minimumFractionDigits - Minimum decimal places (default: 0)
|
|
23
|
+
* @param options.maximumFractionDigits - Maximum decimal places (default: 2)
|
|
24
|
+
* @param options.roundDecimals - If true, rounds decimals; if false, truncates (default: true)
|
|
25
|
+
* @param options.useGrouping - Whether to use thousand separators (default: true)
|
|
26
|
+
* @returns Formatted string (e.g., "1.234,56")
|
|
27
|
+
*/
|
|
28
|
+
export const format = (
|
|
29
|
+
value: number | null | undefined,
|
|
30
|
+
{
|
|
31
|
+
minimumFractionDigits = 0,
|
|
32
|
+
maximumFractionDigits = 2,
|
|
33
|
+
roundDecimals = true,
|
|
34
|
+
useGrouping = true,
|
|
35
|
+
} = {}
|
|
36
|
+
): string => {
|
|
37
|
+
if (
|
|
38
|
+
value === undefined ||
|
|
39
|
+
value === null ||
|
|
40
|
+
isNaN(value) ||
|
|
41
|
+
!isFinite(value)
|
|
42
|
+
) {
|
|
43
|
+
return "";
|
|
11
44
|
}
|
|
12
45
|
|
|
13
|
-
|
|
14
|
-
|
|
46
|
+
// Truncate decimals if roundDecimals is false, otherwise use value as-is (toLocaleString will round)
|
|
47
|
+
const processedValue = roundDecimals
|
|
48
|
+
? value
|
|
49
|
+
: truncateDecimals(value, maximumFractionDigits);
|
|
50
|
+
|
|
51
|
+
return processedValue.toLocaleString("it-IT", {
|
|
52
|
+
minimumFractionDigits: minimumFractionDigits,
|
|
53
|
+
maximumFractionDigits: maximumFractionDigits,
|
|
54
|
+
useGrouping: useGrouping,
|
|
55
|
+
});
|
|
56
|
+
};
|
|
15
57
|
|
|
16
58
|
export const parse = (text: string): number => {
|
|
17
|
-
|
|
18
|
-
|
|
59
|
+
if (!text || typeof text !== 'string') {
|
|
60
|
+
return NaN
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
let normalized = text.trim()
|
|
64
|
+
|
|
65
|
+
// Handle Italian format: "1.234,56" (points = thousands, comma = decimal)
|
|
66
|
+
if (normalized.includes(',')) {
|
|
67
|
+
normalized = normalized.replace(/\./g, '')
|
|
68
|
+
normalized = normalized.replace(',', '.')
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
return parseFloat(normalized)
|
|
19
72
|
}
|
|
20
73
|
|
|
21
74
|
export const roundTo = (step: number, val: number) => {
|
|
@@ -26,4 +79,8 @@ export const roundTo = (step: number, val: number) => {
|
|
|
26
79
|
result = Math.abs(remainder) >= step / 2 ? val + safeStep - remainder : val - remainder
|
|
27
80
|
}
|
|
28
81
|
return result
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export const clamp = (min: number, value: number, max: number): number => {
|
|
85
|
+
return Math.max(min, Math.min(value, max))
|
|
29
86
|
}
|