@arkyn/components 3.0.1-beta.99 → 3.0.3

package/dist/components/textarea/index.d.ts

@@ -1,36 +1,53 @@
-import { TextareaHTMLAttributes } from "react";
+import { type TextareaHTMLAttributes } from "react";
 import "./styles.css";
 type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "name" | "value" | "defaultValue"> & {
+    /** Field name for form submission. Required. */
     name: string;
+    /** Optional label text displayed above the textarea. */
     label?: string;
+    /** Displays an asterisk on the label to signal a required field. */
     showAsterisk?: boolean;
+    /** Validation error message displayed below the textarea. */
     errorMessage?: string;
+    /**
+     * Textarea size.
+     * @default "md"
+     */
     size?: "md" | "lg";
+    /**
+     * Visual style variant.
+     * - `solid`: filled background.
+     * - `outline`: bordered, transparent background.
+     * @default "solid"
+     */
     variant?: "solid" | "outline";
-    value?: string | null;
-    defaultValue?: string | null;
+    /** Controlled value. */
+    value?: string;
+    /** Uncontrolled default value. */
+    defaultValue?: string;
 };
 /**
- * Textarea component - used for multi-line text input with customizable styling and validation
+ * Textarea — multi-line text input with label, validation, and form integration.
  *
- * @param props - Textarea component properties
- * @param props.name - Required field name for form handling and textarea identification
- * @param props.label - Optional label text to display above the textarea
- * @param props.showAsterisk - Whether to show asterisk on label for required fields
- * @param props.errorMessage - Error message to display below the textarea
- * @param props.size - Size variant of the textarea. Default: "md"
- * @param props.variant - Visual variant of the textarea. Default: "solid"
+ * Integrates with `useForm` to display validation errors by field name.
  *
- * **...Other valid HTML properties for textarea element (except name)**
+ * @param props.name - Field name for form submission. Required.
+ * @param props.label - Label text displayed above the textarea.
+ * @param props.showAsterisk - Appends `*` to the label.
+ * @param props.errorMessage - Validation error message.
+ * @param props.size - Textarea size (`md` | `lg`). Default: "md"
+ * @param props.variant - Visual style variant. Default: "solid"
  *
- * @returns Textarea JSX element wrapped in FieldWrapper with optional label and error message
+ * **...Other valid HTML properties for `<textarea>`**
+ *
+ * @returns Textarea JSX element wrapped in `FieldWrapper`.
  *
  * @example
  * ```tsx
- * // Basic textarea
+ * // Basic
  * <Textarea name="description" placeholder="Enter description..." />
  *
- * // Textarea with label and validation
+ * // With label and validation
  * <Textarea
  *   name="bio"
  *   label="Biography"
@@ -39,67 +56,18 @@ type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "name" |
  *   errorMessage="Biography is required"
  * />
  *
- * // Large textarea with outline variant
- * <Textarea
- *   name="comments"
- *   label="Comments"
- *   size="lg"
- *   variant="outline"
- *   placeholder="Enter your comments here..."
- *   rows={6}
- * />
- *
- * // Textarea with character limit and custom styling
- * <Textarea
- *   name="feedback"
- *   label="Feedback"
- *   placeholder="Share your feedback (max 500 characters)"
- *   maxLength={500}
- *   rows={4}
- *   className="feedback-textarea"
- * />
- *
- * // Read-only textarea for display
- * <Textarea
- *   name="terms"
- *   label="Terms and Conditions"
- *   value={termsContent}
- *   readOnly
- *   rows={10}
- *   variant="outline"
- * />
- *
- * // Disabled textarea
- * <Textarea
- *   name="disabled_field"
- *   label="Disabled Field"
- *   value="This field is disabled"
- *   disabled
- *   placeholder="Cannot edit this field"
- * />
- *
- * // Textarea with controlled value and change handler
+ * // Controlled with custom rows
  * <Textarea
  *   name="message"
  *   label="Message"
  *   value={message}
  *   onChange={(e) => setMessage(e.target.value)}
- *   placeholder="Type your message..."
  *   rows={5}
- *   showAsterisk
- * />
- *
- * // Textarea with resize control
- * <Textarea
- *   name="notes"
- *   label="Notes"
- *   placeholder="Enter your notes..."
- *   style={{ resize: 'vertical' }}
- *   rows={3}
- *   cols={50}
+ *   size="lg"
+ *   variant="outline"
  * />
  * ```
  */
