ikoncomponents 1.4.8 → 1.4.9

package/dist/ikoncomponents/image-cropper-upload/cropper-form/index.js

@@ -1,92 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Input } from '../../../shadcn/input';
-import { Label } from '../../../shadcn/label';
-import { ToggleGroup, ToggleGroupItem } from '../../../shadcn/toggle-group';
-import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, FileImage, ImageIcon, RotateCcw, RotateCw, Square, ZoomIn, ZoomOut } from 'lucide-react';
-import { memo, useEffect, useState } from 'react';
-import { ImageCropper } from '../image-cropper';
-import Image from 'next/image';
-import { AspectRatio } from '../../../shadcn/aspect-ratio';
-import { TextButton } from '../../buttons';
-import { toast } from 'sonner';
-import { FileInput } from '../../file-input';
-import { useImageCropper } from '..';
-const stateWiseAspectRatio = {
-    landscape: 4 / 3,
-    potrait: 3 / 4,
-    icon: 1 / 1
-};
-function CropperFormComponent({ onNewFileUpload }) {
-    const { originalImage, setOriginalImage, aspectRatioWiseImages, setAspectRatioWiseImages } = useImageCropper();
-    const [croppedImage, setCroppedImage] = useState(null);
-    const [activeState, setActiveState] = useState();
-    const [rotationAngle, setRotationAngle] = useState(0);
-    const [scale, setScale] = useState(1);
-    const [moveDirection, setMoveDirection] = useState({
-        x: 0,
-        y: 0,
-    });
-    const [imageSrc, setImageSrc] = useState(null);
-    const handleDrop = (event) => {
-        event.preventDefault();
-        handleFileChange(event.dataTransfer.files[0]);
-    };
-    const handleFileChange = (file) => {
-        var _a;
-        if (typeof file === "string") {
-            setImageSrc(file);
-        }
-        else {
-            if ((_a = file === null || file === void 0 ? void 0 : file.type) === null || _a === void 0 ? void 0 : _a.startsWith("image/")) {
-                onNewFileUpload === null || onNewFileUpload === void 0 ? void 0 : onNewFileUpload();
-                const reader = new FileReader();
-                reader.onloadend = () => {
-                    setImageSrc(reader.result);
-                    setActiveState(undefined);
-                };
-                reader.readAsDataURL(file);
-                setOriginalImage(Object.assign(Object.assign({}, originalImage), { image: file, name: file.name }));
-            }
-            else {
-                toast.error("Please select a valid image file.");
-            }
-        }
-    };
-    useEffect(() => {
-        if (originalImage.image) {
-            handleFileChange(originalImage.image);
-        }
-    }, [originalImage.image]);
-    const getImagePreview = (state) => {
-        const imgSource = croppedImage && activeState === state ? croppedImage : aspectRatioWiseImages[state];
-        return (_jsxs(_Fragment, { children: [_jsx("h3", { className: 'mb-3', children: state }), _jsx(AspectRatio, { ratio: stateWiseAspectRatio[state], className: 'bg-muted', children: imgSource &&
-                        _jsx(Image, { src: imgSource || "", alt: `Preview ${state}`, fill: true }) })] }));
-    };
-    useEffect(() => {
-        if (croppedImage) {
-            if (activeState) {
-                setAspectRatioWiseImages(Object.assign(Object.assign({}, aspectRatioWiseImages), { [activeState]: croppedImage }));
-            }
-            else {
-                setAspectRatioWiseImages({
-                    landscape: croppedImage,
-                    potrait: croppedImage,
-                    icon: croppedImage
-                });
-            }
-        }
-    }, [croppedImage]);
-    return (_jsx(_Fragment, { children: _jsxs("div", { className: 'flex flex-col gap-3 h-full overflow-auto', children: [_jsxs("div", { className: 'flex flex-col lg:flex-row gap-3 justify-between', children: [_jsxs("div", { className: 'w-full flex flex-col gap-4', children: [_jsx(Label, { htmlFor: "imageName", children: "Image Name" }), _jsx(FileInput, { id: "inputImage", accept: "image/*", fileNamePlaceholder: "Enter image name", fileName: (originalImage === null || originalImage === void 0 ? void 0 : originalImage.name) || "", onChange: (e) => {
-                                        var _a;
-                                        const file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
-                                        if (file) {
-                                            handleFileChange(file);
-                                        }
-                                    }, onFileNameChange: (e) => {
-                                        setOriginalImage(Object.assign(Object.assign({}, originalImage), { name: e.target.value }));
-                                    } })] }), _jsxs("div", { className: 'w-full flex flex-col gap-4', children: [_jsx(Label, { htmlFor: "imageDescription", children: "Image Description" }), _jsx(Input, { id: "imageDescription", placeholder: "Enter image Description", value: (originalImage === null || originalImage === void 0 ? void 0 : originalImage.description) || "", onChange: (e) => setOriginalImage(Object.assign(Object.assign({}, originalImage), { description: e.target.value })) })] })] }), _jsxs("div", { className: 'flex flex-col lg:flex-row gap-3', children: [_jsxs("div", { className: 'flex-grow flex flex-col gap-3', children: [_jsxs("div", { children: [_jsx("h3", { className: 'mb-3', children: "Original Image" }), _jsx(AspectRatio, { ratio: 4 / 3, className: 'flex justify-center items-center bg-muted text-muted-foreground', onDrop: handleDrop, onDragOver: (e) => e.preventDefault(), children: imageSrc ?
-                                                _jsx(ImageCropper, { src: imageSrc, onCroppedImage: setCroppedImage, aspectRatio: stateWiseAspectRatio[activeState || "icon"], rotationAngle: rotationAngle, zoomLevel: scale, moveDirection: moveDirection })
-                                                :
-                                                    _jsxs("div", { className: "text-center", children: [_jsx(Label, { htmlFor: "inputImage", children: "Drag and drop an image here" }), _jsx("div", { className: "mt-3", children: _jsx(TextButton, { variant: "outline", onClick: () => { var _a; return (_a = document.getElementById("inputImage")) === null || _a === void 0 ? void 0 : _a.click(); }, children: "Browse Image" }) })] }) })] }), _jsxs("div", { className: "flex flex-col lg:flex-row gap-3 justify-between", children: [_jsx("div", { children: _jsxs(ToggleGroup, { type: "single", variant: 'outline', value: activeState, onValueChange: (value) => setActiveState(value), children: [_jsx(ToggleGroupItem, { className: "rounded-e-none", value: "landscape", children: _jsx(ImageIcon, {}) }), _jsx(ToggleGroupItem, { className: "rounded-none border-x-0", value: "potrait", children: _jsx(FileImage, {}) }), _jsx(ToggleGroupItem, { className: 'rounded-s-none', value: "icon", children: _jsx(Square, {}) })] }) }), _jsxs("div", { className: 'flex flex-col lg:flex-row gap-3 justify-between', children: [_jsxs(ToggleGroup, { type: "single", variant: 'outline', value: "", onValueChange: (value) => setRotationAngle(parseInt(value)), children: [_jsx(ToggleGroupItem, { className: "rounded-e-none", value: "90", children: _jsx(RotateCw, {}) }), _jsx(ToggleGroupItem, { className: 'rounded-s-none border-s-0', value: "-90", children: _jsx(RotateCcw, {}) })] }), _jsxs(ToggleGroup, { type: "single", variant: 'outline', value: '', children: [_jsx(ToggleGroupItem, { className: "rounded-e-none", value: "up", onClick: () => setMoveDirection({ x: 0, y: -5 }), children: _jsx(ArrowUp, {}) }), _jsx(ToggleGroupItem, { className: "rounded-none border-x-0", value: "down", onClick: () => setMoveDirection({ x: 0, y: 5 }), children: _jsx(ArrowDown, {}) }), _jsx(ToggleGroupItem, { className: 'rounded-none border-e-0', value: "left", onClick: () => setMoveDirection({ x: -5, y: 0 }), children: _jsx(ArrowLeft, {}) }), _jsx(ToggleGroupItem, { className: 'rounded-s-none', value: "right", onClick: () => setMoveDirection({ x: 5, y: 0 }), children: _jsx(ArrowRight, {}) })] }), _jsxs(ToggleGroup, { type: "single", variant: 'outline', value: "", onValueChange: (value) => setScale(pre => pre + parseFloat(value)), children: [_jsx(ToggleGroupItem, { className: "rounded-e-none", value: "0.1", children: _jsx(ZoomIn, {}) }), _jsx(ToggleGroupItem, { className: 'rounded-s-none border-s-0', value: "-0.1", children: _jsx(ZoomOut, {}) })] })] })] })] }), _jsxs("div", { className: "flex flex-row lg:flex-col gap-3 w-full lg:w-48", children: [_jsx("div", { className: 'w-5/5', children: getImagePreview("landscape") }), _jsx("div", { className: 'w-4/5', children: getImagePreview("potrait") }), _jsx("div", { className: 'w-3/5', children: getImagePreview("icon") })] })] })] }) }));
-}
-export const CropperForm = memo(CropperFormComponent);

