@delightui/components 0.1.3 → 0.1.4

package/dist/esm/components/molecules/Select/Select.Context.d.ts

@@ -1,18 +0,0 @@
-import React from 'react';
-import type { SelectContextType, SelectProviderProps } from './Select.types';
-/**
- * Custom hook to use the SelectContext values.
- * Throws an error if used outside of a SelectProvider.
- *
- * @throws Error if used outside of SelectProvider.
- * @returns Context values of type SelectContextType.
- */
-export declare const useSelectContext: () => SelectContextType;
-/**
- * Provider component for managing state and providing context to Select components.
- * Manages the selected value state and provides methods to update or reset it.
- *
- * @param props - Props for configuring the SelectProvider.
- * @returns JSX element that provides context to its children.
- */
-export declare const SelectProvider: ({ children, value, defaultValue, multiple, disabled, onValueChanged, }: SelectProviderProps) => React.JSX.Element;

package/dist/esm/components/molecules/Select/Select.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import type { SelectViewProps } from './Select.types';
-/**
- * Select component for displaying a dropdown with options.
- * Uses Popover for the dropdown functionality.
- *
- * @param props - Props for configuring the Select component.
- * @returns Element representing the select.
- */
-declare const Select: (props: SelectViewProps) => React.JSX.Element;
-export default Select;

package/dist/esm/components/molecules/Select/Select.types.d.ts

@@ -1,128 +0,0 @@
-import type { HTMLAttributes, ReactNode } from 'react';
-import type { OptionProps } from './Option';
-import type { ContentProps } from '../Popover/Popover.types';
-import { FieldValue } from '../../organisms/Form/Form.types';
-/**
- * Represents the context provided by the Select component.
- */
-export type SelectContextType = {
-    /**
-     * The currently selected value in the Select component.
-     */
-    selectedValue: FieldValue;
-    /**
-     * Function to update the selected value.
-     * @param value - The new value to select, either a string or number.
-     */
-    updateSelectedValue: (value: string | number) => void;
-    /**
-     * Function to reset the selected value to its default state.
-     */
-    resetSelectedValue: () => void;
-    /**
-     * Indicates whether the field is in an invalid state.
-     */
-    invalidField?: boolean;
-    /**
-     * Indicates whether the field is disabled.
-     */
-    disabledField?: boolean;
-    /**
-     * id to use as htmlFor for label, which will be fetched from FormFieldContext
-     */
-    formFieldId: string;
-};
-/**
- * Props for the SelectProvider component, which manages state and provides context for Select.
- */
-export type SelectProviderProps = {
-    /**
-     * Child elements to be rendered within the SelectProvider.
-     */
-    children: ReactNode;
-    /**
-     * Currently selected value (if controlled).
-     */
-    value?: FieldValue;
-    /**
-     * Indicates if multiple options can be selected.
-     * @default false
-     */
-    multiple?: boolean;
-    /**
-     * Default selected value (if uncontrolled).
-     */
-    defaultValue?: FieldValue;
-    /**
-     * Indicates whether the Select is disabled.
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Callback function invoked when the selected value changes.
-     * @param event - Optional event containing the new field value.
-     */
-    onValueChanged?: (event?: FieldValue) => void;
-    /**
-     * Indicates whether the selected field is hasDefaultOption or not.
-     * @default false
-     */
-    hasDefaultOption?: boolean;
-};
-/**
- * Enum representing different states of the Select component.
- */
-export type SelectStateEnum = 'Default' | 'Error';
-/**
- * Props for the SelectView component, defining its visual appearance and behavior.
- */
-export type SelectViewProps = Omit<HTMLAttributes<HTMLElement>, 'style' | 'children'> & {
-    /**
-     * Options to be rendered within the Select component.
-     */
-    children: React.ReactElement<OptionProps> | React.ReactElement<OptionProps>[];
-    /**
-     * Placeholder text displayed when no option is selected.
-     */
-    placeholder?: string;
-    /**
-     * Determines if the dropdown menu is initially open.
-     * @default false
-     */
-    defaultOpen?: boolean;
-    /**
-     * Icon displayed before the select input.
-     */
-    leadingIcon?: ReactNode;
-    /**
-     * Icon displayed for the expand sign.
-     */
-    expandIcon?: ReactNode;
-    /**
-     * Indicates whether the dropdown menu is currently open.
-     * @default false
-     */
-    open?: boolean;
-    /**
-     * Current state of the Select component.
-     * @default 'Default'
-     */
-    state?: SelectStateEnum;
-    /**
-     * Additional props for the dropdown menu.
-     */
-    menuProps?: ContentProps;
-    /**
-   * Indicates whether the selected field is hasDefaultOption or not.
-   * @default false
-   */
-    hasDefaultOption?: boolean;
-    /**
-     * Additional CSS classes for customization.
-     */
-    className?: string;
-};
-/**
- * Props for the Select component, combining provider and view props.
- */
-export type SelectProps = Omit<SelectProviderProps, 'children'> & SelectViewProps;

