@arkyn/components 3.0.1-beta.99 → 3.0.3

package/dist/providers/formProvider.js

@@ -1,69 +0,0 @@
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, cloneElement } from "react";
-const formContext = createContext({});
-/**
- * FormProvider component - provides form context including field errors to child components
- *
- * @param props - FormProvider component properties
- * @param props.children - React elements that will have access to the form context
- * @param props.fieldErrors - Object containing validation errors indexed by field name
- * @param props.form - Optional form element to wrap the children with
- *
- * @returns FormProvider JSX element that wraps children with form context
- *
- * @example
- * ```tsx
- * // Basic form provider with field errors
- * function App() {
- *   const errors = {
- *     email: "Invalid email format",
- *     password: "Password is required"
- *   };
- *
- *   return (
- *     <FormProvider fieldErrors={errors}>
- *       <Input name="email" label="Email" />
- *       <Input name="password" label="Password" type="password" />
- *     </FormProvider>
- *   );
- * }
- *
- * // Form provider with custom form element
- * function FormWithValidation() {
- *   const [errors, setErrors] = useState({});
- *
- *   const handleSubmit = (e) => {
- *     e.preventDefault();
- *     // validation logic
- *   };
- *
- *   return (
- *     <FormProvider
- *       fieldErrors={errors}
- *       form={<form onSubmit={handleSubmit} />}
- *     >
- *       <Input name="username" label="Username" />
- *       <Button type="submit">Submit</Button>
- *     </FormProvider>
- *   );
- * }
- *
- * // Using with useForm hook
- * function FormField() {
- *   const { fieldErrors } = useForm();
- *
- *   return (
- *     <Input
- *       name="email"
- *       label="Email"
- *       errorMessage={fieldErrors?.email}
- *     />
- *   );
- * }
- * ```
- */
-function FormProvider(props) {
-    const { children, fieldErrors, form } = props;
-    return (_jsxs(formContext.Provider, { value: { fieldErrors }, children: [!form && children, form && cloneElement(form, form.props, children)] }));
-}
-export { formContext, FormProvider };

package/dist/providers/modalProvider.js

@@ -1,119 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useState } from "react";
-const modalContext = createContext({});
-/**
- * ModalProvider component - provides modal context for managing multiple modals state and data
- *
- * @param props - ModalProvider component properties
- * @param props.children - React elements that will have access to the modal context
- * @param props.enableModalAutomation - Optional flag to enable modal automation features
- *
- * @returns ModalProvider JSX element that wraps children with modal context
- *
- * @example
- * ```tsx
- * // Basic modal provider setup
- * function App() {
- *   return (
- *     <ModalProvider>
- *       <UserModal />
- *       <ConfirmModal />
- *       <ImagePreviewModal />
- *       <MainContent />
- *     </ModalProvider>
- *   );
- * }
- *
- * // Modal provider with automation enabled
- * function AppWithAutomation() {
- *   return (
- *     <ModalProvider enableModalAutomation={true}>
- *       <Dashboard />
- *       <SettingsModal />
- *       <NotificationModal />
- *     </ModalProvider>
- *   );
- * }
- *
- * // Using with multiple modals
- * function MultiModalApp() {
- *   return (
- *     <ModalProvider>
- *       <Header />
- *       <Modal key="user-profile" />
- *       <Modal key="edit-settings" />
- *       <Modal key="confirm-delete" />
- *       <MainContent />
- *     </ModalProvider>
- *   );
- * }
- *
- * // Component using modal context
- * function ModalTrigger() {
- *   const { openModal, closeAll } = useModal();
- *
- *   const handleOpenUserModal = () => {
- *     openModal('user-details', { userId: 123, mode: 'edit' });
- *   };
- *
- *   const handleCloseAllModals = () => {
- *     closeAll();
- *   };
- *
- *   return (
- *     <div>
- *       <button onClick={handleOpenUserModal}>
- *         Open User Modal
- *       </button>
- *       <button onClick={handleCloseAllModals}>
- *         Close All Modals
- *       </button>
- *     </div>
- *   );
- * }
- *
- * // Modal component consuming context
- * function UserDetailsModal() {
- *   const { modalIsOpen, modalData, closeModal } = useModal('user-details');
- *
- *   if (!modalIsOpen) return null;
- *
- *   return (
- *     <Modal onClose={() => closeModal('user-details')}>
- *       <h2>User Details</h2>
- *       <p>User ID: {modalData?.userId}</p>
- *       <p>Mode: {modalData?.mode}</p>
- *     </Modal>
- *   );
- * }
- * ```
- */
-function ModalProvider(args) {
-    const { children = false } = args;
-    const [openedModals, setOpenedModals] = useState([]);
-    function modalIsOpen(key) {
-        return !!openedModals.some((modal) => modal.key === key);
-    }
-    function modalData(key) {
-        return openedModals.find((modal) => modal.key === key)?.data;
-    }
-    function openModal(key, data) {
-        const alreadyExist = modalIsOpen(key);
-        if (alreadyExist) {
-            setOpenedModals((old) => {
-                const filtered = old.filter((modal) => modal.key !== key);
-                return [...filtered, { key, data }];
-            });
-        }
-        else
-            setOpenedModals([...openedModals, { key, data }]);
-    }
-    function closeModal(key) {
-        setOpenedModals(openedModals.filter((modal) => modal.key !== key));
-    }
-    function closeAll() {
-        setOpenedModals([]);
-    }
-    return (_jsx(modalContext.Provider, { value: { modalIsOpen, modalData, openModal, closeModal, closeAll }, children: children }));
-}
-export { modalContext, ModalProvider };

