@stfrigerio/sito-template 0.1.70 → 0.1.72

package/dist/components/organisms/Navbar/Navbar.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { ComponentSoundConfig } from '../../../utils/useSound';
 export interface NavItem {
     id: string;
-    label: string;
+    label: React.ReactNode;
     icon?: React.ComponentType<{
         className?: string;
     }>;
@@ -17,8 +17,8 @@ export interface NavbarProps {
     logo?: {
         src?: string;
         alt?: string;
-        text?: string;
-        subtitle?: string;
+        text?: React.ReactNode;
+        subtitle?: React.ReactNode;
     };
     onItemClick?: (item: NavItem) => void;
     variant?: 'sidebar' | 'top' | 'minimal';

package/dist/components/organisms/Navbar/Navbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Navbar.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/Navbar/Navbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAKpE,OAAO,EAAqB,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAElF,MAAM,WAAW,OAAO;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;CACxB;AAED,MAAM,WAAW,WAAW;IACxB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,IAAI,CAAC,EAAE;QACH,GAAG,CAAC,EAAE,MAAM,CAAC;QACb,GAAG,CAAC,EAAE,MAAM,CAAC;QACb,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,OAAO,CAAC,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAgWxC,CAAC"}
+{"version":3,"file":"Navbar.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/Navbar/Navbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAKpE,OAAO,EAAqB,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAElF,MAAM,WAAW,OAAO;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;CACxB;AAED,MAAM,WAAW,WAAW;IACxB,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,IAAI,CAAC,EAAE;QACH,GAAG,CAAC,EAAE,MAAM,CAAC;QACb,GAAG,CAAC,EAAE,MAAM,CAAC;QACb,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KAC9B,CAAC;IACF,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,OAAO,CAAC,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAoWxC,CAAC"}

package/dist/index.esm.js

@@ -3731,12 +3731,16 @@ const Navbar = ({ items, logo, onItemClick, variant = 'sidebar', isMobile = fals
                                 damping: 35,
                             } })), Icon && (jsx(Icon, { className: `${styles.navIcon} ${item.isActive ? styles.activeIcon : ''}` })), jsx("span", { className: `${styles.navText} ${item.isActive ? styles.activeText : ''}`, children: item.label }), item.badge && jsx("span", { className: styles.navBadge, children: item.badge }), hasChildren && (jsx(motion.span, { className: styles.chevron, animate: { rotate: isExpanded ? 180 : 0 }, transition: { duration: 0.2 }, children: "\u25BC" }))] }), hasChildren && (jsx(AnimatePresence, { children: isExpanded && (jsx(motion.ul, { className: styles.subNavList, initial: { height: 0, opacity: 0 }, animate: { height: 'auto', opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: { duration: 0.2 }, children: item.children.map((child, childIndex) => renderNavItem(child, childIndex, depth + 1)) })) }))] }, item.id));
     };