package/dist/esm/components/molecules/Select/Select.utils.d.ts

@@ -1,33 +0,0 @@
-import { FieldValue } from '../../organisms/Form/Form.types';
-/**
- * Utility function to check if a given value has content.
- * - If the value is an array, it returns true if the array has elements, otherwise false.
- * - If the value is not an array, it returns the value itself.
- *
- * @param {FieldValue} value - The value to check. Can be a string, number, string array, or undefined.
- * @returns {boolean | FieldValue} - Returns true if the value is a non-empty array, otherwise returns the value itself.
- */
-export declare const hasValue: (value: FieldValue) => boolean | FieldValue;
-/**
- * Returns the selected value in an appropriate format.
- *
- * @param selected - The selected value, which can be a string, number, or an array of strings or numbers.
- * @param defaultValue - The default value to return if no selected value is provided. Default is an empty string.
- * @returns The selected value if it exists, formatted as a string or number, or the default value.
- */
-export declare const getSelectedValue: (selected: FieldValue, defaultValue?: string) => string | number | undefined;
-/**
-   * Utility function to handle changes to the selected value in a Select component.
-   * @param newValue  The new value to be selected or deselected.
-   * @param Values The current selected value(s).
-   * @param multiple Flag to indicate if multiple selections are allowed.
-   * @returns The updated selected option(s).
-   */
-export declare const handleSelectionChange: (newValue: string | number, selectedValue: FieldValue, multiple?: boolean, defaultValue?: FieldValue, hasDefaultOption?: boolean) => FieldValue;
-/**
- * Utility function to determine if an option is selected.
- * @param optionValue The value of the option to check.
- * @param Values The currently selected value.
- * @returns Whether the option is selected or not.
- */
-export declare const checkIsSelected: (optionValue?: string, selectedValue?: FieldValue) => boolean;

package/dist/esm/components/molecules/Select/index.d.ts

@@ -1,15 +0,0 @@
-import { SelectProvider, useSelectContext } from './Select.Context';
-import type { SelectProps } from './Select.types';
-export type { SelectProps };
-export { default as Option } from './Option';
-export { SelectProvider, useSelectContext };
-export * from './Option';
-/**
- * Select component that wraps SelectComponent with SelectProvider.
- * Provides state management and context to SelectComponent.
- *
- * @param props - Props for configuring the Select component.
- * @returns JSX element that renders the SelectComponent wrapped with SelectProvider.
- */
-declare const Select: (props: SelectProps) => JSX.Element;
-export default Select;

package/dist/esm/components/molecules/TabContent/TabContent.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TabContentProps } from './TabContent.types';
-declare const TabContent: (props: TabContentProps) => React.JSX.Element | null;
-export default TabContent;

package/dist/esm/components/molecules/TabContent/TabContent.types.d.ts

