@cloudparker/moldex.js 4.1.7 → 4.1.9

package/dist/services/dialog/dialog-service.js

@@ -0,0 +1,350 @@
+import { mount } from 'svelte';
+import { cropImageFile, FilePickerAccepts, ImageCaptureEnum, OutputImageFormatEnum, processImageFile } from '../utils/image-service';
+import { CropperDialog, Dialog, LoadingDialog, MsgDialog, NumberFieldDialog, PickerDialog, TextareaFieldDialog, TextFieldDialog } from '../../views/index.js';
+import { getDialogSize, isMobileScreen } from '../screen/screen-service';
+export var DialogSizeEnum;
+(function (DialogSizeEnum) {
+    DialogSizeEnum["XS"] = "xs";
+    DialogSizeEnum["SM"] = "sm";
+    DialogSizeEnum["MD"] = "md";
+    DialogSizeEnum["LG"] = "lg";
+    DialogSizeEnum["XL"] = "xl";
+    DialogSizeEnum["FULL"] = "full";
+})(DialogSizeEnum || (DialogSizeEnum = {}));
+function addDialog(props) {
+    const dialog = mount(Dialog, { target: document.getElementsByTagName('body')[0], props });
+    return dialog;
+}
+export async function openDialog(props = {}) {
+    return new Promise((resolve) => {
+        let dialog = addDialog({ ...props, onClose, onResult, });
+        dialog.openDialog();
+        function onClose() {
+            if (dialog) {
+                if (props.onClose) {
+                    props.onClose();
+                }
+            }
+        }
+        function onResult(value) {
+            resolve(value);
+            if (props.onResult) {
+                props.onResult(value);
+            }
+        }
+    });
+}
+export async function openConfirmDialog(params = {}) {
+    let msg = params.msg || 'Are you sure?';
+    params.title = params.title || 'Confirm';
+    params.footerOkButtonLabel = params.footerOkButtonLabel || 'Confirm';
+    return await openDialog({
+        bodyComponent: MsgDialog,
+        props: { msg },
+        ...params,
+        hasTitle: true,
+        hasHeader: true,
+        hasFooter: true,
+        hasFooterCloseButton: true,
+        hasFooterOkButton: true,
+    });
+}
+export async function openAlertDialog(params = {}) {
+    let msg = params.msg || 'Alert Information?';
+    params.title = params.title || 'Alert';
+    params.footerOkButtonLabel = params.footerOkButtonLabel || 'Confirm';
+    return await openDialog({
+        bodyComponent: MsgDialog,
+        props: { msg },
+        ...params,
+        hasTitle: true,
+        hasHeader: true,
+        hasFooter: true,
+        hasFooterCloseButton: true,
+        hasFooterOkButton: false,
+        footerCloseButtonLabel: 'OK'
+    });
+}
+export async function openDeleteConfirmDialog({ msg = 'Are you sure to delete?', title = 'Delete', footerOkButtonLabel = 'Delete', footerOkButtonClassName = 'bg-red-500 hover:bg-red-700 focus:bg-red-700', ...params } = {}) {
+    return await openConfirmDialog({
+        msg,
+        title,
+        footerOkButtonLabel,
+        footerOkButtonClassName,
+        ...params,
+        size: DialogSizeEnum.SM,
+    });
+}
+export async function openPickerDialog({ items, value, multiple, hasCheckbox = true, hasArrow, maxlength, maxlengthMsg, identityFieldName, titleFieldName, searchFieldName, subtitleFieldName, hasIcon, iconPath, iconClassName, isCircularIcon, circularIconClassName, itemTileSnippet, ...params }) {
+    if (hasArrow) {
+        multiple = false;
+        hasCheckbox = false;
+    }
+    return await openDialog({
+        bodyComponent: PickerDialog,
+        props: {
+            items,
+            value,
+            multiple,
+            hasCheckbox,
+            hasArrow,
+            maxlength,
+            maxlengthMsg,
+            identityFieldName,
+            titleFieldName,
+            searchFieldName,
+            subtitleFieldName,
+            hasIcon,
+            iconPath,
+            iconClassName,
+            isCircularIcon,
+            circularIconClassName,
+            itemTileSnippet,
+        },
+        hasHeader: true,
+        hasTitle: true,
+        hasHeaderBack: isMobileScreen(),
+        hasHeaderClose: !isMobileScreen(),
+        footerOkButtonLabel: 'Select',
+        footerClassName: 'border-t',
+        title: 'Pick',
+        ...params,
+        hasFooter: multiple,
+        hasFooterOkButton: multiple,
+        hasFooterCloseButton: multiple,
+    });
+}
+export async function openNumberFieldDialog({ title, value, label, name, maxlength, fieldClassName, autofocus, required, appearance, size, floatingLabel, ...params } = {}) {
+    return await openDialog({
+        bodyComponent: NumberFieldDialog,
+        props: { value, label, name, maxlength, className: fieldClassName, autofocus, required, appearance, size, floatingLabel, },
+        ...params,
+        hasHeader: true,
+        hasHeaderBack: isMobileScreen(),
+        hasHeaderClose: !isMobileScreen(),
+        size: getDialogSize(),
+        hasTitle: true,
+        title: title || 'Prompt',
+        hasFooter: true,
+        hasFooterCloseButton: true,
+        hasFooterOkButton: true,
+        footerOkButtonType: 'submit',
+        targetFormId: 'number-field-dialog-form'
+    });
+}
+export async function openTextFieldDialog({ title, value, label, name, maxlength, fieldClassName, autofocus, required, appearance, size, floatingLabel, ...params } = {}) {
+    return await openDialog({
+        bodyComponent: TextFieldDialog,
+        props: { value, label, name, maxlength, className: fieldClassName, autofocus, required, appearance, size, floatingLabel, },
+        ...params,
+        hasHeader: true,
+        hasHeaderBack: isMobileScreen(),
+        hasHeaderClose: !isMobileScreen(),
+        size: getDialogSize(),
+        hasTitle: true,
+        title: title || 'Prompt',
+        hasFooter: true,
+        hasFooterCloseButton: true,
+        hasFooterOkButton: true,
+        footerOkButtonType: 'submit',
+        targetFormId: 'text-field-dialog-form'
+    });
+}
+export async function openTextareaFieldDialog({ title, value, label, name, maxlength, fieldClassName, autofocus, required, appearance, size, floatingLabel, rows, ...params } = {}) {
+    return await openDialog({
+        bodyComponent: TextareaFieldDialog,
+        props: { value, label, name, maxlength, className: fieldClassName, autofocus, required, appearance, size, floatingLabel, rows },
+        ...params,
+        hasHeader: true,
+        hasHeaderBack: isMobileScreen(),
+        hasHeaderClose: !isMobileScreen(),
+        size: isMobileScreen() ? DialogSizeEnum.FULL : DialogSizeEnum.SM,
+        hasTitle: true,
+        title: title || 'Prompt',
+        hasFooter: true,
+        hasFooterCloseButton: true,
+        hasFooterOkButton: true,
+        footerOkButtonType: 'submit',
+        targetFormId: 'textarea-field-dialog-form'
+    });
+}
+export async function openLoadingDialog({ msg = "Please wait...", loadingDialogContainerClassName, loadingDialogClassName, loadingDialogSpinnerClassName, loadingDialogMsgClassName, ...params } = {}) {
+    let props = {
+        bodyComponent: LoadingDialog,
+        props: { msg, className: loadingDialogClassName, containerClassName: loadingDialogContainerClassName, spinnerClassName: loadingDialogSpinnerClassName, msgClassName: loadingDialogMsgClassName },
+        ...params,
+        hasHeader: false,
+        hasFooter: false,
+        size: DialogSizeEnum.SM,
+    };
+    let dialog = addDialog(props);
+    dialog.openDialog();
+    return dialog;
+}
+/**
+ * Return Cropped Image DataUrl
+ * @param props
+ * @returns
+ */
+export async function openCropperDialog({ outputWidth, outputFormat = OutputImageFormatEnum.WEBP, outputQuality = 0.8, outputType = 'file', inputImageFile, className, outputAspectRatio, ...params }) {
+    return await openDialog({
+        bodyComponent: CropperDialog,
+        props: {
+            outputWidth,
+            outputFormat,
+            outputQuality,
+            outputType,
+            inputImageFile,
+            className,
+            outputAspectRatio,
+        },
+        ...params,
+        hasHeader: true,
+        hasFooter: true,
+        hasFooterOkButton: true,
+        hasFooterCloseButton: true,
+        footerOkButtonLabel: params.footerOkButtonLabel || 'CROP',
+        hasTitle: true,
+        title: params.title || 'Crop Image',
+        hasHeaderBack: isMobileScreen(),
+        hasHeaderClose: !isMobileScreen(),
+        size: getDialogSize(),
+    });
+}
+/**
+ * Opens a file picker dialog and returns the selected file or files.
+ * This function uses native browser APIs to ensure compatibility across different browsers.
+ * @param accepts - A string or array of accepted file types (e.g., 'image/*', '.pdf').
+ * @param multiple - A boolean indicating if multiple files can be selected.
+ * @returns A promise that resolves to a File or an array of File objects, or null if no files were selected.
+ */
+export async function openFilePickerDialog(accepts = '*/*', options = { multiple: false }) {
+    // Check if the browser supports the required File API and input element
+    if (typeof window === 'undefined' || typeof document === 'undefined' || !window.File || !window.FileList || !window.FileReader) {
+        console.error('File APIs are not fully supported in this browser.');
+        return null;
+    }
+    return new Promise((resolve, reject) => {
+        try {
+            // Create an input element of type 'file'
+            const inputElement = document.createElement('input');
+            inputElement.type = 'file';
+            inputElement.style.display = 'none'; // Hide the input element
+            // Set accepted file types if provided
+            if (Array.isArray(accepts)) {
+                inputElement.accept = accepts.join(',');
+            }
+            else {
+                inputElement.accept = accepts;
+            }
+            // Set multiple attribute based on the parameter
+            inputElement.multiple = options.multiple;
+            // Listen for changes (i.e., when files are selected)
+            inputElement.addEventListener('change', () => {
+                // Check if files were selected
+                if (inputElement.files) {
+                    // If multiple is true, return an array of File objects
+                    if (options.multiple) {
+                        resolve(Array.from(inputElement.files));
+                    }
+                    else {
+                        // Otherwise, return the first selected File
+                        resolve(inputElement.files[0]);
+                    }
+                }
+                else {
+                    resolve(null); // No files selected
+                }
+            });
+            // Append the input element to the body and simulate a click to open the dialog
+            document.body.appendChild(inputElement);
+            inputElement.click();
+            // Remove the input element from the DOM after use to prevent memory leaks
+            document.body.removeChild(inputElement);
+        }
+        catch (error) {
+            console.error('An error occurred while opening the file picker dialog:', error);
+            reject(error); // Handle any unexpected errors
+        }
+    });
+}
+/**
+ * Opens an image picker dialog that supports mobile devices, camera capture, gallery selection, and file explorer.
+ * Allows the user to specify output format and quality for the selected images.
+ * @param accepts - A string or array of accepted file types (e.g., 'image/*').
+ * @param options - Additional options for capturing images (e.g., required resolution, file size, output format).
+ * @returns A promise that resolves to a processed File object or an array of File objects, or null if no file was selected.
+ */
+export async function openImagePickerDialog(accepts = 'image/*', options = {}) {
+    return new Promise((resolve, reject) => {
+        try {
+            options = options || {};
+            if (!options.maxWidth) {
+                options.maxWidth = 1920;
+            }
+            if (!options.maxHeight) {
+                options.maxHeight = options.maxWidth;
+            }
+            if (!options.quality || options.quality < 0) {
+                options.quality = 0.8;
+            }
+            if (options.quality > 1) {
+                options.quality = options.quality / 100;
+            }
+            if (options.outputFormat) {
+                options.outputFormat = OutputImageFormatEnum.WEBP;
+            }
+            // Create an input element of type 'file'
+            const inputElement = document.createElement('input');
+            inputElement.type = 'file';
+            inputElement.accept = Array.isArray(accepts) ? accepts.join(',') : accepts;
+            inputElement.multiple = options?.multiple || false;
+            inputElement.style.display = 'none';
+            // Set capture attribute if specified
+            if (options?.capture) {
+                inputElement.setAttribute('capture', options.capture);
+            }
+            // Listen for file selection
+            inputElement.addEventListener('change', async () => {
+                if (!inputElement.files) {
+                    resolve(null); // No files selected
+                    return;
+                }
+                const files = Array.from(inputElement.files);
+                try {
+                    // Process each selected file and resize/compress/convert if required
+                    const processedFiles = await Promise.all(files.map((file) => processImageFile(file, options)));
+                    // Return a single file or an array of files based on the multiple option
+                    if (options?.multiple) {
+                        resolve(processedFiles);
+                    }
+                    else {
+                        resolve((processedFiles[0] || null));
+                    }
+                }
+                catch (error) {
+                    reject(error);
+                }
+            });
+            // Append and trigger the file picker
+            document.body.appendChild(inputElement);
+            inputElement.click();
+            document.body.removeChild(inputElement);
+        }
+        catch (error) {
+            reject(error);
+        }
+    });
+}
+export async function openImagePickerDialogWithCropper({ outputFormat = OutputImageFormatEnum.WEBP, outputWidth = 800, outputQuality = 0.6, outputAspectRatio = 1, dialogSize = DialogSizeEnum.MD, capture, maxHeight, maxSizeInBytes, maxWidth, quality } = {}) {
+    const file = (await openImagePickerDialog(FilePickerAccepts.image, {
+        capture,
+        maxHeight,
+        maxSizeInBytes,
+        maxWidth,
+        quality
+    }));
+    let croppedFile = await cropImageFile({ inputImageFile: file, outputFormat, outputWidth, outputQuality, outputAspectRatio, dialogSize });
+    return croppedFile;
+}
+;

