ikoncomponents 1.1.7 → 1.1.9

package/dist/ikoncomponents/alert-dialog/dialog-context.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from "react";
+interface DialogContextProps {
+    openDialog: (options: DialogOptions) => void;
+    closeDialog: () => void;
+}
+interface DialogOptions {
+    title: string;
+    description: string;
+    onConfirm?: () => void;
+    onCancel?: () => void;
+    onThird?: () => void;
+    confirmText?: string;
+    cancelText?: string;
+    thirdOptionText?: string;
+    fontSize?: string;
+}
+export declare const useDialog: () => DialogContextProps;
+export declare const DialogProvider: React.FC<{
+    children: ReactNode;
+}>;
+export {};

package/dist/ikoncomponents/alert-dialog/dialog-context.js

@@ -0,0 +1,30 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState } from "react";
+import { CustomAlertDialog } from "../alert-dialog";
+const DialogContext = createContext(undefined);
+export const useDialog = () => {
+    const context = useContext(DialogContext);
+    if (!context) {
+        throw new Error("useDialog must be used within a DialogProvider");
+    }
+    return context;
+};
+export const DialogProvider = ({ children }) => {
+    const [dialogOptions, setDialogOptions] = useState(null);
+    const openDialog = (options) => setDialogOptions(options);
+    const closeDialog = () => setDialogOptions(null);
+    return (_jsxs(DialogContext.Provider, { value: { openDialog, closeDialog }, children: [children, dialogOptions && (_jsx(CustomAlertDialog, { title: dialogOptions.title, description: dialogOptions.description, fontSize: dialogOptions.fontSize || "text-base", cancelText: dialogOptions.cancelText || "", confirmText: dialogOptions.confirmText || "", thirdOptionText: dialogOptions.thirdOptionText || "", onConfirm: () => {
+                    if (dialogOptions.onConfirm)
+                        dialogOptions.onConfirm();
+                    closeDialog();
+                }, onCancel: () => {
+                    if (dialogOptions.onCancel)
+                        dialogOptions.onCancel();
+                    closeDialog();
+                }, onThird: () => {
+                    if (dialogOptions.onThird)
+                        dialogOptions.onThird();
+                    closeDialog();
+                } }))] }));
+};

package/dist/ikoncomponents/app-breadcrumb/BreadcrumbProvider.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+export interface BreadcrumbItemProps {
+    title: string;
+    href?: string;
+    level: number;
+}
+interface BreadcrumbContextType {
+    breadcrumbItems: BreadcrumbItemProps[];
+    addBreadcrumb: (item: BreadcrumbItemProps) => void;
+    backBreadcrumb: (item: BreadcrumbItemProps) => void;
+}
+export declare function BreadcrumbProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useBreadcrumb(): BreadcrumbContextType;
+export {};

package/dist/ikoncomponents/app-breadcrumb/BreadcrumbProvider.js

@@ -0,0 +1,32 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useState } from 'react';
+// Create the context with a default value
+const BreadcrumbContext = createContext(undefined);
+// Create a provider component
+export function BreadcrumbProvider({ children }) {
+    const [breadcrumbItems, setBreadcrumbItems] = useState([]);
+    // Function to add a breadcrumb item
+    const addBreadcrumb = (item) => {
+        setBreadcrumbItems((prevItems) => {
+            const filterState = prevItems.filter((e) => e.level < item.level);
+            return [...filterState, item];
+        });
+    };
+    // Function to go back in the breadcrumb
+    const backBreadcrumb = (item) => {
+        setBreadcrumbItems((prevItems) => {
+            const filterState = prevItems.filter((e) => e.level <= item.level);
+            return [...filterState];
+        });
+    };
+    return (_jsx(BreadcrumbContext.Provider, { value: { breadcrumbItems, addBreadcrumb, backBreadcrumb }, children: children }));
+}
+// Custom hook to use the BreadcrumbContext
+export function useBreadcrumb() {
+    const context = useContext(BreadcrumbContext);
+    if (!context) {
+        throw new Error('useBreadcrumb must be used within a BreadcrumbProvider');
+    }
+    return context;
+}