@@ -1,20 +0,0 @@
-export interface TabContentProps {
-    /**
-     * The tab contents value.
-     * @remarks
-     * This is used for determining which tab is selected.
-     * The value from TabContent will be compared to the value from TabItem.
-     * @example
-     * 1
-     * "One"
-     */
-    value: number | string;
-    /**
-     * The contents of the tab.
-     */
-    children: React.ReactNode;
-    /**
-     * The classname applied to the tab content.
-     */
-    className?: string;
-}

package/dist/esm/components/molecules/TabContent/index.d.ts

@@ -1,4 +0,0 @@
-import TabContent from './TabContent';
-import type { TabContentProps } from './TabContent.types';
-export type { TabContentProps };
-export default TabContent;

package/dist/esm/components/molecules/TabItem/TabItem.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TabItemProps } from './TabItem.types';
-declare const TabItem: (props: TabItemProps) => React.JSX.Element;
-export default TabItem;

package/dist/esm/components/molecules/TabItem/TabItem.types.d.ts

@@ -1,19 +0,0 @@
-import type { ButtonProps } from '../../atoms';
-export interface TabItemProps extends ButtonProps {
-    /**
-     * The tabs value.
-     * @remarks
-     * This is used for determining which tab is selected.
-     * The value from TabContent will be compared to the value from TabItem.
-     * @example
-     * 1
-     * "One"
-     */
-    value: number | string;
-    /**
-     * The default tab.
-     * @remarks
-     * True means that this tab will be displayed initially
-     */
-    defaultTab?: boolean;
-}

package/dist/esm/components/molecules/TabItem/index.d.ts

@@ -1,4 +0,0 @@
-import TabItem from './TabItem';
-import type { TabItemProps } from './TabItem.types';
-export type { TabItemProps };
-export default TabItem;

package/dist/esm/components/molecules/TableBody/TableBody.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TableBodyProps } from './TableBody.types';
-declare const TableBody: (props: TableBodyProps) => React.JSX.Element;
-export default TableBody;

package/dist/esm/components/molecules/TableBody/TableBody.types.d.ts

@@ -1,2 +0,0 @@
-import { HTMLAttributes } from 'react';
-export type TableBodyProps = HTMLAttributes<HTMLTableSectionElement>;

package/dist/esm/components/molecules/TableBody/index.d.ts

@@ -1,4 +0,0 @@
-import TableBody from './TableBody';
-import type { TableBodyProps } from './TableBody.types';
-export type { TableBodyProps };
-export default TableBody;

package/dist/esm/components/molecules/TableCell/TableCell.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TableCellProps } from './TableCell.types';
-declare const TableCell: (props: TableCellProps) => React.JSX.Element;
-export default TableCell;

package/dist/esm/components/molecules/TableCell/TableCell.types.d.ts

@@ -1,2 +0,0 @@
-import { TdHTMLAttributes } from 'react';
-export type TableCellProps = TdHTMLAttributes<HTMLTableCellElement>;

package/dist/esm/components/molecules/TableCell/index.d.ts

@@ -1,4 +0,0 @@
-import TableCell from './TableCell';
-import type { TableCellProps } from './TableCell.types';
-export type { TableCellProps };
-export default TableCell;

package/dist/esm/components/molecules/TableHeader/TableHeader.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TableHeaderProps } from './TableHeader.types';
-declare const TableHeader: (props: TableHeaderProps) => React.JSX.Element;
-export default TableHeader;

package/dist/esm/components/molecules/TableHeader/TableHeader.types.d.ts

@@ -1,2 +0,0 @@
-import { HTMLAttributes } from 'react';
-export type TableHeaderProps = HTMLAttributes<HTMLTableSectionElement>;

package/dist/esm/components/molecules/TableHeader/index.d.ts