package/dist/services/index.d.ts

@@ -0,0 +1,12 @@
+export * from './date/date-service.js';
+export * from './dialog/dialog-service.js';
+export * from './navigation/navigation-service.js';
+export * from './screen/screen-service.js';
+export * from './toast/toast-service.js';
+export * from './utils/utils-service.js';
+export * from './utils/color-service.js';
+export * from './utils/download-service.js';
+export * from './utils/file-service.js';
+export * from './utils/http-service.js';
+export * from './utils/image-service.js';
+export * from './utils/currency-service.js';

package/dist/services/index.js

@@ -0,0 +1,12 @@
+export * from './date/date-service.js';
+export * from './dialog/dialog-service.js';
+export * from './navigation/navigation-service.js';
+export * from './screen/screen-service.js';
+export * from './toast/toast-service.js';
+export * from './utils/utils-service.js';
+export * from './utils/color-service.js';
+export * from './utils/download-service.js';
+export * from './utils/file-service.js';
+export * from './utils/http-service.js';
+export * from './utils/image-service.js';
+export * from './utils/currency-service.js';

package/dist/services/navigation/navigation-service.d.ts

@@ -0,0 +1,39 @@
+export interface NavigationOptions {
+    replaceState?: boolean;
+    noscroll?: boolean;
+    keepfocus?: boolean;
+    state?: {
+        tabName?: string;
+    };
+    event?: MouseEvent;
+    vibration?: number | number[];
+    sound?: [string, number][];
+}
+export type BackStateType = {
+    _id: string;
+    isModal?: boolean;
+    isOffcanvas?: boolean;
+    listener: (state: BackStateType) => void;
+    data?: any;
+};
+export declare const referrer: {
+    referer: string;
+};
+export declare const pushBackState: (obj: BackStateType) => void;
+export declare const popBackState: () => BackStateType | undefined;
+export declare const registerBackPress: (state: BackStateType) => void;
+export declare const addBackKeyListener: (callback: (event?: PopStateEvent) => boolean) => (event: PopStateEvent) => void;
+export declare const removeBackKeyListener: (listener: () => boolean) => void;
+export declare function goBack(): void;
+/**
+ * Jump back to the first history entry in this tab (i.e. “home”).
+ * Falls back to a hard redirect if history is too shallow or cross‑origin.
+ */
+export declare function goHome(): void;
+export declare function createRedirectUrl(): string | null;
+/**
+ * Navigate to a URL with support for opening in a new tab, vibration, and sound effects.
+ * @param url - The destination URL.
+ * @param options - Extended options including vibration and sound.
+ */
+export declare function navigate(url: string, options?: NavigationOptions): Promise<void>;