package/dist/ikoncomponents/app-breadcrumb/index.d.ts

@@ -0,0 +1,5 @@
+import { BreadcrumbItemProps } from "./BreadcrumbProvider";
+export declare function AppBreadcrumb(): import("react/jsx-runtime").JSX.Element | null;
+export declare function RenderAppBreadcrumb({ breadcrumb, }: {
+    breadcrumb: BreadcrumbItemProps;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/app-breadcrumb/index.js

@@ -0,0 +1,57 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import Link from "next/link";
+import { Fragment, useEffect, useMemo, useState } from "react";
+import { redirect } from "next/navigation";
+import { useBreadcrumb } from "./BreadcrumbProvider";
+import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "../../shadcn/breadcrumb";
+import { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, } from "../../shadcn/drawer";
+import { Button } from "../../shadcn/button";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "../../shadcn/dropdown-menu";
+import { useIsMobile } from "../../hooks/use-mobile";
+export function AppBreadcrumb() {
+    const { breadcrumbItems, backBreadcrumb } = useBreadcrumb();
+    const [open, setOpen] = useState(false);
+    const [itemToDisplay, setItemToDisplay] = useState(2);
+    const isMobile = useIsMobile();
+    useEffect(() => {
+        if (isMobile) {
+            setItemToDisplay(2);
+        }
+        else {
+            setItemToDisplay(4);
+        }
+    }, [isMobile]);
+    const breadcrumbObj = useMemo(() => {
+        return {
+            firstVisibleBreadcrumbList: breadcrumbItems.slice(0, 2),
+            hiddenBreadcrumbList: isMobile
+                ? breadcrumbItems.slice(2)
+                : breadcrumbItems.slice(2, itemToDisplay),
+            lastVisibleBreadcrumbList: breadcrumbItems.length > 2
+                ? breadcrumbItems.slice(2 -
+                    (breadcrumbItems.length < itemToDisplay
+                        ? breadcrumbItems.length
+                        : itemToDisplay))
+                : [],
+        };
+    }, [breadcrumbItems, itemToDisplay, isMobile]);
+    if (!breadcrumbObj || isMobile == undefined || itemToDisplay == null) {
+        return null;
+    }
+    return (_jsx(Breadcrumb, { children: _jsxs(BreadcrumbList, { children: [breadcrumbObj.firstVisibleBreadcrumbList.map((item, index) => index < breadcrumbItems.length - 1 ? (_jsxs(Fragment, { children: [_jsx(BreadcrumbItem, { children: !item.href ? (_jsx(BreadcrumbPage, { className: "max-w-20 truncate md:max-w-none", children: item.title })) : (_jsx(BreadcrumbLink, { className: "max-w-20 truncate md:max-w-none cursor-pointer", onClick: () => {
+                                    backBreadcrumb(item);
+                                    redirect(item.href);
+                                }, children: item.title })) }), _jsx(BreadcrumbSeparator, {}, "firstsep" + index)] }, "first" + index)) : (_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { className: "max-w-20 truncate md:max-w-none", children: item.title }) }, "first" + index))), breadcrumbItems.length > itemToDisplay ? (_jsxs(_Fragment, { children: [_jsx(BreadcrumbItem, { children: !isMobile ? (_jsxs(DropdownMenu, { open: open, onOpenChange: setOpen, children: [_jsx(DropdownMenuTrigger, { className: "flex items-center gap-1", "aria-label": "Toggle menu", children: _jsx(BreadcrumbEllipsis, { className: "h-4 w-4" }) }), _jsx(DropdownMenuContent, { align: "start", children: breadcrumbObj.hiddenBreadcrumbList.map((item, index) => (_jsx(DropdownMenuItem, { children: !item.href ? (_jsx("span", { children: item.title })) : (_jsx(Link, { href: item.href ? item.href : "#", children: item.title })) }, index))) })] })) : (_jsxs(Drawer, { open: open, onOpenChange: setOpen, children: [_jsx(DrawerTrigger, { "aria-label": "Toggle Menu", children: _jsx(BreadcrumbEllipsis, { className: "h-4 w-4" }) }), _jsxs(DrawerContent, { children: [_jsxs(DrawerHeader, { className: "text-left", children: [_jsx(DrawerTitle, { children: "Navigate to" }), _jsx(DrawerDescription, { children: "Select a page to navigate to." })] }), _jsx("div", { className: "grid gap-1 px-2 lg:px-4", children: breadcrumbObj.hiddenBreadcrumbList.map((item, index) => (_jsx("div", { children: item.clickable == false ? (_jsx("span", { className: "py-1 text-sm", children: item.title })) : (_jsx(Link, { href: item.href ? item.href : "#", className: "py-1 text-sm", children: item.title })) }, index))) }), _jsx(DrawerFooter, { className: "pt-4", children: _jsx(DrawerClose, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Close" }) }) })] })] })) }), !isMobile && _jsx(BreadcrumbSeparator, {})] })) : null, !isMobile &&
+                    breadcrumbObj.lastVisibleBreadcrumbList.map((item, index) => index == breadcrumbObj.lastVisibleBreadcrumbList.length - 1 ? (_jsx(BreadcrumbItem, { children: _jsx(BreadcrumbPage, { className: "max-w-20 truncate md:max-w-none cursor-pointer", children: item.title }) }, "last" + index)) : (_jsxs(Fragment, { children: [_jsx(BreadcrumbItem, { children: !item.href ? (_jsx(BreadcrumbPage, { className: "max-w-20 truncate md:max-w-none", children: item.title })) : (_jsx(BreadcrumbLink, { className: "max-w-20 truncate md:max-w-none cursor-pointer", onClick: () => {
+                                        backBreadcrumb(item);
+                                        redirect(item.href);
+                                    }, children: item.title })) }), _jsx(BreadcrumbSeparator, {}, "lastsep" + index)] }, "last" + index)))] }, "BreadcrumbList1") }, "Breadcrumb1"));
+}
+export function RenderAppBreadcrumb({ breadcrumb, }) {
+    const { addBreadcrumb } = useBreadcrumb();
+    useEffect(() => {
+        addBreadcrumb(breadcrumb);
+    }, [breadcrumb]);
+    return _jsx(_Fragment, {});
+}

package/dist/ikoncomponents/form-fields/combobox-input/index.d.ts

@@ -0,0 +1,2 @@
+import { FormComboboxInputProps } from "../types";
+export declare function FormComboboxInput({ formControl, name, label, placeholder, formDescription, items, disabled, onSelect, }: FormComboboxInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/form-fields/combobox-input/index.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, } from "../../../shadcn/form";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../shadcn/popover";
+import { Button } from "../../../shadcn/button";
+import { cn } from "../../../utils/cn";
+import { Check, ChevronsUpDown } from "lucide-react";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from "../../../shadcn/command";
+export function FormComboboxInput({ formControl, name, label, placeholder, formDescription, items, disabled, onSelect, }) {
+    return (_jsx(_Fragment, { children: _jsx(FormField, { control: formControl, name: name, render: ({ field }) => {
+                var _a;
+                return (_jsxs(FormItem, { className: "", children: [label && (_jsx(_Fragment, { children: _jsx(FormLabel, { children: label }) })), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, className: "w-full", children: _jsx(FormControl, { children: _jsxs(Button, { variant: "outline", role: "combobox", className: cn("justify-between", !field.value && "text-muted-foreground"), disabled: disabled == true ||
+                                                (disabled && disabled(...arguments)), children: [field.value
+                                                    ? ((_a = items.find((item) => item.value === field.value)) === null || _a === void 0 ? void 0 : _a.label) || field.value
+                                                    : placeholder, _jsx(ChevronsUpDown, { className: "opacity-50" })] }) }) }), _jsx(PopoverContent, { className: "p-0", align: "start", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: "Search..." }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No items found." }), _jsx(CommandGroup, { children: items.map((item) => (_jsxs(CommandItem, { value: item.value, disabled: (item.disabled == true || (item.disabled && item.disabled(item))), onSelect: (value) => {
+                                                                field.onChange(value);
+                                                                onSelect && onSelect(value);
+                                                            }, children: [(item === null || item === void 0 ? void 0 : item.label) || item.value, _jsx(Check, { className: cn("ml-auto", item.value === field.value
+                                                                        ? "opacity-100"
+                                                                        : "opacity-0") })] }, item.value))) })] })] }) })] }), formDescription && (_jsx(FormDescription, { children: formDescription })), _jsx(FormMessage, {})] }));
+            } }) }));
+}