@@ -1,4 +0,0 @@
-import TableHeader from './TableHeader';
-import type { TableHeaderProps } from './TableHeader.types';
-export type { TableHeaderProps };
-export default TableHeader;

package/dist/esm/components/molecules/TableRow/TableRow.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TableRowProps } from './TableRow.types';
-declare const TableRow: (props: TableRowProps) => React.JSX.Element;
-export default TableRow;

package/dist/esm/components/molecules/TableRow/TableRow.types.d.ts

@@ -1,2 +0,0 @@
-import { HTMLAttributes } from 'react';
-export type TableRowProps = HTMLAttributes<HTMLTableRowElement>;

package/dist/esm/components/molecules/TableRow/index.d.ts

@@ -1,4 +0,0 @@
-import TableRow from './TableRow';
-import type { TableRowProps } from './TableRow.types';
-export type { TableRowProps };
-export default TableRow;

package/dist/esm/components/molecules/Tabs/Tabs.Context.d.ts

@@ -1,13 +0,0 @@
-import React from 'react';
-import type { TabContextType, TabProviderProps } from './Tabs.types';
-export declare const TabContext: React.Context<TabContextType>;
-/**
- * Custom hook to use the TabContext
- * Throws an error if used outside of a TabProvider
- */
-export declare const useTab: () => TabContextType;
-/**
- * Provides context for Tab components
- * Manages the current tab state and providing a method to update
- */
-export declare const TabProvider: ({ children, value, onClick, }: TabProviderProps) => React.JSX.Element;

package/dist/esm/components/molecules/Tabs/Tabs.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TabsViewProps } from './Tabs.types';
-declare const Tabs: (props: TabsViewProps) => React.JSX.Element;
-export default Tabs;

package/dist/esm/components/molecules/Tabs/Tabs.types.d.ts

@@ -1,37 +0,0 @@
-export type TabContextType = {
-    /**
-     * The currently selected tab.
-     */
-    currentTab: string | number;
-    /**
-     * Function to update the currently selected tab.
-     * @param tabValue - The value of the tab to be set.
-     */
-    updateCurrentTab: (tabValue: string | number) => void;
-};
-export type TabProviderProps = {
-    /**
-     * The content to be displayed within the tab provider.
-     */
-    children: React.ReactNode;
-    /**
-     * The value of the tab.
-     */
-    value?: number | string;
-    /**
-     * Callback function when a tab is clicked.
-     * @param value - The value of the clicked tab.
-     */
-    onClick?: (value: string | number) => void;
-};
-export type TabsViewProps = {
-    /**
-     * The content to be displayed within the tabs.
-     */
-    children: React.ReactNode;
-    /**
-     * Additional class for styling.
-     */
-    className?: string;
-};
-export type TabsProps = TabProviderProps & TabsViewProps;

package/dist/esm/components/molecules/Tabs/index.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { useTab } from './Tabs.Context';
-import type { TabsProps } from './Tabs.types';
-export type { TabsProps };
-export { useTab };
-declare const Tabs: (props: TabsProps) => React.JSX.Element;
-export default Tabs;

package/dist/esm/components/molecules/index.d.ts

@@ -1,28 +0,0 @@
-export { default as ContextMenu } from './ContextMenu';
-export { default as DatePicker } from './DatePicker';
-export { default as FormField } from './FormField';
-export { default as Modal } from './Modal';
-export { default as Nav, NavItem, NavLink } from './Nav';
-export { default as Popover } from './Popover';
-export { Option, default as Select } from './Select';
-export { default as TabContent } from './TabContent';
-export { default as TabItem } from './TabItem';
-export { default as TableBody } from './TableBody';
-export { default as TableCell } from './TableCell';
-export { default as TableHeader } from './TableHeader';
-export { default as TableRow } from './TableRow';
-export { default as Tabs } from './Tabs';
-export * from './ContextMenu';
-export * from './DatePicker';
-export * from './FormField';
-export * from './Modal';
-export * from './Nav';
-export * from './Popover';
-export * from './Select';
-export * from './TabContent';
-export * from './TabItem';
-export * from './TableBody';
-export * from './TableCell';
-export * from './TableHeader';
-export * from './TableRow';
-export * from './Tabs';