package/dist/ikoncomponents/image-cropper-upload/cropper-form-with-modal/index.d.ts

@@ -1,7 +0,0 @@
-import { AspectRatioWiseImagesProps, OriginalImageProps } from '..';
-export declare function CropperFormWithModal({ open, onOpenChange, onCropperChange }: Readonly<{
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    onCropperChange: (originalImage: OriginalImageProps, aspectRatioWiseImages: AspectRatioWiseImagesProps) => void;
-}>): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/image-cropper-upload/cropper-form-with-modal/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ikoncomponents/image-cropper-upload/cropper-form-with-modal/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,0BAA0B,EAAE,kBAAkB,EAAmB,MAAM,IAAI,CAAA;AAEpF,wBAAgB,oBAAoB,CAC/B,EAAE,IAAI,EAAE,YAAY,EAAE,eAAe,EAAE,EACpC,QAAQ,CAAC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAAC,eAAe,EAAE,CAAC,aAAa,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,0BAA0B,KAAK,IAAI,CAAA;CAAE,CAAC,2CAsB1L"}

package/dist/ikoncomponents/image-cropper-upload/cropper-form-with-modal/index.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '../../../shadcn/dialog';
-import { CropperForm } from '../cropper-form';
-import { TextButton } from '../../buttons';
-import { useImageCropper } from '..';
-export function CropperFormWithModal({ open, onOpenChange, onCropperChange }) {
-    const { originalImage, aspectRatioWiseImages } = useImageCropper();
-    return (_jsx(Dialog, { modal: true, open: open, onOpenChange: (isOpen) => {
-            onOpenChange(isOpen);
-        }, children: _jsxs(DialogContent, { className: "max-w-full lg:max-w-5xl max-h-full overflow-auto", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Image to upload" }) }), _jsx(CropperForm, {}), _jsx(DialogFooter, { children: _jsx(TextButton, { onClick: () => {
-                            onCropperChange(originalImage, aspectRatioWiseImages);
-                            onOpenChange(false);
-                        }, children: "Save Changes" }) })] }) }));
-}

