@flywire/react-headlessui - npm Package Compare versions

Comparing version 0.4.1-1 to 0.4.1-2

dist/cjs/components/Field/components/Error.js

@@ -6,20 +6,7 @@ "use strict";
 const Context_1 = require("../Context");
-const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
     const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return null;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: renderChildren }));
+    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
 });
 Error.displayName = 'Field.Error';
 exports.default = Error;

dist/cjs/components/Field/components/Hint.js

@@ -6,20 +6,7 @@ "use strict";
 const Context_1 = require("../Context");
-const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
     const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return null;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: renderChildren }));
+    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
 });
 Hint.displayName = 'Field.Hint';
 exports.default = Hint;

dist/cjs/components/Field/components/Label.js

@@ -7,22 +7,9 @@ "use strict";
 const Context_1 = require("../Context");
-const Label = (0, react_1.forwardRef)(({ children, ...rest }, ref) => {
+const Label = (0, react_1.forwardRef)(({ children, render, ...rest }, ref) => {
     const context = (0, react_1.useContext)(Context_1.Context);
     const { isInvalid, isLoading, isRequired } = context;
     const { labelProps } = (0, hooks_1.useInput)(context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return child;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderChildren, isRequired ? (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" }) : (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})] }) }));
+    return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: render ? (render({ isInvalid, isLoading, isRequired })) : isRequired ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [children, " ", (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" })] })) : (children) }));
 });
 Label.displayName = 'Field.Label';
 exports.default = Label;

dist/cjs/types/components/Field/components/Error.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type ErrorProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<ErrorProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Error;
 //# sourceMappingURL=Error.d.ts.map

dist/cjs/types/components/Field/components/Hint.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type HintProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<HintProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Hint;
 //# sourceMappingURL=Hint.d.ts.map

dist/cjs/types/components/Field/components/Label.d.ts

 /// <reference types="react" />
+import { FieldSubcomponentRenderProp } from '../types';
 declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+    render?: FieldSubcomponentRenderProp | undefined;
+} & {
     children?: import("react").ReactNode;
@@ -4,0 +7,0 @@ } & import("react").RefAttributes<HTMLLabelElement>>;

dist/esm/components/Field/components/Error.js

@@ -6,20 +6,7 @@ "use strict";
 const Context_1 = require("../Context");
-const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
     const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return null;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: renderChildren }));
+    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
 });
 Error.displayName = 'Field.Error';
 exports.default = Error;

dist/esm/components/Field/components/Hint.js

@@ -6,20 +6,7 @@ "use strict";
 const Context_1 = require("../Context");
-const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
     const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return null;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: renderChildren }));
+    return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
 });
 Hint.displayName = 'Field.Hint';
 exports.default = Hint;

dist/esm/components/Field/components/Label.js

@@ -7,22 +7,9 @@ "use strict";
 const Context_1 = require("../Context");
