@skalfa/skalfa-component 1.0.2 → 1.0.3

package/dist/accordion/Accordion.component.d.ts

@@ -10,4 +10,4 @@ export interface AccordionProps {
 }
 export declare function AccordionComponent({ items, setActive, horizontal, 
 /** Use custom class with: "container::", "head::", "active::". */
-className, }: AccordionProps): import("react").JSX.Element;
+className, }: AccordionProps): import("@types/react").JSX.Element;

package/dist/breadcrumb/Breadcrumb.component.d.ts

@@ -11,4 +11,4 @@ export interface BreadcrumbProps {
     /** Use custom class with: "container::", "active::". */
     className?: string;
 }
-export declare function BreadcrumbComponent({ items, className, square, separatorContent, }: BreadcrumbProps): import("react").JSX.Element;
+export declare function BreadcrumbComponent({ items, className, square, separatorContent, }: BreadcrumbProps): import("@types/react").JSX.Element;

package/dist/button/Button.component.d.ts

@@ -18,4 +18,4 @@ export interface ButtonProps {
     /** Use custom class with: "icon::", "loading::". */
     className?: string;
 }
-export declare function ButtonComponent({ type, label, variant, paint, rounded, block, disabled, size, onClick, href, icon, loading, tips, title, className, }: ButtonProps): import("react").JSX.Element;
+export declare function ButtonComponent({ type, label, variant, paint, rounded, block, disabled, size, onClick, href, icon, loading, tips, title, className, }: ButtonProps): import("@types/react").JSX.Element;

package/dist/card/AlertCard.component.d.ts

@@ -8,4 +8,4 @@ export interface AlertCardProps {
     /** Use custom class with: "badge::", "title::". */
     className?: string;
 }
-export declare function AlertCardComponent({ title, leftContent, badge, content, footer, className, }: AlertCardProps): import("react").JSX.Element;
+export declare function AlertCardComponent({ title, leftContent, badge, content, footer, className, }: AlertCardProps): import("@types/react").JSX.Element;

package/dist/card/Card.component.d.ts

@@ -2,4 +2,4 @@ export interface CardProps {
     children: React.ReactNode;
     className?: string;
 }
-export declare function CardComponent({ children, className, }: CardProps): import("react").JSX.Element;
+export declare function CardComponent({ children, className, }: CardProps): import("@types/react").JSX.Element;

package/dist/card/DashboardCard.component.d.ts

@@ -6,4 +6,4 @@ export interface DashboardCardProps {
     path?: string;
     className?: string;
 }
-export declare function DashboardCardComponent({ content, title, rightContent, path, className, }: DashboardCardProps): import("react").JSX.Element;
+export declare function DashboardCardComponent({ content, title, rightContent, path, className, }: DashboardCardProps): import("@types/react").JSX.Element;

package/dist/card/GalleryCard.component.d.ts

@@ -4,4 +4,4 @@ export interface GalleryCardProps {
     /** Use custom class with: "label::", "image::". */
     className?: string;
 }
-export declare function GalleryCardComponent({ src, alt, className, }: GalleryCardProps): import("react").JSX.Element;
+export declare function GalleryCardComponent({ src, alt, className, }: GalleryCardProps): import("@types/react").JSX.Element;

package/dist/card/ProductCard.component.d.ts

@@ -6,4 +6,4 @@ export interface ProductCardProps {
     /** Use custom class with: "image::", "content::". */
     className?: string;
 }
-export declare function ProductCardComponent({ image, name, price, description, className, }: ProductCardProps): import("react").JSX.Element;
+export declare function ProductCardComponent({ image, name, price, description, className, }: ProductCardProps): import("@types/react").JSX.Element;

package/dist/card/ProfileCard.component.d.ts

@@ -7,4 +7,4 @@ export interface ProfileCardProps {
     /** Use custom class with: "image::", "content::". */
     className?: string;
 }
-export declare function ProfileCardComponent({ image, name, short, description, footer, className, }: ProfileCardProps): import("react").JSX.Element;
+export declare function ProfileCardComponent({ image, name, short, description, footer, className, }: ProfileCardProps): import("@types/react").JSX.Element;

package/dist/carousel/Carousel.component.d.ts

@@ -9,5 +9,5 @@ interface CarouselProps {
     /** Use custom class with: "item::", "prev-button::", "next-button::", "navigation::". */
     className?: string;
 }
-export declare function CarouselComponent({ items, className, noButton, noNavigation, }: CarouselProps): import("react").JSX.Element;
+export declare function CarouselComponent({ items, className, noButton, noNavigation, }: CarouselProps): import("@types/react").JSX.Element;
 export {};

package/dist/chip/Chip.component.d.ts

