@arkyn/components 3.0.1-beta.20 → 3.0.1-beta.201

package/dist/src/components/maskedInput/index.d.ts

@@ -1,103 +0,0 @@
-import { type Replacement } from "@react-input/mask";
-import { LucideIcon } from "lucide-react";
-import { InputHTMLAttributes } from "react";
-import "./style.css";
-type MaskedInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "prefix" | "name" | "type"> & {
-    name: string;
-    mask: string;
-    replacement: string | Replacement;
-    separate?: boolean;
-    showMask?: boolean;
-    label?: string;
-    errorMessage?: string;
-    isLoading?: boolean;
-    size?: "md" | "lg";
-    variant?: "solid" | "outline" | "underline";
-    prefix?: string | LucideIcon;
-    suffix?: string | LucideIcon;
-    showAsterisk?: boolean;
-    leftIcon?: LucideIcon;
-    rightIcon?: LucideIcon;
-};
-/**
- * MaskedInput component - used for text input fields with input masking support, labels, validation, icons, and loading states
- *
- * @param props - MaskedInput component properties
- * @param props.name - Required field name for form handling
- * @param props.mask - Input mask pattern (e.g., "___.___.___-__" for CPF)
- * @param props.replacement - Character or replacement configuration for mask positions
- * @param props.separate - Whether to separate mask characters from input value. Default: undefined
- * @param props.showMask - Whether to show the mask placeholder. Default: undefined
- * @param props.label - Optional label text to display above the input
- * @param props.errorMessage - Error message to display below the input
- * @param props.isLoading - Controls loading state with spinner. Default: false
- * @param props.size - Input size. Default: "md"
- * @param props.variant - Visual variant of the input. Default: "solid"
- * @param props.prefix - Text or icon to display at the beginning of the input
- * @param props.suffix - Text or icon to display at the end of the input
- * @param props.showAsterisk - Whether to show asterisk on label for required fields
- * @param props.leftIcon - Optional icon to display on the left side
- * @param props.rightIcon - Optional icon to display on the right side
- *
- * **...Other valid HTML properties for input element (except 'type' which is controlled by the mask)**
- *
- * @returns MaskedInput JSX element wrapped in FieldGroup with optional label and error
- *
- * @example
- * ```tsx
- * // Basic masked input for phone number
- * <MaskedInput
- *   name="phone"
- *   mask="(__) _____-____"
- *   replacement={{ _: /\d/ }}
- *   placeholder="(00) 00000-0000"
- * />
- *
- * // CPF input with label and validation
- * <MaskedInput
- *   name="cpf"
- *   label="CPF"
- *   mask="___.___.___-__"
- *   replacement="_"
- *   showAsterisk
- *   errorMessage="Please enter a valid CPF"
- *   showMask
- * />
- *
- * // Credit card input with icons and loading state
- * <MaskedInput
- *   name="creditCard"
- *   label="Credit Card"
- *   mask="____ ____ ____ ____"
- *   replacement={{ _: /\d/ }}
- *   leftIcon={CreditCardIcon}
- *   rightIcon={ShieldIcon}
- *   isLoading
- * />
- *
- * // Date input with prefix/suffix
- * <MaskedInput
- *   name="birthDate"
- *   label="Birth Date"
- *   mask="__/__/____"
- *   replacement="_"
- *   prefix="📅"
- *   variant="outline"
- *   separate
- * />
- *
- * // Large masked input with underline variant
- * <MaskedInput
- *   name="zipCode"
- *   label="ZIP Code"
- *   mask="_____-___"
- *   replacement={{ _: /\d/ }}
- *   size="lg"
- *   variant="underline"
- *   placeholder="00000-000"
- * />
- * ```
- */
-declare function MaskedInput(props: MaskedInputProps): import("react/jsx-runtime").JSX.Element;
-export { MaskedInput };
-//# sourceMappingURL=index.d.ts.map

package/dist/src/components/maskedInput/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/maskedInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAW,UAAU,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAEL,mBAAmB,EAKpB,MAAM,OAAO,CAAC;AASf,OAAO,aAAa,CAAC;AAErB,KAAK,gBAAgB,GAAG,IAAI,CAC1B,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CACpC,GAAG;IACF,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,GAAG,WAAW,CAAC;IAElC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,WAAW,CAAC;IAE5C,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB,SAAS,CAAC,EAAE,UAAU,CAAC;CACxB,CAAC;AASF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8EG;AAEH,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CA4H3C;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/src/components/maskedInput/index.js

