@jobber/components 6.103.2-JOB-135467-8ed574a.0 → 6.103.2-JOB-140609-9051081.26

package/dist/Button-cjs.js

@@ -68,7 +68,12 @@ function ButtonLabel(_a) {
     return (React.createElement(Typography.Typography, Object.assign({ element: element, fontWeight: fontWeight, fontFamily: fontFamily, size: getTypeSizes(size) }, props)));
 }
 
-const ButtonWrapper = React.forwardRef((props, ref) => {
+function Button(props) {
+    const { size } = props;
+    return (React.createElement(ButtonProvider, { size: size },
+        React.createElement(ButtonWrapper, Object.assign({}, props))));
+}
+function ButtonWrapper(props) {
     const { ariaControls, ariaHaspopup, ariaExpanded, ariaLabel, disabled = false, external, id, name, onClick, onMouseDown, loading, role, value, submit, to, url, UNSAFE_className = {}, UNSAFE_style = {}, children, } = props;
     const { combined } = useButtonStyles(props);
     const buttonType = submit ? "submit" : "button";
@@ -80,22 +85,11 @@ const ButtonWrapper = React.forwardRef((props, ref) => {
     })), (url === undefined && to === undefined && { type: buttonType })), { "aria-controls": ariaControls, "aria-haspopup": ariaHaspopup, "aria-busy": loading, "aria-expanded": ariaExpanded, "aria-label": ariaLabel, role: role });
     const buttonInternals = children || React.createElement(ButtonContent, Object.assign({}, props));
     if (to) {
-        return (React.createElement(reactRouterDom.Link, Object.assign({}, tagProps, { to: to, ref: ref }), buttonInternals));
+        return (React.createElement(reactRouterDom.Link, Object.assign({}, tagProps, { to: to }), buttonInternals));
     }
     const Tag = url ? "a" : "button";
-    // Use createElement for proper ref typing (similar to Chip component)
-    return React.createElement(Tag, Object.assign(Object.assign({}, tagProps), { ref }), buttonInternals);
-});
-ButtonWrapper.displayName = "ButtonWrapper";
-const ButtonForwarded = React.forwardRef((props, ref) => {
-    const { size } = props;
-    return (React.createElement(ButtonProvider, { size: size },
-        React.createElement(ButtonWrapper, Object.assign({}, props, { ref: ref }))));
-});
-ButtonForwarded.displayName = "Button";
-// Add function overloads for type-safe refs
-const Button = ButtonForwarded;
-// Attach namespace components (preserving existing API)
+    return React.createElement(Tag, Object.assign({}, tagProps), buttonInternals);
+}
 Button.Label = ButtonLabel;
 Button.Icon = ButtonIcon;
 

package/dist/Button-es.js

@@ -1,4 +1,4 @@
-import React__default, { createContext, useContext, forwardRef } from 'react';
+import React__default, { createContext, useContext } from 'react';
 import { Link } from 'react-router-dom';
 import classnames from 'classnames';
 import { _ as __rest } from './tslib.es6-es.js';
@@ -66,7 +66,12 @@ function ButtonLabel(_a) {
     return (React__default.createElement(Typography, Object.assign({ element: element, fontWeight: fontWeight, fontFamily: fontFamily, size: getTypeSizes(size) }, props)));
 }
 