package/dist/services/navigation/navigation-service.js

@@ -0,0 +1,100 @@
+// import { goto, pushState } from '$app/navigation';
+import { BROWSER } from 'esm-env';
+import { goto } from '$app/navigation';
+import { createRefererStore } from '../../stores/referrer-store/referrer-store.svelte.js';
+import { vibrate } from '../utils/utils-service.js';
+import { playMelody } from '../utils/melody-service.js';
+export const referrer = createRefererStore();
+let backStateArray = [];
+export const pushBackState = (obj) => {
+    backStateArray.push(obj);
+};
+export const popBackState = () => {
+    return backStateArray.pop();
+};
+export const registerBackPress = (state) => {
+    if (BROWSER) {
+        pushBackState(state);
+        window.history.pushState({}, '');
+    }
+};
+export const addBackKeyListener = (callback) => {
+    if (BROWSER) {
+        let listener = (event) => {
+            if (callback) {
+                let result = callback(event);
+                if (result) {
+                    window.history.pushState({}, '');
+                }
+            }
+        };
+        window.history.pushState({}, '');
+        window.addEventListener('popstate', listener);
+        return listener;
+    }
+};
+export const removeBackKeyListener = (listener) => {
+    if (BROWSER) {
+        window.removeEventListener('popstate', listener);
+    }
+};
+export function goBack() {
+    history.back();
+}
+/**
+ * Jump back to the first history entry in this tab (i.e. “home”).
+ * Falls back to a hard redirect if history is too shallow or cross‑origin.
+ */
+export function goHome() {
+    // number of steps back to the first entry
+    const stepsBack = -(window.history.length - 1);
+    // if we have at least one previous entry, navigate there
+    if (stepsBack < 0) {
+        window.history.go(stepsBack);
+    }
+    else {
+        // no history to go back to — just load your root
+        window.location.replace('/');
+    }
+}
+export function createRedirectUrl() {
+    let pathname = window.location.pathname;
+    let redirectUrl = pathname + window.location.search || '';
+    let redirectInSearchParams = new URLSearchParams(window.location.search).get('redirect');
+    return redirectInSearchParams || redirectUrl || '';
+}
+/**
+ * Navigate to a URL with support for opening in a new tab, vibration, and sound effects.
+ * @param url - The destination URL.
+ * @param options - Extended options including vibration and sound.
+ */
+export async function navigate(url, options = {}) {
+    const { event, vibration, sound, ...gotoOptions } = options;
+    // Ensure window.open is safe and avoids potential abuse
+    const openInNewTab = (targetUrl, tabName) => {
+        const sanitizedUrl = new URL(targetUrl, window.location.origin).href;
+        const safeTabName = tabName?.replace(/[^a-zA-Z0-9-_]/g, '') || '_blank';
+        window.open(sanitizedUrl, safeTabName, 'noopener,noreferrer');
+    };
+    ;
+    try {
+        // Handle vibration if supported
+        if (vibration) {
+            vibrate(vibration);
+        }
+        // Handle sound playback
+        if (sound) {
+            playMelody(sound);
+        }
+        // Handle Ctrl key for opening in a new tab
+        if (event && event instanceof MouseEvent && event.ctrlKey) {
+            openInNewTab(url, gotoOptions.state?.tabName);
+            return;
+        }
+        // Perform navigation using goto
+        goto(url, gotoOptions);
+    }
+    catch (error) {
+        console.error('Error navigating with enhancements:', error);
+    }
+}