@@ -1,130 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { InputMask } from "@react-input/mask";
-import { Loader2 } from "lucide-react";
-import { forwardRef, useId, useRef, useState, } from "react";
-import { useForm } from "../../hooks/useForm";
-import { IconRenderer } from "../../services/iconRenderer";
-import { FieldError } from "../fieldError";
-import { FieldLabel } from "../fieldLabel";
-import { FieldWrapper } from "../fieldWrapper";
-import "./style.css";
-const BaseInput = forwardRef((props, ref) => {
-    return _jsx("input", { ref: ref, ...props });
-});
-/**
- * MaskedInput component - used for text input fields with input masking support, labels, validation, icons, and loading states
- *
- * @param props - MaskedInput component properties
- * @param props.name - Required field name for form handling
- * @param props.mask - Input mask pattern (e.g., "___.___.___-__" for CPF)
- * @param props.replacement - Character or replacement configuration for mask positions
- * @param props.separate - Whether to separate mask characters from input value. Default: undefined
- * @param props.showMask - Whether to show the mask placeholder. Default: undefined
- * @param props.label - Optional label text to display above the input
- * @param props.errorMessage - Error message to display below the input
- * @param props.isLoading - Controls loading state with spinner. Default: false
- * @param props.size - Input size. Default: "md"
- * @param props.variant - Visual variant of the input. Default: "solid"
- * @param props.prefix - Text or icon to display at the beginning of the input
- * @param props.suffix - Text or icon to display at the end of the input
- * @param props.showAsterisk - Whether to show asterisk on label for required fields
- * @param props.leftIcon - Optional icon to display on the left side
- * @param props.rightIcon - Optional icon to display on the right side
- *
- * **...Other valid HTML properties for input element (except 'type' which is controlled by the mask)**
- *
- * @returns MaskedInput JSX element wrapped in FieldGroup with optional label and error
- *
- * @example
- * ```tsx
- * // Basic masked input for phone number
- * <MaskedInput
- *   name="phone"
- *   mask="(__) _____-____"
- *   replacement={{ _: /\d/ }}
- *   placeholder="(00) 00000-0000"
- * />
- *
- * // CPF input with label and validation
- * <MaskedInput
- *   name="cpf"
- *   label="CPF"
- *   mask="___.___.___-__"
- *   replacement="_"
- *   showAsterisk
- *   errorMessage="Please enter a valid CPF"
- *   showMask
- * />
- *
- * // Credit card input with icons and loading state
- * <MaskedInput
- *   name="creditCard"
- *   label="Credit Card"
- *   mask="____ ____ ____ ____"
- *   replacement={{ _: /\d/ }}
- *   leftIcon={CreditCardIcon}
- *   rightIcon={ShieldIcon}
- *   isLoading
- * />
- *
- * // Date input with prefix/suffix
- * <MaskedInput
- *   name="birthDate"
- *   label="Birth Date"
- *   mask="__/__/____"
- *   replacement="_"
- *   prefix="📅"
- *   variant="outline"
- *   separate
- * />
- *
- * // Large masked input with underline variant
- * <MaskedInput
- *   name="zipCode"
- *   label="ZIP Code"
- *   mask="_____-___"
- *   replacement={{ _: /\d/ }}
- *   size="lg"
- *   variant="underline"
- *   placeholder="00000-000"
- * />
- * ```
- */
-function MaskedInput(props) {
-    const { name, disabled, title, style, variant = "solid", separate, mask, showMask, replacement, label, className: baseClassName = "", prefix, suffix, isLoading = false, leftIcon, readOnly, onFocus, onBlur, errorMessage: baseErrorMessage, defaultValue, showAsterisk, rightIcon, size = "md", id, ...rest } = props;
-    const { fieldErrors } = useForm();
-    const [isFocused, setIsFocused] = useState(false);
-    const inputRef = useRef(null);
-    const inputId = id || useId();
-    const errorMessage = baseErrorMessage || fieldErrors?.[name];
-    const isError = !!errorMessage;
-    const iconSizes = { md: 20, lg: 20 };
-    const iconSize = iconSizes[size];
-    const loadingPosition = rightIcon ? "right" : "left";
-    const showLeftSpinner = loadingPosition === "left" && isLoading;
-    const showRightSpinner = loadingPosition === "right" && isLoading;
-    function handleSectionClick() {
-        if (disabled || !inputRef?.current)
-            return;
-        setIsFocused(true);
-        inputRef.current.focus();
-    }
-    function handleFocus(e) {
-        setIsFocused(true);
-        if (onFocus)
-            onFocus(e);
-    }
-    function handleBlur(e) {
-        setIsFocused(false);
-        if (onBlur)
-            onBlur(e);
-    }
-    const hasPrefix = !!prefix ? "hasPrefix" : "";
-    const hasSuffix = !!suffix ? "hasSuffix" : "";
-    const errored = isError ? "errored" : "";
-    const opacity = disabled || readOnly || isLoading ? "opacity" : "";
-    const focused = isFocused ? "focused" : "";
-    const className = `arkynMaskedInput ${hasPrefix} ${hasSuffix} ${variant} ${size} ${opacity} ${errored} ${focused} ${baseClassName}`;
-    return (_jsxs(FieldWrapper, { children: [label && (_jsx(FieldLabel, { showAsterisk: showAsterisk, htmlFor: inputId, children: label })), _jsxs("section", { title: title, style: style, onClick: handleSectionClick, className: className, children: [_jsx(IconRenderer, { iconSize: iconSize, icon: prefix, className: "prefix" }), _jsx(IconRenderer, { show: showLeftSpinner, iconSize: iconSize, className: "spinner", icon: Loader2 }), _jsx(IconRenderer, { show: !isLoading, icon: leftIcon, iconSize: iconSize }), _jsx(InputMask, { component: BaseInput, mask: mask, replacement: replacement, separate: separate, showMask: showMask, ref: inputRef, onFocus: handleFocus, onBlur: handleBlur, disabled: disabled, readOnly: readOnly, id: inputId, ...rest }), _jsx(IconRenderer, { show: !isLoading, icon: rightIcon, iconSize: iconSize }), _jsx(IconRenderer, { show: showRightSpinner, iconSize: iconSize, className: "spinner", icon: Loader2 }), _jsx(IconRenderer, { iconSize: iconSize, icon: suffix, className: "suffix" })] }), errorMessage && _jsx(FieldError, { children: errorMessage })] }));
-}
-export { MaskedInput };

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