package/dist/ikoncomponents/image-cropper-upload/image-cropper/index.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-import "cropperjs/dist/cropper.css";
-export interface CropperImgProps {
-    src: string | undefined;
-    onCroppedImage: (imageUrl: string) => void;
-    aspectRatio: number;
-    rotationAngle: number;
-    zoomLevel: number;
-    moveDirection: {
-        x: number;
-        y: number;
-    };
-}
-export declare const ImageCropper: React.NamedExoticComponent<CropperImgProps>;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/image-cropper-upload/image-cropper/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ikoncomponents/image-cropper-upload/image-cropper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAE9E,OAAO,4BAA4B,CAAC;AAEpC,MAAM,WAAW,eAAe;IAC5B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,cAAc,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C;AA2GD,eAAO,MAAM,YAAY,6CAA8B,CAAC"}

package/dist/ikoncomponents/image-cropper-upload/index.d.ts

@@ -1,28 +0,0 @@
-import { ReactNode } from 'react';
-import { CropperUploadImagesInfoProps } from './utils';
-export interface ImageCropperContextProps {
-    originalImage: OriginalImageProps;
-    setOriginalImage: (originalImage: OriginalImageProps) => void;
-    aspectRatioWiseImages: AspectRatioWiseImagesProps;
-    setAspectRatioWiseImages: (aspectRatioWiseImages: AspectRatioWiseImagesProps) => void;
-}
-export interface AspectRatioWiseImagesProps {
-    landscape: string | null;
-    potrait: string | null;
-    icon: string | null;
-}
-export interface OriginalImageProps {
-    image: string | File | null;
-    name?: string;
-    description?: string;
-}
-export interface ImageCropperProps {
-    children: ReactNode;
-    uploadedImages: CropperUploadImagesInfoProps | null;
-    onCropperChange: (originalImage: OriginalImageProps, aspectRatioWiseImages: AspectRatioWiseImagesProps) => void;
-    modalOpen?: boolean;
-    onModalOpenChange?: (open: boolean) => void;
-}
-export declare function ImageCropperProvider({ children, uploadedImages, onCropperChange, modalOpen, onModalOpenChange }: ImageCropperProps): import("react/jsx-runtime").JSX.Element;
-export declare const useImageCropper: () => ImageCropperContextProps;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/image-cropper-upload/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/image-cropper-upload/index.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAiB,SAAS,EAAmC,MAAM,OAAO,CAAA;AAExF,OAAO,EAAE,4BAA4B,EAAiC,MAAM,SAAS,CAAC;AAGtF,MAAM,WAAW,wBAAwB;IACrC,aAAa,EAAE,kBAAkB,CAAC;IAClC,gBAAgB,EAAE,CAAC,aAAa,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC9D,qBAAqB,EAAE,0BAA0B,CAAC;IAClD,wBAAwB,EAAE,CAAC,qBAAqB,EAAE,0BAA0B,KAAK,IAAI,CAAC;CACzF;AAGD,MAAM,WAAW,0BAA0B;IACvC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,cAAc,EAAE,4BAA4B,GAAG,IAAI,CAAC;IACpD,eAAe,EAAE,CAAC,aAAa,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,0BAA0B,KAAK,IAAI,CAAC;IAChH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAC/C;AAID,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,eAAe,EAAE,SAAS,EAAE,iBAAiB,EAAE,EAAE,iBAAiB,2CAiDlI;AAED,eAAO,MAAM,eAAe,QAAO,wBAMlC,CAAC"}