-declare function Textarea(props: TextareaProps): import("react/jsx-runtime").JSX.Element;
+declare function Textarea(props: TextareaProps): import("react").JSX.Element;
 export { Textarea };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/textarea/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,sBAAsB,EAIvB,MAAM,OAAO,CAAC;AAOf,OAAO,cAAc,CAAC;AAEtB,KAAK,aAAa,GAAG,IAAI,CACvB,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,GAAG,OAAO,GAAG,cAAc,CAClC,GAAG;IACF,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAE9B,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyFG;AAEH,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,2CAmFrC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,sBAAsB,EAI3B,MAAM,OAAO,CAAC;AAMf,OAAO,cAAc,CAAC;AAEtB,KAAK,aAAa,GAAG,IAAI,CACxB,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,GAAG,OAAO,GAAG,cAAc,CACjC,GAAG;IACH,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oEAAoE;IACpE,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6DAA6D;IAC7D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kCAAkC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AAEH,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,+BAqFrC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/components/tooltip/index.d.ts

@@ -1,80 +1,52 @@
-import { HTMLAttributes, ReactNode } from "react";
+import { type HTMLAttributes, type ReactNode } from "react";
 import "./styles.css";
 type TooltipProps = Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
+    /** Text rendered inside the tooltip bubble. Supports inline HTML. Required. */
     text: string;
+    /** Element that triggers the tooltip on hover. Required. */
     children: ReactNode;
+    /**
+     * Preferred position of the tooltip relative to the trigger element.
+     * Automatically flips to the opposite side if the tooltip would overflow the viewport.
+     * @default "top"
+     */
     orientation?: "top" | "right" | "bottom" | "left";
+    /**
+     * Tooltip size.
+     * @default "lg"
+     */
     size?: "md" | "lg";
 };
 /**
- * Tooltip component - displays contextual information on hover with smart positioning
+ * Tooltip — shows a contextual text bubble on hover with smart viewport-aware positioning.
  *
- * @param props - Tooltip component properties
- * @param props.text - Text content to display in the tooltip
- * @param props.children - Element that triggers the tooltip on hover
- * @param props.orientation - Preferred tooltip position relative to trigger element. Default: "top"
- * @param props.size - Tooltip size variant. Default: "lg"
+ * The tooltip automatically flips to the opposite side when it would overflow the viewport.
  *
- * **...Other valid HTML properties for div element**
+ * @param props.text - Text (or HTML) to display in the tooltip. Required.
+ * @param props.children - Trigger element. Required.
+ * @param props.orientation - Preferred position relative to the trigger. Default: "top"
+ * @param props.size - Tooltip size. Default: "lg"
  *
- * @returns Tooltip JSX element
+ * **...Other valid HTML properties for `<div>`**
+ *
+ * @returns Tooltip JSX element.
  *
  * @example
  * ```tsx
- * // Basic tooltip
- * <Tooltip text="This is a helpful tip">
- *   <button>Hover me</button>
- * </Tooltip>
- *
- * // Tooltip with different orientations
- * <Tooltip text="Left tooltip" orientation="left">
- *   <span>Hover for left tooltip</span>
- * </Tooltip>
- *
- * <Tooltip text="Right tooltip" orientation="right">
- *   <span>Hover for right tooltip</span>
- * </Tooltip>
- *
- * // Different sizes
- * <Tooltip text="Small tooltip" size="md">
- *   <button>Small tooltip</button>
- * </Tooltip>
- *
- * <Tooltip text="Large tooltip" size="lg">
- *   <button>Large tooltip</button>
+ * <Tooltip text="Save changes before leaving">
+ *   <IconButton icon={SaveIcon} aria-label="Save" />
  * </Tooltip>
  *
- * // Smart positioning - automatically adjusts if doesn't fit
- * <Tooltip text="This tooltip will auto-adjust position" orientation="left">
- *   <button className="near-edge">Smart positioning</button>
+ * // Toolbar with bottom-oriented tooltips
+ * <Tooltip text="Add item" orientation="bottom">
+ *   <IconButton icon={Plus} aria-label="Add" />
  * </Tooltip>
  *
- * // Complete example with custom styling
- * <Tooltip
- *   text="Save your changes before proceeding"
- *   orientation="bottom"
- *   size="lg"
- *   className="custom-tooltip"
- * >
- *   <IconButton icon={SaveIcon} />
+ * <Tooltip text="Delete" orientation="bottom" size="md">
+ *   <IconButton icon={Trash2} aria-label="Delete" scheme="danger" />
  * </Tooltip>
- *
- * // Multiple tooltips on same page
- * <div className="toolbar">
- *   <Tooltip text="Create new file" orientation="bottom">
- *     <IconButton icon={PlusIcon} />
- *   </Tooltip>
- *
- *   <Tooltip text="Open existing file" orientation="bottom">
- *     <IconButton icon={FolderIcon} />
- *   </Tooltip>
- *
- *   <Tooltip text="Delete selected file" orientation="bottom">
- *     <IconButton icon={TrashIcon} />
- *   </Tooltip>
- * </div>
  * ```
  */
