@superrb/react-addons 3.0.0-9 → 4.0.0-0

package/components/accordion.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren } from 'react';
+export declare function AccordionItem({ title, expanded, children, }: PropsWithChildren<{
+    title: string;
+    expanded?: boolean;
+}>): import("react/jsx-runtime").JSX.Element;
+export declare function Accordion({ multiple, children, }: PropsWithChildren<{
+    multiple?: boolean;
+}>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=accordion.d.ts.map

package/components/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../src/components/accordion.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,iBAAiB,EAMlB,MAAM,OAAO,CAAA;AAcd,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,QAAgB,EAChB,QAAQ,GACT,EAAE,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC,2CA0D1D;AAED,wBAAgB,SAAS,CAAC,EACxB,QAAgB,EAChB,QAAQ,GACT,EAAE,iBAAiB,CAAC;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC,2CAoB3C"}

package/components/accordion.js

@@ -0,0 +1,44 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createContext, useContext, useState, useEffect, useId, } from 'react';
+const AccordionContext = createContext({
+    multiple: false,
+    expandedItems: [],
+    setExpandedItems: () => { },
+});
+export function AccordionItem({ title, expanded = false, children, }) {
+    const { multiple, expandedItems, setExpandedItems } = useContext(AccordionContext);
+    const id = useId();
+    useEffect(() => {
+        if (expanded === true) {
+            setExpandedItems((expandedItems) => {
+                expandedItems.push(id);
+                return expandedItems;
+            });
+        }
+    }, []);
+    const toggle = () => {
+        setExpandedItems((expandedItems) => {
+            const isExpanded = expandedItems.includes(id);
+            if (isExpanded) {
+                return expandedItems.filter((item) => item !== id);
+            }
+            if (!multiple) {
+                return [id];
+            }
+            return [...expandedItems, id];
+        });
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs("button", { "aria-selected": expandedItems.includes(id), "aria-controls": `${id}-panel`, className: "accordion__trigger", onClick: toggle, role: "tab", "aria-label": title, id: `${id}-trigger`, children: [_jsx("span", { className: "screenreader-text", children: expandedItems ? 'Close' : 'Expand' }), title] }), _jsx("div", { className: "accordion__content", role: "tabpanel", "aria-labelledby": `${id}-trigger`, id: `${id}-panel`, children: children })] }));
+}
+export function Accordion({ multiple = false, children, }) {
+    const [expandedItemsStorage, setExpandedItemsStorage] = useState([]);
+    const setExpandedItems = (newState) => {
+        setExpandedItemsStorage((items) => [...new Set(newState(items))]);
+    };
+    return (_jsx(AccordionContext.Provider, { value: {
+            multiple,
+            expandedItems: expandedItemsStorage,
+            setExpandedItems,
+        }, children: _jsx("div", { className: "accordion", role: "tablist", "aria-multiselectable": multiple, children: children }) }));
+}

package/components/back-to-top.d.ts

@@ -1,3 +1,2 @@
-declare const BackToTop: () => import("react/jsx-runtime").JSX.Element;
-export default BackToTop;
+export default function BackToTop(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=back-to-top.d.ts.map

package/components/back-to-top.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"back-to-top.d.ts","sourceRoot":"","sources":["../src/components/back-to-top.tsx"],"names":[],"mappings":"AAAA,QAAA,MAAM,SAAS,+CAMd,CAAA;AAED,eAAe,SAAS,CAAA"}
+{"version":3,"file":"back-to-top.d.ts","sourceRoot":"","sources":["../src/components/back-to-top.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,UAAU,SAAS,4CAMhC"}

package/components/back-to-top.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-const BackToTop = () => {
+export default function BackToTop() {
     return (_jsx("div", { className: "back-to-top", id: "back-to-top", children: _jsx("a", { href: "#top", children: "Back to Top" }) }));
-};
-export default BackToTop;
+}

package/components/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EAEpB,cAAc,EACd,iBAAiB,EAEjB,iBAAiB,EAGlB,MAAM,OAAO,CAAA;AAGd,KAAK,KAAK,GAAG,CACT,iBAAiB,CAAC,cAAc,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC,GACxE,oBAAoB,CAAC,iBAAiB,CAAC,GACvC,oBAAoB,CAAC,iBAAiB,CAAC,CAC1C,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;;AAgED,wBAA2B;AAC3B,YAAY,EAAE,KAAK,IAAI,WAAW,EAAE,CAAA"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EAEpB,cAAc,EACd,iBAAiB,EAEjB,iBAAiB,EAGlB,MAAM,OAAO,CAAA;AAGd,KAAK,KAAK,GAAG,CACT,iBAAiB,CAAC,cAAc,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC,GACxE,oBAAoB,CAAC,iBAAiB,CAAC,GACvC,oBAAoB,CAAC,iBAAiB,CAAC,CAC1C,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;;AA8DD,wBAAuC;AACvC,YAAY,EAAE,KAAK,IAAI,WAAW,EAAE,CAAA"}