package/dist/ikoncomponents/image-cropper-upload/index.js

@@ -1,49 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, useContext, useEffect, useState } from 'react';
-import { CropperFormWithModal } from './cropper-form-with-modal';
-import { uploadedImagesToCropperImgObj } from './utils';
-const ImageCropperContext = createContext(undefined);
-export function ImageCropperProvider({ children, uploadedImages, onCropperChange, modalOpen, onModalOpenChange }) {
-    const [aspectRatioWiseImages, setAspectRatioWiseImages] = useState({
-        landscape: null,
-        potrait: null,
-        icon: null
-    });
-    const [originalImage, setOriginalImage] = useState({
-        image: null,
-        name: "",
-        description: "",
-    });
-    useEffect(() => {
-        async function updateCropperImages() {
-            if (!uploadedImages)
-                return; // Prevent unnecessary processing
-            try {
-                const res = await uploadedImagesToCropperImgObj(uploadedImages);
-                if (res) {
-                    // Check if state is different before updating
-                    setOriginalImage((prev) => JSON.stringify(prev) === JSON.stringify(res.originalImage) ? prev : res.originalImage);
-                    setAspectRatioWiseImages((prev) => JSON.stringify(prev) === JSON.stringify(res.aspectRatioWiseImages) ? prev : res.aspectRatioWiseImages);
-                }
-            }
-            catch (error) {
-                console.error("Error processing uploaded images:", error);
-            }
-        }
-        updateCropperImages();
-    }, [uploadedImages]); // Runs only when `uploadedImages` changes
-    return (_jsxs(ImageCropperContext.Provider, { value: {
-            originalImage,
-            setOriginalImage,
-            aspectRatioWiseImages,
-            setAspectRatioWiseImages
-        }, children: [children, modalOpen && onModalOpenChange && _jsx(CropperFormWithModal, { open: modalOpen, onOpenChange: onModalOpenChange, onCropperChange: onCropperChange })] }));
-}
-export const useImageCropper = () => {
-    const context = useContext(ImageCropperContext);
-    if (!context) {
-        throw new Error("useImageCropper must be used within a ImageCropperProvider");
-    }
-    return context;
-};

package/dist/ikoncomponents/image-cropper-upload/utils/index.d.ts