-declare function Tooltip(props: TooltipProps): import("react/jsx-runtime").JSX.Element;
+declare function Tooltip(props: TooltipProps): import("react").JSX.Element;
 export { Tooltip };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/tooltip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,SAAS,EAKV,MAAM,OAAO,CAAC;AACf,OAAO,cAAc,CAAC;AAEtB,KAAK,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,GAAG;IACrE,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AAEH,iBAAS,OAAO,CAAC,KAAK,EAAE,YAAY,2CAqFnC;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,cAAc,EACnB,KAAK,SAAS,EAKd,MAAM,OAAO,CAAC;AACf,OAAO,cAAc,CAAC;AAEtB,KAAK,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,GAAG;IACtE,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAC;IACb,4DAA4D;IAC5D,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAEH,iBAAS,OAAO,CAAC,KAAK,EAAE,YAAY,+BAqFnC;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/hooks/useAutomation.d.ts

@@ -1,39 +1,36 @@
 /**
- * Hook for automating actions based on form response data.
+ * useAutomation — runs UI side-effects (close modals, scroll, toast) in response to a server action payload.
  *
- * This hook automates the closing of modals and the display of toast notifications
- * based on the properties provided in the form response data object.
+ * Pass the raw response from a form submission. On every change the hook:
+ * 1. Closes all open modals if `closeModal` is `true`.
+ * 2. Smooth-scrolls to a named element if `cause.data.scrollTo` is set.
+ * 3. Shows a toast based on `name` (matched against `successResponses`/`badResponses`) and `message`.
+ *    When `cause.fieldErrors` is present, the first field error takes priority in the toast.
+ *    The message `"Unprocessable entity"` is intentionally suppressed.
  *
- * @param {Object} formResponseData - Object containing form response data for automation
- * @param {boolean} [formResponseData.closeModal] - If true, closes all open modals
- * @param {string} [formResponseData.message] - Message to be displayed in the toast notification
- * @param {string} [formResponseData.name] - Response name used to check against known error responses
- * @param {"success" | "danger"} [formResponseData.type] - Type of toast notification to be displayed
+ * @param formResponseData - Raw server response payload.
+ * @param formResponseData.closeModal - Closes all open modals when `true`.
+ * @param formResponseData.name - Response identifier matched against success/bad response lists.
+ * @param formResponseData.message - Text shown in the toast notification.
+ * @param formResponseData.cause.data.scrollTo - Element name to scroll to via `react-scroll`.
+ * @param formResponseData.cause.fieldErrors - Field-level errors; the first value is shown in the toast.
  *
  * @example
  * ```tsx
- * // Complete usage with success notification
- * const responseData = {
- *   closeModal: true,
- *   message: "Operation completed successfully!",
- *   type: "success"
- * };
- *
- * useAutomation(responseData);
- * ```
- *
- * @example
- * ```tsx
- * // Close modal only
- * useAutomation({ closeModal: true });
+ * // After a successful create action
+ * useAutomation({ closeModal: true, name: "created", message: "Saved successfully" });
  * ```
  *
  * @example
  * ```tsx
- * // Display error notification
+ * // Validation error with field-level feedback and scroll
  * useAutomation({
- *   message: "Error processing request",
- *   type: "danger"
+ *   name: "validation_error",
+ *   message: "Invalid payload",
+ *   cause: {
+ *     data: { scrollTo: "email" },
+ *     fieldErrors: { email: "E-mail is required" },
+ *   },
  * });
  * ```
  */

