@delightui/components 0.1.138 → 0.1.140

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,6 +20,10 @@ export type SelectContextType = {
20
20
  * Function to reset the selected value to its default state.
21
21
  */
22
22
  resetSelectedValue: () => void;
23
+ /**
24
+ * Function to register an option's value-label pair.
25
+ */
26
+ registerOption: (optionValue: FieldValue, label: React.ReactNode) => void;
23
27
  /**
24
28
  * Function to get the display label for a value.
25
29
  */
@@ -33,10 +33,3 @@ export declare const handleSelectionChange: (newValue: string | number, selected
33
33
  * @returns Whether the option is selected or not.
34
34
  */
35
35
  export declare const checkIsSelected: (optionValue?: string, selectedValue?: FieldValue) => boolean;
36
- /**
37
- * Utility to recursively find Option components and extract their props
38
- */
39
- export declare const extractOptionProps: (children: React.ReactNode, OptionComponent: React.ComponentType<any>) => Array<{
40
- value: FieldValue;
41
- label: React.ReactNode;
42
- }>;
@@ -0,0 +1,5 @@
1
+ /**
2
+ * Main example demonstrating the useForm hook
3
+ */
4
+ declare const UseFormExample: () => import("react/jsx-runtime").JSX.Element;
5
+ export default UseFormExample;
@@ -2,3 +2,4 @@ import type { FormProps, FormProviderProps, FormState } from './Form.types';
2
2
  declare const Form: <T extends FormState>(props: FormProviderProps<T> & FormProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default Form;
4
4
  export * from './Form.types';
5
+ export { useForm, useFormTyped } from './useForm';
@@ -0,0 +1,50 @@
1
+ import type { FormContextValues, FormState } from './Form.types';
2
+ /**
3
+ * Custom hook to access form context values.
4
+ * Provides direct access to all form state management functions and values.
5
+ *
6
+ * @throws {Error} If used outside of a Form component
7
+ * @returns {FormContextValues} Object containing form state and control functions
8
+ *
9
+ * @example
10
+ * ```tsx
11
+ * const MyCustomField = () => {
12
+ * const {
13
+ * formState,
14
+ * formErrors,
15
+ * updateFieldValue,
16
+ * resetForm
17
+ * } = useForm();
18
+ *
19
+ * return (
20
+ * <div>
21
+ * <input
22
+ * value={formState.myField || ''}
23
+ * onChange={(e) => updateFieldValue('myField', e.target.value)}
24
+ * />
25
+ * {formErrors.myField && <span>{formErrors.myField}</span>}
26
+ * </div>
27
+ * );
28
+ * };
29
+ * ```
30
+ */
31
+ export declare const useForm: <T extends FormState = Partial<Record<string, import("./Form.types").FieldValue>>>() => FormContextValues<T>;
32
+ /**
33
+ * Type-safe version of useForm that returns properly typed form context
34
+ *
35
+ * @example
36
+ * ```tsx
37
+ * interface MyFormData {
38
+ * name: string;
39
+ * email: string;
40
+ * age: number;
41
+ * }
42
+ *
43
+ * const MyComponent = () => {
44
+ * const form = useFormTyped<MyFormData>();
45
+ * // form.formState is now typed as MyFormData
46
+ * // form.formErrors is now typed as FormErrors<MyFormData>
47
+ * };
48
+ * ```
49
+ */
50
+ export declare const useFormTyped: <T extends FormState>() => FormContextValues<T>;
@@ -692,6 +692,7 @@
692
692
  display: flex;
693
693
  width: auto;
694
694
  height: auto;
695
+ position: relative;
695
696
  gap: var(--tooltip-wrapper-row-gap) var(--tooltip-wrapper-column-gap);
696
697
  }
697
698
  .Tooltip-module_tooltipWrapper__wwgA3 .Tooltip-module_tooltipTarget__FAk8O {