@@ -1,17 +0,0 @@
-import { AspectRatioWiseImagesProps, OriginalImageProps } from "..";
-import { FileinfoProps } from "../../../utils/api/file-upload/type";
-export interface CropperUploadImagesInfoProps {
-    originalImageInfo?: FileinfoProps | null;
-    imageName?: string;
-    imageDescription?: string;
-    landscapeImageInfo?: FileinfoProps | null;
-    portaitImageInfo?: FileinfoProps | null;
-    iconImageInfo?: FileinfoProps | null;
-}
-export interface UploadedImagesToCropperImgObjProps {
-    originalImage: OriginalImageProps;
-    aspectRatioWiseImages: AspectRatioWiseImagesProps;
-}
-export declare function imageCropperFilesUpload(originalImage: OriginalImageProps, aspectRatioWiseImages?: AspectRatioWiseImagesProps, resourceId?: string): Promise<CropperUploadImagesInfoProps | null>;
-export declare function uploadedImagesToCropperImgObj(uploadedImages: CropperUploadImagesInfoProps | null): Promise<UploadedImagesToCropperImgObjProps | null>;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/image-cropper-upload/utils/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ikoncomponents/image-cropper-upload/utils/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,0BAA0B,EAAE,kBAAkB,EAAE,MAAM,IAAI,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAGpE,MAAM,WAAW,4BAA4B;IAC3C,iBAAiB,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAC1C,gBAAgB,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;CACtC;AACD,MAAM,WAAW,kCAAkC;IACjD,aAAa,EAAE,kBAAkB,CAAC;IAClC,qBAAqB,EAAE,0BAA0B,CAAC;CACnD;AACD,wBAAsB,uBAAuB,CAC3C,aAAa,EAAE,kBAAkB,EACjC,qBAAqB,CAAC,EAAE,0BAA0B,EAClD,UAAU,CAAC,EAAE,MAAM,GAClB,OAAO,CAAC,4BAA4B,GAAG,IAAI,CAAC,CAwD9C;AAED,wBAAsB,6BAA6B,CACjD,cAAc,EAAE,4BAA4B,GAAG,IAAI,GAClD,OAAO,CAAC,kCAAkC,GAAG,IAAI,CAAC,CAgCpD"}

package/dist/ikoncomponents/image-cropper-upload/utils/index.js

@@ -1,73 +0,0 @@
-import { base64FileUpload, singleFileUpload, } from "../../../utils/api/file-upload";
-import { getResourceUrl } from "../../../utils/actions/common/utils";
-export async function imageCropperFilesUpload(originalImage, aspectRatioWiseImages, resourceId) {
-    if (!originalImage.image) {
-        return null;
-    }
-    const originalImageInfo = await singleFileUpload(originalImage.image, resourceId);
-    const cropperUploadImagesInfo = {
-        originalImageInfo: originalImageInfo,
-        imageName: originalImage.name,
-        imageDescription: originalImage.description,
-        landscapeImageInfo: null,
-        portaitImageInfo: null,
-        iconImageInfo: null,
-    };
-    if (aspectRatioWiseImages) {
-        if (aspectRatioWiseImages.landscape) {
-            try {
-                cropperUploadImagesInfo["landscapeImageInfo"] = await base64FileUpload(aspectRatioWiseImages.landscape, originalImage.name + "_L.webp", "image/webp");
-            }
-            catch (error) {
-                console.error(error);
-            }
-        }
-        if (aspectRatioWiseImages.potrait) {
-            try {
-                cropperUploadImagesInfo["portaitImageInfo"] = await base64FileUpload(aspectRatioWiseImages.potrait, originalImage.name + "_P.webp", "image/webp");
-            }
-            catch (error) {
-                console.error(error);
-            }
-        }
-        if (aspectRatioWiseImages.icon) {
-            try {
-                cropperUploadImagesInfo["iconImageInfo"] = await base64FileUpload(aspectRatioWiseImages.icon, originalImage.name + "_I.webp", "image/webp");
-            }
-            catch (error) {
-                console.error(error);
-            }
-        }
-    }
-    return cropperUploadImagesInfo;
-}
-export async function uploadedImagesToCropperImgObj(uploadedImages) {
-    if (!uploadedImages) {
-        return null;
-    }
-    const originalImageUrl = uploadedImages.originalImageInfo
-        ? await getResourceUrl(uploadedImages.originalImageInfo)
-        : null;
-    const landscapeImageUrl = uploadedImages.landscapeImageInfo
-        ? await getResourceUrl(uploadedImages.landscapeImageInfo)
-        : null;
-    const portaitImageUrl = uploadedImages.portaitImageInfo
-        ? await getResourceUrl(uploadedImages.portaitImageInfo)
-        : null;
-    const iconImageUrl = uploadedImages.iconImageInfo
-        ? await getResourceUrl(uploadedImages.iconImageInfo)
-        : null;
-    const obj = {
-        originalImage: {
-            image: originalImageUrl,
-            name: uploadedImages.imageName,
-            description: uploadedImages.imageDescription,
-        },
-        aspectRatioWiseImages: {
-            landscape: landscapeImageUrl,
-            potrait: portaitImageUrl,
-            icon: iconImageUrl,
-        },
-    };
-    return obj;
-}