-const ButtonWrapper = forwardRef((props, ref) => {
+function Button(props) {
+    const { size } = props;
+    return (React__default.createElement(ButtonProvider, { size: size },
+        React__default.createElement(ButtonWrapper, Object.assign({}, props))));
+}
+function ButtonWrapper(props) {
     const { ariaControls, ariaHaspopup, ariaExpanded, ariaLabel, disabled = false, external, id, name, onClick, onMouseDown, loading, role, value, submit, to, url, UNSAFE_className = {}, UNSAFE_style = {}, children, } = props;
     const { combined } = useButtonStyles(props);
     const buttonType = submit ? "submit" : "button";
@@ -78,22 +83,11 @@ const ButtonWrapper = forwardRef((props, ref) => {
     })), (url === undefined && to === undefined && { type: buttonType })), { "aria-controls": ariaControls, "aria-haspopup": ariaHaspopup, "aria-busy": loading, "aria-expanded": ariaExpanded, "aria-label": ariaLabel, role: role });
     const buttonInternals = children || React__default.createElement(ButtonContent, Object.assign({}, props));
     if (to) {
-        return (React__default.createElement(Link, Object.assign({}, tagProps, { to: to, ref: ref }), buttonInternals));
+        return (React__default.createElement(Link, Object.assign({}, tagProps, { to: to }), buttonInternals));
     }
     const Tag = url ? "a" : "button";
-    // Use createElement for proper ref typing (similar to Chip component)
-    return React__default.createElement(Tag, Object.assign(Object.assign({}, tagProps), { ref }), buttonInternals);
-});
-ButtonWrapper.displayName = "ButtonWrapper";
-const ButtonForwarded = forwardRef((props, ref) => {
-    const { size } = props;
-    return (React__default.createElement(ButtonProvider, { size: size },
-        React__default.createElement(ButtonWrapper, Object.assign({}, props, { ref: ref }))));
-});
-ButtonForwarded.displayName = "Button";
-// Add function overloads for type-safe refs
-const Button = ButtonForwarded;
-// Attach namespace components (preserving existing API)
+    return React__default.createElement(Tag, Object.assign({}, tagProps), buttonInternals);
+}
 Button.Label = ButtonLabel;
 Button.Icon = ButtonIcon;
 

package/dist/Checkbox/Checkbox.types.d.ts

@@ -1,6 +1,7 @@
 import type { ReactElement, ReactNode } from "react";
 import type { XOR } from "ts-xor";
-export interface BaseCheckboxProps {
+import type { AriaInputProps, FocusEvents } from "../FormField/FormFieldTypes";
+export interface BaseCheckboxProps extends AriaInputProps, FocusEvents<HTMLInputElement> {
     /**
      * Determines if the checkbox is checked or not.
      */
@@ -41,14 +42,6 @@ export interface BaseCheckboxProps {
      * Called when the checkbox value changes
      */
     onChange?(newValue: boolean): void;
-    /**
-     * Called when the checkbox is focused
-     */
-    onFocus?(event: React.FocusEvent<HTMLInputElement>): void;
-    /**
-     * Called when the checkbox loses focus
-     */
-    onBlur?(event: React.FocusEvent<HTMLInputElement>): void;
     /**
      * Whether the checkbox is invalid
      */

package/dist/Checkbox/index.cjs

@@ -54,7 +54,7 @@ function CheckboxLegacy({ checked, defaultChecked, disabled, label, name, value,
         } }));
 }
 
