@delightui/components 0.1.104 → 0.1.105

package/dist/cjs/components/molecules/Popover/Popover.presenter.d.ts

@@ -0,0 +1,26 @@
+import { PopoverProps } from './Popover.types';
+declare const usePresenter: (props: PopoverProps) => {
+    show: boolean;
+    offset: import("react-overlays/esm/usePopper").Offset | undefined;
+    placement: import("@popperjs/core").Placement;
+    handleOnHide: () => void;
+    openPopover: () => void;
+    containerRef: import("react").RefObject<HTMLDivElement>;
+    targetRef: import("react").RefObject<HTMLDivElement>;
+    initialTransformRef: import("react").MutableRefObject<string | undefined>;
+    action: import("./Popover.types").ActionType;
+    hideOnClickAway: boolean;
+    defaultShow: boolean;
+    keepContentOnItemClick: boolean;
+    contentPosition: "fixed" | "absolute";
+    onClickListener: (() => false | void) | undefined;
+    onDoubleClickListener: (() => false | void) | undefined;
+    onMouseOutListener: (() => void) | undefined;
+    onMouseOverListener: (() => void) | undefined;
+    targetOnClickListener: () => false | void;
+    targetOnDoubleClickListener: () => false | void;
+    popoverAccessibilityProps: import("../../utils/accessibilityUtils").AccessibilityProps;
+    targetAccessibilityProps: import("../../utils/accessibilityUtils").AccessibilityProps;
+    otherProps: {};
+};
+export default usePresenter;

package/dist/cjs/components/molecules/Select/Option/Option.types.d.ts

@@ -29,4 +29,10 @@ export type OptionProps = LiHTMLAttributes<HTMLLIElement> & {
      * Children elements or text content of the option.
      */
     children?: ReactNode;
+    /**
+     * Indicates if the option is selected.
+     * For internal use, not to be set by the user.
+     * @default false
+     */
+    closeSelectOptions?: () => void;
 };

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

@@ -14,4 +14,4 @@ export declare const useSelectContext: () => SelectContextType;
  * @param props - Props for configuring the SelectProvider.
  * @returns JSX element that provides context to its children.
  */
-export declare const SelectProvider: ({ children, value, multiple, disabled, invalid, onValueChange, }: SelectProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectProvider: ({ children, value, multiple, disabled, invalid, onValueChange, closeSelectOptions, }: SelectProviderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,10 +1,10 @@
-import type { SelectViewProps } from './Select.types';
+import type { SelectProps } from './Select.types';
 /**
- * Select component for displaying a dropdown with options.
- * Uses Popover for the dropdown functionality.
+ * Select component that wraps SelectComponent with SelectProvider.
+ * Provides state management and context to SelectComponent.
  *
  * @param props - Props for configuring the Select component.
- * @returns Element representing the select.
+ * @returns JSX element that renders the SelectComponent wrapped with SelectProvider.
  */
-declare const Select: (props: SelectViewProps) => import("react/jsx-runtime").JSX.Element;
+declare const Select: (props: SelectProps) => JSX.Element;
 export default Select;

package/dist/cjs/components/molecules/Select/Select.presenter.d.ts

@@ -23,6 +23,7 @@ declare const usePresenter: (props: SelectProps) => {
         invalid?: boolean;
         onValueChange?: ((value: import("../..").FieldValue) => void) | undefined;
         initialValue?: import("../..").FieldValue | undefined;
+        closeSelectOptions?: () => void;
         role?: import("react").AriaRole | undefined;
         onLoad?: import("react").ReactEventHandler<HTMLElement> | undefined;
         onError?: import("react").ReactEventHandler<HTMLElement> | undefined;

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

@@ -47,6 +47,11 @@ export type SelectProviderProps = ControlledFormComponentProps<FieldValue> & {
      * @default false
      */
     hasDefaultOption?: boolean;
+    /**
+     * Function to close the select options menu.
+     * @param value - The new selected value.
+     */
+    closeSelectOptions?: () => void;
 };
 /**
  * Enum representing different states of the Select component.

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

@@ -1,15 +1,8 @@
+import Select from './Select';
 import { SelectProvider, useSelectContext } from './Select.Context';
 import type { SelectProps } from './Select.types';
 export type { SelectProps };
+export * from './Option';
 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/cjs/components/utils/accessibilityUtils.d.ts

@@ -0,0 +1,41 @@
+import type { AriaRole, KeyboardEventHandler, SyntheticEvent } from 'react';
+export type ArrowDirectionEnum = 'ArrowUp' | 'ArrowDown' | 'ArrowLeft' | 'ArrowRight';
+export type AccessibilityActions = {
+    onClick?: (event?: SyntheticEvent) => void;
+    onTab?: (forward: boolean) => void;
+    onEsc?: () => void;
+    onArrowNavigation?: (direction: ArrowDirectionEnum) => void;
+};
+export type AccessibilityProps = {
+    tabIndex?: number;
+    role?: AriaRole;
+    onKeyDown?: KeyboardEventHandler<unknown>;
+};
+/** Executes the provided function with setTimeout with 0 delay */
+export declare const runInNextCycle: (func: (() => void)) => void;
+/**
+ * Generates accessibility properties for clickable elements.
+ * @param {boolean} [addIndex] -
+ * @param {AriaRole} [role='button'] - ARIA role attribute to be assigned to the element.
+ * @returns {AccessibilityProps}
+ */
+export declare const getClickAccessibilityProps: (params: {
+    /** Object containing action handlers for various key events. */
+    actions: AccessibilityActions;
+    /** If true, sets the tabIndex to 0 to make the element focusable. */
+    addIndex?: boolean;
+    /** Accessibility properties including ARIA role and key event handlers. */
+    role?: AriaRole;
+}) => AccessibilityProps;
+/**
+ * Handles arrow key navigation for category elements.
+ *
+ * This function allows users to navigate through keys.
+ * It focuses on the next or previous element and optionally triggers a callback.
+ *
+ * @param {boolean} forward - Whether to move forward (true) or backward (false) in the tab order.
+ * @param {number} index - The current index of the focused element.
+ * @param {HTMLAnchorElement[]} arrayOfRefs - Array of element references to navigate through.
+ * @param {(nextIndex: number) => void} [selectFunction] - Optional callback to handle selection.
+ */
+export declare const handleKeyboardNavigation: (forward: boolean, index: number, arrayOfRefs: HTMLAnchorElement[] | HTMLButtonElement[] | HTMLElement[], selectFunction?: (nextIndex: number) => void, shouldFocusNextElement?: boolean) => void;

package/dist/cjs/components/utils/index.d.ts

@@ -1,6 +1,8 @@
 export { ConditionalView } from './ConditionalView';
 export { WrapTextNodes } from './WrapTextNodes';
 export { RenderStateView } from './RenderStateView';
+export type { AccessibilityActions, AccessibilityProps } from './accessibilityUtils';
+export { getClickAccessibilityProps } from './accessibilityUtils';
 export * from './ConditionalView';
 export * from './WrapTextNodes';
 export * from './RenderStateView';