@pickle-ui/react-native 1.0.0-beta.1 → 1.0.0-beta.3

package/dist/components/form/FormCheckbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormCheckbox.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormCheckbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAO1D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,SAAS,CAAC,GAAG;IAC3E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,uDAAuD;AACvD,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EAAE,QAAQ,EACd,eAAe,EACf,GAAG,KAAK,EACT,EAAE,iBAAiB,+BAuBnB"}

package/dist/components/form/FormCheckbox.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useController } from 'react-hook-form';
+import { Checkbox } from './Checkbox';
+import { useFormControlProps, useFormMethods, useRequiredFieldName, } from './Form.context';
+/** A `Checkbox` bound to the field's boolean value. */
+export function FormCheckbox({ name: nameProp, onCheckedChange, ...props }) {
+    const name = useRequiredFieldName(nameProp, 'Form.Checkbox');
+    const { control } = useFormMethods();
+    const { field } = useController({
+        control,
+        defaultValue: props.defaultChecked ?? false,
+        name,
+    });
+    const { accessibilityLabel, invalid } = useFormControlProps();
+    return (_jsx(Checkbox
+    // A `label` already names the checkbox.
+    , { 
+        // A `label` already names the checkbox.
+        accessibilityLabel: props.label ? undefined : accessibilityLabel, ...props, checked: Boolean(field.value), invalid: invalid, onCheckedChange: (checked) => {
+            field.onChange(checked);
+            onCheckedChange?.(checked);
+        } }));
+}
+//# sourceMappingURL=FormCheckbox.js.map

package/dist/components/form/FormCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormCheckbox.js","sourceRoot":"","sources":["../../../src/components/form/FormCheckbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAsB,MAAM,YAAY,CAAC;AAC1D,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,MAAM,gBAAgB,CAAC;AAMxB,uDAAuD;AACvD,MAAM,UAAU,YAAY,CAAC,EAC3B,IAAI,EAAE,QAAQ,EACd,eAAe,EACf,GAAG,KAAK,EACU;IAClB,MAAM,IAAI,GAAG,oBAAoB,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;IAC7D,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAAC;QAC9B,OAAO;QACP,YAAY,EAAE,KAAK,CAAC,cAAc,IAAI,KAAK;QAC3C,IAAI;KACL,CAAC,CAAC;IACH,MAAM,EAAE,kBAAkB,EAAE,OAAO,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAE9D,OAAO,CACL,KAAC,QAAQ;IACP,wCAAwC;;QAAxC,wCAAwC;QACxC,kBAAkB,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB,KAC5D,KAAK,EACT,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,EAC7B,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,CAAC,OAAO,EAAE,EAAE;YAC3B,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YACxB,eAAe,EAAE,CAAC,OAAO,CAAC,CAAC;QAC7B,CAAC,GACD,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/FormDescription.d.ts

@@ -0,0 +1,4 @@
+import { Text } from 'react-native';
+export type FormDescriptionProps = React.ComponentProps<typeof Text>;
+export declare function FormDescription({ className, ...props }: FormDescriptionProps): import("react").JSX.Element;
+//# sourceMappingURL=FormDescription.d.ts.map

package/dist/components/form/FormDescription.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormDescription.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormDescription.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAIpC,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAErE,wBAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,+BAO5E"}

package/dist/components/form/FormDescription.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text } from 'react-native';
+import { cn } from '../../lib/cn';
+export function FormDescription({ className, ...props }) {
+    return (_jsx(Text, { className: cn('text-muted-foreground font-sans text-sm', className), ...props }));
+}
+//# sourceMappingURL=FormDescription.js.map

package/dist/components/form/FormDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormDescription.js","sourceRoot":"","sources":["../../../src/components/form/FormDescription.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAIlC,MAAM,UAAU,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB;IAC3E,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CAAC,yCAAyC,EAAE,SAAS,CAAC,KAC/D,KAAK,GACT,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/FormError.d.ts

@@ -0,0 +1,5 @@
+import { Text } from 'react-native';
+export type FormErrorProps = React.ComponentProps<typeof Text>;
+/** Announced by screen readers when it appears, like the web's live error. */
+export declare function FormError({ className, ...props }: FormErrorProps): import("react").JSX.Element;
+//# sourceMappingURL=FormError.d.ts.map

package/dist/components/form/FormError.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormError.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAIpC,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAE/D,8EAA8E;AAC9E,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAYhE"}

package/dist/components/form/FormError.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text } from 'react-native';
+import { cn } from '../../lib/cn';
+/** Announced by screen readers when it appears, like the web's live error. */
+export function FormError({ className, ...props }) {
+    return (_jsx(Text, { accessibilityLiveRegion: "polite", className: cn('text-destructive font-sans text-sm font-medium', className), role: "alert", ...props }));
+}
+//# sourceMappingURL=FormError.js.map

