@flywire/react-headlessui - npm Package Compare versions

Comparing version 0.0.1-beta.1 to 0.0.1-beta.2

dist/index.js

@@ -1,2 +0,2 @@
-var Q=Object.defineProperty;var j=(t,e)=>{for(var r in e)Q(t,r,{get:e[r],enumerable:!0})};var _={};j(_,{useId:()=>P,useInput:()=>c,useMaskInput:()=>R,useMoneyInput:()=>b,useRunAfterUpdate:()=>C});import{useRef as tt}from"react";function et(t=Math.random().toString(36).slice(-5)){return tt(t).current}var P=et;function rt({hasHint:t=!1,id:e,isInvalid:r=!1,isRequired:o=!1}){return{labelProps:{htmlFor:e},inputProps:{id:e,name:e},inputA11yProps:{"aria-invalid":r,"aria-required":o,"aria-describedby":[r&&`${e}-error`,t&&`${e}-description`].filter(Boolean).join(" ")}}}var c=rt;import{useRef as ft,useState as lt}from"react";import{useRef as ot,useLayoutEffect as nt}from"react";function st(){let t=ot();return nt(()=>{t.current&&(t.current?.(),t.current=void 0)}),e=>t.current=e}var C=st;var it=({text:t,pattern:e,cursor:r=t?.length||0})=>{if(!t||t.length===0||!e||r<t.length)return[t,r];let o=t.replace(/\D/g,""),a=e.split("").reduce((n,s)=>n.remainingText.length===0?n:s!=="."?{formattedText:n.formattedText+s,remainingText:n.remainingText}:{formattedText:n.formattedText+n.remainingText[0],remainingText:n.remainingText.slice(1)},{formattedText:"",remainingText:o.split("")}).formattedText,p=a.length;return[a,p]},I=it;function at(...t){return function(...e){t.forEach(r=>r?.(...e))}}var d=at;function pt(t,{decimals:e=2}={}){return new Intl.NumberFormat(void 0,{minimumFractionDigits:e,maximumFractionDigits:e}).format(Math.floor(t*Math.pow(10,e))/Math.pow(10,e))}var h=pt;function ut(t){return typeof t=="number"?t:Number.parseFloat(t.replace(/[$,]/g,""))}var y=ut;var mt="";function dt({mask:t,onChange:e=()=>{},...r}){let o=ft(null),[i,a]=lt(mt),p=C();function n(s){let f=o.current,[l,u]=I({text:s.target.value,pattern:t,cursor:s.target.selectionStart||0});l&&(a(l),p(()=>{!f||(f.selectionStart=u,f.selectionEnd=u)}))}return{inputProps:{onChange:d(e,n),value:i,ref:o,maxLength:t.length,...r}}}var R=dt;import{useState as Kt}from"react";var F="",Ut=2;function Yt({decimals:t=Ut,onChange:e=()=>{},onBlur:r=()=>{},onMouseOut:o=()=>{},onKeyDown:i=()=>{},...a}){let[p,n]=Kt(F);function s(u){let M=u.ctrlKey||u.metaKey,z=M&&u.keyCode===67,X=M&&u.keyCode===88,$=/\d/.test(String.fromCharCode(u.keyCode)),J=M&&u.keyCode===86,Z=[188,110,8,39,96,97,98,99,100,101,102,103,104,105,190,37,46,9].includes(u.keyCode);!$&&!Z&&!J&&!z&&!X&&u.preventDefault()}function f(u){n(u.target.value)}function l(){n(u=>u===F?u:h(y(u),{decimals:t}))}return{inputProps:{onBlur:d(r,l),onChange:d(e,f),onMouseOut:d(o,l),onKeyDown:d(i,s),type:"text",value:p,...a}}}var b=Yt;import{jsx as Wt}from"react/jsx-runtime";function Ot(t){return Wt("button",{type:"button",...t})}var D=Ot;import{Children as de,createContext as ce,isValidElement as xe,useMemo as Ee,useRef as H,useState as Pe}from"react";import{forwardRef as wt,useContext as Bt}from"react";import{jsx as Gt}from"react/jsx-runtime";var K=wt(({as:t="p",children:e,...r},o)=>{let{id:i,isInvalid:a,isLoading:p,isRequired:n}=Bt(m);return Gt(t,{ref:o,id:`${i}-error`,...r,children:typeof e=="function"?e({isInvalid:a,isLoading:p,isRequired:n}):e})});K.displayName="Field.Error";var g=K;import{useContext as zt}from"react";import{useRef as Xt}from"react";import{forwardRef as kt,useContext as qt}from"react";import{jsx as Vt}from"react/jsx-runtime";var U=kt((t,e)=>{let r=qt(m),{inputProps:o,inputA11yProps:i}=c(r);return Vt("input",{ref:e,...o,...i,...t})});U.displayName="Field.Input";var E=U;import{jsx as Zt}from"react/jsx-runtime";var $t=8e6,Jt=250,L=class extends Error{};function Y({accept:t=".png,.jpg,.jpeg,.pdf",maxFileSizeInBytes:e=$t,onChange:r=()=>Promise.resolve(),onError:o=()=>{},...i}){let{setIsLoading:a}=zt(m),p=Xt(null);async function n(s){a(!0);let f=s.target.files?.[0];if(f&&f.size>e)return p?.current?.setCustomValidity("Invalid file size"),a(!1),o(new L("Invalid file size"));p?.current?.setCustomValidity(""),await Promise.allSettled([r(s),new Promise(u=>setTimeout(u,Jt))]),a(!1),s.target.value=""}return Zt(E,{accept:t,onChange:n,ref:p,...i,type:"file"})}Y.displayName="File";var N=Y;import{Children as O,cloneElement as Qt,createRef as jt,Fragment as te}from"react";import{jsx as re}from"react/jsx-runtime";function ee({children:t,onChange:e=()=>{},onBlur:r=()=>{}}){let o=O.count(t),i=Array.from({length:o},()=>jt());function a(){return i.map(s=>s.current?.value)}function p(){let s=a(),f=new CustomEvent("change",{detail:{values:s}});e(f)}function n(){let s=a(),f=new CustomEvent("blur",{detail:{values:s}});r(f)}return re(te,{children:O.map(t,function(s,f){let{onChange:l,onBlur:u}=s.props;return Qt(s,{ref:i[f],onChange:d(l,p),onBlur:d(u,n)})})})}var S=ee;import{forwardRef as oe,useContext as ne}from"react";import{jsx as se}from"react/jsx-runtime";var W=oe(({as:t="p",children:e,...r},o)=>{let{id:i,isInvalid:a,isLoading:p,isRequired:n}=ne(m);return se(t,{ref:o,id:`${i}-description`,...r,children:typeof e=="function"?e({isInvalid:a,isLoading:p,isRequired:n}):e})});W.displayName="Field.Hint";var T=W;import{Fragment as ie,forwardRef as ae,useContext as pe}from"react";import{jsx as w,jsxs as ue}from"react/jsx-runtime";var B=ae(({children:t,...e},r)=>{let o=pe(m),{isInvalid:i,isLoading:a,isRequired:p}=o,{labelProps:n}=c(o);return w("label",{ref:r,...n,...e,children:typeof t=="function"?t({isInvalid:i,isLoading:a,isRequired:p}):p?ue(ie,{children:[t," ",w("span",{"aria-hidden":!0,children:"*"})]}):t})});B.displayName="Field.Label";var v=B;import{forwardRef as fe,useContext as le}from"react";import{jsx as me}from"react/jsx-runtime";var G=fe((t,e)=>{let r=le(m),{inputProps:o,inputA11yProps:i}=c(r);return me("textarea",{ref:e,...o,...i,...t})});G.displayName="Field.Textarea";var A=G;import{jsx as Ce}from"react/jsx-runtime";var m=ce({hasHint:!1,id:"",isInvalid:!1,isLoading:!1,isRequired:!1,setIsLoading:()=>{}});function k({id:t,children:e,...r}){let o=H(!1),i=P(t),a=H(!1),[p,n]=Pe(!1),s=H(!1);de.toArray(e).find(l=>{xe(l)&&(l.type===g&&(a.current=!0),l.type===T&&(o.current=!0),(l.type===E||l.type===A)&&(s.current=!!l.props.required))});let f=Ee(()=>({hasHint:o.current,id:i,isInvalid:a.current,isLoading:p,isRequired:s.current,setIsLoading:n}),[i,p]);return Ce(m.Provider,{value:f,...r,children:e})}import{jsx as q}from"react/jsx-runtime";var x=({as:t="div",className:e,id:r,...o})=>q(t,{className:e,children:q(k,{id:r,...o})});x.displayName="Field";x.Error=g;x.File=N;x.Group=S;x.Hint=T;x.Input=E;x.Label=v;x.Textarea=A;var V=x;export{D as Button,V as Field,_ as hooks};
+var ue=Object.create;var L=Object.defineProperty;var le=Object.getOwnPropertyDescriptor;var fe=Object.getOwnPropertyNames;var me=Object.getPrototypeOf,de=Object.prototype.hasOwnProperty;var N=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),ce=(e,t)=>{for(var r in t)L(e,r,{get:t[r],enumerable:!0})},xe=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of fe(t))!de.call(e,n)&&n!==r&&L(e,n,{get:()=>t[n],enumerable:!(o=le(t,n))||o.enumerable});return e};var Ee=(e,t,r)=>(r=e!=null?ue(me(e)):{},xe(t||!e||!e.__esModule?L(r,"default",{value:e,enumerable:!0}):r,e));var w=N((Kr,W)=>{"use strict";var nt="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";W.exports=nt});var V=N((Ur,q)=>{"use strict";var st=w();function B(){}function k(){}k.resetWarningCache=B;q.exports=function(){function e(o,n,p,u,s,l){if(l!==st){var i=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw i.name="Invariant Violation",i}}e.isRequired=e;function t(){return e}var r={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:k,resetWarningCache:B};return r.PropTypes=r,r}});var z=N((wr,G)=>{G.exports=V()();var Yr,Wr});var U={};ce(U,{useId:()=>g,useInput:()=>x,useMaskInput:()=>v,useMoneyInput:()=>S,useRunAfterUpdate:()=>C});import{useRef as Te}from"react";function Pe(e=Math.random().toString(36).slice(-5)){return Te(e).current}var g=Pe;function ge({hasHint:e=!1,id:t,isInvalid:r=!1,isRequired:o=!1}){return{labelProps:{htmlFor:t},inputProps:{id:t,name:t},inputA11yProps:{"aria-invalid":r,"aria-required":o,"aria-describedby":[r&&`${t}-error`,e&&`${t}-description`].filter(Boolean).join(" ")}}}var x=ge;import{useRef as be,useState as Le}from"react";import{useRef as Ce,useLayoutEffect as ye}from"react";function he(){let e=Ce();return ye(()=>{e.current&&(e.current?.(),e.current=void 0)}),t=>e.current=t}var C=he;var Ie=({text:e,pattern:t,cursor:r=e?.length||0})=>{if(!e||e.length===0||!t||r<e.length)return[e,r];let o=e.replace(/\D/g,""),p=t.split("").reduce((s,l)=>s.remainingText.length===0?s:l!=="."?{formattedText:s.formattedText+l,remainingText:s.remainingText}:{formattedText:s.formattedText+s.remainingText[0],remainingText:s.remainingText.slice(1)},{formattedText:"",remainingText:o.split("")}).formattedText,u=p.length;return[p,u]},A=Ie;function Ae(...e){return function(...t){e.forEach(r=>r?.(...t))}}var d=Ae;function Re(e,{decimals:t=2}={}){return new Intl.NumberFormat(void 0,{minimumFractionDigits:t,maximumFractionDigits:t}).format(Math.floor(e*Math.pow(10,t))/Math.pow(10,t))}var R=Re;function Me(e){return typeof e=="number"?e:Number.parseFloat(e.replace(/[$,]/g,""))}var M=Me;var Ne="";function ve({mask:e,onChange:t=()=>{},...r}){let o=be(null),[n,p]=Le(Ne),u=C();function s(l){let i=o.current,[f,a]=A({text:l.target.value,pattern:e,cursor:l.target.selectionStart||0});f&&(p(f),u(()=>{!i||(i.selectionStart=a,i.selectionEnd=a)}))}return{inputProps:{onChange:d(t,s),value:n,ref:o,maxLength:e.length,...r}}}var v=ve;import{useState as je}from"react";var K="",et=2;function tt({decimals:e=et,onChange:t=()=>{},onBlur:r=()=>{},onMouseOut:o=()=>{},onKeyDown:n=()=>{},...p}){let[u,s]=je(K);function l(a){let E=a.ctrlKey||a.metaKey,b=E&&a.keyCode===67,se=E&&a.keyCode===88,ae=/\d/.test(String.fromCharCode(a.keyCode)),ie=E&&a.keyCode===86,pe=[188,110,8,39,96,97,98,99,100,101,102,103,104,105,190,37,46,9].includes(a.keyCode);!ae&&!pe&&!ie&&!b&&!se&&a.preventDefault()}function i(a){s(a.target.value)}function f(){s(a=>a===K?a:R(M(a),{decimals:e}))}return{inputProps:{onBlur:d(r,f),onChange:d(t,i),onMouseOut:d(o,f),onKeyDown:d(n,l),type:"text",value:u,...p}}}var S=tt;import{jsx as ot}from"react/jsx-runtime";function rt(e){return ot("button",{type:"button",...e})}var Y=rt;var P=Ee(z());import{Children as _t,createContext as Ht,isValidElement as Dt,useMemo as Ft,useRef as O,useState as Ot}from"react";import{forwardRef as at,useContext as it}from"react";import{jsx as pt}from"react/jsx-runtime";var X=at(({as:e="p",children:t,...r},o)=>{let{id:n,isInvalid:p,isLoading:u,isRequired:s}=it(m);return pt(e,{ref:o,id:`${n}-error`,...r,children:typeof t=="function"?t({isInvalid:p,isLoading:u,isRequired:s}):t})});X.displayName="Field.Error";var y=X;import{useContext as mt}from"react";import{useRef as dt}from"react";import{forwardRef as ut,useContext as lt}from"react";import{jsx as ft}from"react/jsx-runtime";var $=ut((e,t)=>{let r=lt(m),{inputProps:o,inputA11yProps:n}=x(r);return ft("input",{ref:t,...o,...n,...e})});$.displayName="Field.Input";var T=$;import{jsx as Et}from"react/jsx-runtime";var ct=8e6,xt=250,_=class extends Error{};function J({accept:e=".png,.jpg,.jpeg,.pdf",maxFileSizeInBytes:t=ct,onChange:r=()=>Promise.resolve(),onError:o=()=>{},...n}){let{setIsLoading:p}=mt(m),u=dt(null);async function s(l){p(!0);let i=l.target.files?.[0];if(i&&i.size>t)return u?.current?.setCustomValidity("Invalid file size"),p(!1),o(new _("Invalid file size"));u?.current?.setCustomValidity(""),await Promise.allSettled([r(l),new Promise(a=>setTimeout(a,xt))]),p(!1),l.target.value=""}return Et(T,{accept:e,onChange:s,ref:u,...n,type:"file"})}J.displayName="File";var H=J;import{Children as Z,cloneElement as Tt,Fragment as Pt,useState as gt}from"react";import{jsx as yt}from"react/jsx-runtime";function Ct({as:e=Pt,children:t,className:r,onChange:o=()=>{},onBlur:n=()=>{}}){let[p,u]=gt(Z.map(t,i=>i.props.defaultValue||i.props.value||i.props.selected));function s({evt:i,index:f}){let a=[...p];a[f]=i.target?.value,u(a);let E=new CustomEvent("change",{detail:{values:a}});o(E)}function l(){let i=new CustomEvent("blur",{detail:{values:p}});n(i)}return yt(e,{className:r,children:Z.map(t,function(i,f){let{onChange:a,onBlur:E}=i.props;return Tt(i,{onChange:d(a,b=>s({evt:b,index:f})),onBlur:d(E,l)})})})}var D=Ct;import{forwardRef as ht,useContext as It}from"react";import{jsx as At}from"react/jsx-runtime";var Q=ht(({as:e="p",children:t,...r},o)=>{let{id:n,isInvalid:p,isLoading:u,isRequired:s}=It(m);return At(e,{ref:o,id:`${n}-description`,...r,children:typeof t=="function"?t({isInvalid:p,isLoading:u,isRequired:s}):t})});Q.displayName="Field.Hint";var h=Q;import{Fragment as Rt,forwardRef as Mt,useContext as bt}from"react";import{jsx as j,jsxs as Lt}from"react/jsx-runtime";var ee=Mt(({children:e,...t},r)=>{let o=bt(m),{isInvalid:n,isLoading:p,isRequired:u}=o,{labelProps:s}=x(o);return j("label",{ref:r,...s,...t,children:typeof e=="function"?e({isInvalid:n,isLoading:p,isRequired:u}):u?Lt(Rt,{children:[e," ",j("span",{"aria-hidden":!0,children:"*"})]}):e})});ee.displayName="Field.Label";var F=ee;import{forwardRef as Nt,useContext as vt}from"react";import{jsx as St}from"react/jsx-runtime";var te=Nt((e,t)=>{let r=vt(m),{inputProps:o,inputA11yProps:n}=x(r);return St("textarea",{ref:t,...o,...n,...e})});te.displayName="Field.Textarea";var I=te;import{jsx as Kt}from"react/jsx-runtime";var m=Ht({hasHint:!1,id:"",isInvalid:!1,isLoading:!1,isRequired:!1,setIsLoading:()=>{}});function re({id:e,children:t,...r}){let o=O(!1),n=g(e),p=O(!1),[u,s]=Ot(!1),l=O(!1);_t.toArray(t).find(f=>{Dt(f)&&(f.type===y&&(p.current=!0),f.type===h&&(o.current=!0),(f.type===T||f.type===I)&&(l.current=!!f.props.required))});let i=Ft(()=>({hasHint:o.current,id:n,isInvalid:p.current,isLoading:u,isRequired:l.current,setIsLoading:s}),[n,u]);return Kt(m.Provider,{value:i,...r,children:t})}import{jsx as oe}from"react/jsx-runtime";var c=({as:e="div",className:t,id:r,...o})=>oe(e,{className:t,children:oe(re,{id:r,...o})});c.displayName="Field";c.Error=y;c.File=H;c.Group=D;c.Hint=h;c.Input=T;c.Label=F;c.Textarea=I;c.propTypes={as:P.default.oneOfType([P.default.string,P.default.elementType]),className:P.default.string,id:P.default.string};var ne=c;export{Y as Button,ne as Field,U as hooks};
 //# sourceMappingURL=index.js.map