package/dist/ikoncomponents/form-fields/combobox-input-value/index.d.ts

@@ -0,0 +1,18 @@
+import { Control } from "react-hook-form";
+export interface FormComboboxInputProps {
+    formControl: Control<any>;
+    name: string;
+    label?: string;
+    placeholder?: string;
+    formDescription?: string;
+    items: {
+        value: string;
+        label: string;
+        disabled?: boolean | ((item: any) => boolean);
+    }[];
+    disabled?: boolean | ((...args: any[]) => boolean);
+    onSelect?: (value: any) => void;
+    value?: string;
+    onChange?: (value: any) => void;
+}
+export declare function FormComboboxInputWithValue(props: FormComboboxInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/form-fields/combobox-input-value/index.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useController } from "react-hook-form";
+import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, } from "../../../shadcn/form";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../shadcn/popover";
+import { Button } from "../../../shadcn/button";
+import { cn } from "../../../utils/cn";
+import { Check, ChevronsUpDown } from "lucide-react";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from "../../../shadcn/command";
+export function FormComboboxInputWithValue(props) {
+    const { field } = useController({ name: props.name, control: props.formControl });
+    // Use the external value if provided, otherwise use the field's value.
+    const currentValue = props.value !== undefined ? props.value : field.value;
+    return (_jsx(FormField, { control: props.formControl, name: props.name, render: ({ field }) => {
+            var _a;
+            return (_jsxs(FormItem, { className: "", children: [props.label && (_jsxs(_Fragment, { children: [_jsx(FormLabel, { children: props.label }), _jsx("br", {})] })), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, className: "w-full", children: _jsx(FormControl, { children: _jsxs(Button, { variant: "outline", role: "combobox", className: cn("justify-between", !currentValue && "text-muted-foreground"), disabled: typeof props.disabled === "function" ? props.disabled() : props.disabled, children: [currentValue
+                                                ? ((_a = props.items.find((item) => item.value === currentValue)) === null || _a === void 0 ? void 0 : _a.label) || currentValue
+                                                : props.placeholder, _jsx(ChevronsUpDown, { className: "opacity-50" })] }) }) }), _jsx(PopoverContent, { className: "p-0", align: "start", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: "Search..." }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No items found." }), _jsx(CommandGroup, { children: props.items.map((item) => (_jsxs(CommandItem, { value: item.value, disabled: typeof item.disabled === "function"
+                                                            ? item.disabled(item)
+                                                            : item.disabled, onSelect: (value) => {
+                                                            field.onChange(value);
+                                                            props.onSelect && props.onSelect(value);
+                                                            props.onChange && props.onChange(value);
+                                                        }, children: [(item === null || item === void 0 ? void 0 : item.label) || item.value, _jsx(Check, { className: cn("ml-auto", item.value === currentValue ? "opacity-100" : "opacity-0") })] }, item.value))) })] })] }) })] }), props.formDescription && (_jsx(FormDescription, { children: props.formDescription })), _jsx(FormMessage, {})] }));
+        } }));
+}

