@moderneinc/neo-styled-components 0.0.0-development → 1.6.1-next.13e7c8

package/dist/Badge.d.ts

@@ -0,0 +1,23 @@
+import { type ChipProps } from '@mui/material/Chip';
+export interface NeoBadgeProps extends Omit<ChipProps, 'variant' | 'size'> {
+    /**
+     * The color/state of the badge
+     * @default "default"
+     */
+    color?: 'default' | 'error' | 'warning' | 'success' | 'info';
+}
+/**
+ * NeoBadge - Status badge component based on MUI Chip
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system-w--correct-set-of-tokens?node-id=4091-17230
+ *
+ * Figma Props Mapping:
+ * - state (Neutral|Error|Warning|Success|Info) → color (default|error|warning|success|info)
+ * - iconLeading → icon prop (pass React element)
+ * - iconTrailing → deleteIcon prop (pass React element)
+ * - Label → label prop
+ */
+export declare const NeoBadge: {
+    (props: NeoBadgeProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Banner.d.ts

@@ -0,0 +1,66 @@
+import { type AlertProps } from '@mui/material/Alert';
+import type { ReactNode } from 'react';
+export interface NeoBannerProps extends Omit<AlertProps, 'variant' | 'severity' | 'color'> {
+    /**
+     * The visual style variant of the banner
+     * @default "light"
+     *
+     * @figmaPropMapping color (Dark|Light|Success|Error|Warning) → variant
+     */
+    variant?: 'dark' | 'light' | 'success' | 'error' | 'warning';
+    /**
+     * The message text to display
+     *
+     * @figmaPropMapping {Message} → message
+     */
+    message: string;
+    /**
+     * Horizontal alignment of the message content
+     * @default "left"
+     *
+     * @figmaPropMapping messagePosition (Left|Center) → messagePosition
+     */
+    messagePosition?: 'left' | 'center';
+    /**
+     * Optional link text to display after the message
+     *
+     * @figmaPropMapping link (boolean) → linkText (string)
+     */
+    linkText?: string;
+    /**
+     * Whether to show the close button
+     * @default true
+     *
+     * @figmaPropMapping closeIcon → showClose
+     */
+    showClose?: boolean;
+    /**
+     * Custom icon to display (optional)
+     * If not provided, no icon will be shown
+     */
+    icon?: ReactNode;
+    /**
+     * Callback when close button is clicked
+     */
+    onClose?: () => void;
+    /**
+     * Callback when link text is clicked
+     */
+    onLinkClick?: () => void;
+}
+/**
+ * NeoBanner - Inline banner/alert component based on MUI Alert
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4170-2158
+ *
+ * Figma Props Mapping:
+ * - color (Dark|Light|Success|Error|Warning) → variant (dark|light|success|error|warning)
+ * - messagePosition (Left|Center) → messagePosition ("left"|"center")
+ * - closeIcon (boolean) → showClose (boolean)
+ * - link (boolean) → linkText (string)
+ * - {Message} → message (string)
+ */
+export declare const NeoBanner: {
+    ({ variant, message, messagePosition, linkText, showClose, icon, onClose, onLinkClick, ...props }: NeoBannerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Breadcrumbs.d.ts

@@ -0,0 +1,61 @@
+import { type LinkProps } from '@mui/material/Link';
+import type { ReactNode } from 'react';
+/**
+ * NeoBreadcrumbs - Navigation breadcrumb component
+ *
+ * Figma Mapping:
+ * - Base component uses MuiBreadcrumbs with custom styled Links
+ * - Uses chevron separator (ChevronRight from lucide-react)
+ * - Typography: 14px Medium (500 weight)
+ * - Colors:
+ *   - Non-current: semanticColors.typography.bodySecondary (#6b7280)
+ *   - Current: semanticColors.buttons.primary.default (#2f42ff)
+ *   - Hover: semanticColors.icons.hover (#1f2937) or buttons.tertiary.hover (#1e2ec2)
+ * - Focus: 2px outline with buttons.primary.focus
+ *
+ * @see https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4563-122872
+ */
+export interface NeoBreadcrumbsProps {
+    /** Breadcrumb items as Link elements */
+    children: ReactNode;
+    /** Additional CSS classes */
+    className?: string;
+}
+export interface NeoBreadcrumbLinkProps extends Omit<LinkProps, 'color'> {
+    /** Marks this breadcrumb as the current page (sets aria-current="page") */
+    current?: boolean;
+    /** Link content */
+    children: ReactNode;
+}
+/**
+ * NeoBreadcrumbLink - Individual breadcrumb link
+ *
+ * Use this component as children of NeoBreadcrumbs to create breadcrumb items.
+ * Set `current` prop on the last item to indicate the current page.
+ *
+ * @example
+ * ```tsx
+ * <NeoBreadcrumbs>
+ *   <NeoBreadcrumbLink href="/settings">Settings</NeoBreadcrumbLink>
+ *   <NeoBreadcrumbLink href="/team">Team</NeoBreadcrumbLink>
+ *   <NeoBreadcrumbLink current>Team Details</NeoBreadcrumbLink>
+ * </NeoBreadcrumbs>
+ * ```
+ */
+export declare function NeoBreadcrumbLink({ current, children, ...props }: NeoBreadcrumbLinkProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * NeoBreadcrumbs - Navigation breadcrumb component
+ *
+ * Provides hierarchical navigation with styled links and chevron separators.
+ * Use NeoBreadcrumbLink components as children to create breadcrumb items.
+ *
+ * @example
+ * ```tsx
+ * <NeoBreadcrumbs>
+ *   <NeoBreadcrumbLink href="/settings">Settings</NeoBreadcrumbLink>
+ *   <NeoBreadcrumbLink href="/team">Team</NeoBreadcrumbLink>
+ *   <NeoBreadcrumbLink current>Team Details</NeoBreadcrumbLink>
+ * </NeoBreadcrumbs>
+ * ```
+ */
+export declare function NeoBreadcrumbs({ children, className }: NeoBreadcrumbsProps): import("react/jsx-runtime").JSX.Element;

package/dist/Button.d.ts

@@ -0,0 +1,59 @@
+import { type ButtonBaseProps } from '@mui/material/ButtonBase';
+import type { ReactNode } from 'react';
+declare module '@mui/material/ButtonBase' {
+    interface ButtonBasePropsVariantOverrides {
+        primary: true;
+        secondary: true;
+        destructive: true;
+        link: true;
+        linkColor: true;
+    }
+}
+type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link' | 'linkColor';
+type ButtonSize = 'small' | 'medium';
+export interface NeoButtonProps extends Omit<ButtonBaseProps, 'children'> {
+    /**
+     * The visual variant of the button
+     * @default "primary"
+     *
+     * @figma Hierarchy
+     */
+    variant?: ButtonVariant;
+    /**
+     * The size of the button
+     * @default "medium"
+     *
+     * @figma Size
+     */
+    size?: ButtonSize;
+    /**
+     * Show loading spinner instead of children
+     * @default false
+     *
+     * @figma State=Loading
+     */
+    loading?: boolean;
+    /**
+     * Button content
+     */
+    children?: ReactNode;
+}
+/**
+ * NeoButton - Text button component based on MUI ButtonBase
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4086-7590
+ *
+ * Figma Props Mapping:
+ * - Hierarchy (Primary|Secondary|Destructive|Link|Link Color) → variant prop
+ * - Size (Small|Medium) → size prop
+ * - State=Disabled → disabled prop
+ * - State=Loading → loading prop
+ * - State=Hover → CSS :hover
+ * - State=Pressed → CSS :active
+ * - State=Focused → CSS :focus-visible
+ */
+export declare const NeoButton: {
+    ({ variant, size, loading, children, disabled, ...props }: NeoButtonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/ButtonGroup.d.ts

@@ -0,0 +1,42 @@
+import { type ButtonGroupProps as MuiButtonGroupProps } from '@mui/material/ButtonGroup';
+type ButtonGroupSize = 'small' | 'medium';
+export interface NeoButtonGroupProps extends Omit<MuiButtonGroupProps, 'size' | 'variant'> {
+    /**
+     * The size of the button group
+     * @default "medium"
+     *
+     * @figma Size=Sm → small, Size=Md → medium
+     */
+    size?: ButtonGroupSize;
+    /**
+     * The visual variant of the buttons
+     * ButtonGroup uses a fixed outlined style from the design
+     */
+    variant?: 'outlined';
+}
+/**
+ * NeoButtonGroup - Button group component based on MUI ButtonGroup
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4106-11129
+ *
+ * Figma Props Mapping:
+ * - Size (Sm|Md) → size prop (small|medium)
+ * - Icon=False → Icon support not included in this implementation
+ * - Active button state → Controlled externally via button props or classes
+ *
+ * Usage:
+ * ```tsx
+ * <NeoButtonGroup size="medium">
+ *   <NeoButton>Button 1</NeoButton>
+ *   <NeoButton>Button 2</NeoButton>
+ *   <NeoButton>Button 3</NeoButton>
+ * </NeoButtonGroup>
+ * ```
+ *
+ * Note: To show active state, add 'active' class to the selected button
+ */
+export declare const NeoButtonGroup: {
+    ({ size, variant, ...props }: NeoButtonGroupProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/Checkbox.d.ts

@@ -0,0 +1,80 @@
+import { type CheckboxProps } from '@mui/material/Checkbox';
+import type { ReactNode } from 'react';
+declare module '@mui/material/Checkbox' {
+    interface CheckboxPropsSizeOverrides {
+        xs: true;
+        small: true;
+        medium: true;
+    }
+}
+type CheckboxSize = 'xs' | 'small' | 'medium';
+export interface NeoCheckboxProps extends Omit<CheckboxProps, 'size'> {
+    /**
+     * The size of the checkbox
+     * @default "medium"
+     *
+     * @figma Size
+     */
+    size?: CheckboxSize;
+    /**
+     * The label text displayed next to the checkbox
+     *
+     * @figma Text (label)
+     */
+    label?: ReactNode;
+    /**
+     * The helper text displayed below the label
+     *
+     * @figma Text (supporting text)
+     */
+    helperText?: ReactNode;
+}
+/**
+ * NeoCheckbox - Checkbox component based on MUI Checkbox
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4122-39311
+ *
+ * Figma Props Mapping:
+ * - Checked (True|False) → checked prop
+ * - Indeterminate (True|False) → indeterminate prop
+ * - Size (xs|sm|md) → size prop (xs|small|medium)
+ * - State=Default → default state
+ * - State=Hover → CSS :hover
+ * - State=Focused → CSS :focus-visible
+ * - State=Disabled → disabled prop
+ * - Text (label) → label prop
+ * - Text (supporting text) → helperText prop
+ *
+ * @example
+ * // Basic checkbox
+ * <NeoCheckbox />
+ *
+ * @example
+ * // With label
+ * <NeoCheckbox label="Remember me" />
+ *
+ * @example
+ * // With label and helper text
+ * <NeoCheckbox label="Remember me" helperText="Save my login details for next time." />
+ *
+ * @example
+ * // Small size
+ * <NeoCheckbox size="small" label="Remember me" />
+ *
+ * @example
+ * // Extra small size
+ * <NeoCheckbox size="xs" label="Remember me" />
+ *
+ * @example
+ * // Controlled
+ * <NeoCheckbox checked={isChecked} onChange={handleChange} label="Remember me" />
+ *
+ * @example
+ * // Indeterminate state (for "select all" checkboxes)
+ * <NeoCheckbox indeterminate={true} label="Select all" />
+ */
+export declare const NeoCheckbox: {
+    ({ size, label, helperText, disabled, ...props }: NeoCheckboxProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/CodeSnippet.d.ts

@@ -0,0 +1,59 @@
+import type { ButtonBaseProps } from '@mui/material/ButtonBase';
+import type { ReactNode } from 'react';
+declare module '@mui/material/ButtonBase' {
+    interface ButtonBasePropsVariantOverrides {
+        outlined: true;
+        filled: true;
+    }
+}
+type CodeSnippetVariant = 'outlined' | 'filled';
+type CodeSnippetSize = 'xs' | 'small' | 'large';
+export interface NeoCodeSnippetProps extends Omit<ButtonBaseProps, 'children'> {
+    /**
+     * The visual variant of the code snippet
+     * @default "outlined"
+     *
+     * @figma Color (Light|Dark)
+     */
+    variant?: CodeSnippetVariant;
+    /**
+     * The size of the code snippet
+     * @default "small"
+     *
+     * @figma size (xs|small|large)
+     */
+    size?: CodeSnippetSize;
+    /**
+     * Icon to display at the start (leading position)
+     *
+     * @figma leadingIcon
+     */
+    startIcon?: ReactNode;
+    /**
+     * Icon to display at the end (trailing position)
+     *
+     * @figma trailingIcon
+     */
+    endIcon?: ReactNode;
+    /**
+     * Code snippet content to display
+     */
+    children: ReactNode;
+}
+/**
+ * NeoCodeSnippet - Inline code snippet component based on MUI ButtonBase
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4187-30353
+ *
+ * Figma Props Mapping:
+ * - Color (Light|Dark) → variant (outlined|filled)
+ * - size (xs|small|large) → size prop
+ * - leadingIcon (boolean) → startIcon (ReactNode)
+ * - trailingIcon (boolean) → endIcon (ReactNode)
+ * - Text content → children prop
+ */
+export declare const NeoCodeSnippet: {
+    ({ variant, size, startIcon, endIcon, children, ...props }: NeoCodeSnippetProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/Divider.d.ts

@@ -0,0 +1,32 @@
+import { type DividerProps } from '@mui/material/Divider';
+export interface NeoDividerProps extends DividerProps {
+}
+/**
+ * NeoDivider - Horizontal divider for separating content
+ *
+ * Generic divider component that can be used in menus, lists, cards, or any layout
+ * that needs visual separation between content sections.
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4159-8649
+ *
+ * @example
+ * ```tsx
+ * // In a menu
+ * <NeoMenu>
+ *   <NeoMenuItem>Settings</NeoMenuItem>
+ *   <NeoDivider />
+ *   <NeoMenuItem>Sign out</NeoMenuItem>
+ * </NeoMenu>
+ *
+ * // In a card
+ * <Card>
+ *   <CardHeader>Title</CardHeader>
+ *   <NeoDivider />
+ *   <CardContent>Content</CardContent>
+ * </Card>
+ * ```
+ */
+export declare const NeoDivider: {
+    (props: NeoDividerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Dot.d.ts

@@ -0,0 +1,36 @@
+import { type BadgeProps } from '@mui/material/Badge';
+type DotSize = 'small' | 'medium' | 'large';
+type DotVariant = 'solid' | 'outline';
+type DotColor = 'success' | 'error' | 'warning' | 'info' | 'neutral';
+export interface NeoDotProps extends Omit<BadgeProps, 'variant' | 'color' | 'badgeContent' | 'children'> {
+    /**
+     * The size of the dot
+     * @default "medium"
+     */
+    size?: DotSize;
+    /**
+     * The variant of the dot
+     * @default "solid"
+     */
+    variant?: DotVariant;
+    /**
+     * The color/status of the dot
+     * @default "neutral"
+     */
+    color?: DotColor;
+}
+/**
+ * NeoDot - Status indicator dot component based on MUI Badge
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4163-3577
+ *
+ * Figma Props Mapping:
+ * - size (sm|md|lg) → size prop (small|medium|large)
+ * - outline (False|True) → variant prop (solid|outline)
+ * - Color is configurable via color prop (success|error|warning|info|neutral)
+ */
+export declare const NeoDot: {
+    ({ size, variant, color, ...props }: NeoDotProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/Footer.d.ts

@@ -0,0 +1,103 @@
+import type { ReactNode } from 'react';
+export interface NeoFooterProps {
+    /**
+     * Footer variant
+     * - "loading": Shows result count with loading indicator and "Load more" button
+     * - "pagination": Shows pagination controls with page range and navigation buttons
+     * @default "pagination"
+     */
+    variant?: 'loading' | 'pagination';
+    /**
+     * Whether to show the loading indicator (only for "loading" variant)
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Total number of results (for "loading" variant)
+     */
+    resultCount?: number;
+    /**
+     * Callback when "Load more" is clicked (for "loading" variant)
+     */
+    onLoadMore?: () => void;
+    /**
+     * Whether there are more results to load (for "loading" variant)
+     * @default true
+     */
+    hasMore?: boolean;
+    /**
+     * Custom pagination info text (for "pagination" variant)
+     * If not provided, will attempt to use DataGrid's pagination state
+     * @example "1-80 of 120"
+     */
+    paginationInfo?: string;
+    /**
+     * Callback when previous page button is clicked (for "pagination" variant)
+     */
+    onPreviousPage?: () => void;
+    /**
+     * Callback when next page button is clicked (for "pagination" variant)
+     */
+    onNextPage?: () => void;
+    /**
+     * Whether the previous page button is disabled (for "pagination" variant)
+     * If not provided, will attempt to use DataGrid's pagination state
+     */
+    hasPreviousPage?: boolean;
+    /**
+     * Whether the next page button is disabled (for "pagination" variant)
+     * If not provided, will attempt to use DataGrid's pagination state
+     */
+    hasNextPage?: boolean;
+    /**
+     * Custom content to render in the footer
+     */
+    children?: ReactNode;
+}
+/**
+ * NeoFooter - Footer component for data grids
+ *
+ * Provides two variants:
+ * - "loading": Shows result count with loading indicator and "Load more" button for infinite scroll
+ * - "pagination": Shows pagination controls with page range and navigation buttons
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4261-3133
+ *
+ * @example
+ * // Loading variant with load more
+ * <NeoFooter
+ *   variant="loading"
+ *   loading={isLoading}
+ *   resultCount={40}
+ *   hasMore={true}
+ *   onLoadMore={() => loadMore()}
+ * />
+ *
+ * @example
+ * // Pagination variant
+ * <NeoFooter
+ *   variant="pagination"
+ *   paginationInfo="1-80 of 120"
+ *   hasPreviousPage={false}
+ *   hasNextPage={true}
+ *   onPreviousPage={() => goToPrevious()}
+ *   onNextPage={() => goToNext()}
+ * />
+ *
+ * @example
+ * // Used with DataGrid (automatically reads pagination state)
+ * <DataGrid
+ *   rows={rows}
+ *   columns={columns}
+ *   slots={{ footer: NeoFooter }}
+ *   slotProps={{
+ *     footer: {
+ *       variant: 'pagination',
+ *     },
+ *   }}
+ * />
+ */
+export declare const NeoFooter: {
+    ({ variant, loading, resultCount, onLoadMore, hasMore, paginationInfo, onPreviousPage, onNextPage, hasPreviousPage, hasNextPage, children, }: NeoFooterProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/IconButton.d.ts

@@ -0,0 +1,31 @@
+import { type IconButtonProps } from '@mui/material/IconButton';
+type IconButtonSize = 'small' | 'medium';
+export interface NeoIconButtonProps extends Omit<IconButtonProps, 'color' | 'size'> {
+    /**
+     * The size of the icon button
+     * @default "medium"
+     *
+     * @figma Size
+     */
+    size?: IconButtonSize;
+}
+/**
+ * NeoIconButton - Icon-only button component based on MUI IconButton
+ *
+ * Simple, neutral icon button with transparent background and icon color states.
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4086-7590
+ *
+ * Figma Props Mapping:
+ * - Hierarchy=Icon → Single default style (no variant prop)
+ * - Size (Small|Medium) → size prop
+ * - State=Disabled → disabled prop
+ * - State=Hover → CSS :hover
+ * - State=Pressed → CSS :active
+ * - State=Focused → CSS :focus-visible
+ */
+export declare const NeoIconButton: {
+    ({ size, ...props }: NeoIconButtonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};

package/dist/InputField.d.ts

@@ -0,0 +1,90 @@
+import { type InputBaseProps } from '@mui/material/InputBase';
+import type { ReactNode } from 'react';
+type InputFieldSize = 'small' | 'medium';
+export interface NeoInputFieldProps extends Omit<InputBaseProps, 'size'> {
+    /**
+     * The size of the input field
+     * @default "medium"
+     *
+     * @figma Size
+     */
+    size?: InputFieldSize;
+    /**
+     * Show error/destructive state with red styling
+     * @default false
+     *
+     * @figma Destructive
+     */
+    destructive?: boolean;
+    /**
+     * Label text for the input
+     *
+     * @figma Label
+     */
+    label?: string;
+    /**
+     * Show required indicator (asterisk)
+     * @default false
+     *
+     * @figma Required indicator
+     */
+    required?: boolean;
+    /**
+     * Info icon to display next to the label
+     *
+     * @figma Info icon
+     */
+    infoIcon?: ReactNode;
+    /**
+     * Helper text displayed below the input (normal state)
+     *
+     * @figma Helper text
+     */
+    helperText?: string;
+    /**
+     * Error message displayed below the input (destructive state)
+     * Takes precedence over helperText when destructive is true
+     *
+     * @figma Error message
+     */
+    errorMessage?: string;
+    /**
+     * Icon to display at the start of the input
+     *
+     * @figma Left icon
+     */
+    startIcon?: ReactNode;
+    /**
+     * Icon to display at the end of the input
+     * In destructive state, an error icon is automatically shown
+     *
+     * @figma Right icon
+     */
+    endIcon?: ReactNode;
+}
+/**
+ * NeoInputField - Form input field component using MUI FormControl composition
+ *
+ * @figma https://www.figma.com/design/fQTkGSFbYyE7LiHuQJsENC/Neo---Moderne-Design-system---2025?node-id=4091-23373
+ *
+ * Figma Props Mapping:
+ * - Size (small|medium) → size prop
+ * - Destructive (false|true) → destructive prop
+ * - State=Placeholder → empty value with placeholder text
+ * - State=Hover → CSS :hover
+ * - State=Filled → value prop with text
+ * - State=Focused → CSS :focus
+ * - State=Disabled → disabled prop
+ * - Label → label prop
+ * - Required indicator (*) → required prop
+ * - Info icon → infoIcon prop
+ * - Helper text → helperText prop
+ * - Error message → errorMessage prop (shown when destructive=true)
+ * - Left icon → startIcon prop
+ * - Right icon → endIcon prop (auto error icon when destructive=true)
+ */
+export declare const NeoInputField: {
+    ({ size, destructive, label, required, infoIcon, helperText, errorMessage, startIcon, endIcon, disabled, id, ...props }: NeoInputFieldProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export {};