package/dist/components/form/FormError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormError.js","sourceRoot":"","sources":["../../../src/components/form/FormError.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAIlC,8EAA8E;AAC9E,MAAM,UAAU,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB;IAC/D,OAAO,CACL,KAAC,IAAI,IACH,uBAAuB,EAAC,QAAQ,EAChC,SAAS,EAAE,EAAE,CACX,gDAAgD,EAChD,SAAS,CACV,EACD,IAAI,EAAC,OAAO,KACR,KAAK,GACT,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/FormField.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from 'react';
+import { View } from 'react-native';
+export type FormFieldProps = Omit<React.ComponentProps<typeof View>, 'children'> & {
+    children: ReactNode;
+    description?: ReactNode;
+    /** Replaces the error message React Hook Form holds for the field. */
+    error?: ReactNode;
+    /** Names the control and focuses it when pressed, like the web's `<label>`. */
+    label?: ReactNode;
+    name?: string;
+};
+/**
+ * A labelled field bound to `name`, like `Form.Field` in @pickle-ui/react:
+ * the label, the control, then the field's error or its description.
+ */
+export declare function FormField({ children, className, description, error, label, name, ...props }: FormFieldProps): import("react").JSX.Element;
+//# sourceMappingURL=FormField.d.ts.map

package/dist/components/form/FormField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA0B,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAYpC,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EACjC,UAAU,CACX,GAAG;IACF,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,WAAW,EACX,KAAK,EACL,KAAK,EACL,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,cAAc,+BA0ChB"}

package/dist/components/form/FormField.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useMemo, useRef } from 'react';
+import { useFormState } from 'react-hook-form';
+import { View } from 'react-native';
+import { cn } from '../../lib/cn';
+import { FormFieldContext, getErrorMessage, useFormMethods, } from './Form.context';
+import { FormDescription } from './FormDescription';
+import { FormError } from './FormError';
+import { FormLabel } from './FormLabel';
+/**
+ * A labelled field bound to `name`, like `Form.Field` in @pickle-ui/react:
+ * the label, the control, then the field's error or its description.
+ */
+export function FormField({ children, className, description, error, label, name, ...props }) {
+    const { control, getFieldState } = useFormMethods();
+    const formState = useFormState({
+        control,
+        disabled: !name,
+        exact: true,
+        name,
+    });
+    const fieldError = name ? getFieldState(name, formState).error : undefined;
+    const errorMessage = error ?? getErrorMessage(fieldError);
+    const labelId = useId();
+    const controlRef = useRef(null);
+    const context = useMemo(() => ({
+        label,
+        labelId: label ? labelId : undefined,
+        name,
+        setControl: (target) => {
+            controlRef.current = target;
+        },
+    }), [label, labelId, name]);
+    return (_jsxs(View, { className: cn('gap-2.5', className), ...props, children: [label ? (_jsx(FormLabel, { nativeID: labelId, onPress: () => controlRef.current?.focus(), children: label })) : null, _jsx(FormFieldContext, { value: context, children: children }), errorMessage ? (_jsx(FormError, { children: errorMessage })) : description ? (_jsx(FormDescription, { children: description })) : null] }));
+}
+//# sourceMappingURL=FormField.js.map

package/dist/components/form/FormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAkB,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EACL,gBAAgB,EAChB,eAAe,EACf,cAAc,GACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAexC;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,WAAW,EACX,KAAK,EACL,KAAK,EACL,IAAI,EACJ,GAAG,KAAK,EACO;IACf,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IACpD,MAAM,SAAS,GAAG,YAAY,CAAC;QAC7B,OAAO;QACP,QAAQ,EAAE,CAAC,IAAI;QACf,KAAK,EAAE,IAAI;QACX,IAAI;KACL,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3E,MAAM,YAAY,GAAG,KAAK,IAAI,eAAe,CAAC,UAAU,CAAC,CAAC;IAC1D,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IACxB,MAAM,UAAU,GAAG,MAAM,CAA+B,IAAI,CAAC,CAAC;IAC9D,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CAAC;QACL,KAAK;QACL,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;QACpC,IAAI;QACJ,UAAU,EAAE,CAAC,MAAoC,EAAE,EAAE;YACnD,UAAU,CAAC,OAAO,GAAG,MAAM,CAAC;QAC9B,CAAC;KACF,CAAC,EACF,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,CACvB,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,KAAM,KAAK,aACjD,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,SAAS,IACR,QAAQ,EAAE,OAAO,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,YAEzC,KAAK,GACI,CACb,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,gBAAgB,IAAC,KAAK,EAAE,OAAO,YAAG,QAAQ,GAAoB,EAC9D,YAAY,CAAC,CAAC,CAAC,CACd,KAAC,SAAS,cAAE,YAAY,GAAa,CACtC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAChB,KAAC,eAAe,cAAE,WAAW,GAAmB,CACjD,CAAC,CAAC,CAAC,IAAI,IACH,CACR,CAAC;AACJ,CAAC"}