package/dist/hooks/useAutomation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAutomation.d.ts","sourceRoot":"","sources":["../../src/hooks/useAutomation.ts"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAEH,iBAAS,aAAa,CAAC,gBAAgB,EAAE,GAAG,QAmB3C;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"useAutomation.d.ts","sourceRoot":"","sources":["../../src/hooks/useAutomation.ts"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAGH,iBAAS,aAAa,CAAC,gBAAgB,EAAE,GAAG,QA+B3C;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/hooks/useDrawer.d.ts

@@ -1,78 +1,33 @@
-import { DrawerContextProps } from "../providers/drawerProvider";
+import { type DrawerContextProps } from "../providers/drawerProvider";
 type OpenDrawerProps<T = any> = (data?: T) => void;
 /**
- * useDrawer hook - provides access to drawer context for managing drawer state and data
+ * useDrawer — accesses the nearest `DrawerProvider` context.
  *
- * @param key - Optional drawer identifier key. When provided, returns functions for a specific drawer
+ * Two call signatures:
+ * - **Without `key`** — returns the raw context object (manage any drawer by name).
+ * - **With `key`** — returns a scoped object bound to one named drawer.
  *
- * @returns When called without key: Complete drawer context with all drawer management functions
- * @returns When called with key: Object containing drawer-specific functions:
- * - `drawerIsOpen`: Boolean indicating if the specific drawer is open
- * - `drawerData`: Data associated with the specific drawer
- * - `openDrawer`: Function to open the specific drawer with optional data
- * - `closeDrawer`: Function to close the specific drawer
+ * @param key - Drawer identifier registered in `DrawerProvider`.
  *
- * @example
- * ```tsx
- * // Basic usage - access to full drawer context
- * function DrawerManager() {
- *   const drawerContext = useDrawer();
- *
- *   return (
- *     <div>
- *       <button onClick={() => drawerContext.openDrawer('navigation', { section: 'main' })}>
- *         Open Navigation
- *       </button>
- *       <button onClick={() => drawerContext.openDrawer('filters', { category: 'electronics' })}>
- *         Open Filters
- *       </button>
- *     </div>
- *   );
- * }
+ * @returns Without key: full `DrawerContextProps`. With key: `{ drawerIsOpen, drawerData, openDrawer, closeDrawer }`.
  *
- * // Usage with specific drawer key
- * function NavigationDrawer() {
- *   const { drawerIsOpen, drawerData, openDrawer, closeDrawer } = useDrawer('navigation');
+ * @throws If called outside a `DrawerProvider`.
  *
- *   return (
- *     <Drawer isOpen={drawerIsOpen} onClose={closeDrawer} position="left">
- *       <h2>Navigation</h2>
- *       <p>Current section: {drawerData?.section}</p>
- *       <button onClick={closeDrawer}>Close</button>
- *     </Drawer>
- *   );
- * }
- *
- * // Usage with typed data
- * interface FilterData {
- *   category: string;
- *   priceRange: [number, number];
- *   brands: string[];
- * }
+ * @example
+ * ```tsx
+ * // Scoped to one drawer — the most common pattern
+ * const { drawerIsOpen, drawerData, openDrawer, closeDrawer } = useDrawer<{ section: string }>('navigation');
  *
- * function FilterDrawer() {
- *   const { drawerIsOpen, drawerData, closeDrawer } = useDrawer<FilterData>('filters');
+ * openDrawer({ section: 'products' });
+ * ```
  *
- *   return (
- *     <Drawer isOpen={drawerIsOpen} onClose={closeDrawer} position="right">
- *       <h2>Filters</h2>
- *       <p>Category: {drawerData?.category}</p>
- *       <p>Price: ${drawerData?.priceRange?.[0]} - ${drawerData?.priceRange?.[1]}</p>
- *       <p>Brands: {drawerData?.brands?.join(', ')}</p>
- *     </Drawer>
- *   );
- * }
+ * @example
+ * ```tsx
+ * // Full context — useful when triggering multiple different drawers from one place
+ * const { openDrawer } = useDrawer();
  *
- * // Usage with DrawerProvider
- * function App() {
- *   return (
- *     <DrawerProvider>
- *       <NavigationDrawer />
- *       <FilterDrawer />
- *       <DrawerManager />
- *     </DrawerProvider>
- *   );
- * }
+ * openDrawer('navigation', { section: 'main' });
+ * openDrawer('filters', { category: 'electronics' });
  * ```
  */
 declare function useDrawer<T = any>(): DrawerContextProps<T>;