-    const navContent = (jsxs(Fragment, { children: [logo && (jsx(motion.div, { className: styles.navLogo, initial: { opacity: 0, y: -20 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.1 }, children: jsxs("div", { className: styles.logoContainer, children: [logo.src ? (jsx(motion.img, { src: logo.src, alt: logo.alt || 'Logo', className: styles.logoImage, onMouseEnter: handlers.onMouseEnter, whileHover: { scale: 1.05 }, transition: { type: 'spring', stiffness: 400 } })) : (jsx("div", { className: styles.logoPlaceholder, children: logo.text?.charAt(0) || 'L' })), (logo.text || logo.subtitle) && (jsxs("div", { className: styles.logoContent, children: [logo.text && jsx("span", { className: styles.logoText, children: logo.text }), logo.subtitle && (jsx("span", { className: styles.logoSubtitle, children: logo.subtitle }))] }))] }) })), jsx("ul", { className: styles.navList, children: items.map((item, index) => renderNavItem(item, index)) }), footer && (jsx(motion.div, { className: styles.navFooter, initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.3 }, children: footer }))] }));
+    const navContent = (jsxs(Fragment, { children: [logo && (jsx(motion.div, { className: styles.navLogo, initial: { opacity: 0, y: -20 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.1 }, children: jsxs("div", { className: styles.logoContainer, children: [logo.src ? (jsx(motion.img, { src: logo.src, alt: logo.alt || 'Logo', className: styles.logoImage, onMouseEnter: handlers.onMouseEnter, whileHover: { scale: 1.05 }, transition: { type: 'spring', stiffness: 400 } })) : (jsx("div", { className: styles.logoPlaceholder, children: typeof logo.text === 'string'
+                                ? logo.text.charAt(0) || 'L'
+                                : 'L' })), (logo.text || logo.subtitle) && (jsxs("div", { className: styles.logoContent, children: [logo.text && jsx("span", { className: styles.logoText, children: logo.text }), logo.subtitle && (jsx("span", { className: styles.logoSubtitle, children: logo.subtitle }))] }))] }) })), jsx("ul", { className: styles.navList, children: items.map((item, index) => renderNavItem(item, index)) }), footer && (jsx(motion.div, { className: styles.navFooter, initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.3 }, children: footer }))] }));
     if (variant === 'top') {
         return (jsx(motion.nav, { className: `${styles.navbar} ${styles.navbarTop} ${className}`, "data-colored-icons": coloredIconsAttr, initial: { y: -100 }, animate: { y: 0 }, transition: { type: 'spring', stiffness: 300, damping: 30 }, children: navContent }));
     }
     if (isMobile) {
-        return (jsxs(Fragment, { children: [jsxs("nav", { className: `${styles.navbar} ${className}`, "data-colored-icons": coloredIconsAttr, children: [logo && (jsx("div", { className: styles.navLogo, children: jsxs("div", { className: styles.logoContainer, children: [logo.src ? (jsx("img", { src: logo.src, alt: logo.alt || 'Logo', className: styles.logoImage })) : (jsx("div", { className: styles.logoPlaceholder, children: logo.text?.charAt(0) || 'L' })), logo.text && (jsx("div", { className: styles.logoContent, children: jsx("span", { className: styles.logoText, children: logo.text }) }))] }) })), jsxs("div", { className: styles.navActions, children: [footer && jsx("div", { className: styles.navFooter, children: footer }), jsx("button", { className: `${styles.mobileMenuButton} ${isMobileMenuOpen ? styles.menuOpen : ''}`, onClick: toggleMobileMenu, "aria-label": "Toggle navigation menu", children: isMobileMenuOpen ? jsx(X, {}) : jsx(Menu, {}) })] })] }), jsx(AnimatePresence, { children: isMobileMenuOpen && (jsx(motion.div, { className: styles.mobileBackdrop, "data-colored-icons": coloredIconsAttr, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, onClick: () => setIsMobileMenuOpen(false), children: jsx(motion.div, { initial: { y: -20, opacity: 0 }, animate: { y: 0, opacity: 1 }, exit: { y: -20, opacity: 0 }, transition: { duration: 0.2 }, onClick: (e) => e.stopPropagation(), children: jsx("ul", { className: styles.navList, children: items.map((item, index) => renderNavItem(item, index)) }) }) })) })] }));
+        return (jsxs(Fragment, { children: [jsxs("nav", { className: `${styles.navbar} ${className}`, "data-colored-icons": coloredIconsAttr, children: [logo && (jsx("div", { className: styles.navLogo, children: jsxs("div", { className: styles.logoContainer, children: [logo.src ? (jsx("img", { src: logo.src, alt: logo.alt || 'Logo', className: styles.logoImage })) : (jsx("div", { className: styles.logoPlaceholder, children: typeof logo.text === 'string'
+                                            ? logo.text.charAt(0) || 'L'
+                                            : 'L' })), logo.text && (jsx("div", { className: styles.logoContent, children: jsx("span", { className: styles.logoText, children: logo.text }) }))] }) })), jsxs("div", { className: styles.navActions, children: [footer && jsx("div", { className: styles.navFooter, children: footer }), jsx("button", { className: `${styles.mobileMenuButton} ${isMobileMenuOpen ? styles.menuOpen : ''}`, onClick: toggleMobileMenu, "aria-label": "Toggle navigation menu", children: isMobileMenuOpen ? jsx(X, {}) : jsx(Menu, {}) })] })] }), jsx(AnimatePresence, { children: isMobileMenuOpen && (jsx(motion.div, { className: styles.mobileBackdrop, "data-colored-icons": coloredIconsAttr, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, onClick: () => setIsMobileMenuOpen(false), children: jsx(motion.div, { initial: { y: -20, opacity: 0 }, animate: { y: 0, opacity: 1 }, exit: { y: -20, opacity: 0 }, transition: { duration: 0.2 }, onClick: (e) => e.stopPropagation(), children: jsx("ul", { className: styles.navList, children: items.map((item, index) => renderNavItem(item, index)) }) }) })) })] }));
     }
     return (jsx(Fragment, { children: jsx(motion.nav, { className: `${styles.navbar} ${styles[`navbar${variant.charAt(0).toUpperCase() + variant.slice(1)}`]} ${className}`, "data-colored-icons": coloredIconsAttr, initial: variant === 'sidebar' ? { x: -300 } : { opacity: 0 }, animate: variant === 'sidebar' ? { x: 0 } : { opacity: 1 }, transition: { type: 'spring', stiffness: 300, damping: 30 }, children: navContent }) }));
 };
@@ -4118,21 +4122,21 @@ const QuantifiableHabitsChart = ({ data, width = 800, height = 400, defaultViewT
         const xAxisFormat = (() => {
             switch (viewType) {
                 case 'daily':
-                    return d3.timeFormat('%Y-%m-%d');
+                    return d3.timeFormat('%m-%d');
                 case 'weekly':
                     return (d) => {
                         const weekNum = getISOWeek(d);
-                        return `${d.getFullYear()}-W${weekNum.toString().padStart(2, '0')}`;
+                        return `W${weekNum.toString().padStart(2, '0')}`;
                     };
                 case 'monthly':
-                    return d3.timeFormat('%Y-%m');
+                    return d3.timeFormat('%b');
                 case 'quarterly':
                     return (d) => {
                         const quarter = Math.floor(d.getMonth() / 3) + 1;
-                        return `${d.getFullYear()}-Q${quarter}`;
+                        return `Q${quarter}`;
                     };
                 default:
-                    return d3.timeFormat('%Y-%m-%d');
+                    return d3.timeFormat('%m-%d');
             }
         })();
         // Determine number of ticks based on view type and data