package/dist/components/form/FormInput.d.ts

@@ -0,0 +1,10 @@
+import { type InputProps } from './Input';
+export type FormInputProps = Omit<InputProps, 'defaultValue' | 'invalid' | 'value'> & {
+    name?: string;
+};
+/**
+ * An `Input` bound to the field's value. The return key submits the form,
+ * like Enter on the web, unless `onSubmitEditing` is set.
+ */
+export declare function FormInput({ name: nameProp, onBlur, onChangeText, onSubmitEditing, ref, ...props }: FormInputProps): import("react").JSX.Element;
+//# sourceMappingURL=FormInput.d.ts.map

package/dist/components/form/FormInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormInput.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAGjD,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,UAAU,EACV,cAAc,GAAG,SAAS,GAAG,OAAO,CACrC,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAItB;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EACZ,eAAe,EACf,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,+BAoChB"}

package/dist/components/form/FormInput.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { use, useImperativeHandle, useRef } from 'react';
+import { useController } from 'react-hook-form';
+import { FormFieldContext, FormInputGroupContext, FormSubmitContext, useFormControlProps, useFormMethods, useRequiredFieldName, } from './Form.context';
+import { Input } from './Input';
+import { InputGroup } from './InputGroup';
+/**
+ * An `Input` bound to the field's value. The return key submits the form,
+ * like Enter on the web, unless `onSubmitEditing` is set.
+ */
+export function FormInput({ name: nameProp, onBlur, onChangeText, onSubmitEditing, ref, ...props }) {
+    const name = useRequiredFieldName(nameProp, 'Form.Input');
+    const { control } = useFormMethods();
+    const { field } = useController({ control, name });
+    const controlProps = useFormControlProps();
+    const fieldContext = use(FormFieldContext);
+    const isInsideInputGroup = use(FormInputGroupContext);
+    const submit = use(FormSubmitContext);
+    const inputRef = useRef(null);
+    useImperativeHandle(ref, () => inputRef.current);
+    const InputComponent = isInsideInputGroup ? InputGroup.Input : Input;
+    return (_jsx(InputComponent, { ...controlProps, ...props, onBlur: (event) => {
+            field.onBlur();
+            onBlur?.(event);
+        }, onChangeText: (text) => {
+            field.onChange(text);
+            onChangeText?.(text);
+        }, onSubmitEditing: onSubmitEditing ?? submit, ref: (node) => {
+            inputRef.current = node;
+            // React Hook Form focuses the first invalid field after a submit,
+            // and the field's label focuses its input when pressed.
+            field.ref(node);
+            fieldContext?.setControl(node);
+        }, value: field.value ?? '' }));
+}
+//# sourceMappingURL=FormInput.js.map

package/dist/components/form/FormInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormInput.js","sourceRoot":"","sources":["../../../src/components/form/FormInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,iBAAiB,EACjB,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,KAAK,EAAmB,MAAM,SAAS,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAS1C;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EACZ,eAAe,EACf,GAAG,EACH,GAAG,KAAK,EACO;IACf,MAAM,IAAI,GAAG,oBAAoB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IAC1D,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACnD,MAAM,YAAY,GAAG,mBAAmB,EAAE,CAAC;IAC3C,MAAM,YAAY,GAAG,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC3C,MAAM,kBAAkB,GAAG,GAAG,CAAC,qBAAqB,CAAC,CAAC;IACtD,MAAM,MAAM,GAAG,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACtC,MAAM,QAAQ,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACxD,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAA4B,CAAC,CAAC;IAEtE,MAAM,cAAc,GAAG,kBAAkB,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;IAErE,OAAO,CACL,KAAC,cAAc,OACT,YAAY,KACZ,KAAK,EACT,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,MAAM,EAAE,CAAC;YACf,MAAM,EAAE,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC,EACD,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;YACrB,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACrB,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC;QACvB,CAAC,EACD,eAAe,EAAE,eAAe,IAAI,MAAM,EAC1C,GAAG,EAAE,CAAC,IAA8B,EAAE,EAAE;YACtC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;YACxB,kEAAkE;YAClE,wDAAwD;YACxD,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;YAChB,YAAY,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,EACD,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,GACxB,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/FormInputGroup.d.ts