-const Label = (0, react_1.forwardRef)(({ children, ...rest }, ref) => {
+const Label = (0, react_1.forwardRef)(({ children, render, ...rest }, ref) => {
     const context = (0, react_1.useContext)(Context_1.Context);
     const { isInvalid, isLoading, isRequired } = context;
     const { labelProps } = (0, hooks_1.useInput)(context);
-    const renderChildren = (0, react_1.useMemo)(() => {
-        return react_1.Children.map(children, (child) => {
-            if (!(0, react_1.isValidElement)(child)) {
-                return child;
-            }
-            return (0, react_1.cloneElement)(child, {
-                ...child.props,
-                isInvalid,
-                isLoading,
-                isRequired,
-            });
-        });
-    }, [children, isInvalid, isLoading, isRequired]);
-    return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderChildren, isRequired ? (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" }) : (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})] }) }));
+    return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: render ? (render({ isInvalid, isLoading, isRequired })) : isRequired ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [children, " ", (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" })] })) : (children) }));
 });
 Label.displayName = 'Field.Label';
 exports.default = Label;

dist/esm/types/components/Field/components/Error.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type ErrorProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<ErrorProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Error;
 //# sourceMappingURL=Error.d.ts.map

dist/esm/types/components/Field/components/Hint.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type HintProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<HintProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Hint;
 //# sourceMappingURL=Hint.d.ts.map

dist/esm/types/components/Field/components/Label.d.ts

 /// <reference types="react" />
+import { FieldSubcomponentRenderProp } from '../types';
 declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+    render?: FieldSubcomponentRenderProp | undefined;
+} & {
     children?: import("react").ReactNode;
@@ -4,0 +7,0 @@ } & import("react").RefAttributes<HTMLLabelElement>>;

dist/umd/components/Field/components/Error.js

@@ -15,18 +15,5 @@ (function (factory) {
     const Context_1 = require("../Context");
-    const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+    const Error = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
         const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-        const renderChildren = (0, react_1.useMemo)(() => {
-            return react_1.Children.map(children, (child) => {
-                if (!(0, react_1.isValidElement)(child)) {
-                    return null;
-                }
-                return (0, react_1.cloneElement)(child, {
-                    ...child.props,
-                    isInvalid,
-                    isLoading,
-                    isRequired,
-                });
-            });
-        }, [children, isInvalid, isLoading, isRequired]);
-        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: renderChildren }));
+        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-error`, role: "alert", ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
     });
@@ -33,0 +20,0 @@ Error.displayName = 'Field.Error';

dist/umd/components/Field/components/Hint.js

@@ -15,18 +15,5 @@ (function (factory) {
     const Context_1 = require("../Context");
-    const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, ...rest }, ref) => {
+    const Hint = (0, react_1.forwardRef)(({ as: Element = 'p', children, render, ...rest }, ref) => {
         const { id, isInvalid, isLoading, isRequired } = (0, react_1.useContext)(Context_1.Context);
-        const renderChildren = (0, react_1.useMemo)(() => {
-            return react_1.Children.map(children, (child) => {
-                if (!(0, react_1.isValidElement)(child)) {
-                    return null;
-                }
-                return (0, react_1.cloneElement)(child, {
-                    ...child.props,
-                    isInvalid,
-                    isLoading,
-                    isRequired,
-                });
-            });
-        }, [children, isInvalid, isLoading, isRequired]);
-        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: renderChildren }));
+        return ((0, jsx_runtime_1.jsx)(Element, { ref: ref, id: `${id}-description`, ...rest, children: render ? render({ isInvalid, isLoading, isRequired }) : children }));
     });
@@ -33,0 +20,0 @@ Hint.displayName = 'Field.Hint';

dist/umd/components/Field/components/Label.js

@@ -16,20 +16,7 @@ (function (factory) {
     const Context_1 = require("../Context");
-    const Label = (0, react_1.forwardRef)(({ children, ...rest }, ref) => {
+    const Label = (0, react_1.forwardRef)(({ children, render, ...rest }, ref) => {
         const context = (0, react_1.useContext)(Context_1.Context);
         const { isInvalid, isLoading, isRequired } = context;
         const { labelProps } = (0, hooks_1.useInput)(context);
-        const renderChildren = (0, react_1.useMemo)(() => {
-            return react_1.Children.map(children, (child) => {
-                if (!(0, react_1.isValidElement)(child)) {
-                    return child;
-                }
-                return (0, react_1.cloneElement)(child, {
-                    ...child.props,
-                    isInvalid,
-                    isLoading,
-                    isRequired,
-                });
-            });
-        }, [children, isInvalid, isLoading, isRequired]);
-        return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderChildren, isRequired ? (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" }) : (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})] }) }));
+        return ((0, jsx_runtime_1.jsx)("label", { ref: ref, ...labelProps, ...rest, children: render ? (render({ isInvalid, isLoading, isRequired })) : isRequired ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [children, " ", (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, children: "*" })] })) : (children) }));
     });
@@ -36,0 +23,0 @@ Label.displayName = 'Field.Label';

dist/umd/types/components/Field/components/Error.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type ErrorProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<ErrorProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Error: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Error;
 //# sourceMappingURL=Error.d.ts.map

dist/umd/types/components/Field/components/Hint.d.ts

@@ -1,10 +0,5 @@
-import { ElementType, HTMLProps, PropsWithChildren } from 'react';
-type HintProps = HTMLProps<HTMLElement> & {
-    as?: ElementType;
-    className?: string;
-    onPointerEnterCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-    onPointerLeaveCapture?: (e: React.PointerEvent<HTMLElement>) => void;
-};
-declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<HintProps>, "ref"> & import("react").RefAttributes<HTMLElement>>;
+import { PropsWithChildren } from 'react';
+import { FieldSubcomponentType } from '../types';
+declare const Hint: import("react").ForwardRefExoticComponent<Omit<PropsWithChildren<FieldSubcomponentType>, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Hint;
 //# sourceMappingURL=Hint.d.ts.map

dist/umd/types/components/Field/components/Label.d.ts

 /// <reference types="react" />
+import { FieldSubcomponentRenderProp } from '../types';
 declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+    render?: FieldSubcomponentRenderProp | undefined;
+} & {
     children?: import("react").ReactNode;
@@ -4,0 +7,0 @@ } & import("react").RefAttributes<HTMLLabelElement>>;

package.json

 {
   "name": "@flywire/react-headlessui",
-  "version": "0.4.1-1",
+  "version": "0.4.1-2",
   "description": "Headless UI components",
@@ -5,0 +5,0 @@ "main": "./dist/umd/index.js",

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

Number of package files

443

increased by2.07%

Worsened metrics

Total package byte prevSize

328106

decreased by-0.57%

Lines of code

5458

decreased by-1.5%

No dependency changes