@hybr1d-tech/charizard 0.6.108 → 0.7.0

package/dist/components/input-v2/NumberAdornment.d.ts

@@ -1,24 +0,0 @@
-import { INPUT_COMPONENTS, NumberAdornmentProps } from './types';
-
-/**
- * NumberAdornment provides increment and decrement buttons for numeric inputs.
- * It allows users to adjust the numeric value up or down within a controlled component i.e. InputNumber.
- *
- * @param {NumberAdornmentProps} props - The properties for the NumberAdornment component.
- * @param {() => void} [props.onDecrement] - Callback function to be called when the decrement button is clicked.
- * @param {() => void} [props.onIncrement] - Callback function to be called when the increment button is clicked.
- * @param {boolean} [props.disabled=false] - Whether the buttons are disabled or not.
- * @returns {JSX.Element} The rendered NumberAdornment component.
- *
- * @example
- * <NumberAdornment
- *   onIncrement={handleIncrement}
- *   onDecrement={handleDecrement}
- *   disabled={false}
- * />
- */
-declare function NumberAdornment({ onDecrement, onIncrement, disabled, }: NumberAdornmentProps): import("react/jsx-runtime").JSX.Element;
-declare namespace NumberAdornment {
-    var displayName: INPUT_COMPONENTS;
-}
-export default NumberAdornment;

package/dist/components/input-v2/Textarea.d.ts

@@ -1,23 +0,0 @@
-import { TextareaV2Props } from './types';
-import * as React from 'react';
-/**
- * TextareaV2 is a styled textarea component with optional error message display.
- * It provides a flexible way to render a textarea with custom styles and error handling.
- *
- * @param {TextareaV2Props} props - The properties for the TextareaV2 component.
- * @param {string} [props.errorMsg=''] - Error message to display below the textarea.
- * @param {string} [props.containerClassName=''] - Additional CSS classes to apply to the container.
- * @param {string} [props.className=''] - Additional CSS classes to apply to the textarea.
- * @param {React.CSSProperties} [props.inputStyles={}] - Used for internal styling when grouping it with multiple components. use className for styling textarea.
- * @param {React.CSSProperties} [props.containerStyles={}] -Used for internal styling when grouping it with multiple components. use containerClassName for styling textarea container.
- * @param {React.TextareaHTMLAttributes<HTMLTextAreaElement>} [props] - Other standard textarea attributes.
- * @param {React.Ref<HTMLTextAreaElement>} ref - Ref to the underlying textarea element.
- * @returns {JSX.Element} The rendered TextareaV2 component.
- *
- * @example
- * <TextareaV2
- *   errorMsg="This field is required."
- *   placeholder="Enter text..."
- * />
- */
-export declare const TextareaV2: React.ForwardRefExoticComponent<TextareaV2Props & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/components/input-v2/index.d.ts

@@ -1,10 +0,0 @@
-export * from './Input';
-export * from './InputControl';
-export * from './Label';
-export * from './InputGroup';
-export * from './InputIcon';
-export * from './InputAdornment';
-export * from './Textarea';
-export * from './InputCount';
-export * from './InputNumber';
-export * from './NumberAdornment';

package/dist/components/input-v2/types.d.ts