@@ -1,78 +0,0 @@
-import { HTMLAttributes } from "react";
-import "./styles.css";
-type ModalContainerProps = HTMLAttributes<HTMLElement> & {
-    isVisible: boolean;
-    makeInvisible: () => void;
-};
-/**
- * ModalContainer component - animated overlay modal for dialogs and content
- *
- * @param props - ModalContainer component properties
- * @param props.isVisible - Controls modal visibility state
- * @param props.makeInvisible - Callback function to hide the modal
- *
- * **...Other valid HTML properties for aside element**
- *
- * @returns ModalContainer JSX element
- *
- * @example
- * ```tsx
- * // Basic modal
- * const [isOpen, setIsOpen] = useState(false);
- * <ModalContainer
- *   isVisible={isOpen}
- *   makeInvisible={() => setIsOpen(false)}
- * >
- *   <p>Modal content</p>
- * </ModalContainer>
- *
- * // Modal with custom styling
- * <ModalContainer
- *   isVisible={isOpen}
- *   makeInvisible={() => setIsOpen(false)}
- *   className="custom-modal"
- * >
- *   <div className="modal-content">
- *     <h2>Confirmation</h2>
- *     <p>Are you sure you want to proceed?</p>
- *   </div>
- * </ModalContainer>
- *
- * // Complete modal example
- * function ModalExample() {
- *   const [isModalOpen, setIsModalOpen] = useState(false);
- *
- *   return (
- *     <>
- *       <button onClick={() => setIsModalOpen(true)}>
- *         Open Modal
- *       </button>
- *
- *       <ModalContainer
- *         isVisible={isModalOpen}
- *         makeInvisible={() => setIsModalOpen(false)}
- *       >
- *         <div className="modal-dialog">
- *           <header>
- *             <h2>Modal Title</h2>
- *           </header>
- *
- *           <main>
- *             <p>This is the modal content.</p>
- *           </main>
- *
- *           <footer>
- *             <button onClick={() => setIsModalOpen(false)}>
- *               Close
- *             </button>
- *           </footer>
- *         </div>
- *       </ModalContainer>
- *     </>
- *   );
- * }
- * ```
- */
-declare function ModalContainer(args: ModalContainerProps): import("react/jsx-runtime").JSX.Element;
-export { ModalContainer };
-//# sourceMappingURL=index.d.ts.map