package/dist/providers/placesProvider.js

@@ -1,35 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { useLoadScript } from "@react-google-maps/api";
-const libraries = [
-    "places",
-    "marker",
-    "maps",
-];
-/**
- * PlacesProvider component that loads Google Maps API with Places, Marker, and Maps libraries.
- *
- * @component
- * @example
- * ```tsx
- * <PlacesProvider apiKey="YOUR_API_KEY">
- *   {(isLoaded) => isLoaded ? <MapComponent /> : <LoadingSpinner />)}
- * </PlacesProvider>
- * ```
- *
- * @param {PlacesProviderProps} props - The component props
- * @param {string} props.apiKey - Maps API key for authentication
- * @param {(isLoaded: boolean) => ReactNode} props.children - Render function that receives the loading state
- * @param {boolean} [props.preventFontsLoading=true] - Whether to prevent Fonts from loading
- *
- * @returns {ReactNode} The rendered children with the loading state
- */
-function PlacesProvider(props) {
-    const { apiKey, children, preventFontsLoading = true } = props;
-    const { isLoaded } = useLoadScript({
-        googleMapsApiKey: apiKey,
-        libraries,
-        preventGoogleFontsLoading: preventFontsLoading,
-    });
-    return _jsx(_Fragment, { children: children(isLoaded) });
-}
-export { PlacesProvider };

package/dist/providers/toastProvider.js

@@ -1,73 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext } from "react";
-import toast, { Toaster } from "react-hot-toast";
-const toastContext = createContext({});
-/**
- * ToastProvider component - provides toast context for managing toast notifications
- *
- * @param props - ToastProvider component properties
- * @param props.children - React elements that will have access to the toast context
- *
- * @returns ToastProvider JSX element that wraps children with toast context
- *
- * @example
- * Basic usage:
- * ```tsx
- * <ToastProvider>
- *   <App />
- * </ToastProvider>
- * ```
- *
- * @example
- * Using toast in component:
- * ```tsx
- * function MyComponent() {
- *   const { showToast } = useToast();
- *
- *   const handleClick = () => {
- *     showToast({
- *       message: 'Success!',
- *       type: 'success'
- *     });
- *   };
- *
- *   return <button onClick={handleClick}>Show Toast</button>;
- * }
- * ```
- */
-function ToastProvider({ children }) {
-    function showToast(props) {
-        switch (props.type) {
-            case "success":
-                return toast.success(props.message, {
-                    style: {
-                        background: "#10B981",
-                        color: "#ffffff",
-                        padding: "12px 16px",
-                        fontSize: "14px",
-                        fontWeight: 600,
-                    },
-                    iconTheme: {
-                        primary: "#059669",
-                        secondary: "#ffffff",
-                    },
-                });
-            case "danger":
-                return toast.error(props.message, {
-                    style: {
-                        background: "#E11D48",
-                        color: "#ffffff",
-                        padding: "12px 16px",
-                        fontSize: "14px",
-                        fontWeight: 600,
-                    },
-                    iconTheme: {
-                        primary: "#BE123C",
-                        secondary: "#ffffff",
-                    },
-                });
-        }
-    }
-    return (_jsxs(toastContext.Provider, { value: { showToast }, children: [_jsx(Toaster, { position: "top-right", containerStyle: { zIndex: 999999999999999 } }), children] }));
-}
-export { toastContext, ToastProvider };