dist/typings/components/Field/components/Group.d.ts

@@ -1,8 +0,10 @@
-/// <reference types="react" />
+import { ElementType } from 'react';
 declare type GroupProps = {
+    as?: ElementType;
     children: JSX.Element | JSX.Element[];
+    className?: string;
+    onBlur?: (evt: CustomEvent) => void;
     onChange?: (evt: CustomEvent) => void;
-    onBlur?: (evt: CustomEvent) => void;
 };
-declare function Group({ children, onChange, onBlur, }: GroupProps): JSX.Element;
+declare function Group({ as: Element, children, className, onChange, onBlur, }: GroupProps): JSX.Element;
 export default Group;

package.json

 {
   "name": "@flywire/react-headlessui",
-  "version": "0.0.1-beta.1",
+  "version": "0.0.1-beta.2",
   "description": "Headless UI components",
@@ -34,2 +34,3 @@ "module": "dist/index.js",
     "@babel/preset-typescript": "^7.18.6",
+    "@ladle/react": "^2.4.2",
     "@tailwindcss/forms": "^0.5.3",
@@ -53,2 +54,3 @@ "@testing-library/jest-dom": "^5.16.5",
     "eslint-plugin-storybook": "^0.6.4",
+    "install": "^0.13.0",
     "jest": "^27.5.1",
@@ -59,2 +61,3 @@ "jest-axe": "^6.0.0",
     "prettier": "^2.7.1",
+    "prop-types": "^15.8.1",
     "react": ">=17.0.2",
@@ -71,2 +74,4 @@ "react-dom": ">=17.0.2",
   "peerDependencies": {
+    "date-fns": ">=2.29.2",
+    "prop-types": ">=15.8.1",
     "react": ">=17.0.2",
@@ -73,0 +78,0 @@ "react-dom": ">=17.0.2"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

110814

increased by6.74%

Number of package files

45

increased by4.65%

Lines of code

835

increased by1.71%

Worsened metrics

Dependency count

5

increased by66.67%

Dev dependency count

37

increased by8.82%

No dependency changes