@@ -1,329 +0,0 @@
-import { TooltipV2Props } from '../tooltip-v2/TooltipV2';
-
-/**
- * Enum representing the different components within the input system.
- * This can be used to identify and manage the different subcomponents
- * of a more complex and nested input structure.
- */
-export declare enum INPUT_COMPONENTS {
-    INPUT = "input",
-    TEXTAREA = "textarea",
-    CONTROL = "control",
-    LABEL = "label",
-    GROUP = "group",
-    LEFT_ICON = "leftIcon",
-    RIGHT_ICON = "rightIcon",
-    LEFT_ADORNMENT = "leftAdornment",
-    RIGHT_ADORNMENT = "rightAdornment",
-    COUNT = "count",
-    NUMBER = "number",
-    NUMBER_ADORNMENT = "numberAdornment"
-}
-/**
- * Props for the InputV2 component, which extends the standard HTML input element
- * with additional styling and error handling.
- *
- * @interface InputV2Props
- * @extends {React.InputHTMLAttributes<HTMLInputElement>}
- *
- * @property {string} [errorMsg] - Error message to display below the input if there is a validation error.
- * @property {string} [containerClassName] - Additional class name(s) for the input container div.
- * @property {never} [inputStyles] - Used for internal styling when grouping it with multiple components. use className for styling input.
- * @property {never} [containerStyles] - Used for internal styling when grouping it with multiple components. use containerClassName for styling input container.
- *
- * @example
- * <InputV2
- *   placeholder="Enter"
- *   errorMsg="This field is required"
- * />
- * @example
- * with formik
- * <InputV2
- *   {...formik.getFieldProps(key)}
- *   placeholder="Enter"
- *   errorMsg="This field is required"
- * />
- */
-export interface InputV2Props extends React.InputHTMLAttributes<HTMLInputElement> {
-    errorMsg?: string;
-    containerClassName?: string;
-    inputStyles?: never;
-    containerStyles?: never;
-}
-/**
- * Props for the TextareaV2 component, which extends the standard HTML textarea element
- * with additional styling and error handling.
- *
- * @interface InputV2Props
- * @extends {React.TextareaHTMLAttributes<HTMLTextAreaElement>}
- *
- *
- * @property {string} [errorMsg] - Error message to display below the textarea if there is a validation error.
- * @property {string} [containerClassName] - Additional class name(s) for the textarea container div.
- * @property {never} [inputStyles] - Used for internal styling when grouping it with multiple components. use className for styling textarea.
- * @property {never} [containerStyles] - Used for internal styling when grouping it with multiple components. use containerClassName for styling textarea container.
- *
- * @example
- * <TextareaV2
- *   placeholder="Enter"
- *   errorMsg="This field is required"
- * />
- * @example
- * with formik
- * <TextareaV2
- *   {...formik.getFieldProps(key)}
- *   placeholder="Enter"
- *   errorMsg="This field is required"
- * />
- */
-export interface TextareaV2Props extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
-    errorMsg?: string;
-    containerClassName?: string;
-    inputStyles?: never;
-    containerStyles?: never;
-}
-/**
- * Props for the InputControl component, used as a wrapper to group multiple input-related components.
- *
- * @interface InputControlPropsV2
- * @extends {React.HTMLAttributes<HTMLDivElement>}
- *
- * @property {React.ReactNode} children - The elements that will be rendered inside the control.
- *
- * @example
- * <InputControlV2>
- *   <LabelV2>Username</LabelV2>
- *   <InputV2
- *   placeholder="Enter"
- *   errorMsg="This field is required"
- *  />
- * </InputControlV2>
- */
-export interface InputControlPropsV2 extends React.HTMLAttributes<HTMLDivElement> {
-    children: React.ReactNode;
-}
-/**
- * Props for the Label component, used to provide descriptive text for form inputs.
- *
- * @interface LabelPropsV2
- * @extends {React.LabelHTMLAttributes<HTMLLabelElement>}
- *
- * @property {React.ReactNode} children - The text or elements inside the label.
- * @property {string} [info] - Additional info to display, such as help text in tooltip.
- * @property {boolean} [disabled] - Whether the associated input is disabled.
- * @property {boolean} [required] - Whether the field is required (red * will be shown beside label).
- * @property {Partial<TooltipV2Props>} [tooltipProps] - Props for the tooltip, if additional information is provided and want to customize tooltip styles.
- *
- * @example
- * <LabelV2 info="Your full name">Name</LabelV2>
- */
-export interface LabelPropsV2 extends React.LabelHTMLAttributes<HTMLLabelElement> {
-    children: React.ReactNode;
-    info?: string;
-    disabled?: boolean;
-    required?: boolean;
-    tooltipProps?: Partial<TooltipV2Props>;
-}
-/**
- * Props for the InputGroup component, which groups input icons and adornments elements together.
- *
- * @interface InputGroupPropsV2
- * @extends {React.HTMLAttributes<HTMLDivElement>}
- *
- * @property {React.ReactNode} children - The elements to be grouped together.
- *
- * @example
- * <InputGroupV2>
- *   <InputLeftAdornment>+</InputLeftAdornment>
- *   <InputV2 />
- *   <InputRightAdornment>-</InputRightAdornment>
- * </InputGroupV2>
- * @example
- * with label
- * <InputControlV2>
- *   <LabelV2>Username</LabelV2>
- *   <InputGroupV2>
- *     <InputLeftAdornment>+</InputLeftAdornment>
- *     <InputV2 />
- *     <InputRightAdornment>-</InputRightAdornment>
- *   </InputGroupV2>
- * </InputControlV2>
- */
-export interface InputGroupPropsV2 extends React.HTMLAttributes<HTMLDivElement> {
-    children: React.ReactNode;
-}
-/**
- * Props for the InputIcon component, which is used to display an icon within an input field. It can be left, right or both.
- *
- * @interface InputIconProps
- *
- * @property {string} icon - The icon to display.
- * @property {() => void} [onClick] - Optional click handler for the icon.
- * @property {never} [iconStyles] - Used for internal styling when grouping it with multiple components. use className for styling icon if clickable.
- * @property {boolean} [disabled] - Whether the icon should be disabled with input.
- * @property {string} [className] - Additional classNames for the icon if it is clickable.
- *
- * @example
- *  <InputGroupV2>
- *   <InputLeftIcon icon={...} />
- *   <InputV2 />
- *   <InputRightIcon icon={...} />
- * </InputGroupV2>
- */
-export interface InputIconProps {
-    icon: string;
-    onClick?: () => void;
-    iconStyles?: never;
-    disabled?: boolean;
-    className?: string;
-}
-/**
- * Represents an option in a dropdown menu for adornment.
- *
- * @interface DropdownOption
- *
- * @property {string} value - The value associated with the dropdown option.
- * @property {string} label - The label displayed for the dropdown option.
- *
- * @example
- * const options: DropdownOption[] = [
- *   { value: '1', label: 'Option 1' },
- *   { value: '2', label: 'Option 2' },
- * ];
- */
-export interface DropdownOption {
-    value: string;
-    label: string;
-}
-/**
- * Base props for input adornment components. It can be dropdown or non actionable
- *
- * @interface BaseInputAdornmentProps
- *
- * @property {React.ReactNode} children - The elements or text inside the adornment.
- * @property {boolean} [disabled] - Whether the adornment is disabled.
- */
-export interface BaseInputAdornmentProps {
-    children: React.ReactNode;
-    disabled?: boolean;
-}
-/**
- * Props for a dropdown adornment.
- *
- * @interface DropdownProps
- * @extends {BaseInputAdornmentProps}
- *
- * @property {true} isDropdown - Indicates this adornment is a dropdown.
- * @property {DropdownOption[]} options - List of options available in the dropdown.
- * @property {(value: string) => void} onOptionSelect - Callback function when an option is selected.
- * @property {boolean} [hideSearch] - Whether to hide the search bar within the dropdown.
- * @property {boolean} [isLoading] - Whether the dropdown is currently loading options.
- *
- * @example
- *  <InputGroupV2>
- *   <InputLeftAdornment isDropdown options={options} onOptionSelect={handleSelect}>...</InputLeftAdornment>
- *   <InputV2 />
- * </InputGroupV2>
- */
-export interface DropdownProps extends BaseInputAdornmentProps {
-    isDropdown: true;
-    options: DropdownOption[];
-    onOptionSelect: (value: string) => void;
-    hideSearch?: boolean;
-    isLoading?: boolean;
-}
-/**
- * Props for a non-dropdown adornment within an input field, such as an icon.
- *
- * @interface NonDropdownProps
- * @extends {BaseInputAdornmentProps}
- *
- * @property {false} [isDropdown] - Indicates this adornment is not a dropdown.
- * @property {never} [options] - Options are not applicable to non-dropdown adornments.
- * @property {never} [hideSearch] - Search hiding is not applicable to non-dropdown adornments.
- * @property {never} [onOptionSelect] - Option selection is not applicable to non-dropdown adornments.
- * @property {never} [isLoading] - Loading state is not applicable to non-dropdown adornments.
- *
- * @example
- * @example
- *  <InputGroupV2>
- *   <InputV2 />
- *   <InputRightAdornment>...</InputRightAdornment>
- * </InputGroupV2>
- */
-export interface NonDropdownProps extends BaseInputAdornmentProps {
-    isDropdown?: false;
-    options?: never;
-    hideSearch?: never;
-    onOptionSelect?: never;
-    isLoading?: never;
-}
-/**
- * Type representing the possible props for input adornments, which can either be a dropdown or non actionable.
- */
-export type InputAdornmentProps = DropdownProps | NonDropdownProps;
-/**
- * Props for an input field which can be use as counter i.e. product count.
- *
- * @interface InputCountProps
- * @extends {InputV2Props}
- *
- * @property {(value: number) => void} onCountChange - Callback when the count changes.
- * @property {never} [onChange] - `onChange` is disabled for this component; use `onCountChange`.
- * @property {number} [min] - Minimum allowable value for the count (by default Infinity).
- * @property {number} [max] - Maximum allowable value for the count (by default Infinity).
- * @property {number} [count] - Current count value (enable for two way binding).
- * @property {string} [countContainerClassName] - Additional className for the count container.
- *
- * @example
- * <InputCount onCountChange={(value) => ...} count={10} min={0} max={100} />
- */
-export interface InputCountProps extends InputV2Props {
-    onCountChange: (value: number) => void;
-    onChange?: never;
-    min?: number;
-    max?: number;
-    count?: number;
-    countContainerClassName?: string;
-}
-/**
- * Props for an input field designed to accept numeric values.
- *
- * @interface InputNumberProps
- * @extends {InputV2Props}
- *
- * @property {(value: number) => void} onCountChange - Callback when the numeric value changes.
- * @property {never} [onChange] - `onChange` is disabled for this component; use `onCountChange`.
- * @property {number} [min] - Minimum allowable value for the input (by default Infinity)
- * @property {number} [max] - Maximum allowable value for the input (by default Infinity)
- * @property {number} [count] - Current numeric value (enable for two way binding).
- * @property {string} [countContainerClassName] -Additional className for the count container.
- *
- * @example
- * <InputNumber onCountChange={(value) => ...)} count={5} min={0} max={10} />
- */
-export interface InputNumberProps extends InputV2Props {
-    onCountChange: (value: number) => void;
-    onChange?: never;
-    min?: number;
-    max?: number;
-    count?: number;
-    countContainerClassName?: string;
-}
-/**
- * Props for a number increment/decrement adornment in an InputNumber field.
- *
- * @interface NumberAdornmentProps
- *
- * @property {() => void} onIncrement - Callback when the increment button is clicked.
- * @property {() => void} onDecrement - Callback when the decrement button is clicked.
- * @property {boolean} [disabled] - Whether the increment/decrement buttons are disabled.
- *
- * @example
- * <NumberAdornment onIncrement={() => increment()} onDecrement={() => decrement()} />
- */
-export interface NumberAdornmentProps {
-    onIncrement: () => void;
-    onDecrement: () => void;
-    disabled?: boolean;
-}