@@ -0,0 +1,8 @@
+import { InputGroup } from './InputGroup';
+export type FormInputGroupProps = React.ComponentProps<typeof InputGroup>;
+/**
+ * An `InputGroup` whose `Form.Input` renders `InputGroup.Input`, framed as
+ * invalid while the field has an error.
+ */
+export declare function FormInputGroup({ children, ...props }: FormInputGroupProps): import("react").JSX.Element;
+//# sourceMappingURL=FormInputGroup.d.ts.map

package/dist/components/form/FormInputGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormInputGroup.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormInputGroup.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAE1E;;;GAGG;AACH,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,+BAgBzE"}

package/dist/components/form/FormInputGroup.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Children, isValidElement } from 'react';
+import { FormInputGroupContext, useFormControlProps } from './Form.context';
+import { FormInput } from './FormInput';
+import { InputGroup } from './InputGroup';
+import { InputGroupStateContext } from './InputGroup.context';
+/**
+ * An `InputGroup` whose `Form.Input` renders `InputGroup.Input`, framed as
+ * invalid while the field has an error.
+ */
+export function FormInputGroup({ children, ...props }) {
+    const { invalid } = useFormControlProps();
+    const disabled = Children.toArray(children).some((child) => isValidElement(child) &&
+        child.type === FormInput &&
+        Boolean(child.props.disabled));
+    return (_jsx(FormInputGroupContext, { value: true, children: _jsx(InputGroupStateContext, { value: { disabled, invalid }, children: _jsx(InputGroup, { ...props, children: children }) }) }));
+}
+//# sourceMappingURL=FormInputGroup.js.map

package/dist/components/form/FormInputGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormInputGroup.js","sourceRoot":"","sources":["../../../src/components/form/FormInputGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAuB,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAI9D;;;GAGG;AACH,MAAM,UAAU,cAAc,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAuB;IACxE,MAAM,EAAE,OAAO,EAAE,GAAG,mBAAmB,EAAE,CAAC;IAC1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC9C,CAAC,KAAK,EAAE,EAAE,CACR,cAAc,CAAiB,KAAK,CAAC;QACrC,KAAK,CAAC,IAAI,KAAK,SAAS;QACxB,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,CAChC,CAAC;IAEF,OAAO,CACL,KAAC,qBAAqB,IAAC,KAAK,kBAC1B,KAAC,sBAAsB,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,YAClD,KAAC,UAAU,OAAK,KAAK,YAAG,QAAQ,GAAc,GACvB,GACH,CACzB,CAAC;AACJ,CAAC"}

package/dist/components/form/FormLabel.d.ts

@@ -0,0 +1,4 @@
+import { Text } from 'react-native';
+export type FormLabelProps = React.ComponentProps<typeof Text>;
+export declare function FormLabel({ className, ...props }: FormLabelProps): import("react").JSX.Element;
+//# sourceMappingURL=FormLabel.d.ts.map

package/dist/components/form/FormLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLabel.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAIpC,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAE/D,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAUhE"}

package/dist/components/form/FormLabel.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text } from 'react-native';
+import { cn } from '../../lib/cn';
+export function FormLabel({ className, ...props }) {
+    return (_jsx(Text, { className: cn('text-foreground font-sans text-sm leading-none font-medium', className), ...props }));
+}
+//# sourceMappingURL=FormLabel.js.map

package/dist/components/form/FormLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLabel.js","sourceRoot":"","sources":["../../../src/components/form/FormLabel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAIlC,MAAM,UAAU,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB;IAC/D,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CACX,4DAA4D,EAC5D,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/FormRadioGroup.d.ts

@@ -0,0 +1,11 @@
+import { type RadioGroupProps } from './RadioGroup';
+export type FormRadioGroupProps = Omit<RadioGroupProps, 'value'> & {
+    name?: string;
+};
+/** A `RadioGroup` bound to the field's value. */
+declare function FormRadioGroupRoot({ name: nameProp, onValueChange, ...props }: FormRadioGroupProps): import("react").JSX.Element;
+declare const FormRadioGroup: typeof FormRadioGroupRoot & {
+    Item: typeof import("./RadioGroup").RadioGroupItem;
+};
+export { FormRadioGroup };
+//# sourceMappingURL=FormRadioGroup.d.ts.map