package/dist/ikoncomponents/form-fields/date-input/index.d.ts

@@ -0,0 +1,2 @@
+import { FormDateInputProps } from "../types";
+export declare function FormDateInput({ formControl, name, label, placeholder, dateFormat, calendarDateDisabled, formDescription, disabled, }: FormDateInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/form-fields/date-input/index.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, } from "../../../shadcn/form";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../shadcn/popover";
+import { Button } from "../../../shadcn/button";
+import { cn } from "../../../utils/cn";
+import { format } from "date-fns";
+import { CalendarIcon } from "lucide-react";
+import { Calendar } from "../../../shadcn/calendar";
+export function FormDateInput({ formControl, name, label, placeholder, dateFormat, calendarDateDisabled, formDescription, disabled, }) {
+    return (_jsx(_Fragment, { children: _jsx(FormField, { control: formControl, name: name, render: ({ field }) => (_jsxs(FormItem, { children: [label && (_jsxs(_Fragment, { children: [_jsx(FormLabel, { children: label }), _jsx("br", {})] })), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, className: "w-full", children: _jsx(FormControl, { children: _jsxs(Button, { variant: "outline", className: cn(!field.value && "text-foreground/50"), disabled: disabled, children: [field.value ? (format(field.value, dateFormat || "PPP")) : (_jsx("span", { children: placeholder || "Pick a date" })), _jsx(CalendarIcon, { className: "ml-auto h-4 w-4 opacity-50" })] }) }) }), _jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: _jsx(Calendar, { mode: "single", selected: field.value, onSelect: field.onChange, disabled: calendarDateDisabled, 
+                                    // disabled={(date) =>
+                                    //   date > new Date() || date < new Date("1900-01-01")
+                                    // }
+                                    initialFocus: true }) })] }), formDescription && (_jsx(FormDescription, { children: formDescription })), _jsx(FormMessage, {})] })) }) }));
+}