package/dist/ikoncomponents/loading-spinner/index.d.ts

@@ -1,10 +0,0 @@
-import * as React from "react";
-export interface ISVGProps extends React.SVGProps<SVGSVGElement> {
-    size?: number;
-    className?: string;
-}
-export interface LoadingSpinnerProps extends ISVGProps {
-    visible?: boolean;
-}
-export declare const LoadingSpinner: ({ size, className, visible, ...props }: LoadingSpinnerProps) => import("react/jsx-runtime").JSX.Element | null;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/loading-spinner/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/loading-spinner/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,cAAc,GAAI,wCAK5B,mBAAmB,mDAwBrB,CAAC"}

package/dist/ikoncomponents/loading-spinner/index.js

@@ -1,19 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "../../utils/cn";
-export const LoadingSpinner = (_a) => {
-    var { size = 48, className, visible = true } = _a, props = __rest(_a, ["size", "className", "visible"]);
-    if (!visible)
-        return null;
-    return (_jsx("div", { className: "h-full w-full", children: _jsx("div", { className: "absolute inset-0 flex justify-center items-center z-50", children: _jsx("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: size, height: size }, props, { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: cn("animate-spin", className), children: _jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) })) }) }));
-};

package/dist/ikoncomponents/main-layout/RefreshContext.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-interface RefreshContextType {
-    refresh: () => void;
-    refreshCounter: number;
-}
-export declare function RefreshProvider({ children }: {
-    children: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function useRefresh(): RefreshContextType;
-export {};
-//# sourceMappingURL=RefreshContext.d.ts.map

package/dist/ikoncomponents/main-layout/RefreshContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RefreshContext.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/RefreshContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAEhF,UAAU,kBAAkB;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;CACxB;AAID,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAY1E;AAED,wBAAgB,UAAU,uBAMzB"}

package/dist/ikoncomponents/main-layout/RefreshContext.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState, useCallback } from 'react';
-const RefreshContext = createContext(undefined);
-export function RefreshProvider({ children }) {
-    const [refreshCounter, setRefreshCounter] = useState(0);
-    const refresh = useCallback(() => {
-        setRefreshCounter((prev) => prev + 1);
-    }, []);
-    return (_jsx(RefreshContext.Provider, { value: { refresh, refreshCounter }, children: children }));
-}
-export function useRefresh() {
-    const context = useContext(RefreshContext);
-    if (context === undefined) {
-        throw new Error('useRefresh must be used within a RefreshProvider');
-    }
-    return context;
-}

package/dist/ikoncomponents/main-layout/SidebarNavContext.d.ts

@@ -1,34 +0,0 @@
-import { ReactNode } from 'react';
-import { LucideIcon } from 'lucide-react';
-export interface SidebarNavSubItem {
-    title: string;
-    url: string;
-    isActive?: boolean;
-}
-export interface SidebarNavItem {
-    title: string;
-    url: string;
-    icon?: LucideIcon;
-    isActive?: boolean;
-    default?: boolean;
-    items?: SidebarNavSubItem[];
-    header?: ReactNode;
-    footer?: ReactNode;
-}
-export interface SidebarNavContextType {
-    navItems: SidebarNavItem[];
-    header: ReactNode | null;
-    footer: ReactNode | null;
-    setNavItems: (items: SidebarNavItem[]) => void;
-    addNavItem: (item: SidebarNavItem) => void;
-    removeNavItem: (title: string) => void;
-    updateNavItem: (title: string, updates: Partial<SidebarNavItem>) => void;
-    clearNavItems: () => void;
-    setSidebarHeader: (header: ReactNode) => void;
-    setSidebarFooter: (footer: ReactNode) => void;
-}
-export declare function SidebarNavProvider({ children }: {
-    children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function useSidebarNav(): SidebarNavContextType;
-//# sourceMappingURL=SidebarNavContext.d.ts.map

package/dist/ikoncomponents/main-layout/SidebarNavContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidebarNavContext.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/SidebarNavContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuC,SAAS,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,WAAW,iBAAiB;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,cAAc;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC5B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,qBAAqB;IAClC,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,MAAM,EAAE,SAAS,GAAG,IAAI,CAAC;IACzB,MAAM,EAAE,SAAS,GAAG,IAAI,CAAC;IACzB,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC3C,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACzE,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,gBAAgB,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAC;IAC9C,gBAAgB,EAAE,CAAC,MAAM,EAAE,SAAS,KAAK,IAAI,CAAC;CACjD;AAID,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CA0DvE;AAED,wBAAgB,aAAa,0BAM5B"}

package/dist/ikoncomponents/main-layout/SidebarNavContext.js

@@ -1,52 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState } from 'react';
-const SidebarNavContext = createContext(undefined);
-export function SidebarNavProvider({ children }) {
-    const [navItems, setNavItems] = useState([]);
-    const [header, setHeader] = useState(null);
-    const [footer, setFooter] = useState(null);
-    const addNavItem = (item) => {
-        setNavItems((prevItems) => {
-            const exists = prevItems.some((navItem) => navItem.title === item.title);
-            if (exists) {
-                return prevItems.map((navItem) => navItem.title === item.title ? Object.assign(Object.assign({}, navItem), item) : navItem);
-            }
-            return [...prevItems, item];
-        });
-    };
-    const removeNavItem = (title) => {
-        setNavItems((prevItems) => prevItems.filter((item) => item.title !== title));
-    };
-    const updateNavItem = (title, updates) => {
-        setNavItems((prevItems) => prevItems.map((item) => item.title === title ? Object.assign(Object.assign({}, item), updates) : item));
-    };
-    const setSidebarHeader = (header) => {
-        setHeader(header);
-    };
-    const setSidebarFooter = (footer) => {
-        setFooter(footer);
-    };
-    const clearNavItems = () => {
-        setNavItems([]);
-    };
-    return (_jsx(SidebarNavContext.Provider, { value: {
-            navItems,
-            header,
-            footer,
-            setNavItems,
-            addNavItem,
-            removeNavItem,
-            updateNavItem,
-            clearNavItems,
-            setSidebarHeader,
-            setSidebarFooter,
-        }, children: children }));
-}
-export function useSidebarNav() {
-    const context = useContext(SidebarNavContext);
-    if (!context) {
-        throw new Error('useSidebarNav must be used within a SidebarNavProvider');
-    }
-    return context;
-}

package/dist/ikoncomponents/main-layout/app-sidebar.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { Sidebar } from "../../shadcn/sidebar";
-export declare function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>): import("react/jsx-runtime").JSX.Element | null;
-//# sourceMappingURL=app-sidebar.d.ts.map

package/dist/ikoncomponents/main-layout/app-sidebar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"app-sidebar.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/app-sidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,OAAO,EAKR,MAAM,sBAAsB,CAAC;AAI9B,wBAAgB,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,kDAsB5E"}

package/dist/ikoncomponents/main-layout/app-sidebar.js

@@ -1,24 +0,0 @@
-"use client";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarRail, } from "../../shadcn/sidebar";
-import { NavMain } from "./nav-main";
-import { useSidebarNav } from "./SidebarNavContext";
-export function AppSidebar(_a) {
-    var props = __rest(_a, []);
-    const { navItems, header, footer } = useSidebarNav();
-    if (!navItems || navItems.length === 0) {
-        return null;
-    }
-    return (_jsxs(Sidebar, Object.assign({ className: "ml-12", collapsible: "offcanvas" }, props, { children: [header && _jsx(SidebarHeader, { children: header }), _jsx(SidebarContent, { children: _jsx(NavMain, {}) }), footer && _jsx(SidebarFooter, { children: footer }), _jsx(SidebarRail, {})] })));
-}

package/dist/ikoncomponents/main-layout/footer.d.ts

@@ -1,2 +0,0 @@
-export declare function Footer(): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=footer.d.ts.map

package/dist/ikoncomponents/main-layout/footer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/footer.tsx"],"names":[],"mappings":"AAGA,wBAAgB,MAAM,4CAgBrB"}

package/dist/ikoncomponents/main-layout/footer.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Copyright } from "lucide-react";
-export function Footer() {
-    return (_jsx("footer", { className: "ml-12 flex border-t px-4 py-2 justify-center lg:justify-start", children: _jsxs("div", { className: "flex gap-2 items-center", children: [_jsx(Copyright, { className: "size-4" }), _jsx("span", { children: "Powered By" }), _jsx("a", { href: "https://keross.com", target: "_blank", children: "Keross" }), _jsx("span", { className: "", children: "|" }), _jsx("span", { id: "txtCopyrightYear", className: "", children: new Date().getFullYear() })] }) }));
-}

package/dist/ikoncomponents/main-layout/header.d.ts

@@ -1,4 +0,0 @@
-export declare function Header({ platformUrl }: {
-    platformUrl: string;
-}): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=header.d.ts.map

package/dist/ikoncomponents/main-layout/header.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/header.tsx"],"names":[],"mappings":"AAYA,wBAAgB,MAAM,CAAC,EAAE,WAAW,EAAE,EAAE;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,2CAwC9D"}

package/dist/ikoncomponents/main-layout/header.js

@@ -1,15 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AppBreadcrumb } from "../app-breadcrumb";
-import { ThemeToggleBtn } from "../theme-toggle-btn";
-import { Separator } from "../../shadcn/separator";
-import { SidebarTrigger } from "../../shadcn/sidebar";
-import { Bell, Play } from "lucide-react";
-import { IconButtonWithTooltip, IconTextButton } from "../buttons";
-import { useSidebarNav } from "./SidebarNavContext";
-import Link from "next/link";
-export function Header({ platformUrl }) {
-    const { navItems } = useSidebarNav();
-    return (_jsx("header", { className: "ml-12 flex h-12 border-b shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12", children: _jsxs("div", { className: "flex items-center justify-between gap-2 px-4 w-full", children: [_jsxs("div", { className: "flex items-center gap-2", children: [(!navItems || navItems.length === 0) ? _jsx("div", {}) : _jsx(SidebarTrigger, { className: "-ml-1" }), (!navItems || navItems.length === 0) ?
-                            _jsx("div", {}) :
-                            _jsx(Separator, { orientation: "vertical", className: "mr-2 data-[orientation=vertical]:h-4" }), _jsx(AppBreadcrumb, {})] }), _jsxs("div", { className: "ml-auto flex gap-4", children: [_jsx(IconButtonWithTooltip, { className: "px-2!", tooltipContent: "Notifications", children: _jsx(Bell, {}) }), _jsx(ThemeToggleBtn, {}), _jsx(Link, { href: `${platformUrl}/app-store`, children: _jsxs(IconTextButton, { variant: "default", children: [_jsx(Play, {}), "App Store"] }) })] })] }) }));
-}

package/dist/ikoncomponents/main-layout/index.d.ts

@@ -1,7 +0,0 @@
-import { ReactNode } from 'react';
-export declare function MainLayout({ children, baseUrl, platformUrl }: {
-    children: ReactNode;
-    baseUrl: string;
-    platformUrl: string;
-}): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/ikoncomponents/main-layout/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ikoncomponents/main-layout/index.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAUxC,wBAAgB,UAAU,CAAC,EACvB,QAAQ,EACR,OAAO,EACP,WAAW,EACd,EAAE;IACC,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACvB,2CAwBA"}

package/dist/ikoncomponents/main-layout/index.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { MainSidebar } from './main-sidebar';
-import { SidebarInset, SidebarProvider } from '../../shadcn/sidebar';
-import { DialogProvider } from '../alert-dialog/dialog-context';
-import { AppSidebar } from './app-sidebar';
-import { Header } from './header';
-import { Footer } from './footer';
-import { SidebarNavProvider } from './SidebarNavContext';
-import { RefreshProvider } from './RefreshContext';
-export function MainLayout({ children, baseUrl, platformUrl }) {
-    return (_jsx(_Fragment, { children: _jsxs(RefreshProvider, { children: [_jsx(MainSidebar, { baseUrl: baseUrl, platformUrl: platformUrl }), _jsx(SidebarProvider, { children: _jsx(DialogProvider, { children: _jsxs(SidebarNavProvider, { children: [_jsx(AppSidebar, {}), _jsxs(SidebarInset, { className: "flex flex-col h-screen", children: [_jsx(Header, { platformUrl: platformUrl }), _jsx("div", { className: "flex flex-col gap-4 p-4 pt-0 ml-12 grow overflow-auto scrollbar-hidden", children: children }), _jsx(Footer, {})] })] }) }) })] }) }));
-}