package/dist/src/components/modal/modalContainer/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/modalContainer/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,cAAc,CAAC;AAEtB,KAAK,mBAAmB,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AAEH,iBAAS,cAAc,CAAC,IAAI,EAAE,mBAAmB,2CA0ChD;AAED,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/src/components/modal/modalContainer/index.js

@@ -1,82 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AnimatePresence, motion } from "framer-motion";
-import { useScrollLock } from "../../../hooks/useScrollLock";
-import { ModalProvider } from "../modalContext";
-import "./styles.css";
-/**
- * ModalContainer component - animated overlay modal for dialogs and content
- *
- * @param props - ModalContainer component properties
- * @param props.isVisible - Controls modal visibility state
- * @param props.makeInvisible - Callback function to hide the modal
- *
- * **...Other valid HTML properties for aside element**
- *
- * @returns ModalContainer JSX element
- *
- * @example
- * ```tsx
- * // Basic modal
- * const [isOpen, setIsOpen] = useState(false);
- * <ModalContainer
- *   isVisible={isOpen}
- *   makeInvisible={() => setIsOpen(false)}
- * >
- *   <p>Modal content</p>
- * </ModalContainer>
- *
- * // Modal with custom styling
- * <ModalContainer
- *   isVisible={isOpen}
- *   makeInvisible={() => setIsOpen(false)}
- *   className="custom-modal"
- * >
- *   <div className="modal-content">
- *     <h2>Confirmation</h2>
- *     <p>Are you sure you want to proceed?</p>
- *   </div>
- * </ModalContainer>
- *
- * // Complete modal example
- * function ModalExample() {
- *   const [isModalOpen, setIsModalOpen] = useState(false);
- *
- *   return (
- *     <>
- *       <button onClick={() => setIsModalOpen(true)}>
- *         Open Modal
- *       </button>
- *
- *       <ModalContainer
- *         isVisible={isModalOpen}
- *         makeInvisible={() => setIsModalOpen(false)}
- *       >
- *         <div className="modal-dialog">
- *           <header>
- *             <h2>Modal Title</h2>
- *           </header>
- *
- *           <main>
- *             <p>This is the modal content.</p>
- *           </main>
- *
- *           <footer>
- *             <button onClick={() => setIsModalOpen(false)}>
- *               Close
- *             </button>
- *           </footer>
- *         </div>
- *       </ModalContainer>
- *     </>
- *   );
- * }
- * ```
- */
-function ModalContainer(args) {
-    const { isVisible, makeInvisible, children, className: baseClassName = "", ...rest } = args;
-    useScrollLock(isVisible);
-    const visibleClass = isVisible ? "visibleTrue" : "visibleFalse";
-    const className = `arkynModalContainer ${visibleClass} ${baseClassName}`;
-    return (_jsx(ModalProvider, { makeInvisible: makeInvisible, children: _jsx(AnimatePresence, { children: isVisible && (_jsxs("aside", { className: className.trim(), ...rest, children: [_jsx(motion.div, { className: "arkynModalContainerOverlay", transition: { duration: 0.15, ease: "easeOut" }, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, onClick: makeInvisible }), _jsx(motion.div, { className: "arkynModalContainerContent", transition: { duration: 0.15, ease: "easeOut" }, initial: { opacity: 0, scale: 0.75 }, animate: { opacity: 1, scale: 1 }, exit: { opacity: 0, scale: 0 }, children: children })] })) }) }));
-}
-export { ModalContainer };