@@ -3,4 +3,4 @@ export declare function ChipComponent({ items, onClick, onDelete, className, }:
     onClick?: (item: any, index: number) => void;
     onDelete?: (item: any, index: number) => void;
     className?: string;
-}): import("react").JSX.Element;
+}): import("@types/react").JSX.Element;

package/dist/input/Checkbox.component.d.ts

@@ -10,4 +10,4 @@ export type CheckboxProps = {
     /** Use custom class with: "label::", "checked::", "error::". */
     className?: string;
 };
-export declare function CheckboxComponent({ name, label, value, disabled, checked, invalid, onChange, className, }: CheckboxProps): import("react").JSX.Element;
+export declare function CheckboxComponent({ name, label, value, disabled, checked, invalid, onChange, className, }: CheckboxProps): import("@types/react").JSX.Element;

package/dist/input/Input.component.d.ts

@@ -20,4 +20,4 @@ export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
     /** Use custom class with: "label::", "tip::", "error::", "icon::", "suggest::", "suggest-item::". */
     className?: string;
 }
-export declare function InputComponent({ label, tip, leftIcon, rightIcon, className, value, invalid, suggestions, validations, onlyAlphabet, uppercase, lowercase, multiple, register, unregister, onChange, ref, ...props }: InputProps): import("react").JSX.Element;
+export declare function InputComponent({ label, tip, leftIcon, rightIcon, className, value, invalid, suggestions, validations, onlyAlphabet, uppercase, lowercase, multiple, register, unregister, onChange, ref, ...props }: InputProps): import("@types/react").JSX.Element;

package/dist/input/InputCheckbox.component.d.ts

@@ -24,4 +24,4 @@ export interface InputCheckboxProps {
     /** Use custom class with: "label::", "checked::", "error::". */
     classNameCheckbox?: string;
 }
-export declare function InputCheckboxComponent({ name, label, tip, vertical, className, classNameCheckbox, value, disabled, invalid, options, serverOptionControl, customOptions, validations, register, unregister, onChange, }: InputCheckboxProps): import("react").JSX.Element;
+export declare function InputCheckboxComponent({ name, label, tip, vertical, className, classNameCheckbox, value, disabled, invalid, options, serverOptionControl, customOptions, validations, register, unregister, onChange, }: InputCheckboxProps): import("@types/react").JSX.Element;

package/dist/input/InputCurrency.component.d.ts

@@ -18,4 +18,4 @@ export interface InputCurrencyProps extends Omit<InputHTMLAttributes<HTMLInputEl
     /** Use custom class with: "label::", "tip::", "error::", "icon::". */
     className?: string;
 }
-export declare function InputCurrencyComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, format, register, unregister, onChange, className, ...props }: InputCurrencyProps): import("react").JSX.Element;
+export declare function InputCurrencyComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, format, register, unregister, onChange, className, ...props }: InputCurrencyProps): import("@types/react").JSX.Element;

package/dist/input/InputDate.component.d.ts

@@ -14,7 +14,7 @@ export interface InputDateProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     /** Use custom class with: "label::", "tip::", "error::", "icon::". */
     className?: string;
 }
