@parasutcom/fds 0.1.7 → 0.1.8

package/dist/index.d.ts

@@ -69,51 +69,7 @@ declare const alertVariants: (props?: ({
     variant?: "default" | "destructive" | null | undefined;
 } & ClassProp) | undefined) => string;
 
-/**
- * Autocomplete component with form validation support.
- * Accepts error prop as string or string[] for seamless integration with form libraries.
- *
- * @example
- * // Standalone with controlled state
- * const [city, setCity] = useState(null)
- *
- * <Autocomplete
- *   name="city"
- *   options={cities}
- *   value={city}
- *   onValueChange={setCity}
- *   description="Select your city"
- * />
- *
- * @example
- * // With TanStack Form + Zod (in your project)
- * // 1. Define schema in your project:
- * // const citySchema = z.object({ value: z.string(), label: z.string() }).nullable()
- * //   .refine(val => val !== null, { message: 'City required' })
- *
- * // 2. Use in form:
- * <form.Field
- *   name="city"
- *   validators={{
- *     onChange: ({ value }) => {
- *       const result = citySchema.safeParse(value)
- *       return result.success ? undefined : result.error.issues[0]?.message
- *     }
- *   }}
- * >
- *   {(field) => (
- *     <Autocomplete
- *       name="city"
- *       options={cities}
- *       value={field.state.value}
- *       onValueChange={field.handleChange}
- *       onBlur={field.handleBlur}
- *       error={field.state.meta.errors}
- *     />
- *   )}
- * </form.Field>
- */
-export declare function Autocomplete<T extends AutocompleteOption>({ options, value, defaultValue, onValueChange, description, error, emptyMessage, name, placeholder, disabled, variant, size, ...props }: AutocompleteProps<T>): JSX.Element;
+export declare function Autocomplete<T extends AutocompleteOption>({ options, value, defaultValue, onValueChange, description, error, emptyMessage, name, placeholder, disabled, variant, size, allowCustomValue, createOption, ...props }: AutocompleteProps<T>): JSX.Element;
 
 export declare interface AutocompleteOption {
     value: string;
@@ -129,6 +85,10 @@ export declare interface AutocompleteProps<T extends AutocompleteOption> extends
     error?: string | string[];
     emptyMessage?: string;
     name: string;
+    /** Allows creating new options by typing values not in the list. */
+    allowCustomValue?: boolean;
+    /** Custom function to create option from input. Defaults to { value: input, label: input }. */
+    createOption?: (inputValue: string) => T;
 }
 
 export declare function Avatar({ className, size, ...props }: Avatar_2.Root.Props & {
@@ -423,6 +383,14 @@ declare const fieldVariants: (props?: ({
     orientation?: "horizontal" | "vertical" | "responsive" | null | undefined;
 } & ClassProp) | undefined) => string;
 
+export declare function IbanField({ value, onChange, showPrefix, error, placeholder, ...props }: IbanFieldProps): JSX.Element;
+
+export declare interface IbanFieldProps extends Omit<TextFieldProps, 'type' | 'value' | 'onChange' | 'prefix'> {
+    value: string;
+    onChange: (value: string) => void;
+    showPrefix?: boolean;
+}
+
 export declare function Input({ className, type, variant, size, ...props }: InputProps): JSX.Element;
 
 export declare function InputGroup({ className, variant, size, ...props }: React_2.ComponentProps<"div"> & VariantProps<typeof inputGroupVariants>): JSX.Element;
@@ -447,6 +415,8 @@ export declare function InputGroupText({ className, ...props }: React_2.Componen
 
 export declare function InputGroupTextarea({ className, ...props }: React_2.ComponentProps<"textarea">): JSX.Element;
 
+declare type InputGroupVariants = Pick<React_2.ComponentProps<typeof InputGroup>, 'variant' | 'size'>;
+
 declare const inputGroupVariants: (props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
@@ -506,6 +476,61 @@ export declare function KbdGroup({ className, ...props }: React.ComponentProps<"
 
 export declare function Label({ className, ...props }: React_2.ComponentProps<"label">): JSX.Element;
 
+/**
+ * NumericField - A one-way numeric input component with Turkish formatting
+ *
+ * @description
+ * Provides a numeric input that:
+ * - Formats numbers with Turkish locale (dot for thousands, comma for decimals)
+ * - Supports configurable decimal places
+ * - Can be readonly (display-only) or controlled
+ * - Follows the same pattern as TextField component
+ * - Handles validation states and descriptions
+ *
+ * @example
+ * // Basic usage (readonly display)
+ * <NumericField
+ *   name="price"
+ *   value={1234.56}
+ *   readonly
+ * />
+ *
+ * @example
+ * // Controlled input
+ * <NumericField
+ *   name="amount"
+ *   value={amount}
+ *   onChange={setAmount}
+ *   decimalPlaces={2}
+ *   description="Tutar giriniz"
+ * />
+ *
+ * @example
+ * // With error state
+ * <NumericField
+ *   name="quantity"
+ *   value={quantity}
+ *   onChange={setQuantity}
+ *   error="Miktar 0'dan büyük olmalıdır"
+ *   decimalPlaces={0}
+ * />
+ */
+export declare function NumericField({ name, value, onChange, description, error, variant, size, decimalPlaces, readonly, prefix, suffix, className, disabled, ...props }: NumericFieldProps): JSX.Element;
+
+export declare interface NumericFieldProps extends Omit<React_2.ComponentPropsWithoutRef<typeof InputGroupInput>, 'value' | 'onChange' | 'type' | 'inputMode' | 'prefix' | 'ref'> {
+    name: string;
+    value: number | null | undefined;
+    onChange?: (value: number | null) => void;
+    description?: string;
+    error?: string | string[];
+    variant?: InputGroupVariants['variant'];
+    size?: InputGroupVariants['size'];
+    decimalPlaces?: number;
+    readonly?: boolean;
+    prefix?: React_2.ReactNode;
+    suffix?: React_2.ReactNode;
+}
+
 export declare function Pagination({ className, ...props }: React_2.ComponentProps<'nav'>): JSX.Element;
 
 export declare function PaginationContent({ className, ...props }: React_2.ComponentProps<'ul'>): JSX.Element;