package/dist/src/components/modal/modalContext.d.ts

@@ -1,12 +0,0 @@
-import { ReactNode } from "react";
-type ModalContextProps = {
-    makeInvisible: () => void;
-};
-type ModalProviderProps = {
-    children: ReactNode;
-    makeInvisible: () => void;
-};
-declare function ModalProvider(props: ModalProviderProps): import("react/jsx-runtime").JSX.Element;
-declare function useModal(): ModalContextProps;
-export { ModalProvider, useModal };
-//# sourceMappingURL=modalContext.d.ts.map

package/dist/src/components/modal/modalContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"modalContext.d.ts","sourceRoot":"","sources":["../../../../src/components/modal/modalContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAE7D,KAAK,iBAAiB,GAAG;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAIF,iBAAS,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CAM/C;AAED,iBAAS,QAAQ,sBAEhB;AAED,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAC"}

package/dist/src/components/modal/modalContext.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext } from "react";
-const modalContext = createContext({});
-function ModalProvider(props) {
-    return (_jsx(modalContext.Provider, { value: { makeInvisible: props.makeInvisible }, children: props.children }));
-}
-function useModal() {
-    return useContext(modalContext);
-}
-export { ModalProvider, useModal };

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

@@ -1,72 +0,0 @@
-import { HTMLAttributes } from "react";
-import "./styles.css";
-type ModalFooterProps = HTMLAttributes<HTMLElement> & {
-    alignment?: "left" | "center" | "right" | "between" | "around";
-};
-/**
- * ModalFooter component - footer section for modals with flexible alignment options
- *
- * @param props - ModalFooter component properties
- * @param props.alignment - Content alignment within the footer. Default: "right"
- *
- * **...Other valid HTML properties for footer element**
- *
- * @returns ModalFooter JSX element
- *
- * @example
- * ```tsx
- * // Basic footer with right alignment (default)
- * <ModalFooter>
- *   <button>Cancel</button>
- *   <button>Save</button>
- * </ModalFooter>
- *
- * // Left aligned footer
- * <ModalFooter alignment="left">
- *   <button>Delete</button>
- * </ModalFooter>
- *
- * // Center aligned footer
- * <ModalFooter alignment="center">
- *   <button>OK</button>
- * </ModalFooter>
- *
- * // Space between buttons
- * <ModalFooter alignment="between">
- *   <button>Cancel</button>
- *   <button>Confirm</button>
- * </ModalFooter>
- *
- * // Space around buttons
- * <ModalFooter alignment="around">
- *   <button>Previous</button>
- *   <button>Next</button>
- *   <button>Finish</button>
- * </ModalFooter>
- *
- * // Complete modal example
- * <ModalContainer isVisible={isOpen} makeInvisible={() => setIsOpen(false)}>
- *   <div className="modal-content">
- *     <header>
- *       <h2>Confirm Action</h2>
- *     </header>
- *
- *     <main>
- *       <p>Are you sure you want to delete this item?</p>
- *     </main>
- *
- *     <ModalFooter alignment="right">
- *       <button onClick={() => setIsOpen(false)}>
- *         Cancel
- *       </button>
- *       <button onClick={handleDelete}>
- *         Delete
- *       </button>
- *     </ModalFooter>
- *   </div>
- * </ModalContainer>
- * ```
- */
-declare function ModalFooter(args: ModalFooterProps): import("react/jsx-runtime").JSX.Element;
-export { ModalFooter };
-//# sourceMappingURL=index.d.ts.map

package/dist/src/components/modal/modalFooter/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/modalFooter/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,cAAc,CAAC;AAEtB,KAAK,gBAAgB,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACpD,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;CAChE,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AAEH,iBAAS,WAAW,CAAC,IAAI,EAAE,gBAAgB,2CAK1C;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/src/components/modal/modalFooter/index.js