package/dist/services/extractTextFromNode.js

@@ -1,5 +0,0 @@
-import { Node } from "slate";
-function extractTextFromNode(nodes) {
-    return nodes.map((n) => Node.string(n)).join("");
-}
-export { extractTextFromNode };

package/dist/services/iconRenderer.js

@@ -1,13 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-function IconRenderer(props) {
-    const { iconSize, icon: Icon, className, show = true } = props;
-    if (!show)
-        return _jsx(_Fragment, {});
-    if (!Icon)
-        return _jsx(_Fragment, {});
-    if (typeof Icon === "string") {
-        return _jsx("p", { className: className, children: Icon });
-    }
-    return (_jsx("p", { className: className, children: _jsx(Icon, { size: iconSize, strokeWidth: 2.5 }) }));
-}
-export { IconRenderer };

package/dist/services/isBlockActive.js

@@ -1,14 +0,0 @@
-import { Editor, Element as SlateElement } from "slate";
-function isBlockActive(editor, format, blockType = "type") {
-    const { selection } = editor;
-    if (!selection)
-        return false;
-    const [match] = Array.from(Editor.nodes(editor, {
-        at: Editor.unhangRange(editor, selection),
-        match: (n) => !Editor.isEditor(n) &&
-            SlateElement.isElement(n) &&
-            n[blockType] === format,
-    }));
-    return !!match;
-}
-export { isBlockActive };

package/dist/services/isMarkActive.js

@@ -1,6 +0,0 @@
-import { Editor } from "slate";
-function isMarkActive(editor, format) {
-    const marks = Editor.marks(editor);
-    return marks ? marks[format] === true : false;
-}
-export { isMarkActive };

package/dist/services/maskCurrencyValues.js

@@ -1,23 +0,0 @@
-import { formatToCurrency, removeNonNumeric } from "@arkyn/shared";
-function normalizeValue(number) {
-    let safeNumber = number;
-    if (typeof number === "string") {
-        safeNumber = +removeNonNumeric(number);
-        if (safeNumber % 1 !== 0)
-            safeNumber = safeNumber.toFixed(2);
-    }
-    else {
-        safeNumber = Number.isInteger(number)
-            ? Number(number) * 10 ** 2
-            : number.toFixed(2);
-    }
-    return +removeNonNumeric(String(safeNumber)) / 10 ** 2;
-}
-function maskCurrencyValues(inputFieldValue, locale) {
-    if (!inputFieldValue)
-        return [0, formatToCurrency(0, locale)];
-    const value = normalizeValue(inputFieldValue);
-    const maskedValue = formatToCurrency(value, locale);
-    return [value, maskedValue];
-}
-export { maskCurrencyValues, normalizeValue };

package/dist/services/toHtml.js

@@ -1,21 +0,0 @@
-import { serialize } from "../utils/richTextUtilities";
-/**
- * Converts a RichTextValue array to HTML string format.
- *
- * @param {RichTextValue} richTextValue - Array of Descendant objects representing rich text content
- * @returns {string} HTML string representation of the rich text content
- *
- * @example
- * ```typescript
- * const richTextService = new RichTextService();
- * const richText = [
- *   { type: 'paragraph', children: [{ text: 'Hello world', bold: true }] }
- * ];
- * const html = richTextService.toHtml(richText);
- * // Returns: "<p><strong>Hello world</strong></p>"
- * ```
- */
-function toHtml(richTextValue) {
-    return richTextValue.map((node) => serialize(node)).join("");
-}
-export { toHtml };