package/dist/components/form/FormRadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormRadioGroup.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEhE,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,eAAe,EAAE,OAAO,CAAC,GAAG;IACjE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,iDAAiD;AACjD,iBAAS,kBAAkB,CAAC,EAC1B,IAAI,EAAE,QAAQ,EACd,aAAa,EACb,GAAG,KAAK,EACT,EAAE,mBAAmB,+BAuBrB;AAED,QAAA,MAAM,cAAc;;CAElB,CAAC;AAEH,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/form/FormRadioGroup.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useController } from 'react-hook-form';
+import { useFormControlProps, useFormMethods, useRequiredFieldName, } from './Form.context';
+import { RadioGroup } from './RadioGroup';
+/** A `RadioGroup` bound to the field's value. */
+function FormRadioGroupRoot({ name: nameProp, onValueChange, ...props }) {
+    const name = useRequiredFieldName(nameProp, 'Form.RadioGroup');
+    const { control } = useFormMethods();
+    const { field } = useController({
+        control,
+        defaultValue: props.defaultValue,
+        name,
+    });
+    const { accessibilityLabel, 'aria-labelledby': labelledBy } = useFormControlProps();
+    return (_jsx(RadioGroup, { accessibilityLabel: accessibilityLabel, "aria-labelledby": labelledBy, ...props, onValueChange: (value) => {
+            field.onChange(value);
+            onValueChange?.(value);
+        }, value: field.value }));
+}
+const FormRadioGroup = Object.assign(FormRadioGroupRoot, {
+    Item: RadioGroup.Item,
+});
+export { FormRadioGroup };
+//# sourceMappingURL=FormRadioGroup.js.map

package/dist/components/form/FormRadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRadioGroup.js","sourceRoot":"","sources":["../../../src/components/form/FormRadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,UAAU,EAAwB,MAAM,cAAc,CAAC;AAMhE,iDAAiD;AACjD,SAAS,kBAAkB,CAAC,EAC1B,IAAI,EAAE,QAAQ,EACd,aAAa,EACb,GAAG,KAAK,EACY;IACpB,MAAM,IAAI,GAAG,oBAAoB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC;IAC/D,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAAC;QAC9B,OAAO;QACP,YAAY,EAAE,KAAK,CAAC,YAAY;QAChC,IAAI;KACL,CAAC,CAAC;IACH,MAAM,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,UAAU,EAAE,GACzD,mBAAmB,EAAE,CAAC;IAExB,OAAO,CACL,KAAC,UAAU,IACT,kBAAkB,EAAE,kBAAkB,qBACrB,UAAU,KACvB,KAAK,EACT,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE;YACvB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YACtB,aAAa,EAAE,CAAC,KAAK,CAAC,CAAC;QACzB,CAAC,EACD,KAAK,EAAE,KAAK,CAAC,KAAK,GAClB,CACH,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,CAAC,kBAAkB,EAAE;IACvD,IAAI,EAAE,UAAU,CAAC,IAAI;CACtB,CAAC,CAAC;AAEH,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/form/FormRoot.d.ts

@@ -0,0 +1,13 @@
+import { type FieldValues, type SubmitHandler, type UseFormReturn } from 'react-hook-form';
+import { View } from 'react-native';
+export type FormProps<FormValues extends FieldValues = FieldValues> = React.ComponentProps<typeof View> & {
+    form: UseFormReturn<FormValues>;
+    onSubmit?: SubmitHandler<FormValues>;
+};
+/**
+ * React Native has no `<form>`, so the root shares a submit action:
+ * `Form.Button` and the return key in `Form.Input` call it, like a submit
+ * button and Enter on the web.
+ */
+export declare function FormRoot<FormValues extends FieldValues = FieldValues>({ className, form, onSubmit, ...props }: FormProps<FormValues>): import("react").JSX.Element;
+//# sourceMappingURL=FormRoot.d.ts.map

package/dist/components/form/FormRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRoot.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormRoot.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,aAAa,EAClB,KAAK,aAAa,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAKpC,MAAM,MAAM,SAAS,CAAC,UAAU,SAAS,WAAW,GAAG,WAAW,IAChE,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,GAAG;IAClC,IAAI,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CACtC,CAAC;AAEJ;;;;GAIG;AACH,wBAAgB,QAAQ,CAAC,UAAU,SAAS,WAAW,GAAG,WAAW,EAAE,EACrE,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,UAAU,CAAC,+BAYvB"}

package/dist/components/form/FormRoot.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from 'react';
+import { FormProvider, } from 'react-hook-form';
+import { View } from 'react-native';
+import { cn } from '../../lib/cn';
+import { FormSubmitContext } from './Form.context';
+/**
+ * React Native has no `<form>`, so the root shares a submit action:
+ * `Form.Button` and the return key in `Form.Input` call it, like a submit
+ * button and Enter on the web.
+ */
+export function FormRoot({ className, form, onSubmit, ...props }) {
+    const submit = useCallback(() => {
+        if (onSubmit)
+            void form.handleSubmit(onSubmit)();
+    }, [form, onSubmit]);
+    return (_jsx(FormProvider, { ...form, children: _jsx(FormSubmitContext, { value: submit, children: _jsx(View, { className: cn('gap-6', className), ...props }) }) }));
+}
+//# sourceMappingURL=FormRoot.js.map