package/dist/esm/components/organisms/Form/Form.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { FormProps } from './Form.types';
-declare const Form: (props: FormProps) => React.JSX.Element;
-export default Form;

package/dist/esm/components/organisms/Form/Form.types.d.ts

@@ -1,135 +0,0 @@
-import React from 'react';
-import type { FormHTMLAttributes, Ref } from 'react';
-/**
- * Type representing the allowed values for form fields
- */
-export type FieldValue = string | number | Date | boolean | Array<string | number | Date>;
-/**
- * Type representing the form values as a partial record of field names to field values
- * @example
- * ```typescript
- * const formState: FormState = {
- *   name: 'John Doe',
- *   age: 30,
- *   dob: new Date('1990-01-01')
- * };
- * ```
- */
-export type FormState<T extends FieldValue = FieldValue> = Partial<Record<string, T>>;
-/**
- * Type representing the form errors as a partial record of field names to error messages
- */
-export type FormErrors<T extends FormState = FormState> = Partial<Record<keyof T, string>>;
-/**
- * Type representing a validation function for a form field
- * It takes an error setter function and the field value (optional) and returns a boolean indicating if the value is valid
- * @example
- * ```typescript
- * const nameValidator: FieldValidationFunction = (setError, value) => {
- *   if (!value) {
- *     setError('Name is required');
- *     return false;
- *   }
- *   return true;
- * };
- * ```
- */
-export type FieldValidationFunction<T extends FieldValue = FieldValue> = (setError: (message: string) => void, value?: T) => boolean;
-/**
- * Type representing the required fields in a form
- * It's a partial record of field names to a boolean indicating if the field is required
- */
-export type RequiredFields<T extends FormState = FormState> = Partial<Record<keyof T, boolean>>;
-/**
- * Type representing the validation functions for each field in a form
- * It's a partial record of field names to validation functions (or undefined)
- * @example
- * ```typescript
- * const nameValidator: FieldValidationFunction = (setError, value) => {
- *   if (!value) {
- *     setError('Name is required');
- *     return false;
- *   }
- *   return true;
- * };
- * const fieldValidators: FieldValidators = {
- *   name: nameValidator,
- *   age: undefined,
- * };
- * ```
- */
-export type FieldValidators<T extends FormState = FormState> = Partial<Record<keyof T, FieldValidationFunction | undefined>>;
-/**
- * Type representing a function that handles form state changes
- * It takes the new form state and an error setter function and doesn't return anything
- * @example
- * ```typescript
- * const handleFormStateChange: FormStateChangeHandler = (state, setError) => {
- *   // Validate form state and set errors
- *   if (!state.name) {
- *     setError('name', 'Name is required');
- *   }
- * };
- * ```
- */
-export type FormStateChangeHandler<T extends FormState = FormState> = (state: T, setError: (field: keyof T, errorMessage: string) => void) => void;
-/**
- * Type representing a function that validates the entire form
- * It takes the form values and an error setter function and returns a boolean indicating if the form is valid
- * @example
- * ```typescript
- * const validateForm: FormValidator = (state, setError) => {
- *   let isValid = true;
- *   if (!state.name) {
- *     setError('name', 'Name is required');
- *     isValid = false;
- *   }
- *   if (!state.age || typeof state.age !== 'number') {
- *     setError('age', 'Age must be a number');
- *     isValid = false;
- *   }
- *   return isValid;
- * };
- * ```
- */
-export type FormValidator<T extends FormState = FormState> = (state: T, setError: (field: keyof T, errorMessage: string) => void) => boolean;
-/**
- * Type representing a function that handles form submission.
- * It takes updated form state and a function to set error messages for specific fields.
- *
- * @template T - The type of the form state, defaulting to `FormState`.
- *
- * @param {T} values - The updated form state values.
- * @param {(field: keyof T, errorMessage: string) => void} setError - A function to set error messages for specific fields.
- *
- * @example
- * ```typescript
- * const handleFormSubmit: FormSubmitHandler = (values, setError) => {
- *   // Submit form data
- *   console.log(values);
- * };
- * ```
- */
-export type FormSubmitHandler<T extends FormState = FormState> = (values: T, setError: (field: keyof T, errorMessage: string) => void) => void;
-export type FormProps = Omit<FormHTMLAttributes<HTMLFormElement>, 'onSubmit'> & {
-    formRef?: Ref<HTMLFormElement>;
-};
-export type FormContextValues<T extends FormState = FormState> = {
-    formRef?: Ref<HTMLFormElement>;
-    formState?: T;
-    updateFieldValue: (name: string, value: FieldValue) => void;
-    formErrors: FormErrors<T>;
-    updateFieldError: (name: keyof T, errorMessage: string) => void;
-    onFormSubmit: React.FormEventHandler<HTMLFormElement>;
-    updateFieldValidators: (name: keyof T, validate?: FieldValidationFunction) => void;
-    updateRequiredFields: (name: keyof T, required?: boolean) => void;
-};
-export type FormProviderProps<T extends FormState = FormState> = {
-    formRef?: Ref<HTMLFormElement>;
-    children?: React.ReactNode;
-    formState?: T;
-    onFormStateChange?: FormStateChangeHandler<T>;
-    formValidator?: FormValidator<T>;
-    onSubmit?: FormSubmitHandler<T>;
-    validateOnChange?: boolean;
-};