-export declare function InputDateComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputDateProps): import("react").JSX.Element;
+export declare function InputDateComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputDateProps): import("@types/react").JSX.Element;
 export interface InputDatePickerProps {
     onChange?: (date: string) => void;
     minDate?: string;

package/dist/input/InputDate.component.js

@@ -75,10 +75,10 @@ const InputDatePickerComponent = ({ onChange, minDate, maxDate, rightElement, })
         while (day.isBefore(endDate) || day.isSame(endDate, "day")) {
             for (let i = 0; i < 7; i++) {
                 const cloneDay = (0, moment_1.default)(day);
-                days.push((0, jsx_runtime_1.jsx)("div", { className: `w-8 aspect-square flex items-center justify-center text-center rounded-lg transition-all 
-              ${day.isSame(currentDate, "month") ? "text-foreground" : "text-light-foreground"} 
-              ${day.isSame(selectedDate, "day") ? "bg-primary text-background" : "hover:bg-light-primary"}
-              ${day.isSame((0, moment_1.default)(), "day") ? "border !border-primary" : "hover:bg-light-primary"} 
+                days.push((0, jsx_runtime_1.jsx)("div", { className: `w-8 aspect-square flex items-center justify-center text-center rounded-lg transition-all 
+              ${day.isSame(currentDate, "month") ? "text-foreground" : "text-light-foreground"} 
+              ${day.isSame(selectedDate, "day") ? "bg-primary text-background" : "hover:bg-light-primary"}
+              ${day.isSame((0, moment_1.default)(), "day") ? "border !border-primary" : "hover:bg-light-primary"} 
               ${(minDate && day.isBefore((0, moment_1.default)(minDate))) || (maxDate && day.isAfter((0, moment_1.default)(maxDate))) ? "opacity-10 cursor-not-allowed" : "cursor-pointer"}`, onClick: () => handleDateClick(cloneDay), children: day.format("D") }, day.toString()));
                 day.add(1, "day");
             }

package/dist/input/InputDatetime.component.d.ts

@@ -14,4 +14,4 @@ export interface InputDateTimeProps extends Omit<InputHTMLAttributes<HTMLInputEl
     /** Use custom class with: "label::", "tip::", "error::", "icon::", "suggest::", "suggest-item::". */
     className?: string;
 }
-export declare function InputDatetimeComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputDateTimeProps): import("react").JSX.Element;
+export declare function InputDatetimeComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputDateTimeProps): import("@types/react").JSX.Element;

package/dist/input/InputDocument.component.d.ts

@@ -14,7 +14,7 @@ export interface InputDocumentProps extends Omit<InputHTMLAttributes<HTMLInputEl
     /** Use custom class with: "label::", "tip::", "error::", "icon::", "suggest::", "suggest-item::". */
     className?: string;
 }
-export declare function InputDocumentComponent({ label, tip, leftIcon, rightIcon, className, value, invalid, validations, register, unregister, onChange, ...props }: InputDocumentProps): import("react").JSX.Element;
+export declare function InputDocumentComponent({ label, tip, leftIcon, rightIcon, className, value, invalid, validations, register, unregister, onChange, ...props }: InputDocumentProps): import("@types/react").JSX.Element;
 export interface InputDocumentPickerProps {
     value?: any[];
     onChange?: (value: any[]) => void;

package/dist/input/InputMap.component.d.ts

@@ -17,7 +17,7 @@ export interface InputMapProps extends Omit<React.InputHTMLAttributes<HTMLInputE
     unregister?: (name: string) => void;
     className?: string;
 }
-export declare function InputMapComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputMapProps): import("react").JSX.Element;
+export declare function InputMapComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputMapProps): import("@types/react").JSX.Element;
 export interface MapPickerProps {
     value?: any;
     onChange?: (value: any) => any;

package/dist/input/InputNumber.component.d.ts

@@ -16,4 +16,4 @@ export interface InputNumberProps extends Omit<InputHTMLAttributes<HTMLInputElem
     /** Use custom class with: "label::", "tip::", "error::", "icon::", "suggest::", "suggest-item::". */
     className?: string;
 }
-export declare function InputNumberComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, min, max, onChange, register, unregister, className, ...props }: InputNumberProps): import("react").JSX.Element;
+export declare function InputNumberComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, min, max, onChange, register, unregister, className, ...props }: InputNumberProps): import("@types/react").JSX.Element;

package/dist/input/InputPassword.component.d.ts

@@ -14,4 +14,4 @@ export interface InputPasswordProps extends Omit<InputHTMLAttributes<HTMLInputEl
     /** Use custom class with: "label::", "tip::", "error::", "icon::". */
     className?: string;
 }
-export declare function InputPasswordComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputPasswordProps): import("react").JSX.Element;
+export declare function InputPasswordComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputPasswordProps): import("@types/react").JSX.Element;

package/dist/input/InputRadio.component.d.ts

@@ -24,4 +24,4 @@ export type InputRadioProps = {
     /** Use custom class with: "label::", "checked::", "error::". */
     classNameCheckbox?: string;
 };
-export declare function InputRadioComponent({ name, label, tip, vertical, value, disabled, invalid, options, serverOptionControl, customOptions, validations, onChange, register, unregister, className, classNameCheckbox, }: InputRadioProps): import("react").JSX.Element;
+export declare function InputRadioComponent({ name, label, tip, vertical, value, disabled, invalid, options, serverOptionControl, customOptions, validations, onChange, register, unregister, className, classNameCheckbox, }: InputRadioProps): import("@types/react").JSX.Element;

package/dist/input/InputTime.component.d.ts

@@ -14,7 +14,7 @@ export interface InputTimeProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     /** Use custom class with: "label::", "tip::", "error::", "icon::". */
     className?: string;
 }
-export declare function InputTimeComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputTimeProps): import("react").JSX.Element;
+export declare function InputTimeComponent({ label, tip, leftIcon, rightIcon, value, invalid, validations, register, unregister, onChange, className, ...props }: InputTimeProps): import("@types/react").JSX.Element;
 interface InputTimePickerProps {
     onChange?: (time: string) => void;
     rightElement?: ReactNode;

package/dist/input/InputValues.component.d.ts

@@ -6,4 +6,4 @@ export declare function InputValues({ value, className, onDelete, isFocus, onFoc
     isFocus?: boolean;
     onFocus?: () => void;
     style?: CSSProperties;
-}): import("react").JSX.Element;
+}): import("@types/react").JSX.Element;

package/dist/input/Radio.component.d.ts

@@ -9,4 +9,4 @@ export interface RadioProps {
     /** Use custom class with: "label::", "checked::", "error::". */
     className?: string;
 }
-export declare function RadioComponent({ name, label, value, disabled, checked, invalid, onChange, className, }: RadioProps): import("react").JSX.Element;
+export declare function RadioComponent({ name, label, value, disabled, checked, invalid, onChange, className, }: RadioProps): import("@types/react").JSX.Element;

package/dist/input/Select.component.d.ts

@@ -44,4 +44,4 @@ export interface SelectProps {
     /** Use custom class with: "label::", "tip::", "error::", "icon::", "suggest::", "suggest-item::". */
     className?: string;
 }
-export declare function SelectComponent({ name, label, placeholder, tip, leftIcon, rightIcon, value, invalid, disabled, validations, multiple, autoFocus, clearable, options, searchable, serverOptionControl, idbOptionControl, serverSearchable, includedOptions, exceptOptions, tempOptions, newOption, maxShowOption, register, unregister, onChange, onFocus, onBlur, className, }: SelectProps): import("react").JSX.Element;
+export declare function SelectComponent({ name, label, placeholder, tip, leftIcon, rightIcon, value, invalid, disabled, validations, multiple, autoFocus, clearable, options, searchable, serverOptionControl, idbOptionControl, serverSearchable, includedOptions, exceptOptions, tempOptions, newOption, maxShowOption, register, unregister, onChange, onFocus, onBlur, className, }: SelectProps): import("@types/react").JSX.Element;

package/dist/modal/FloatingPage.component.d.ts

@@ -9,4 +9,4 @@ export interface FloatingPageProps {
     /** Use custom class with: "backdrop::", "header::", "footer::". */
     className?: string;
 }
-export declare function FloatingPageComponent({ show, onClose, title, children, tip, footer, className, }: FloatingPageProps): import("react").JSX.Element;
+export declare function FloatingPageComponent({ show, onClose, title, children, tip, footer, className, }: FloatingPageProps): import("@types/react").JSX.Element;

package/dist/modal/Modal.component.d.ts

@@ -9,4 +9,4 @@ export interface ModalProps {
     /** Use custom class with: "backdrop::", "header::", "footer::". */
     className?: string;
 }
-export declare function ModalComponent({ show, onClose, title, children, tip, footer, className, }: ModalProps): import("react").JSX.Element;
+export declare function ModalComponent({ show, onClose, title, children, tip, footer, className, }: ModalProps): import("@types/react").JSX.Element;

package/dist/modal/ModalConfirm.component.d.ts

@@ -22,5 +22,5 @@ export interface ModalConfirmProps {
     /** Use custom class with: "backdrop::", "header::", "footer::". */
     className?: string;
 }
-export declare function ModalConfirmComponent({ show, title, children, icon, footer, submitControl, onClose, className, }: ModalConfirmProps): import("react").JSX.Element;
+export declare function ModalConfirmComponent({ show, title, children, icon, footer, submitControl, onClose, className, }: ModalConfirmProps): import("@types/react").JSX.Element;
 export {};

package/dist/modal/Toast.component.d.ts

@@ -8,4 +8,4 @@ export interface ToastProps {
     /** Use custom class with: "backdrop::", "header::", "footer::". */
     className?: string;
 }
-export declare function ToastComponent({ show, onClose, title, children, footer, className, }: ToastProps): import("react").JSX.Element;
+export declare function ToastComponent({ show, onClose, title, children, footer, className, }: ToastProps): import("@types/react").JSX.Element;

package/dist/nav/Bottombar.component.d.ts

@@ -9,4 +9,4 @@ export interface BottombarProps {
     items?: BottombarItemProps[];
     className?: string;
 }
-export declare function BottombarComponent({ className, active, items, }: BottombarProps): import("react").JSX.Element;
+export declare function BottombarComponent({ className, active, items, }: BottombarProps): import("@types/react").JSX.Element;

package/dist/nav/Footer.component.d.ts

@@ -34,4 +34,4 @@ export interface FooterProps {
         path: string;
     };
 }
-export declare function FooterComponent({ brandTitle, brandSubtitle, address, phone, email, supportHours, socials, columns, copyrightLink, }: FooterProps): import("react").JSX.Element;
+export declare function FooterComponent({ brandTitle, brandSubtitle, address, phone, email, supportHours, socials, columns, copyrightLink, }: FooterProps): import("@types/react").JSX.Element;

package/dist/nav/Headbar.component.d.ts

@@ -1,14 +1,7 @@
 import { ReactNode } from "react";
-export interface HeadbarUserProps {
-    name: string;
-    role: string;
-    avatar?: any;
-}
 export interface HeadbarProps {
-    children?: ReactNode;
-    user?: HeadbarUserProps;
-    onLogout?: () => void;
-    onEditProfile?: () => void;
-    className?: string;
+    title?: string;
+    backHref?: string | boolean;
+    rightContent?: ReactNode;
 }
-export declare function HeadbarComponent({ children, user, onLogout, onEditProfile, className, }: HeadbarProps): import("react").JSX.Element;
+export declare function HeadbarComponent({ title, backHref, rightContent }: HeadbarProps): import("@types/react").JSX.Element;

package/dist/nav/Headbar.component.js

@@ -3,31 +3,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.HeadbarComponent = HeadbarComponent;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
 const navigation_1 = require("next/navigation");
 const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
 const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
-const Image_component_1 = require("../wrap/Image.component");
-const OutsideClick_component_1 = require("../wrap/OutsideClick.component");
-const _utils_1 = require("@utils");
-const defaultUser = {
-    name: "Jhon Duck",
-    role: "Admin",
-};
-function HeadbarComponent({ children, user = defaultUser, onLogout, onEditProfile, className = "", }) {
+;
+function HeadbarComponent({ title, backHref, rightContent }) {
     const router = (0, navigation_1.useRouter)();
-    const [profile, setProfile] = (0, react_1.useState)(false);
-    const handleLogout = () => {
-        if (onLogout) {
-            onLogout();
-        }
-        else {
-            _utils_1.auth.deleteAccessToken();
-            router.push("/");
-        }
-    };
-    const styles = {
-        base: (0, _utils_1.cn)("headbar-base", className),
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: styles.base, children: [(0, jsx_runtime_1.jsx)("div", { className: "w-full ", children: children }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-right-controls", children: [(0, jsx_runtime_1.jsx)("div", { className: "headbar-icon-button", children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faHistory }) }), (0, jsx_runtime_1.jsx)("div", { className: "headbar-icon-button", children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faBell }) }), (0, jsx_runtime_1.jsx)("div", { className: "headbar-divider" }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-user-profile-trigger", onClick: () => setProfile(!profile), children: [(0, jsx_runtime_1.jsx)("div", { className: "headbar-user-avatar-wrapper", children: user.avatar ? ((0, jsx_runtime_1.jsx)(Image_component_1.ImageComponent, { src: user.avatar, alt: user.name, className: "w-full h-full object-cover" })) : ((0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faUser })) }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-user-info", children: [(0, jsx_runtime_1.jsx)("h6", { className: "headbar-user-name", children: user.name }), (0, jsx_runtime_1.jsx)("h6", { className: "headbar-user-role", children: user.role })] })] })] }), (0, jsx_runtime_1.jsx)(OutsideClick_component_1.OutsideClickComponent, { onOutsideClick: () => setProfile(false), children: (0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("headbar-dropdown", profile ? "scale-y-100" : "scale-y-0"), children: [(0, jsx_runtime_1.jsxs)("div", { className: "headbar-dropdown-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "headbar-dropdown-avatar-wrapper", children: user.avatar ? ((0, jsx_runtime_1.jsx)(Image_component_1.ImageComponent, { src: user.avatar, alt: user.name, className: "w-full h-full object-cover" })) : ((0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faUser, className: "text-2xl text-light-foreground" })) }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-dropdown-user-info", children: [(0, jsx_runtime_1.jsx)("h6", { className: "text-lg font-bold line-clamp-1", children: user.name }), (0, jsx_runtime_1.jsx)("h6", { className: "text-xs -mt-1 font-semibold line-clamp-1", children: user.role })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-dropdown-body", children: [(0, jsx_runtime_1.jsxs)("div", { className: "headbar-dropdown-item", onClick: onEditProfile, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faUserCog }), (0, jsx_runtime_1.jsx)("label", { className: "cursor-pointer font-semibold", children: "Edit Profile" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "headbar-dropdown-item-danger", onClick: handleLogout, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faPowerOff }), (0, jsx_runtime_1.jsx)("label", { className: "cursor-pointer font-semibold", children: "Keluar" })] })] })] }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between w-full items-center mt-2 mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center", children: [backHref && ((0, jsx_runtime_1.jsx)("div", { className: "w-8 aspect-square flex justify-center items-center cursor-pointer", onClick: () => typeof backHref != "boolean" ? router.push(backHref) : router.back(), children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faChevronLeft, className: "text-secondary text-xl" }) })), (0, jsx_runtime_1.jsx)("p", { className: "text-lg font-bold px-2", children: title })] }), rightContent && (0, jsx_runtime_1.jsx)("div", { children: rightContent })] }));
 }

package/dist/nav/Navbar.component.d.ts

@@ -19,4 +19,4 @@ export interface NavbarProps {
     onProfile?: () => void;
     className?: string;
 }
-export declare function NavbarComponent({ logoTitle, logoSubtitle, logoPath, specialLink, items, isLoggedIn, onLogin, onRegister, onProfile, className, }: NavbarProps): import("react").JSX.Element;
+export declare function NavbarComponent({ logoTitle, logoSubtitle, logoPath, specialLink, items, isLoggedIn, onLogin, onRegister, onProfile, className, }: NavbarProps): import("@types/react").JSX.Element;

package/dist/nav/Sidebar.component.d.ts

@@ -27,7 +27,7 @@ export interface sidebarProps {
     /** Use custom class with: "backdrop::", "head-item::", "item::", "child-item::". */
     className?: string;
 }
-export declare function SidebarComponent({ head, items, basePath, toggle, onToggleChange, className, }: sidebarProps): import("react").JSX.Element;
+export declare function SidebarComponent({ head, items, basePath, toggle, onToggleChange, className, }: sidebarProps): import("@types/react").JSX.Element;
 export declare function SidebarContentComponent({ children }: {
     children: ReactNode;
-}): import("react").JSX.Element;
+}): import("@types/react").JSX.Element;

package/dist/nav/Tabbar.component.d.ts

@@ -10,4 +10,4 @@ export interface TabbarProps {
 }
 export declare function TabbarComponent({ items, onChange, active, 
 /** Use custom class with: "item::", "active::". */
-className, }: TabbarProps): import("react").JSX.Element;
+className, }: TabbarProps): import("@types/react").JSX.Element;

package/dist/nav/Wizard.component.d.ts

@@ -6,4 +6,4 @@ export interface WizardProps {
     }[];
     active: number;
 }
-export declare function WizardComponent({ items, active }: WizardProps): import("react").JSX.Element;
+export declare function WizardComponent({ items, active }: WizardProps): import("@types/react").JSX.Element;

package/dist/supervision/FormSupervision.component.d.ts

@@ -101,5 +101,5 @@ export interface formSupervisionProps {
     onError?: (code: number) => void;
     className?: string;
 }
-export declare function FormSupervisionComponent({ title, fields, submitControl, confirmation, defaultValue, onSuccess, onError, footerControl, payload, className, }: formSupervisionProps): import("react").JSX.Element;
+export declare function FormSupervisionComponent({ title, fields, submitControl, confirmation, defaultValue, onSuccess, onError, footerControl, payload, className, }: formSupervisionProps): import("@types/react").JSX.Element;
 export {};

package/dist/supervision/TableSupervision.component.d.ts

@@ -80,4 +80,4 @@ export type TableSupervisionProps = {
     };
     importControl?: FetchControlType;
 };
-export declare function TableSupervisionComponent({ title, id, fetchControl, columnControl, formControl, detailControl, actionControl, actionBulkingControl, block, controlBar, noIndex, responsiveControl, urlParam, importControl, }: TableSupervisionProps): import("react").JSX.Element;
+export declare function TableSupervisionComponent({ title, id, fetchControl, columnControl, formControl, detailControl, actionControl, actionBulkingControl, block, controlBar, noIndex, responsiveControl, urlParam, importControl, }: TableSupervisionProps): import("@types/react").JSX.Element;

package/dist/table/ControlBar.component.d.ts

@@ -31,4 +31,4 @@ export interface ControlBarProps {
     filter?: ApiFilterType[];
     onRefresh?: () => void;
 }
-export declare function ControlBarComponent({ id, options, className, search, onSearch, searchableOptions, searchable, onSearchable, selectableOptions, selectable, onSelectable, sortableOptions, sort, onSort, filterableColumns, onFilter, filter, onRefresh }: ControlBarProps): import("react").JSX.Element;
+export declare function ControlBarComponent({ id, options, className, search, onSearch, searchableOptions, searchable, onSearchable, selectableOptions, selectable, onSelectable, sortableOptions, sort, onSort, filterableColumns, onFilter, filter, onRefresh }: ControlBarProps): import("@types/react").JSX.Element;

package/dist/table/FilterComponent.d.ts

@@ -26,7 +26,7 @@ export interface AdvancedFilterProps {
     /** Use custom class with: "title::". */
     className?: string;
 }
-export declare function FilterComponent({ columns, onChange, value, onMinimize, className, }: AdvancedFilterProps): import("react").JSX.Element;
+export declare function FilterComponent({ columns, onChange, value, onMinimize, className, }: AdvancedFilterProps): import("@types/react").JSX.Element;
 interface FilterInputProps {
     type?: string | null;
     name: string;
@@ -41,5 +41,5 @@ interface FilterInputProps {
     between?: boolean;
     multiple?: boolean;
 }
-export declare function InputFilterValueComponent({ type, name, value, onChange, options, placeholder, className, between, multiple, }: FilterInputProps): import("react").JSX.Element;
+export declare function InputFilterValueComponent({ type, name, value, onChange, options, placeholder, className, between, multiple, }: FilterInputProps): import("@types/react").JSX.Element;
 export {};

package/dist/table/Pagination.component.d.ts

@@ -5,4 +5,4 @@ export interface PaginationProps {
     onChange?: (totalRow: number, paginate: number, page: number) => void;
     className?: string;
 }
-export declare function PaginationComponent({ paginate, page, totalRow, onChange, className, }: PaginationProps): import("react").JSX.Element;
+export declare function PaginationComponent({ paginate, page, totalRow, onChange, className, }: PaginationProps): import("@types/react").JSX.Element;

package/dist/table/Table.component.d.ts

@@ -60,4 +60,4 @@ export interface TableProps {
     /** Use custom class with: "controller-bar::", "head-column::", "column::", "floating-action::", "row::". */
     className?: string;
 }
-export declare function TableComponent({ id, controlBar, columns, data, pagination, loading, sortBy, onChangeSortBy, search, onChangeSearch, searchableColumn, onChangeSearchableColumn, filter, onChangeFilter, checks, onChangeChecks, actionBulking, focus, onRowClick, onRefresh, block, noIndex, responsiveControl, className, }: TableProps): import("react").JSX.Element;
+export declare function TableComponent({ id, controlBar, columns, data, pagination, loading, sortBy, onChangeSortBy, search, onChangeSearch, searchableColumn, onChangeSearchableColumn, filter, onChangeFilter, checks, onChangeChecks, actionBulking, focus, onRowClick, onRefresh, block, noIndex, responsiveControl, className, }: TableProps): import("@types/react").JSX.Element;

package/dist/typography/TypographyArticle.component.d.ts

@@ -5,4 +5,4 @@ export interface TypographyArticleProps {
     header?: string | ReactNode;
     footer?: string | ReactNode;
 }
-export declare function TypographyArticleComponent({ title, content, header, footer, }: TypographyArticleProps): import("react").JSX.Element;
+export declare function TypographyArticleComponent({ title, content, header, footer, }: TypographyArticleProps): import("@types/react").JSX.Element;

package/dist/typography/TypographyColumn.component.d.ts

@@ -3,4 +3,4 @@ export interface TypographyColumnProps {
     title: string | ReactNode;
     content: string | ReactNode;
 }
-export declare function TypographyColumnComponent({ title, content, }: TypographyColumnProps): import("react").JSX.Element;
+export declare function TypographyColumnComponent({ title, content, }: TypographyColumnProps): import("@types/react").JSX.Element;

package/dist/typography/TypographyContent.component.d.ts

@@ -3,4 +3,4 @@ export interface TypographyContentProps {
     title: string | ReactNode;
     content: string | ReactNode;
 }
-export declare function TypographyContentComponent({ title, content, }: TypographyContentProps): import("react").JSX.Element;
+export declare function TypographyContentComponent({ title, content, }: TypographyContentProps): import("@types/react").JSX.Element;

package/dist/typography/TypographyTips.component.d.ts

@@ -3,4 +3,4 @@ export interface TypographyTipsProps {
     title: string | ReactNode;
     content: string | ReactNode;
 }
-export declare function TypographyTipsComponent({ title, content, }: TypographyTipsProps): import("react").JSX.Element;
+export declare function TypographyTipsComponent({ title, content, }: TypographyTipsProps): import("@types/react").JSX.Element;

package/dist/wrap/Image.component.d.ts

@@ -1,2 +1,2 @@
 import { ImageProps } from "next/image";
-export declare function ImageComponent(props: ImageProps): import("react").JSX.Element;
+export declare function ImageComponent(props: ImageProps): import("@types/react").JSX.Element;

package/dist/wrap/ScrollContainer.component.d.ts

@@ -7,4 +7,4 @@ export interface ScrollContainerProps {
     /** Use custom class with: "container::", "floating-scroll::"". */
     className?: string;
 }
-export declare function ScrollContainerComponent({ children, footer, className, scrollFloating, onScroll, }: ScrollContainerProps): import("react").JSX.Element;
+export declare function ScrollContainerComponent({ children, footer, className, scrollFloating, onScroll, }: ScrollContainerProps): import("@types/react").JSX.Element;

package/dist/wrap/ShortcutProvider.d.ts

@@ -1 +1 @@
-export declare function ShortcutProvider(): import("react").JSX.Element;
+export declare function ShortcutProvider(): import("@types/react").JSX.Element;

package/dist/wrap/Swipe.component.d.ts

@@ -11,4 +11,4 @@ export type SwipeProps = {
     children?: ReactNode;
     className?: string;
 };
-export declare function SwipeComponent({ leftActionControl, rightActionControl, children, className, }: SwipeProps): import("react").JSX.Element;
+export declare function SwipeComponent({ leftActionControl, rightActionControl, children, className, }: SwipeProps): import("@types/react").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skalfa/skalfa-component",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "Core reusable UI components for Skalfa applications.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -20,7 +20,7 @@
   "license": "MIT",
   "peerDependencies": {
     "@fortawesome/react-fontawesome": "^0.2.2",
-    "@skalfa/skalfa-app-core": "^1.0.0",
+    "@skalfa/skalfa-app-core": "^1.0.11",
     "next": "^15.0.0 || ^16.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"

package/dist/src/accordion/Accordion.component.d.ts

@@ -1,13 +0,0 @@
-import { ReactNode } from "react";
-export interface AccordionProps {
-    setActive?: number | null;
-    items: {
-        head: ReactNode;
-        content: ReactNode;
-    }[];
-    horizontal?: boolean;
-    className?: string;
-}
-export declare function AccordionComponent({ items, setActive, horizontal, 
-/** Use custom class with: "container::", "head::", "active::". */
-className, }: AccordionProps): import("react").JSX.Element;

package/dist/src/accordion/Accordion.component.js

@@ -1,25 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AccordionComponent = AccordionComponent;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
-const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
-const _utils_1 = require("@utils");
-;
-function AccordionComponent({ items, setActive = null, horizontal = false, 
-/** Use custom class with: "container::", "head::", "active::". */
-className = "", }) {
-    const [isActive, setIsActive] = (0, react_1.useState)(setActive);
-    (0, react_1.useEffect)(() => {
-        setIsActive(setActive);
-    }, [setActive]);
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, _utils_1.cn)("accordion", horizontal ? "accordion-horizontal" : "accordion-vertical", (0, _utils_1.pcn)(className, "container")), children: items.map(({ head, content }, key) => ((0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("accordion-item", horizontal ? "accordion-item-horizontal" : "accordion-item-vertical"), children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("accordion-head", horizontal ? "accordion-head-horizontal" : "accordion-head-vertical", (0, _utils_1.pcn)(className, "head")), onClick: () => setIsActive(isActive === key ? null : key), children: [(0, jsx_runtime_1.jsx)("div", { children: head }), (0, jsx_runtime_1.jsx)("div", { className: (0, _utils_1.cn)("w-min transition-transform", isActive !== key && "rotate-180"), children: (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: horizontal ? free_solid_svg_icons_1.faChevronLeft : free_solid_svg_icons_1.faChevronDown }) })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, _utils_1.cn)("accordion-content", horizontal
-                        ? isActive === key
-                            ? "accordion-content-horizontal-active"
-                            : "accordion-content-horizontal-inactive"
-                        : isActive === key
-                            ? "accordion-content-vertical-active"
-                            : "accordion-content-vertical-inactive", (0, _utils_1.pcn)(className, "base"), isActive === key && (0, _utils_1.pcn)(className, "active")), children: content })] }, key))) }));
-}

package/dist/src/breadcrumb/Breadcrumb.component.d.ts

@@ -1,14 +0,0 @@
-import { ReactNode } from "react";
-export interface BreadcrumbItemProps {
-    path: string;
-    label: string;
-    className?: string;
-}
-export interface BreadcrumbProps {
-    items: BreadcrumbItemProps[];
-    square?: boolean;
-    separatorContent?: string | ReactNode;
-    /** Use custom class with: "container::", "active::". */
-    className?: string;
-}
-export declare function BreadcrumbComponent({ items, className, square, separatorContent, }: BreadcrumbProps): import("react").JSX.Element;

package/dist/src/breadcrumb/Breadcrumb.component.js

@@ -1,21 +0,0 @@
-"use client";
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BreadcrumbComponent = BreadcrumbComponent;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const link_1 = __importDefault(require("next/link"));
-const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
-const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
-const _utils_1 = require("@utils");
-;
-;
-function BreadcrumbComponent({ items, className = "", square = false, separatorContent, }) {
-    return ((0, jsx_runtime_1.jsx)("nav", { className: (0, _utils_1.cn)("breadcrumb", (0, _utils_1.pcn)(className, "container")), children: (0, jsx_runtime_1.jsx)("ol", { className: "breadcrumb-list", children: items.map((item, index) => {
-                const isActive = index === items.length - 1;
-                return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(link_1.default, { href: item.path, className: (0, _utils_1.cn)("breadcrumb-link", square && "breadcrumb-link-square", isActive && !square && "breadcrumb-link-active", isActive && square && "breadcrumb-link-square-active", (0, _utils_1.pcn)(className, "base"), isActive && (0, _utils_1.pcn)(className, "active")), children: item.label }) }), !isActive && ((0, jsx_runtime_1.jsx)("li", { className: "breadcrumb-separator", children: separatorContent || ((0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faChevronRight })) }))] }, item.path));
-            }) }) }));
-}