package/dist/services/toRichTextValue.js

@@ -1,40 +0,0 @@
-import parse from "html-react-parser";
-import { deserialize } from "../utils/richTextUtilities";
-/**
- * Converts an HTML string to RichTextValue format.
- * Parses the HTML content and transforms it into an array of Descendant objects
- * that can be used by the rich text editor.
- *
- * @param {string} html - HTML string to be converted to rich text format
- * @returns {RichTextValue} Array of Descendant objects representing the parsed content
- *
- * @example
- * ```typescript
- * const richTextService = new RichTextService();
- * const html = "<p><strong>Hello world</strong></p>";
- * const richText = richTextService.toRichTextValue(html);
- * // Returns: [{ type: 'paragraph', children: [{ text: 'Hello world', bold: true }] }]
- * ```
- *
- * @example
- * ```typescript
- * // Handling plain text
- * const plainText = "Simple text";
- * const richText = richTextService.toRichTextValue(plainText);
- * // Returns: [{ text: 'Simple text' }]
- * ```
- */
-function toRichTextValue(html) {
-    const parsed = parse(html);
-    if (Array.isArray(parsed)) {
-        return parsed.map((node) => {
-            if (typeof node === "string")
-                return { text: node };
-            return deserialize(node);
-        });
-    }
-    if (typeof parsed === "string")
-        return [{ text: parsed }];
-    return [deserialize(parsed)];
-}
-export { toRichTextValue };

package/dist/services/toggleBlock.js

@@ -1,32 +0,0 @@
-import { Editor, Element as SlateElement, Transforms } from "slate";
-import { listTypes, textAlignTypes } from "../templates/richTextTemplates";
-import { isBlockActive } from "./isBlockActive";
-function toggleBlock(editor, format) {
-    const blockType = textAlignTypes.includes(format) ? "align" : "type";
-    const isActive = isBlockActive(editor, format, blockType);
-    const isList = listTypes.includes(format);
-    Transforms.unwrapNodes(editor, {
-        match: (n) => !Editor.isEditor(n) &&
-            SlateElement.isElement(n) &&
-            listTypes.includes(n.type) &&
-            !textAlignTypes.includes(format),
-        split: true,
-    });
-    let newProperties;
-    if (textAlignTypes.includes(format)) {
-        const formatType = format;
-        newProperties = { align: isActive ? undefined : formatType };
-    }
-    else {
-        const formatType = format;
-        newProperties = {
-            type: isActive ? "paragraph" : isList ? "listItem" : formatType,
-        };
-    }
-    Transforms.setNodes(editor, newProperties);
-    if (!isActive && isList) {
-        const block = { type: format, children: [] };
-        Transforms.wrapNodes(editor, block);
-    }
-}
-export { toggleBlock };

package/dist/services/toggleMark.js

@@ -1,10 +0,0 @@
-import { Editor } from "slate";
-import { isMarkActive } from "./isMarkActive";
-function toggleMark(editor, format) {
-    const isActive = isMarkActive(editor, format);
-    if (isActive)
-        Editor.removeMark(editor, format);
-    else
-        Editor.addMark(editor, format, true);
-}
-export { toggleMark };

package/dist/templates/badResponses.js

@@ -1,12 +0,0 @@
-const badResponses = [
-    "BadGateway",
-    "BadRequest",
-    "Conflict",
-    "Forbidden",
-    "NotFound",
-    "NotImplemented",
-    "ServerError",
-    "Unauthorized",
-    "UnprocessableEntity",
-];
-export { badResponses };

package/dist/templates/richTextTemplates.js