package/dist/components/form/FormRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRoot.js","sourceRoot":"","sources":["../../../src/components/form/FormRoot.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,EAEL,YAAY,GAGb,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAQnD;;;;GAIG;AACH,MAAM,UAAU,QAAQ,CAA+C,EACrE,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACc;IACtB,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,IAAI,QAAQ;YAAE,KAAK,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,CAAC;IACnD,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC;IAErB,OAAO,CACL,KAAC,YAAY,OAAK,IAAI,YACpB,KAAC,iBAAiB,IAAC,KAAK,EAAE,MAAM,YAC9B,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,GACpC,GACP,CAChB,CAAC;AACJ,CAAC"}

package/dist/components/form/FormTextarea.d.ts

@@ -0,0 +1,7 @@
+import { type TextareaProps } from './Textarea';
+export type FormTextareaProps = Omit<TextareaProps, 'defaultValue' | 'invalid' | 'value'> & {
+    name?: string;
+};
+/** A `Textarea` bound to the field's value. */
+export declare function FormTextarea({ name: nameProp, onBlur, onChangeText, ref, ...props }: FormTextareaProps): import("react").JSX.Element;
+//# sourceMappingURL=FormTextarea.d.ts.map

package/dist/components/form/FormTextarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTextarea.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormTextarea.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAE1D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAClC,aAAa,EACb,cAAc,GAAG,SAAS,GAAG,OAAO,CACrC,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAItB,+CAA+C;AAC/C,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EACZ,GAAG,EACH,GAAG,KAAK,EACT,EAAE,iBAAiB,+BA6BnB"}

package/dist/components/form/FormTextarea.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { use, useImperativeHandle, useRef } from 'react';
+import { useController } from 'react-hook-form';
+import { FormFieldContext, useFormControlProps, useFormMethods, useRequiredFieldName, } from './Form.context';
+import { Textarea } from './Textarea';
+/** A `Textarea` bound to the field's value. */
+export function FormTextarea({ name: nameProp, onBlur, onChangeText, ref, ...props }) {
+    const name = useRequiredFieldName(nameProp, 'Form.Textarea');
+    const { control } = useFormMethods();
+    const { field } = useController({ control, name });
+    const controlProps = useFormControlProps();
+    const fieldContext = use(FormFieldContext);
+    const inputRef = useRef(null);
+    useImperativeHandle(ref, () => inputRef.current);
+    return (_jsx(Textarea, { ...controlProps, ...props, onBlur: (event) => {
+            field.onBlur();
+            onBlur?.(event);
+        }, onChangeText: (text) => {
+            field.onChange(text);
+            onChangeText?.(text);
+        }, ref: (node) => {
+            inputRef.current = node;
+            field.ref(node);
+            fieldContext?.setControl(node);
+        }, value: field.value ?? '' }));
+}
+//# sourceMappingURL=FormTextarea.js.map

package/dist/components/form/FormTextarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTextarea.js","sourceRoot":"","sources":["../../../src/components/form/FormTextarea.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAsB,MAAM,YAAY,CAAC;AAS1D,+CAA+C;AAC/C,MAAM,UAAU,YAAY,CAAC,EAC3B,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EACZ,GAAG,EACH,GAAG,KAAK,EACU;IAClB,MAAM,IAAI,GAAG,oBAAoB,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;IAC7D,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACnD,MAAM,YAAY,GAAG,mBAAmB,EAAE,CAAC;IAC3C,MAAM,YAAY,GAAG,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC3C,MAAM,QAAQ,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACxD,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAA4B,CAAC,CAAC;IAEtE,OAAO,CACL,KAAC,QAAQ,OACH,YAAY,KACZ,KAAK,EACT,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,MAAM,EAAE,CAAC;YACf,MAAM,EAAE,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC,EACD,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE;YACrB,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACrB,YAAY,EAAE,CAAC,IAAI,CAAC,CAAC;QACvB,CAAC,EACD,GAAG,EAAE,CAAC,IAA8B,EAAE,EAAE;YACtC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;YACxB,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;YAChB,YAAY,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC,EACD,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,GACxB,CACH,CAAC;AACJ,CAAC"}

package/dist/components/form/Input.d.ts