package/dist/services/screen/screen-service.d.ts

@@ -0,0 +1,17 @@
+import { DialogSizeEnum } from "../dialog/dialog-service.js";
+import { ScreenSize } from "../../types.js";
+export declare const screenSizeStore: {
+    size: ScreenSize;
+    readonly isXXL: boolean;
+    readonly isXL: boolean;
+    readonly isLg: boolean;
+    readonly isMd: boolean;
+    readonly isSm: boolean;
+    readonly isXs: boolean;
+    readonly isMobileScreen: any;
+};
+export declare const handleScreenSizeUpdate: (size: number) => void;
+export declare function isSmallScreen(): boolean;
+export declare function isMobileScreen(): boolean;
+export declare function getDialogSize(): DialogSizeEnum.SM | DialogSizeEnum.FULL;
+export declare function isTouchDevice(): boolean;

package/dist/services/screen/screen-service.js

@@ -0,0 +1,40 @@
+import { createScreenSizeStore, } from "../../stores/screen-size/screen-size-store.svelte.js";
+import { BROWSER } from "esm-env";
+import { DialogSizeEnum } from "../dialog/dialog-service.js";
+import { ScreenSize } from "../../types.js";
+export const screenSizeStore = createScreenSizeStore();
+export const handleScreenSizeUpdate = (size) => {
+    // console.log('screenSizeChanged', size)
+    if (BROWSER && size) {
+        if (size >= 1400) {
+            screenSizeStore.size = ScreenSize.XXL;
+        }
+        else if (size >= 1200) {
+            screenSizeStore.size = ScreenSize.XL;
+        }
+        else if (size >= 992) {
+            screenSizeStore.size = ScreenSize.LG;
+        }
+        else if (size >= 768) {
+            screenSizeStore.size = ScreenSize.MD;
+        }
+        else if (size >= 576) {
+            screenSizeStore.size = ScreenSize.SM;
+        }
+        else if (size < 576) {
+            screenSizeStore.size = ScreenSize.SM;
+        }
+    }
+};
+export function isSmallScreen() {
+    return screenSizeStore.isSm || screenSizeStore.isXs;
+}
+export function isMobileScreen() {
+    return isSmallScreen();
+}
+export function getDialogSize() {
+    return isMobileScreen() ? DialogSizeEnum.FULL : DialogSizeEnum.SM;
+}
+export function isTouchDevice() {
+    return 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0 || window.matchMedia("(pointer: coarse)").matches;
+}