package/dist/esm/components/organisms/Form/Form.utils.d.ts

@@ -1,2 +0,0 @@
-import { FieldValue, FormState } from "./Form.types";
-export declare const isEqualFormState: <T extends FieldValue>(state1: FormState<T>, state2: FormState<T>) => boolean;

package/dist/esm/components/organisms/Form/FormContext.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type { FormContextValues, FormProviderProps, FormState, FieldValue } from './Form.types';
-declare const FormContext: React.Context<FormContextValues<Partial<Record<string, FieldValue>>> | undefined>;
-export declare const FormProvider: <T extends FormState>(props: FormProviderProps<T>) => React.JSX.Element;
-export default FormContext;

package/dist/esm/components/organisms/Form/FormExample.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-export type ProfileFormValues = {
-    participants?: number;
-    name: string;
-    email: string;
-    address: string;
-    someField: string;
-    check?: string;
-    date?: string | Date;
-    checked?: boolean;
-    password?: string;
-};
-declare const ProfileForm: () => React.JSX.Element;
-export default ProfileForm;

package/dist/esm/components/organisms/Form/index.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type { FormProps, FormProviderProps, FormState } from './Form.types';
-declare const Form: <T extends FormState>(props: FormProviderProps<T> & FormProps) => React.JSX.Element;
-export default Form;
-export * from './Form.types';

package/dist/esm/components/organisms/Table/Table.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { TableProps } from './Table.types';
-declare const Table: (props: TableProps) => React.JSX.Element;
-export default Table;

package/dist/esm/components/organisms/Table/Table.types.d.ts

@@ -1,2 +0,0 @@
-import { TableHTMLAttributes } from 'react';
-export type TableProps = TableHTMLAttributes<HTMLTableElement>;

package/dist/esm/components/organisms/Table/index.d.ts

@@ -1,4 +0,0 @@
-import Table from './Table';
-import type { TableProps } from './Table.types';
-export type { TableProps };
-export default Table;

package/dist/esm/components/organisms/index.d.ts

@@ -1,4 +0,0 @@
-export { default as Form } from './Form';
-export * from './Form';
-export { default as Table } from './Table';
-export * from './Table';