@@ -0,0 +1,17 @@
+import { TextInput } from 'react-native';
+export type InputProps = React.ComponentProps<typeof TextInput> & {
+    /** Class overrides for the inner `TextInput`; `className` styles the control around it. */
+    classNames?: {
+        input?: string;
+    };
+    /** Dims the field and stops editing, like the web's `disabled`. */
+    disabled?: boolean;
+    /** Marks the value as invalid, like the web's `aria-invalid`. */
+    invalid?: boolean;
+    size?: 'lg' | 'md' | 'sm';
+    /** Renders the bare `TextInput`, without the border and background. */
+    unstyled?: boolean;
+};
+/** A single-line text field, like `Input` in @pickle-ui/react. */
+export declare function Input({ className, classNames, disabled, editable, invalid, onBlur, onFocus, size, unstyled, ...props }: InputProps): import("react").JSX.Element;
+//# sourceMappingURL=Input.d.ts.map

package/dist/components/form/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAczC,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAChE,2FAA2F;IAC3F,UAAU,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAChC,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,kEAAkE;AAClE,wBAAgB,KAAK,CAAC,EACpB,SAAS,EACT,UAAU,EACV,QAAgB,EAChB,QAAe,EACf,OAAe,EACf,MAAM,EACN,OAAO,EACP,IAAW,EACX,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,UAAU,+BAyCZ"}

package/dist/components/form/Input.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { TextInput } from 'react-native';
+import { cn } from '../../lib/cn';
+import { InputFrame } from '../_internal/InputFrame';
+// Same heights as `Button` for the same size, so they line up side by side,
+// and the web's paddings minus the 1pt border.
+const heightClasses = { lg: 'h-9', md: 'h-8', sm: 'h-7' };
+const paddingClasses = {
+    lg: 'px-[13px]',
+    md: 'px-[11px]',
+    sm: 'px-[9px]',
+};
+/** A single-line text field, like `Input` in @pickle-ui/react. */
+export function Input({ className, classNames, disabled = false, editable = true, invalid = false, onBlur, onFocus, size = 'md', unstyled = false, ...props }) {
+    const [focused, setFocused] = useState(false);
+    // The web's 14px from `sm` up: the 16px it uses on phones only stops iOS
+    // Safari zooming into a focused field, which native apps don't do.
+    // `text-[14px]` sets the size without `text-sm`'s line height, which
+    // pushes a single-line field's text off center on iOS.
+    const input = (_jsx(TextInput, { accessibilityState: { disabled }, className: cn('text-foreground flex-1 font-sans text-[14px] outline-none', paddingClasses[size], unstyled ? cn(heightClasses[size], disabled && 'opacity-64') : 'h-full', unstyled ? className : classNames?.input), editable: editable && !disabled, onBlur: (event) => {
+            setFocused(false);
+            onBlur?.(event);
+        }, onFocus: (event) => {
+            setFocused(true);
+            onFocus?.(event);
+        }, placeholderTextColorClassName: "accent-muted-foreground/72", ...props }));
+    if (unstyled)
+        return input;
+    return (_jsx(InputFrame, { className: cn(heightClasses[size], className), disabled: disabled, focused: focused, invalid: invalid, children: input }));
+}
+//# sourceMappingURL=Input.js.map

package/dist/components/form/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,4EAA4E;AAC5E,+CAA+C;AAC/C,MAAM,aAAa,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAW,CAAC;AACnE,MAAM,cAAc,GAAG;IACrB,EAAE,EAAE,WAAW;IACf,EAAE,EAAE,WAAW;IACf,EAAE,EAAE,UAAU;CACN,CAAC;AAcX,kEAAkE;AAClE,MAAM,UAAU,KAAK,CAAC,EACpB,SAAS,EACT,UAAU,EACV,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,IAAI,EACf,OAAO,GAAG,KAAK,EACf,MAAM,EACN,OAAO,EACP,IAAI,GAAG,IAAI,EACX,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACG;IACX,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,yEAAyE;IACzE,mEAAmE;IACnE,qEAAqE;IACrE,uDAAuD;IACvD,MAAM,KAAK,GAAG,CACZ,KAAC,SAAS,IACR,kBAAkB,EAAE,EAAE,QAAQ,EAAE,EAChC,SAAS,EAAE,EAAE,CACX,2DAA2D,EAC3D,cAAc,CAAC,IAAI,CAAC,EACpB,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,CAAC,QAAQ,EACvE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CACzC,EACD,QAAQ,EAAE,QAAQ,IAAI,CAAC,QAAQ,EAC/B,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,UAAU,CAAC,KAAK,CAAC,CAAC;YAClB,MAAM,EAAE,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC,EACD,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;YACjB,UAAU,CAAC,IAAI,CAAC,CAAC;YACjB,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC,EACD,6BAA6B,EAAC,4BAA4B,KACtD,KAAK,GACT,CACH,CAAC;IAEF,IAAI,QAAQ;QAAE,OAAO,KAAK,CAAC;IAE3B,OAAO,CACL,KAAC,UAAU,IACT,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,EAC7C,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,YAEf,KAAK,GACK,CACd,CAAC;AACJ,CAAC"}