package/dist/hooks/useDrawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDrawer.d.ts","sourceRoot":"","sources":["../../src/hooks/useDrawer.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAEhF,KAAK,eAAe,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;AAEnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0EG;AAEH,iBAAS,SAAS,CAAC,CAAC,GAAG,GAAG,KAAK,kBAAkB,CAAC,CAAC,CAAC,CAAC;AACrD,iBAAS,SAAS,CAAC,CAAC,GAAG,GAAG,EACxB,GAAG,EAAE,MAAM,GACV;IACD,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,CAAC,CAAC;IACd,UAAU,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AA6BF,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"useDrawer.d.ts","sourceRoot":"","sources":["../../src/hooks/useDrawer.ts"],"names":[],"mappings":"AACA,OAAO,EACN,KAAK,kBAAkB,EAEvB,MAAM,6BAA6B,CAAC;AAGrC,KAAK,eAAe,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;AAEnD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAGH,iBAAS,SAAS,CAAC,CAAC,GAAG,GAAG,KAAK,kBAAkB,CAAC,CAAC,CAAC,CAAC;AAErD,iBAAS,SAAS,CAAC,CAAC,GAAG,GAAG,EACzB,GAAG,EAAE,MAAM,GACT;IACF,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,CAAC,CAAC;IACd,UAAU,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AA6BF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/hooks/useForm.d.ts

@@ -1,45 +1,28 @@
 /**
- * useForm hook - provides access to form context data including field errors
+ * useForm — reads the nearest `FormProvider` context to access field-level validation errors.
  *
- * @returns Form context object containing:
- * - `fieldErrors`: Object with field validation errors indexed by field name
+ * All form inputs (`Input`, `Select`, `Checkbox`, etc.) call this hook internally,
+ * so you rarely need it directly. Use it when you want to read errors outside of
+ * an input component, or build a custom input.
+ *
+ * @returns Form context containing:
+ * - `fieldErrors` — `Record<string, string>` mapping field names to error messages.
  *
  * @example
  * ```tsx
- * // Basic usage in a component
- * function MyComponent() {
- *   const { fieldErrors } = useForm();
- *
- *   return (
- *     <Input
- *       name="email"
- *       errorMessage={fieldErrors?.email}
- *     />
- *   );
- * }
- *
- * // Usage with FormProvider
+ * // Wrapping a form with FormProvider
  * function App() {
- *   const errors = { email: "Invalid email format" };
- *
  *   return (
- *     <FormProvider fieldErrors={errors}>
+ *     <FormProvider fieldErrors={{ email: "Invalid email" }}>
  *       <MyForm />
  *     </FormProvider>
  *   );
  * }
  *
- * // Checking for specific field errors
- * function FormField() {
+ * // Reading errors manually
+ * function CustomField() {
  *   const { fieldErrors } = useForm();
- *   const hasError = !!fieldErrors?.username;
- *
- *   return (
- *     <div>
- *       <Input name="username" />
- *       {hasError && <span>Error: {fieldErrors.username}</span>}
- *     </div>
- *   );
+ *   return <span>{fieldErrors?.username}</span>;
  * }
  * ```
  */