@@ -1,12 +0,0 @@
-const hotKeys = {
-    "mod+b": "bold",
-    "mod+i": "italic",
-    "mod+u": "underline",
-    "mod+`": "code",
-};
-const initialValue = [
-    { type: "paragraph", children: [{ text: "" }] },
-];
-const listTypes = ["listItem", "numberedList"];
-const textAlignTypes = ["left", "center", "right", "justify"];
-export { hotKeys, initialValue, listTypes, textAlignTypes };

package/dist/templates/successResponses.js

@@ -1,2 +0,0 @@
-const successResponses = ["Created", "Found", "Success", "Updated"];
-export { successResponses };

package/dist/types/richTextTypes.js

@@ -1 +0,0 @@
-export {};

package/dist/utils/phoneInputUtilities.js

@@ -1,99 +0,0 @@
-import { countries } from "@arkyn/templates";
-function clear(value) {
-    return value && value.replace(/[^0-9]/g, "");
-}
-const TYPES = {
-    EIGHT: "(99) 9999-9999",
-    NINE: "(99) 99999-9999",
-};
-function applyMask(value, maskPattern) {
-    let result = "";
-    let digitIndex = 0;
-    for (let i = 0; i < maskPattern.length; i++) {
-        if (maskPattern[i] === "9") {
-            if (digitIndex < value.length) {
-                result += value[digitIndex];
-                digitIndex++;
-            }
-            else {
-                break;
-            }
-        }
-        else {
-            if (digitIndex < value.length) {
-                result += maskPattern[i];
-            }
-            else {
-                break;
-            }
-        }
-    }
-    return result;
-}
-function getMask(value) {
-    const mask = value.length > 10 ? "NINE" : "EIGHT";
-    return mask;
-}
-const MAX_LENGTH = clear(TYPES.NINE).length;
-function formatPhoneNumber(phoneNumber, country) {
-    if (country.code === "+55") {
-        let value = clear(phoneNumber);
-        const mask = getMask(value);
-        let nextLength = value.length;
-        if (nextLength > MAX_LENGTH)
-            return;
-        value = applyMask(value, TYPES[mask]);
-        return value;
-    }
-    const mask = country.mask;
-    let formattedNumber = mask;
-    if (country.prefix) {
-        const prefixRegex = /\$+/g;
-        formattedNumber = formattedNumber.replace(prefixRegex, country.prefix);
-    }
-    for (let i = 0, j = 0; i < formattedNumber.length && j < phoneNumber.length; i++) {
-        if (formattedNumber[i] === "_") {
-            formattedNumber =
-                formattedNumber.substring(0, i) +
-                    phoneNumber[j] +
-                    formattedNumber.substring(i + 1);
-            j++;
-        }
-    }
-    return formattedNumber;
-}
-function getCountryWithPrefixCode(countryCode, prefix) {
-    const country = countries.find((country) => country.code === countryCode && country.prefix === prefix);
-    if (!country)
-        return null;
-    return country;
-}
-function getCountryWithoutPrefixCode(countryCode) {
-    const country = countries.find((country) => country.code === countryCode);
-    if (!country)
-        return null;
-    return country;
-}
-function getDefaultFormatPhoneNumber(defaultValue) {
-    const countryCode = defaultValue.split(" ")[0].split("-")[0];
-    const prefixCode = defaultValue.split(" ")[0].split("-")[1];
-    const phoneNumber = defaultValue.split(" ")[1];
-    if (!countryCode || !phoneNumber) {
-        return { country: null, formattedNumber: "" };
-    }
-    if (prefixCode) {
-        const country = getCountryWithPrefixCode(countryCode, prefixCode);
-        if (!country)
-            return { country: null, formattedNumber: "" };
-        const formattedNumber = formatPhoneNumber(phoneNumber, country);
-        const response = { country, formattedNumber };
-        return response;
-    }
-    const country = getCountryWithoutPrefixCode(countryCode);
-    if (!country)
-        return { country: null, formattedNumber: "" };
-    const formattedNumber = formatPhoneNumber(phoneNumber, country);
-    const response = { country, formattedNumber };
-    return response;
-}
-export { getDefaultFormatPhoneNumber, applyMask, clear, getMask, MAX_LENGTH, TYPES, };