package/dist/components/layout-tabs/LayoutTabs.d.ts

@@ -1,22 +0,0 @@
-import * as React from 'react';
-interface LayoutTabsProps {
-    tabClassName?: string;
-    /**
-     * tabs to render
-     */
-    tabs: Array<{
-        label: string;
-        value: string;
-        content: React.ReactNode | string;
-    }>;
-    /**
-     * default value (initial tab to render)
-     */
-    defaultValue: string;
-    /**
-     * callback function when tab is changed
-     */
-    onValueChange?: (value: string) => void;
-}
-export declare function LayoutTabs({ tabs, defaultValue, tabClassName, onValueChange }: LayoutTabsProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/layout-tabs/index.d.ts

@@ -1 +0,0 @@
-export * from './LayoutTabs';

package/dist/components/loader/Loader.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-export type LoaderProps = {
-    containerStyle?: React.CSSProperties;
-    loaderStyle?: React.CSSProperties;
-    variant?: LOADER_VARIANT;
-};
-export declare enum LOADER_VARIANT {
-    RING = "ring",
-    DUAL_RING = "dual_ring",
-    RIPPLE = "ripple",
-    ELLIPSES = "ellipses",
-    ROLLER = "roller",
-    SPINNER = "spinner",
-    HOURGLASS = "hourglass",
-    GRID = "grid"
-}
-export declare function Loader({ containerStyle, loaderStyle, variant }: LoaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/loader/index.d.ts

@@ -1 +0,0 @@
-export * from './Loader';

package/dist/components/loader/loader.stories.d.ts

@@ -1,14 +0,0 @@
-import { Loader } from './Loader';
-import { Meta, StoryObj } from '@storybook/react';
-
-declare const meta: Meta<typeof Loader>;
-export default meta;
-type Story = StoryObj<typeof Loader>;
-export declare const Ring: Story;
-export declare const DualRing: Story;
-export declare const Ellipses: Story;
-export declare const Grid: Story;
-export declare const Hourglass: Story;
-export declare const Ripple: Story;
-export declare const Roller: Story;
-export declare const Spinner: Story;

package/dist/components/modal/Modal.d.ts

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import * as dialog from '@zag-js/dialog';
-type ModalProps = {
-    /**
-     * Modal is open or not
-     */
-    isOpen: boolean;
-    /**
-     * Modal close handler
-     */
-    onClose: () => void;
-    /**
-     * Modal content
-     */
-    children: React.ReactNode;
-    /**
-     * size of modal
-     */
-    size?: 'sm' | 'md' | 'fullScreen';
-    /**
-     * show overlay
-     */
-    showOverlay?: boolean;
-    /**
-     * Machine Props
-     */
-    machineProps?: dialog.Context | {};
-};
-export declare function Modal({ isOpen, onClose, children, size, showOverlay, machineProps, }: ModalProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/ModalBody.d.ts

@@ -1,17 +0,0 @@
-interface ModalBodyProps {
-    /**
-     * Modal body children
-     */
-    children: React.ReactNode;
-    /**
-     * Zagjs modal API (no need to pass when using this component)
-     * will be inserted by default
-     */
-    api?: any;
-    /**
-     * custom styles
-     */
-    customStyles?: React.CSSProperties;
-}
-export declare function ModalBody({ children, api, customStyles }: ModalBodyProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/ModalContent.d.ts

@@ -1,18 +0,0 @@
-import * as React from 'react';
-interface ModalContentProps {
-    /**
-     * Modal content children
-     */
-    children: React.ReactNode;
-    /**
-     * Zagjs modal API (no need to pass when using this component)
-     * will be inserted by default
-     */
-    api?: any;
-    /**
-     * size of the modal
-     */
-    size?: 'sm' | 'md' | 'fullScreen';
-}
-export declare function ModalContent({ children, api, size }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/ModalFooter.d.ts

@@ -1,38 +0,0 @@
-import { BUTTON_VARIANT } from '../button';
-import { BUTTON_V2_VARIANT, BUTTON_V2_SIZE, BUTTON_V2_TYPE } from '../button-v2';
-
-export type FooterButtons = Array<{
-    variant?: BUTTON_VARIANT | BUTTON_V2_VARIANT;
-    onClick: () => void;
-    btnText: string;
-    btnType?: BUTTON_V2_TYPE | 'submit';
-    btnSize?: BUTTON_V2_SIZE;
-    disabled?: boolean;
-    isLoading?: boolean;
-    loadingText?: string;
-    icon?: string;
-}>;
-export declare const mapVariant: (variant?: BUTTON_VARIANT | BUTTON_V2_VARIANT) => BUTTON_V2_VARIANT | undefined;
-interface ModalFooterProps {
-    /**
-     * Modal footer children
-     * if children is passed, default buttons will not be shown
-     * children acts like a custom footer
-     */
-    children?: React.ReactNode;
-    /**
-     * zagjs modal API (no need to pass when using this component)
-     * will be inserted by default
-     */
-    api?: any;
-    /**
-     * set of buttons to display
-     */
-    buttons: FooterButtons;
-    /**
-     * show border or not
-     */
-    showBorder?: boolean;
-}
-export declare function ModalFooter({ children, api, buttons, showBorder }: ModalFooterProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/ModalHeader.d.ts

@@ -1,21 +0,0 @@
-interface ModalHeaderProps {
-    /**
-     * Modal header children
-     */
-    children: React.ReactNode;
-    /**
-     * Zagjs modal API (no need to pass when using this component)
-     * will be inserted by default
-     */
-    api?: any;
-    /**
-     * Show cross button or not
-     */
-    showCrossBtn?: boolean;
-    /**
-     * Show border or not
-     */
-    showBorder?: boolean;
-}
-export declare function ModalHeader({ children, api, showCrossBtn, showBorder, }: ModalHeaderProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/ModalOverlay.d.ts

@@ -1,9 +0,0 @@
-interface ModalOverlayProps {
-    /**
-     * Zagjs modal API (no need to pass when using this component)
-     * will be inserted by default
-     */
-    api?: any;
-}
-export declare function ModalOverlay({ api }: ModalOverlayProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/modal/index.d.ts

@@ -1,6 +0,0 @@
-export { Modal } from './Modal';
-export { ModalBody } from './ModalBody';
-export { ModalContent } from './ModalContent';
-export { ModalFooter } from './ModalFooter';
-export { ModalHeader } from './ModalHeader';
-export { ModalOverlay } from './ModalOverlay';

package/dist/components/modal/usage.d.ts

@@ -1 +0,0 @@
-export default function Example({ isOpen, onClose }: any): import("react/jsx-runtime").JSX.Element;

package/dist/components/pill/Pill.d.ts

@@ -1,15 +0,0 @@
-import * as React from 'react';
-export declare enum PILL_STATUS {
-    DEFAULT = "default",
-    NEUTRAL = "neutral",
-    POSITIVE = "positive",
-    WARNING = "warning",
-    NEGATIVE = "negative",
-    HIGHLIGHT = "highlight"
-}
-interface PillProps {
-    status?: PILL_STATUS;
-    children: React.ReactNode;
-}
-export declare function Pill({ status, children }: PillProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/pill/index.d.ts

@@ -1 +0,0 @@
-export * from './Pill';

package/dist/components/popover/Popover.d.ts

@@ -1,26 +0,0 @@
-import { Placement } from '@zag-js/popper';
-import * as React from 'react';
-type PopoverProps = {
-    /**
-     * Content of the trigger
-     */
-    children: React.ReactNode;
-    /**
-     * Placement of the popover
-     */
-    placement?: Placement;
-    /**
-     * Props to pass to the popover machine
-     */
-    popoverProps?: any;
-    /**
-     * close popover on scroll
-     */
-    closeOnScroll?: boolean;
-    /**
-     * when using closeOnScroll, its necessary to pass containerRef to track scroll movement of the container you want to close the popover with respect to.
-     */
-    containerRef?: React.RefObject<HTMLElement>;
-};
-export declare function Popover({ children, placement, popoverProps, closeOnScroll, containerRef, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/popover/PopoverCloseButton.d.ts

@@ -1,23 +0,0 @@
-/**
- * @author Pratik Awaik <pratik@hybr1d.io>
- */
-interface PopoverCloseButtonProps {
-    /**
-     * The content of the close button.
-     */
-    children: React.ReactNode;
-    /**
-     * The popover API object.
-     */
-    api?: any;
-    /**
-     * The styles to apply to the PopoverCloseButton.
-     */
-    styles?: React.CSSProperties;
-    /**
-     * The className to apply to the PopoverCloseButton.
-     */
-    className?: string;
-}
-export declare function PopoverCloseButton({ children, api, styles, className }: PopoverCloseButtonProps): import("react/jsx-runtime").JSX.Element;
-export {};