package/dist/components/form/InputGroup.context.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Lets a wrapper mark the frame `disabled` or `invalid` when its input isn't
+ * a direct `InputGroup.Input` child, like `Form.InputGroup` does with
+ * `Form.Input`, whose invalid state comes from the form.
+ */
+export declare const InputGroupStateContext: import("react").Context<{
+    disabled?: boolean;
+    invalid?: boolean;
+} | null>;
+//# sourceMappingURL=InputGroup.context.d.ts.map

package/dist/components/form/InputGroup.context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.context.d.ts","sourceRoot":"","sources":["../../../src/components/form/InputGroup.context.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,sBAAsB;eACtB,OAAO;cACR,OAAO;SACX,CAAC"}

package/dist/components/form/InputGroup.context.js

@@ -0,0 +1,8 @@
+import { createContext } from 'react';
+/**
+ * Lets a wrapper mark the frame `disabled` or `invalid` when its input isn't
+ * a direct `InputGroup.Input` child, like `Form.InputGroup` does with
+ * `Form.Input`, whose invalid state comes from the form.
+ */
+export const InputGroupStateContext = createContext(null);
+//# sourceMappingURL=InputGroup.context.js.map

package/dist/components/form/InputGroup.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.context.js","sourceRoot":"","sources":["../../../src/components/form/InputGroup.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAGhD,IAAI,CAAC,CAAC"}

package/dist/components/form/InputGroup.d.ts

@@ -0,0 +1,31 @@
+import { type ReactNode } from 'react';
+import { Pressable, Text, View } from 'react-native';
+import { type ButtonProps } from '../Button';
+import { type InputProps } from './Input';
+type InputGroupAlign = 'block-end' | 'block-start' | 'inline-end' | 'inline-start';
+export type InputGroupAddonProps = React.ComponentProps<typeof Pressable> & {
+    align?: InputGroupAlign;
+    /** Text is wrapped in a label; other children, such as icons, render as they are. */
+    children?: ReactNode;
+};
+export type InputGroupButtonProps = ButtonProps & {
+    align?: InputGroupAlign;
+};
+export type InputGroupInputProps = Omit<InputProps, 'unstyled'>;
+export type InputGroupProps = React.ComponentProps<typeof View>;
+export type InputGroupTextProps = React.ComponentProps<typeof Text>;
+/** Pressing an addon focuses the field, like clicking it on the web. */
+declare function InputGroupAddon({ align, children, className, ...props }: InputGroupAddonProps): import("react").JSX.Element;
+declare function InputGroupButton({ align, className, size, variant, ...props }: InputGroupButtonProps): import("react").JSX.Element;
+declare function InputGroupInput({ className, onBlur, onFocus, ref, ...props }: InputGroupInputProps): import("react").JSX.Element;
+/** Places addons around the input and frames the group like an `Input`. */
+declare function InputGroupRoot({ children, className, ...props }: InputGroupProps): import("react").JSX.Element;
+declare function InputGroupText({ className, ...props }: InputGroupTextProps): import("react").JSX.Element;
+declare const InputGroup: typeof InputGroupRoot & {
+    Addon: typeof InputGroupAddon;
+    Button: typeof InputGroupButton;
+    Input: typeof InputGroupInput;
+    Text: typeof InputGroupText;
+};
+export { InputGroup };
+//# sourceMappingURL=InputGroup.d.ts.map

package/dist/components/form/InputGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.d.ts","sourceRoot":"","sources":["../../../src/components/form/InputGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,SAAS,EAAE,IAAI,EAAkB,IAAI,EAAE,MAAM,cAAc,CAAC;AAIrE,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAGjD,KAAK,eAAe,GAChB,WAAW,GACX,aAAa,GACb,YAAY,GACZ,cAAc,CAAC;AA6BnB,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1E,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG;IAAE,KAAK,CAAC,EAAE,eAAe,CAAA;CAAE,CAAC;AAE9E,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AAEhE,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAEhE,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAEpE,wEAAwE;AACxE,iBAAS,eAAe,CAAC,EACvB,KAAsB,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,oBAAoB,+BAuBtB;AAED,iBAAS,gBAAgB,CAAC,EACxB,KAAoB,EACpB,SAAS,EACT,IAAgB,EAChB,OAAiB,EACjB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BAMvB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,MAAM,EACN,OAAO,EACP,GAAG,EACH,GAAG,KAAK,EACT,EAAE,oBAAoB,+BA6BtB;AAED,2EAA2E;AAC3E,iBAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,+BAoDzE;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,+BAQnE;AA+CD,QAAA,MAAM,UAAU;;;;;CAKd,CAAC;AAEH,OAAO,EAAE,UAAU,EAAE,CAAC"}