package/components/button.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, memo, } from 'react';
 import { extendClass } from '../utils';
-const Button = forwardRef(({ children, label, label_a11y, onClick, className = '', href, ...props }, ref) => {
+function Button({ children, label, label_a11y, onClick, className = '', href, ...props }, ref) {
     className = `button ${className}`;
     const renderedChildren = (_jsxs(_Fragment, { children: [label_a11y && _jsx("span", { className: "screenreader-text", children: label_a11y }), label && (_jsx("span", { className: `${extendClass(className, 'label')}`, "aria-hidden": label_a11y !== undefined, "data-text": label, children: label })), children] }));
     const linkProps = {
@@ -22,5 +22,5 @@ const Button = forwardRef(({ children, label, label_a11y, onClick, className = '
         ref,
     };
     return _jsx("button", { ...buttonProps, children: renderedChildren });
-});
-export default memo(Button);
+}
+export default memo(forwardRef(Button));

package/components/context-wrapper.d.ts

@@ -1,4 +1,3 @@
 import { PropsWithChildren } from 'react';
-declare const ContextWrapper: ({ children }: PropsWithChildren<{}>) => import("react/jsx-runtime").JSX.Element;
-export default ContextWrapper;
+export default function ContextWrapper({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=context-wrapper.d.ts.map

package/components/context-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context-wrapper.d.ts","sourceRoot":"","sources":["../src/components/context-wrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAGzC,QAAA,MAAM,cAAc,iBAAkB,kBAAkB,EAAE,CAAC,4CAM1D,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"context-wrapper.d.ts","sourceRoot":"","sources":["../src/components/context-wrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAGzC,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,CAAC,EAAE,CAAC,2CAQzE"}

package/components/context-wrapper.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { GoogleReCaptchaProvider } from 'react-google-recaptcha-v3';
-const ContextWrapper = ({ children }) => (_jsx(GoogleReCaptchaProvider, { reCaptchaKey: process.env.NEXT_PUBLIC_RECAPTCHA_KEY, children: children }));
-export default ContextWrapper;
+export default function ContextWrapper({ children }) {
+    return (_jsx(GoogleReCaptchaProvider, { reCaptchaKey: process.env.NEXT_PUBLIC_RECAPTCHA_KEY, children: children }));
+}

package/components/cookie-banner.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-declare const CookieBanner: ({ allowCustomisation, allowReject, title, text, formText, policyLink, policyLabel, acceptLabel, acceptAllLabel, rejectLabel, customiseLabel, renderAcceptButton, renderCustomiseButton, renderRejectButton, renderSubmitButton, }: {
+export default function CookieBanner({ allowCustomisation, allowReject, title, text, formText, policyLink, policyLabel, acceptLabel, acceptAllLabel, rejectLabel, customiseLabel, tracking, necessary, renderAcceptButton, renderCustomiseButton, renderRejectButton, renderSubmitButton, }: {
     allowCustomisation?: boolean;
     allowReject?: boolean;
     title?: string;
@@ -11,10 +11,15 @@ declare const CookieBanner: ({ allowCustomisation, allowReject, title, text, for
     acceptAllLabel?: string;
     rejectLabel?: string;
     customiseLabel?: string;
+    tracking?: {
+        [key: string]: string;
+    };
+    necessary?: {
+        [key: string]: string;
+    };
     renderAcceptButton?: (props: {}) => ReactNode;
     renderCustomiseButton?: (props: {}) => ReactNode;
     renderRejectButton?: (props: {}) => ReactNode;
     renderSubmitButton?: () => ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
-export default CookieBanner;
+}): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=cookie-banner.d.ts.map

package/components/cookie-banner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cookie-banner.d.ts","sourceRoot":"","sources":["../src/components/cookie-banner.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAA;AA6BtD,QAAA,MAAM,YAAY,sOAgBf;IACD,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAC7C,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAChD,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAC7C,kBAAkB,CAAC,EAAE,MAAM,SAAS,CAAA;CACrC,4CA4JA,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"cookie-banner.d.ts","sourceRoot":"","sources":["../src/components/cookie-banner.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAA;AA6BtD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,kBAAyB,EACzB,WAAmB,EACnB,KAAqB,EACrB,IAAmB,EACnB,QAA4B,EAC5B,UAA+B,EAC/B,WAAiC,EACjC,WAAiC,EACjC,cAAuC,EACvC,WAAiC,EACjC,cAAuC,EACvC,QAA2B,EAC3B,SAA6B,EAC7B,kBAAkB,EAClB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,GACnB,EAAE;IACD,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IACpC,SAAS,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IACrC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAC7C,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAChD,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,SAAS,CAAA;IAC7C,kBAAkB,CAAC,EAAE,MAAM,SAAS,CAAA;CACrC,2CA4JA"}

package/components/cookie-banner.js

@@ -25,7 +25,7 @@ const content = {
         description: 'These cookies are necessary for the website to function and cannot be switched off.',
     },
 };
-const CookieBanner = ({ allowCustomisation = true, allowReject = false, title = content.title, text = content.text, formText = content.form_text, policyLink = content.policyLink, policyLabel = content.policyLabel, acceptLabel = content.acceptLabel, acceptAllLabel = content.acceptAllLabel, rejectLabel = content.rejectLabel, customiseLabel = content.customiseLabel, renderAcceptButton, renderCustomiseButton, renderRejectButton, renderSubmitButton, }) => {
+export default function CookieBanner({ allowCustomisation = true, allowReject = false, title = content.title, text = content.text, formText = content.form_text, policyLink = content.policyLink, policyLabel = content.policyLabel, acceptLabel = content.acceptLabel, acceptAllLabel = content.acceptAllLabel, rejectLabel = content.rejectLabel, customiseLabel = content.customiseLabel, tracking = content.tracking, necessary = content.necessary, renderAcceptButton, renderCustomiseButton, renderRejectButton, renderSubmitButton, }) {
     const { cookiesAccepted, setCookiesAccepted, trackingCookiesAccepted, setTrackingCookiesAccepted, popupOpen, closePopup, } = useCookieStore();
     const [animate, setAnimate] = useState(false);
     const [formOpen, setFormOpen] = useState(false);
@@ -57,15 +57,15 @@ const CookieBanner = ({ allowCustomisation = true, allowReject = false, title =
     const trueAcceptLabel = !allowCustomisation || formOpen ? acceptLabel : acceptAllLabel;
     const schema = Yup.object().shape({
         tracking: Yup.boolean().required().default(trackingCookiesAccepted).label(`
-      <strong>${content.tracking?.title}</strong>
-      <p>${content.tracking?.description}</p>
+      <strong>${tracking?.title}</strong>
+      <p>${tracking?.description}</p>
     `),
         necessary: Yup.boolean()
             .required()
             .default(true)
             .label(`
-        <strong>${content.necessary?.title}</strong>
-        <p>${content.necessary?.description}</p>
+        <strong>${necessary?.title}</strong>
+        <p>${necessary?.description}</p>
       `)
             .meta({ disabled: true }),
     });
@@ -73,5 +73,4 @@ const CookieBanner = ({ allowCustomisation = true, allowReject = false, title =
         setReady(true);
     }, []);
     return (_jsx(_Fragment, { children: ready && ((!rejected && !cookiesAccepted) || popupOpen) ? (_jsx("div", { className: `cookie-banner ${animate ? ' cookie-banner--hide' : ''} `, children: _jsx("div", { className: "cookie-banner__container container", children: _jsxs("div", { className: "cookie-banner__inner", children: [allowCustomisation && (_jsxs("div", { className: "cookie-banner__form", "aria-hidden": !formOpen, children: [formText && (_jsx("p", { className: "cookie-banner__form-text", children: formText })), _jsx(Form, { useRecaptcha: false, className: "cookie-banner__form", schema: schema, onSubmit: submit, renderSubmit: () => renderSubmitButton ? (renderSubmitButton()) : (_jsx(SubmitButton, { label: acceptLabel })), renderSuccessMessage: false })] })), _jsxs("div", { className: "cookie-banner__main", children: [_jsxs("div", { className: "cookie-banner__message", "aria-hidden": formOpen, children: [title && _jsx("h2", { className: "cookie-banner__title", children: title }), text && (_jsxs("p", { className: "cookie-banner__text", children: [text, " ", _jsx("a", { href: policyLink, children: policyLabel })] }))] }), _jsxs("div", { className: "cookie-banner__buttons", children: [allowCustomisation && !formOpen && (_jsx(_Fragment, { children: renderCustomiseButton ? (renderCustomiseButton({ onClick: openForm })) : (_jsx(Button, { onClick: openForm, className: "cookie-banner__customise", label: customiseLabel })) })), allowReject && !formOpen && (_jsx(_Fragment, { children: renderRejectButton ? (renderRejectButton({ onClick: reject })) : (_jsx(Button, { onClick: reject, className: "cookie-banner__reject", label: rejectLabel })) })), !formOpen && (_jsx(_Fragment, { children: renderAcceptButton ? (renderAcceptButton({ onClick: acceptAll })) : (_jsx(Button, { onClick: acceptAll, className: "cookie-banner__accept", label: trueAcceptLabel })) }))] })] })] }) }) })) : ('') }));
-};
-export default CookieBanner;
+}

package/components/form/error-message.d.ts

@@ -4,6 +4,5 @@ export interface ErrorMessageProps {
     error?: FieldError | Merge<FieldError, FieldErrorsImpl<any>>;
     fieldSchema?: AnySchema;
 }
-declare const ErrorMessage: ({ error }: ErrorMessageProps) => import("react/jsx-runtime").JSX.Element;
-export default ErrorMessage;
+export default function ErrorMessage({ error }: ErrorMessageProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=error-message.d.ts.map

package/components/form/error-message.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"error-message.d.ts","sourceRoot":"","sources":["../../src/components/form/error-message.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAE/B,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,UAAU,GAAG,KAAK,CAAC,UAAU,EAAE,eAAe,CAAC,GAAG,CAAC,CAAC,CAAA;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB;AAED,QAAA,MAAM,YAAY,cAAe,iBAAiB,4CAQjD,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"error-message.d.ts","sourceRoot":"","sources":["../../src/components/form/error-message.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAE/B,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,UAAU,GAAG,KAAK,CAAC,UAAU,EAAE,eAAe,CAAC,GAAG,CAAC,CAAC,CAAA;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE,iBAAiB,2CAQhE"}

package/components/form/error-message.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-const ErrorMessage = ({ error }) => {
+export default function ErrorMessage({ error }) {
     const GENERIC_ERROR = 'Sorry, an error occurred';
     return (_jsx("span", { className: "form__error", children: error?.message || GENERIC_ERROR }));
-};
-export default ErrorMessage;
+}

package/components/form/field.d.ts

@@ -1,4 +1,4 @@
-import { FormEventHandler } from 'react';
+import { FormEventHandler, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes } from 'react';
 import { AnySchema } from 'yup';
 import { UseFormRegisterReturn } from 'react-hook-form';
 interface Props {
@@ -6,7 +6,15 @@ interface Props {
     schema: AnySchema<any>;
     id?: string;
     onInput?: FormEventHandler<HTMLElement>;
+    onChange?: FormEventHandler<HTMLElement>;
+    value?: any;
+    disabled?: boolean;
 }
-declare const FormField: ({ register, schema, id, onInput }: Props) => import("react/jsx-runtime").JSX.Element;
-export default FormField;
+export type InputFieldType = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;
+export type InputProps = InputHTMLAttributes<HTMLInputElement>;
+export type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement>;
+export type SelectProps = SelectHTMLAttributes<HTMLSelectElement>;
+export type FieldProps = InputProps | TextareaProps | SelectProps;
+declare const _default: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<InputFieldType>>;
+export default _default;
 //# sourceMappingURL=field.d.ts.map

package/components/form/field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/components/form/field.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,gBAAgB,EAAuB,MAAM,OAAO,CAAA;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAEvD,UAAU,KAAK;IACb,QAAQ,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAA;IACvC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAA;CACxC;AAED,QAAA,MAAM,SAAS,sCAAuC,KAAK,4CAuE1D,CAAA;AAED,eAAe,SAAS,CAAA"}
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/components/form/field.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,gBAAgB,EAGhB,mBAAmB,EAEnB,oBAAoB,EACpB,sBAAsB,EAGvB,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAGvD,UAAU,KAAK;IACb,QAAQ,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAA;IACvC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACvC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACxC,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,MAAM,cAAc,GACtB,gBAAgB,GAChB,mBAAmB,GACnB,iBAAiB,CAAA;AAErB,MAAM,MAAM,UAAU,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAC9D,MAAM,MAAM,aAAa,GAAG,sBAAsB,CAAC,mBAAmB,CAAC,CAAA;AACvE,MAAM,MAAM,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAA;AAEjE,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,CAAA;;AAmHjE,wBAAoC"}

package/components/form/field.js

@@ -1,7 +1,8 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-const FormField = ({ register, schema, id, onInput }) => {
+import { forwardRef, useEffect, useState, } from 'react';
+import FileField from './file-field';
+function FormField({ register, schema, id, onInput, onChange, value, disabled = false }, ref) {
     const [touched, setTouched] = useState(false);
     const [rendered, setRendered] = useState(false);
     const fieldProps = {
@@ -10,23 +11,33 @@ const FormField = ({ register, schema, id, onInput }) => {
             ? { value: schema?.spec?.default }
             : {}),
         ...(id ? { id } : {}),
-        ...(schema?.spec?.meta?.disabled ? { disabled: true } : {}),
+        ...(disabled || schema?.spec?.meta?.disabled ? { disabled: true } : {}),
+        ...(schema?.spec?.meta?.multiple ? { multiple: true } : {}),
         ...(schema?.spec?.meta?.placeholder
             ? { placeholder: schema?.spec?.meta?.placeholder }
             : {}),
+        ...(schema?.spec?.meta?.autocomplete
+            ? { autocomplete: schema?.spec?.meta?.autocomplete }
+            : {}),
         onInput: (event) => {
             setTouched(true);
             if (onInput) {
                 onInput(event);
             }
         },
+        onChange: (event) => {
+            setTouched(true);
+            if (onChange) {
+                onChange(event);
+            }
+        },
     };
     useEffect(() => {
         setRendered(true);
     }, []);
     if (schema?.spec?.meta?.options?.length > 0) {
-        return (_jsxs("select", { className: "form__control form__control--select", ...fieldProps, children: [schema?.spec?.meta?.placeholder ? (_jsx("option", { value: "", children: schema?.spec?.meta?.placeholder }, 'placeholder')) : null, schema?.spec?.meta?.options?.map((value, index) => (_jsx("option", { value: value, children: value }, value)))] }));
+        return (_jsxs("select", { className: "form__control form__control--select", ...fieldProps, ref: ref, children: [schema?.spec?.meta?.placeholder ? (_jsx("option", { value: "", children: schema?.spec?.meta?.placeholder }, 'placeholder')) : null, schema?.spec?.meta?.options?.map((optionValue, index) => (_jsx("option", { value: optionValue, children: optionValue }, optionValue)))] }));
     }
-    return (_jsx(_Fragment, { children: schema?.spec?.meta?.textarea === true ? (_jsx("textarea", { className: "form__control", ...fieldProps })) : schema?.type === 'boolean' ? (_jsx("input", { type: "checkbox", className: "form__control form__control--checkbox", checked: !rendered ? schema?.spec?.default : null, ...fieldProps })) : schema?.spec?.meta?.hidden === true ? (_jsx("input", { type: "hidden", className: "form__control form__control--hidden", ...fieldProps })) : schema?.type === 'mixed' ? (_jsx("input", { className: "form__control form__control--mixed", type: "file", ...fieldProps })) : (_jsx("input", { className: "form__control", ...fieldProps })) }));
-};
-export default FormField;
+    return (_jsx(_Fragment, { children: schema?.spec?.meta?.textarea === true ? (_jsx("textarea", { className: "form__control", ...fieldProps, ref: ref })) : schema?.type === 'boolean' ? (_jsx("input", { type: "checkbox", className: "form__control form__control--checkbox", checked: !rendered ? schema?.spec?.default : null, value: "true", ...fieldProps, ref: ref })) : schema?.type === 'date' ? (_jsx("input", { type: "date", className: "form__control form__control--date", ...fieldProps, ref: ref })) : schema?.spec?.meta?.hidden === true ? (_jsx("input", { type: "hidden", className: "form__control form__control--hidden", ...fieldProps, ref: ref })) : schema?.type === 'mixed' ? (_jsx(_Fragment, { children: _jsx(FileField, { schema: schema, ...fieldProps, ref: ref }) })) : (_jsx("input", { className: "form__control", ...fieldProps, ref: ref })) }));
+}
+export default forwardRef(FormField);

package/components/form/file-field.d.ts

@@ -0,0 +1,15 @@
+import { AnySchema } from 'yup';
+import { InputProps } from './field';
+interface Props extends InputProps {
+    schema: AnySchema<any>;
+}
+interface File {
+    url: string;
+    name: string;
+}
+export declare function Files({ files }: {
+    files: File[];
+}): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLInputElement>>;
+export default _default;
+//# sourceMappingURL=file-field.d.ts.map

package/components/form/file-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-field.d.ts","sourceRoot":"","sources":["../../src/components/form/file-field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AASpC,UAAU,KAAM,SAAQ,UAAU;IAChC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;CACvB;AAED,UAAU,IAAI;IACZ,GAAG,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;CACb;AAED,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,2CAoBjD;;AA2CD,wBAAoC"}

package/components/form/file-field.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef, useState, } from 'react';
+export function Files({ files }) {
+    return (_jsx("ul", { className: "form__file-list", children: files.map((file) => (_jsxs("li", { className: "form__file-list-item", children: [_jsx("figure", { className: "form__file-list-image", children: _jsx("img", { src: file.url, alt: file.name }) }), _jsx("a", { href: file.url, download: file.name, className: "form__file-list-name", children: file.name })] }, file.name))) }));
+}
+function FileField({ schema, ...fieldProps }, ref) {
+    const [files, setFiles] = useState([]);
+    const originalOnInput = fieldProps.onInput;
+    fieldProps.onInput = (event) => {
+        const target = event.target;
+        const newFiles = Array.from(target.files || []).map((file) => ({
+            name: file.name,
+            url: URL.createObjectURL(file),
+        }));
+        setFiles(newFiles);
+        target.blur();
+        if (originalOnInput) {
+            originalOnInput(event);
+        }
+    };
+    const input = (_jsx(_Fragment, { children: _jsx("input", { className: "form__control form__control--mixed", type: "file", ...fieldProps, ref: ref }) }));
+    return (_jsxs("fieldset", { className: "form__file-upload-wrapper", children: [input, _jsx(Files, { files: files })] }));
+}
+export default forwardRef(FileField);

package/components/form/submit-button.d.ts

@@ -1,5 +1,5 @@
-declare const SubmitButton: ({ label }: {
+import { ButtonHTMLAttributes } from 'react';
+export default function SubmitButton({ label, ...props }: {
     label?: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export default SubmitButton;
+} & ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=submit-button.d.ts.map

package/components/form/submit-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"submit-button.d.ts","sourceRoot":"","sources":["../../src/components/form/submit-button.tsx"],"names":[],"mappings":"AAEA,QAAA,MAAM,YAAY,cAAe;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,4CAIlD,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"submit-button.d.ts","sourceRoot":"","sources":["../../src/components/form/submit-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAA;AAG5C,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,KAAgB,EAChB,GAAG,KAAK,EACT,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,2CAI9D"}

package/components/form/submit-button.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from '../../components';
-const SubmitButton = ({ label }) => {
-    return (_jsx(Button, { label: label || 'Submit', className: "form__submit", type: "submit" }));
-};
-export default SubmitButton;
+export default function SubmitButton({ label = 'Submit', ...props }) {
+    return (_jsx(Button, { label: label, className: "form__submit", type: "submit", ...props }));
+}

package/components/form/success-message.d.ts

@@ -1,3 +1,4 @@
-declare const SuccessMessage: () => import("react/jsx-runtime").JSX.Element;
-export default SuccessMessage;
+export default function SuccessMessage({ data, }: {
+    data: Record<string, any>;
+}): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=success-message.d.ts.map

package/components/form/success-message.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"success-message.d.ts","sourceRoot":"","sources":["../../src/components/form/success-message.tsx"],"names":[],"mappings":"AAAA,QAAA,MAAM,cAAc,+CAOnB,CAAA;AACD,eAAe,cAAc,CAAA"}
+{"version":3,"file":"success-message.d.ts","sourceRoot":"","sources":["../../src/components/form/success-message.tsx"],"names":[],"mappings":"AAIA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,IAAI,GACL,EAAE;IACD,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAC1B,2CAeA"}

package/components/form/success-message.js

@@ -1,3 +1,10 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const SuccessMessage = () => (_jsxs("div", { className: "success-message", children: [_jsx("h2", { className: "success-message__title", children: "Thanks for your message" }), _jsx("p", { className: "success-message__text", children: "We'll get back to you as soon as possible." })] }));
-export default SuccessMessage;
+import { useEffect, useRef } from 'react';
+export default function SuccessMessage({ data, }) {
+    const ref = useRef(null);
+    useEffect(() => {
+        ref.current?.scrollIntoView({ behavior: 'smooth' });
+    }, []);
+    return (_jsxs("div", { className: "success-message", ref: ref, children: [_jsx("h2", { className: "success-message__title", children: "Thanks for your message" }), _jsx("p", { className: "success-message__text", children: "We'll get back to you as soon as possible." })] }));
+}

package/components/form.d.ts

@@ -1,27 +1,43 @@
-import { ReactNode } from 'react';
+import { ReactNode, ButtonHTMLAttributes } from 'react';
 import { ObjectSchema, InferType, AnySchema } from 'yup';
 import { FieldError } from 'react-hook-form';
 import { Status } from '../hooks/use-async';
 import { FieldRenderer } from './form/types';
-export interface FormProps<T extends ObjectSchema<any>> {
+type WithRecaptcha<T> = T & {
+    recaptchaToken?: string;
+};
+export interface FormProps<T extends ObjectSchema<any>, DataStructure extends InferType<T> = InferType<T>> {
     schema: T;
     name?: string;
-    action?: string | ((data: InferType<T>, token: string) => any);
+    action?: any;
+    disabled?: boolean;
     className?: string;
     method?: string;
     initialData?: {
         [P in T as string]: any;
     };
     onSubmit?: (data: InferType<T>) => void;
+    onChange?: (data: InferType<T>) => void;
     onStatusChange?: (status: Status) => void;
     renderSuccessMessage?: ((data: InferType<T>) => ReactNode) | false;
     renderErrorMessage?: (error?: FieldError, fieldSchema?: AnySchema) => ReactNode;
-    renderSubmit?: () => ReactNode;
+    renderSubmit?: (props: {
+        label?: string;
+    } & ButtonHTMLAttributes<HTMLButtonElement>) => ReactNode;
     renderers?: {
-        [P in T as string]: FieldRenderer;
+        [P in DataStructure]: FieldRenderer;
     };
     useRecaptcha?: boolean;
 }
-declare const _default: import("react").ForwardRefExoticComponent<FormProps<ObjectSchema<any, import("yup").AnyObject, any, "">> & import("react").RefAttributes<HTMLFormElement>>;
+export interface FormRef<T extends ObjectSchema<any>, DataStructure extends InferType<T> = InferType<T>> {
+    form: HTMLFormElement;
+    submit: () => void;
+    reset: () => void;
+    values: WithRecaptcha<DataStructure>;
+    fields: {
+        [P in DataStructure as string]?: HTMLElement;
+    };
+}
+declare const _default: import("react").ForwardRefExoticComponent<FormProps<ObjectSchema<any, import("yup").AnyObject, any, "">, any> & import("react").RefAttributes<FormRef<ObjectSchema<any, import("yup").AnyObject, any, "">, any>>>;
 export default _default;
 //# sourceMappingURL=form.d.ts.map

package/components/form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../src/components/form.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAQV,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAExD,OAAO,EAAE,UAAU,EAAW,MAAM,iBAAiB,CAAA;AAErD,OAAiB,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAa5C,MAAM,WAAW,SAAS,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC;IACpD,MAAM,EAAE,CAAC,CAAA;IACT,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,CAAC,CAAA;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE;SAAG,CAAC,IAAI,CAAC,IAAI,MAAM,GAAG,GAAG;KAAE,CAAA;IACzC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAA;IACvC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,oBAAoB,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC,GAAG,KAAK,CAAA;IAClE,kBAAkB,CAAC,EAAE,CACnB,KAAK,CAAC,EAAE,UAAU,EAClB,WAAW,CAAC,EAAE,SAAS,KACpB,SAAS,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,SAAS,CAAA;IAC9B,SAAS,CAAC,EAAE;SAAG,CAAC,IAAI,CAAC,IAAI,MAAM,GAAG,aAAa;KAAE,CAAA;IACjD,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;;AA8QD,wBAA+B"}
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../src/components/form.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,SAAS,EAUT,oBAAoB,EACrB,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AAExD,OAAO,EAAiB,UAAU,EAAiB,MAAM,iBAAiB,CAAA;AAE1E,OAAiB,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAY5C,KAAK,aAAa,CAAC,CAAC,IAAI,CAAC,GAAG;IAAE,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAEvD,MAAM,WAAW,SAAS,CACxB,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,EAC3B,aAAa,SAAS,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC;IAEjD,MAAM,EAAE,CAAC,CAAA;IACT,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,GAAG,CAAA;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE;SAAG,CAAC,IAAI,CAAC,IAAI,MAAM,GAAG,GAAG;KAAE,CAAA;IACzC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAA;IACvC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAA;IACvC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,oBAAoB,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC,GAAG,KAAK,CAAA;IAClE,kBAAkB,CAAC,EAAE,CACnB,KAAK,CAAC,EAAE,UAAU,EAClB,WAAW,CAAC,EAAE,SAAS,KACpB,SAAS,CAAA;IACd,YAAY,CAAC,EAAE,CACb,KAAK,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,KAChE,SAAS,CAAA;IACd,SAAS,CAAC,EAAE;SAAG,CAAC,IAAI,aAAa,GAAG,aAAa;KAAE,CAAA;IACnD,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,OAAO,CACtB,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,EAC3B,aAAa,SAAS,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC;IAEjD,IAAI,EAAE,eAAe,CAAA;IACrB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,MAAM,EAAE,aAAa,CAAC,aAAa,CAAC,CAAA;IACpC,MAAM,EAAE;SACL,CAAC,IAAI,aAAa,IAAI,MAAM,CAAC,CAAC,EAAE,WAAW;KAC7C,CAAA;CACF;;AAsVD,wBAA+B"}