-const CheckboxRebuilt = React.forwardRef(function CheckboxRebuiltInternal({ checked, defaultChecked, disabled, label, name, value, indeterminate = false, description, id, onBlur, onChange, onFocus, invalid, }, ref) {
+const CheckboxRebuilt = React.forwardRef(function CheckboxRebuiltInternal({ checked, defaultChecked, disabled, label, name, value, indeterminate = false, description, id, onBlur, onChange, onFocus, invalid, ariaLabel, ariaDescribedBy, ariaInvalid, ariaRequired, }, ref) {
     const descriptionIdentifier = React.useId();
     const wrapperClassName = classnames(styles.wrapper, disabled && styles.disabled, invalid && styles.invalid);
     const inputClassName = classnames(styles.input, {
@@ -70,7 +70,8 @@ const CheckboxRebuilt = React.forwardRef(function CheckboxRebuiltInternal({ chec
     return (React.createElement("div", { className: styles.checkBoxParent },
         React.createElement("label", { className: wrapperClassName },
             React.createElement("span", { className: styles.checkHolder },
-                React.createElement("input", { ref: ref, type: "checkbox", id: id, className: inputClassName, name: name, "aria-describedby": description ? descriptionIdentifier : undefined, checked: checked, value: value, defaultChecked: defaultChecked, disabled: disabled, onChange: handleChange, onFocus: onFocus, onBlur: onBlur }),
+                React.createElement("input", { ref: ref, type: "checkbox", id: id, className: inputClassName, name: name, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy ||
+                        (description ? descriptionIdentifier : undefined), "aria-invalid": ariaInvalid, "aria-required": ariaRequired, checked: checked, value: value, defaultChecked: defaultChecked, disabled: disabled, onChange: handleChange, onFocus: onFocus, onBlur: onBlur }),
                 React.createElement("span", { className: styles.checkBox },
                     React.createElement(Icon.Icon, { name: iconName, color: "surface" }))),
             labelContent && React.createElement("span", { className: styles.label }, labelContent)),

package/dist/Checkbox/index.mjs

@@ -52,7 +52,7 @@ function CheckboxLegacy({ checked, defaultChecked, disabled, label, name, value,
         } }));
 }
 
-const CheckboxRebuilt = forwardRef(function CheckboxRebuiltInternal({ checked, defaultChecked, disabled, label, name, value, indeterminate = false, description, id, onBlur, onChange, onFocus, invalid, }, ref) {
+const CheckboxRebuilt = forwardRef(function CheckboxRebuiltInternal({ checked, defaultChecked, disabled, label, name, value, indeterminate = false, description, id, onBlur, onChange, onFocus, invalid, ariaLabel, ariaDescribedBy, ariaInvalid, ariaRequired, }, ref) {
     const descriptionIdentifier = useId();
     const wrapperClassName = classnames(styles.wrapper, disabled && styles.disabled, invalid && styles.invalid);
     const inputClassName = classnames(styles.input, {
@@ -68,7 +68,8 @@ const CheckboxRebuilt = forwardRef(function CheckboxRebuiltInternal({ checked, d
     return (React__default.createElement("div", { className: styles.checkBoxParent },
         React__default.createElement("label", { className: wrapperClassName },
             React__default.createElement("span", { className: styles.checkHolder },
-                React__default.createElement("input", { ref: ref, type: "checkbox", id: id, className: inputClassName, name: name, "aria-describedby": description ? descriptionIdentifier : undefined, checked: checked, value: value, defaultChecked: defaultChecked, disabled: disabled, onChange: handleChange, onFocus: onFocus, onBlur: onBlur }),
+                React__default.createElement("input", { ref: ref, type: "checkbox", id: id, className: inputClassName, name: name, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy ||
+                        (description ? descriptionIdentifier : undefined), "aria-invalid": ariaInvalid, "aria-required": ariaRequired, checked: checked, value: value, defaultChecked: defaultChecked, disabled: disabled, onChange: handleChange, onFocus: onFocus, onBlur: onBlur }),
                 React__default.createElement("span", { className: styles.checkBox },
                     React__default.createElement(Icon, { name: iconName, color: "surface" }))),
             labelContent && React__default.createElement("span", { className: styles.label }, labelContent)),

package/dist/Chips/InternalChipDismissible/hooks/index.cjs

@@ -4,12 +4,12 @@ var useScrollToActive = require('../../../useScrollToActive-cjs.js');
 require('react');
 require('../../../_commonjsHelpers-cjs.js');
 require('../../../_baseFlatten-cjs.js');
-require('../../../_baseGet-cjs.js');
+require('../../../_getAllKeys-cjs.js');
 require('../../../isTypedArray-cjs.js');
 require('../../../isObjectLike-cjs.js');
+require('../../../isSymbol-cjs.js');
 require('../../../identity-cjs.js');
 require('../../../_getTag-cjs.js');
-require('../../../isSymbol-cjs.js');
 require('../../../_baseEach-cjs.js');
 require('../../../_baseFor-cjs.js');
 require('../../../_isIterateeCall-cjs.js');

package/dist/Chips/InternalChipDismissible/hooks/index.mjs

@@ -2,12 +2,12 @@ export { b as useInView, u as useInternalChipDismissible, a as useInternalChipDi
 import 'react';
 import '../../../_commonjsHelpers-es.js';
 import '../../../_baseFlatten-es.js';
-import '../../../_baseGet-es.js';
+import '../../../_getAllKeys-es.js';
 import '../../../isTypedArray-es.js';
 import '../../../isObjectLike-es.js';
+import '../../../isSymbol-es.js';
 import '../../../identity-es.js';
 import '../../../_getTag-es.js';
-import '../../../isSymbol-es.js';
 import '../../../_baseEach-es.js';
 import '../../../_baseFor-es.js';
 import '../../../_isIterateeCall-es.js';

package/dist/Chips/InternalChipDismissible/index.cjs

@@ -5,12 +5,12 @@ require('react');
 require('../../useScrollToActive-cjs.js');
 require('../../_commonjsHelpers-cjs.js');
 require('../../_baseFlatten-cjs.js');
-require('../../_baseGet-cjs.js');
+require('../../_getAllKeys-cjs.js');
 require('../../isTypedArray-cjs.js');
 require('../../isObjectLike-cjs.js');
+require('../../isSymbol-cjs.js');
 require('../../identity-cjs.js');
 require('../../_getTag-cjs.js');
-require('../../isSymbol-cjs.js');
 require('../../_baseEach-cjs.js');
 require('../../_baseFor-cjs.js');
 require('../../_isIterateeCall-cjs.js');

package/dist/Chips/InternalChipDismissible/index.mjs

@@ -3,12 +3,12 @@ import 'react';
 import '../../useScrollToActive-es.js';
 import '../../_commonjsHelpers-es.js';
 import '../../_baseFlatten-es.js';
-import '../../_baseGet-es.js';
+import '../../_getAllKeys-es.js';
 import '../../isTypedArray-es.js';
 import '../../isObjectLike-es.js';
+import '../../isSymbol-es.js';
 import '../../identity-es.js';
 import '../../_getTag-es.js';
-import '../../isSymbol-es.js';
 import '../../_baseEach-es.js';
 import '../../_baseFor-es.js';
 import '../../_isIterateeCall-es.js';

package/dist/Chips/index.cjs

@@ -7,12 +7,12 @@ var Chips = require('../Chips-cjs.js');
 require('../useScrollToActive-cjs.js');
 require('../_commonjsHelpers-cjs.js');
 require('../_baseFlatten-cjs.js');
-require('../_baseGet-cjs.js');
+require('../_getAllKeys-cjs.js');
 require('../isTypedArray-cjs.js');
 require('../isObjectLike-cjs.js');
+require('../isSymbol-cjs.js');
 require('../identity-cjs.js');
 require('../_getTag-cjs.js');
-require('../isSymbol-cjs.js');
 require('../_baseEach-cjs.js');
 require('../_baseFor-cjs.js');
 require('../_isIterateeCall-cjs.js');

package/dist/Chips/index.mjs

@@ -5,12 +5,12 @@ export { C as Chips } from '../Chips-es.js';
 import '../useScrollToActive-es.js';
 import '../_commonjsHelpers-es.js';
 import '../_baseFlatten-es.js';
-import '../_baseGet-es.js';
+import '../_getAllKeys-es.js';
 import '../isTypedArray-es.js';
 import '../isObjectLike-es.js';
+import '../isSymbol-es.js';
 import '../identity-es.js';
 import '../_getTag-es.js';
-import '../isSymbol-es.js';
 import '../_baseEach-es.js';
 import '../_baseFor-es.js';
 import '../_isIterateeCall-es.js';

package/dist/DataList/components/DataListSearch/index.cjs

@@ -18,20 +18,9 @@ require('../../../useFormFieldFocus-cjs.js');
 require('../../../InputValidation-cjs.js');
 require('../../../Spinner-cjs.js');
 require('react-hook-form');
-require('../../../omit-cjs.js');
-require('../../../_commonjsHelpers-cjs.js');
-require('../../../_baseGet-cjs.js');
-require('../../../isTypedArray-cjs.js');
-require('../../../isObjectLike-cjs.js');
-require('../../../identity-cjs.js');
-require('../../../_getTag-cjs.js');
-require('../../../isSymbol-cjs.js');
-require('../../../keysIn-cjs.js');
-require('../../../_baseAssignValue-cjs.js');
-require('../../../_baseFlatten-cjs.js');
-require('../../../_setToString-cjs.js');
 require('../../../DataListContext-cjs.js');
 require('../../../noop-cjs.js');
+require('../../../_commonjsHelpers-cjs.js');
 require('../../../DataList.const-cjs.js');
 require('../../../AnimatedSwitcher-cjs.js');
 

package/dist/DataList/components/DataListSearch/index.mjs

@@ -16,19 +16,8 @@ import '../../../useFormFieldFocus-es.js';
 import '../../../InputValidation-es.js';
 import '../../../Spinner-es.js';
 import 'react-hook-form';
-import '../../../omit-es.js';
-import '../../../_commonjsHelpers-es.js';
-import '../../../_baseGet-es.js';
-import '../../../isTypedArray-es.js';
-import '../../../isObjectLike-es.js';
-import '../../../identity-es.js';
-import '../../../_getTag-es.js';
-import '../../../isSymbol-es.js';
-import '../../../keysIn-es.js';
-import '../../../_baseAssignValue-es.js';
-import '../../../_baseFlatten-es.js';
-import '../../../_setToString-es.js';
 import '../../../DataListContext-es.js';
 import '../../../noop-es.js';
+import '../../../_commonjsHelpers-es.js';
 import '../../../DataList.const-es.js';
 import '../../../AnimatedSwitcher-es.js';

package/dist/DataList/index.cjs

@@ -81,14 +81,6 @@ require('../InputText/index.cjs');
 require('../FormField-cjs.js');
 require('../useFormFieldFocus-cjs.js');
 require('../InputValidation-cjs.js');
-require('../omit-cjs.js');
-require('../_baseGet-cjs.js');
-require('../identity-cjs.js');
-require('../isSymbol-cjs.js');
-require('../keysIn-cjs.js');
-require('../_baseAssignValue-cjs.js');
-require('../_baseFlatten-cjs.js');
-require('../_setToString-cjs.js');
 require('../DataListEmptyState-cjs.js');
 require('../DataListLoadMore-cjs.js');
 require('../DataListAction-cjs.js');

package/dist/DataList/index.mjs

@@ -79,14 +79,6 @@ import '../InputText/index.mjs';
 import '../FormField-es.js';
 import '../useFormFieldFocus-es.js';
 import '../InputValidation-es.js';
-import '../omit-es.js';
-import '../_baseGet-es.js';
-import '../identity-es.js';
-import '../isSymbol-es.js';
-import '../keysIn-es.js';
-import '../_baseAssignValue-es.js';
-import '../_baseFlatten-es.js';
-import '../_setToString-es.js';
 import '../DataListEmptyState-es.js';
 import '../DataListLoadMore-es.js';
 import '../DataListAction-es.js';

package/dist/DataTable/index.cjs

@@ -13,12 +13,12 @@ require('../Content-cjs.js');
 require('../Select/index.cjs');
 require('../omit-cjs.js');
 require('../_commonjsHelpers-cjs.js');
-require('../_baseGet-cjs.js');
+require('../_getAllKeys-cjs.js');
 require('../isTypedArray-cjs.js');
 require('../isObjectLike-cjs.js');
+require('../isSymbol-cjs.js');
 require('../identity-cjs.js');
 require('../_getTag-cjs.js');
-require('../isSymbol-cjs.js');
 require('../keysIn-cjs.js');
 require('../_baseAssignValue-cjs.js');
 require('../_baseFlatten-cjs.js');

package/dist/DataTable/index.mjs

@@ -11,12 +11,12 @@ import '../Content-es.js';
 import '../Select/index.mjs';
 import '../omit-es.js';
 import '../_commonjsHelpers-es.js';
-import '../_baseGet-es.js';
+import '../_getAllKeys-es.js';
 import '../isTypedArray-es.js';
 import '../isObjectLike-es.js';
+import '../isSymbol-es.js';
 import '../identity-es.js';
 import '../_getTag-es.js';
-import '../isSymbol-es.js';
 import '../keysIn-es.js';
 import '../_baseAssignValue-es.js';
 import '../_baseFlatten-es.js';

package/dist/DatePicker/index.cjs

@@ -16,12 +16,12 @@ require('../Icon-cjs.js');
 require('@jobber/design');
 require('../omit-cjs.js');
 require('../_commonjsHelpers-cjs.js');
-require('../_baseGet-cjs.js');
+require('../_getAllKeys-cjs.js');
 require('../isTypedArray-cjs.js');
 require('../isObjectLike-cjs.js');
+require('../isSymbol-cjs.js');
 require('../identity-cjs.js');
 require('../_getTag-cjs.js');
-require('../isSymbol-cjs.js');
 require('../keysIn-cjs.js');
 require('../_baseAssignValue-cjs.js');
 require('../_baseFlatten-cjs.js');

package/dist/DatePicker/index.mjs

@@ -14,12 +14,12 @@ import '../Icon-es.js';
 import '@jobber/design';
 import '../omit-es.js';
 import '../_commonjsHelpers-es.js';
-import '../_baseGet-es.js';
+import '../_getAllKeys-es.js';
 import '../isTypedArray-es.js';
 import '../isObjectLike-es.js';
+import '../isSymbol-es.js';
 import '../identity-es.js';
 import '../_getTag-es.js';
-import '../isSymbol-es.js';
 import '../keysIn-es.js';
 import '../_baseAssignValue-es.js';
 import '../_baseFlatten-es.js';

package/dist/FormField/FormFieldTypes.d.ts

@@ -1,4 +1,4 @@
-import type { ChangeEvent, ReactNode, RefObject } from "react";
+import type { AriaAttributes, ChangeEvent, ReactNode, RefObject } from "react";
 import type React from "react";
 import type { RegisterOptions } from "react-hook-form";
 import type { XOR } from "ts-xor";
@@ -7,6 +7,222 @@ import type { IconNames } from "../Icon";
 export type FormFieldTypes = "text" | "password" | "number" | "time" | "textarea" | "select" | "tel" | "email";
 export type KeyBoardTypes = "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal";
 export type AutocompleteTypes = "one-time-code" | "address-line1" | "address-line2";
+/**
+ * Core ARIA attributes for input elements.
+ * Uses camelCase naming for consistency with React props pattern.
+ * Based on React's canonical ARIA type definitions.
+ */
+export interface AriaInputProps {
+    /**
+     * Defines a string value that labels the current element.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-label}
+     */
+    readonly ariaLabel?: AriaAttributes["aria-label"];
+    /**
+     * Identifies the element (or elements) that labels the current element.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-labelledby}
+     */
+    readonly ariaLabelledBy?: AriaAttributes["aria-labelledby"];
+    /**
+     * Identifies the element (or elements) that describes the object.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-describedby}
+     */
+    readonly ariaDescribedBy?: AriaAttributes["aria-describedby"];
+    /**
+     * Identifies the element (or elements) that provide a detailed, extended description.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-details}
+     */
+    readonly ariaDetails?: AriaAttributes["aria-details"];
+    /**
+     * ID of the currently active descendant element.
+     * Used for composite widgets like combobox or listbox.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-activedescendant}
+     */
+    readonly ariaActiveDescendant?: AriaAttributes["aria-activedescendant"];
+    /**
+     * Indicates the entered value does not conform to the format expected.
+     * Supports boolean or specific error types: "grammar" | "spelling".
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-invalid}
+     */
+    readonly ariaInvalid?: AriaAttributes["aria-invalid"];
+    /**
+     * Indicates the element that controls the current element.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-controls}
+     */
+    readonly ariaControls?: AriaAttributes["aria-controls"];
+    /**
+     * Indicates whether the element is expanded or collapsed.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-expanded}
+     */
+    readonly ariaExpanded?: AriaAttributes["aria-expanded"];
+    /**
+     * Indicates the type of autocomplete interaction.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-autocomplete}
+     */
+    readonly ariaAutocomplete?: AriaAttributes["aria-autocomplete"];
+    /**
+     * Indicates that user input is required before form submission.
+     * @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-required}
+     */
+    readonly ariaRequired?: AriaAttributes["aria-required"];
+}
+/**
+ * Focus event handlers for input elements.
+ * Generic interface that can be specialized for different element types.
+ */
+export interface FocusEvents<Target = HTMLElement> {
+    /**
+     * Focus event handler.
+     */
+    readonly onFocus?: (event: React.FocusEvent<Target>) => void;
+    /**
+     * Blur event handler.
+     */
+    readonly onBlur?: (event: React.FocusEvent<Target>) => void;
+}
+/**
+ * Keyboard event handlers for input elements.
+ * Generic interface that can be specialized for different element types.
+ */
+export interface KeyboardEvents<Target = HTMLElement> {
+    /**
+     * Key down event handler.
+     */
+    readonly onKeyDown?: (event: React.KeyboardEvent<Target>) => void;
+    /**
+     * Key up event handler.
+     */
+    readonly onKeyUp?: (event: React.KeyboardEvent<Target>) => void;
+}
+/**
+ * Curated set of HTML input attributes for rebuilt input components.
+ * This provides a whitelist of standard HTML/React props we want to support,
+ * avoiding the issues of extending React.InputHTMLAttributes directly.
+ * Note: Event handlers and ARIA attributes are separate - use FocusEvents, KeyboardEvents, and AriaInputProps.
+ */
+export interface HTMLInputBaseProps extends AriaInputProps {
+    /**
+     * The unique identifier for the input element.
+     */
+    readonly id?: string;
+    /**
+     * The name attribute for the input element.
+     */
+    readonly name?: string;
+    /**
+     * Placeholder text that appears when the input is empty.
+     */
+    readonly placeholder?: string;
+    /**
+     * Whether the input is disabled.
+     */
+    readonly disabled?: boolean;
+    /**
+     * Whether the input is required.
+     */
+    readonly required?: boolean;
+    /**
+     * Whether the input is read-only (HTML standard casing).
+     */
+    readonly readOnly?: boolean;
+    /**
+     * Whether the input should be auto-focused (React casing).
+     */
+    readonly autoFocus?: boolean;
+    /**
+     * Autocomplete behavior for the input (React casing, string values only).
+     * Use standard HTML autocomplete values or "on"/"off".
+     */
+    readonly autoComplete?: string;
+    /**
+     * Maximum character length for the input (HTML validation only).
+     * Note: In v2, this does NOT affect the visual width of the component.
+     * Use CSS or the size prop for width control.
+     */
+    readonly maxLength?: number;
+    /**
+     * Minimum character length for the input.
+     */
+    readonly minLength?: number;
+    /**
+     * Maximum numerical value (for number inputs).
+     */
+    readonly max?: number | string;
+    /**
+     * Minimum numerical value (for number inputs).
+     */
+    readonly min?: number | string;
+    /**
+     * Validation pattern (regex) for the input.
+     */
+    readonly pattern?: string;
+    /**
+     * Input mode hint for virtual keyboards.
+     */
+    readonly inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search";
+    /**
+     * Role attribute for accessibility.
+     */
+    readonly role?: string;
+    /**
+     * Tab index for keyboard navigation.
+     */
+    readonly tabIndex?: number;
+}
+/**
+ * Common props shared across all rebuilt input components.
+ * These are Atlantis-specific features not part of standard HTML inputs.
+ */
+export interface RebuiltInputCommonProps {
+    /**
+     * Error message to display. This also highlights the field red.
+     */
+    readonly error?: string;
+    /**
+     * Highlights the field red to indicate an error.
+     */
+    readonly invalid?: boolean;
+    /**
+     * Show a spinner to indicate loading.
+     */
+    readonly loading?: boolean;
+    /**
+     * Add a clear action on the input that clears the value.
+     */
+    readonly clearable?: Clearable;
+    /**
+     * Adjusts the interface to either have small or large spacing.
+     */
+    readonly size?: "small" | "large";
+    /**
+     * Adjusts the form field to go inline with content.
+     */
+    readonly inline?: boolean;
+    /**
+     * Determines the alignment of the text inside the input.
+     */
+    readonly align?: "center" | "right";
+    /**
+     * Adds a prefix label and icon to the field.
+     */
+    readonly prefix?: Affix;
+    /**
+     * Adds a suffix label and icon with an optional action to the field.
+     */
+    readonly suffix?: XOR<Affix, Suffix>;
+    /**
+     * Further description of the input, can be used for a hint.
+     */
+    readonly description?: ReactNode;
+    /**
+     * Children elements to render inside the component.
+     */
+    readonly children?: ReactNode;
+    /**
+     * Version 2 is highly experimental. Avoid using it unless you have talked with Atlantis first.
+     */
+    readonly version: 2;
+}
 export interface FieldActionsRef {
     setValue(value: string | number): void;
 }

package/dist/FormField-cjs.js

@@ -467,7 +467,6 @@ exports.FormFieldWrapper = FormFieldWrapper;
 exports.FormFieldWrapperMain = FormFieldWrapperMain;
 exports.FormFieldWrapperToolbar = FormFieldWrapperToolbar;
 exports.mergeRefs = mergeRefs;
-exports.styles = styles$1;
 exports.useAtlantisFormField = useAtlantisFormField;
 exports.useAtlantisFormFieldActions = useAtlantisFormFieldActions;
 exports.useAtlantisFormFieldName = useAtlantisFormFieldName;

package/dist/FormField-es.js

@@ -454,4 +454,4 @@ function setAutocomplete(autocompleteSetting) {
     return autocompleteSetting;
 }
 
-export { AffixIcon as A, FormFieldInputHorizontalWrapper as F, useAtlantisFormFieldActions as a, useAtlantisFormFieldName as b, useAtlantisReactHookForm as c, FormFieldInputWrapperStyles as d, FormFieldLabel as e, FormFieldWrapper as f, FormFieldWrapperMain as g, FormFieldWrapperToolbar as h, AffixLabel as i, useFormFieldWrapperStyles as j, FormField as k, FormFieldPostFix as l, mergeRefs as m, styles$1 as s, useAtlantisFormField as u };
+export { AffixIcon as A, FormFieldInputHorizontalWrapper as F, useAtlantisFormFieldActions as a, useAtlantisFormFieldName as b, useAtlantisReactHookForm as c, FormFieldInputWrapperStyles as d, FormFieldLabel as e, FormFieldWrapper as f, FormFieldWrapperMain as g, FormFieldWrapperToolbar as h, AffixLabel as i, useFormFieldWrapperStyles as j, FormField as k, FormFieldPostFix as l, mergeRefs as m, useAtlantisFormField as u };