package/dist/services/toast/toast-service.d.ts

@@ -0,0 +1,5 @@
+import { type ToastPropsType } from "../../views";
+export declare function showToast(props: ToastPropsType | string): void;
+export declare function showSuccessToast(): void;
+export declare function showFailedToast(): void;
+export declare function showErrorToast(): void;

package/dist/services/toast/toast-service.js

@@ -0,0 +1,26 @@
+import { Toast } from "../../views";
+import { mount } from "svelte";
+function addToast(props) {
+    const toast = mount(Toast, { target: document.getElementsByTagName('body')[0], props });
+    toast.openToast();
+    return toast;
+}
+export function showToast(props) {
+    let newProps = { msg: 'Ok' };
+    if (typeof props === 'string') {
+        newProps.msg = props;
+    }
+    else {
+        newProps = props;
+    }
+    addToast(newProps);
+}
+export function showSuccessToast() {
+    showToast('Success');
+}
+export function showFailedToast() {
+    showToast('Failed');
+}
+export function showErrorToast() {
+    showToast('Error');
+}

package/dist/services/utils/color-service.d.ts

@@ -0,0 +1,46 @@
+/**
+ * Validates whether a given string is a valid hexadecimal color code.
+ *
+ * This function checks if a given string matches the pattern for a valid hex color code,
+ * which can be either 3 or 6 characters long, prefixed with '#'.
+ *
+ * @param hex - The string to validate as a hex color code.
+ * @returns A boolean indicating whether the string is a valid hex color code.
+ *
+ * @example
+ * console.log(isValidHexColor('#FFF'));   // Output: true
+ * console.log(isValidHexColor('#123ABC')); // Output: true
+ * console.log(isValidHexColor('#1234'));   // Output: false
+ */
+export declare function isValidHexColor(hex: string): boolean;
+/**
+ * Converts a named or RGB color string to its hexadecimal representation.
+ *
+ * This function creates a temporary DOM element, sets its color property to the provided color string,
+ * and retrieves the computed color value. It then converts the RGB color to a hexadecimal format.
+ *
+ * @param color - A color string, such as a named color ('red'), RGB color ('rgb(255, 0, 0)'), or hex color ('#FF0000').
+ * @returns The hexadecimal representation of the color.
+ *
+ * @throws An error if the color cannot be parsed.
+ *
+ * @example
+ * console.log(colorToHex('red'));        // Output: #FF0000
+ * console.log(colorToHex('rgb(0, 255, 0)')); // Output: #00FF00
+ */
+export declare function colorToHex(color: string): string;
+/**
+ * Converts RGB values to a hexadecimal color code.
+ *
+ * This function takes the red, green, and blue components and converts them to a hexadecimal string.
+ * The resulting hex code is formatted as '#RRGGBB'.
+ *
+ * @param r - The red component (0-255).
+ * @param g - The green component (0-255).
+ * @param b - The blue component (0-255).
+ * @returns The hexadecimal color code in the format '#RRGGBB'.
+ *
+ * @example
+ * console.log(rgbToHex(255, 0, 0)); // Output: #FF0000
+ */
+export declare function rgbToHex(r: number, g: number, b: number): string;