package/dist/ikoncomponents/form-fields/file-input/index.d.ts

@@ -0,0 +1 @@
+export declare function FormFileInput(): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/form-fields/file-input/index.js

@@ -0,0 +1,4 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+export function FormFileInput() {
+    return (_jsx(_Fragment, {}));
+}

package/dist/ikoncomponents/form-fields/input/index.d.ts

@@ -0,0 +1,2 @@
+import { FormInputProps } from '../types';
+export declare function FormInput({ formControl, label, formDescription, extraFormComponent, name, ...inputProps }: FormInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/form-fields/input/index.js

@@ -0,0 +1,18 @@
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from '../../../shadcn/form';
+import { Input } from '../../../shadcn/input';
+export function FormInput(_a) {
+    var { formControl, label, formDescription, extraFormComponent, name } = _a, inputProps = __rest(_a, ["formControl", "label", "formDescription", "extraFormComponent", "name"]);
+    return (_jsx(_Fragment, { children: _jsx(FormField, { control: formControl, name: name, render: ({ field }) => (_jsxs(FormItem, { children: [label && _jsx(FormLabel, { children: label }), _jsx(FormControl, { children: _jsx(Input, Object.assign({}, field, inputProps)) }), extraFormComponent && extraFormComponent(field.value), formDescription && _jsx(FormDescription, { children: formDescription }), _jsx(FormMessage, {})] })) }) }));
+}

package/dist/ikoncomponents/form-fields/multi-combobox-input/index.d.ts

@@ -0,0 +1,6 @@
+import { FormComboboxInputProps as BaseFormComboboxInputProps } from "../../form-fields/types";
+interface FormComboboxInputProps extends BaseFormComboboxInputProps {
+    defaultOptions?: number;
+}
+export declare function dFormMultiComboboxInput({ formControl, name, label, placeholder, formDescription, items, disabled, onSelect, defaultValue, defaultOptions, }: FormComboboxInputProps): import("react/jsx-runtime").JSX.Element;
+export {};