package/dist/hooks/useForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../src/hooks/useForm.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,iBAAS,OAAO;;;;EAGf;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}
+{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../src/hooks/useForm.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,iBAAS,OAAO;;;;EAGf;AAED,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/hooks/useHydrated.d.ts

@@ -1,73 +1,18 @@
 /**
- * useHydrated hook - detects if the component is hydrated on the client side
+ * useHydrated — returns `true` once the component has hydrated on the client, `false` during SSR.
  *
- * This hook is useful for preventing hydration mismatches when rendering different content
- * on server and client sides. It returns false during SSR and true after hydration.
+ * Built on `useSyncExternalStore` so it is safe with React 18 concurrent rendering.
+ * Use this when you need to defer client-only rendering (e.g. browser APIs, `window`, `navigator`)
+ * without causing a hydration mismatch. For most cases, prefer the `ClientOnly` component.
  *
- * @returns Boolean indicating if the component is hydrated
- * - `true`: Component is hydrated on the client side
- * - `false`: Component is being rendered on the server side or before hydration
+ * @returns `true` on the client after hydration; `false` on the server.
  *
  * @example
  * ```tsx
- * // Basic usage to prevent hydration mismatches
- * function ClientOnlyComponent() {
+ * function Map() {
  *   const isHydrated = useHydrated();
- *
- *   if (!isHydrated) {
- *     return <div>Loading...</div>;
- *   }
- *
- *   return (
- *     <div>
- *       <p>This content is only rendered on the client</p>
- *       <p>Current time: {new Date().toLocaleString()}</p>
- *     </div>
- *   );
- * }
- *
- * // Conditional rendering based on hydration state
- * function ResponsiveComponent() {
- *   const isHydrated = useHydrated();
- *
- *   return (
- *     <div>
- *       <h1>My App</h1>
- *       {isHydrated ? (
- *         <InteractiveWidget />
- *       ) : (
- *         <StaticPlaceholder />
- *       )}
- *     </div>
- *   );
- * }
- *
- * // Using with client-only features
- * function LocationComponent() {
- *   const isHydrated = useHydrated();
- *   const [location, setLocation] = useState(null);
- *
- *   useEffect(() => {
- *     if (isHydrated && navigator.geolocation) {
- *       navigator.geolocation.getCurrentPosition((pos) => {
- *         setLocation(pos.coords);
- *       });
- *     }
- *   }, [isHydrated]);
- *
- *   if (!isHydrated) {
- *     return <div>Preparing location services...</div>;
- *   }
- *
- *   return (
- *     <div>
- *       {location ? (
- *         <p>Your location: {location.latitude}, {location.longitude}</p>
- *       ) : (
- *         <p>Getting your location...</p>
- *       )}
- *     </div>
- *   );
+ *   if (!isHydrated) return <Skeleton />;
+ *   return <MapView accessToken={token} coordinates={coords} />;
  * }
  * ```
  */

package/dist/hooks/useHydrated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useHydrated.d.ts","sourceRoot":"","sources":["../../src/hooks/useHydrated.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AAEH,iBAAS,WAAW,YAMnB;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"useHydrated.d.ts","sourceRoot":"","sources":["../../src/hooks/useHydrated.ts"],"names":[],"mappings":"AAMA;;;;;;;;;;;;;;;;;GAiBG;AAEH,iBAAS,WAAW,YAMnB;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}