@@ -1,72 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import "./styles.css";
-/**
- * ModalFooter component - footer section for modals with flexible alignment options
- *
- * @param props - ModalFooter component properties
- * @param props.alignment - Content alignment within the footer. Default: "right"
- *
- * **...Other valid HTML properties for footer element**
- *
- * @returns ModalFooter JSX element
- *
- * @example
- * ```tsx
- * // Basic footer with right alignment (default)
- * <ModalFooter>
- *   <button>Cancel</button>
- *   <button>Save</button>
- * </ModalFooter>
- *
- * // Left aligned footer
- * <ModalFooter alignment="left">
- *   <button>Delete</button>
- * </ModalFooter>
- *
- * // Center aligned footer
- * <ModalFooter alignment="center">
- *   <button>OK</button>
- * </ModalFooter>
- *
- * // Space between buttons
- * <ModalFooter alignment="between">
- *   <button>Cancel</button>
- *   <button>Confirm</button>
- * </ModalFooter>
- *
- * // Space around buttons
- * <ModalFooter alignment="around">
- *   <button>Previous</button>
- *   <button>Next</button>
- *   <button>Finish</button>
- * </ModalFooter>
- *
- * // Complete modal example
- * <ModalContainer isVisible={isOpen} makeInvisible={() => setIsOpen(false)}>
- *   <div className="modal-content">
- *     <header>
- *       <h2>Confirm Action</h2>
- *     </header>
- *
- *     <main>
- *       <p>Are you sure you want to delete this item?</p>
- *     </main>
- *
- *     <ModalFooter alignment="right">
- *       <button onClick={() => setIsOpen(false)}>
- *         Cancel
- *       </button>
- *       <button onClick={handleDelete}>
- *         Delete
- *       </button>
- *     </ModalFooter>
- *   </div>
- * </ModalContainer>
- * ```
- */
-function ModalFooter(args) {
-    const { alignment = "right", className: baseClassName, ...rest } = args;
-    const className = `arkynModalFooter ${alignment} ${baseClassName}`;
-    return _jsx("footer", { className: className.trim(), ...rest });
-}
-export { ModalFooter };

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

@@ -1,66 +0,0 @@
-import { HTMLAttributes } from "react";
-import "./styles.css";
-type ModalHeaderProps = HTMLAttributes<HTMLElement> & {
-    showCloseButton?: boolean;
-};
-/**
- * ModalHeader component - header section for modals with optional close button
- *
- * @param props - ModalHeader component properties
- * @param props.showCloseButton - Shows close button in header. Default: true
- *
- * **...Other valid HTML properties for header element**
- *
- * @returns ModalHeader JSX element
- *
- * @example
- * ```tsx
- * // Basic modal header with close button
- * <ModalHeader>
- *   <h2>Modal Title</h2>
- * </ModalHeader>
- *
- * // Header without close button
- * <ModalHeader showCloseButton={false}>
- *   <h2>Important Notice</h2>
- * </ModalHeader>
- *
- * // Header with subtitle
- * <ModalHeader>
- *   <div>
- *     <h2>Settings</h2>
- *     <p>Manage your preferences</p>
- *   </div>
- * </ModalHeader>
- *
- * // Complete modal example
- * <ModalContainer isVisible={isOpen} makeInvisible={() => setIsOpen(false)}>
- *   <div className="modal-content">
- *     <ModalHeader>
- *       <h2>Confirm Delete</h2>
- *       <p>This action cannot be undone</p>
- *     </ModalHeader>
- *
- *     <main>
- *       <p>Are you sure you want to delete this item?</p>
- *     </main>
- *
- *     <ModalFooter>
- *       <button onClick={() => setIsOpen(false)}>Cancel</button>
- *       <button onClick={handleDelete}>Delete</button>
- *     </ModalFooter>
- *   </div>
- * </ModalContainer>
- *
- * // Custom styled header
- * <ModalHeader className="custom-header">
- *   <div className="header-content">
- *     <img src="/icon.png" alt="Icon" />
- *     <h1>Welcome</h1>
- *   </div>
- * </ModalHeader>
- * ```
- */
-declare function ModalHeader(args: ModalHeaderProps): import("react/jsx-runtime").JSX.Element;
-export { ModalHeader };
-//# sourceMappingURL=index.d.ts.map

package/dist/src/components/modal/modalHeader/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/modal/modalHeader/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,cAAc,CAAC;AAEtB,KAAK,gBAAgB,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACpD,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyDG;AAEH,iBAAS,WAAW,CAAC,IAAI,EAAE,gBAAgB,2CA2B1C;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}