@stfrigerio/sito-template 0.1.89 → 0.1.91

package/dist/index.js

@@ -31,7 +31,7 @@ function _interopNamespaceDefault(e) {
 
 var d3__namespace = /*#__PURE__*/_interopNamespaceDefault(d3);
 
-var styles$B = {"button":"Button-module_button__c6nkW","primary":"Button-module_primary__pMqAs","secondary":"Button-module_secondary__mBWx9","outline":"Button-module_outline__NGGGN","ghost":"Button-module_ghost__u2QBF","danger":"Button-module_danger__2ewhr","small":"Button-module_small__ZI9RX","medium":"Button-module_medium__Wnf9t","large":"Button-module_large__cQCpA","fullWidth":"Button-module_fullWidth__N8vYg","loading":"Button-module_loading__hcSI4","spinner":"Button-module_spinner__HtM96","spin":"Button-module_spin__jblrj","iconLeft":"Button-module_iconLeft__Fpz-y","iconRight":"Button-module_iconRight__kTfjS"};
+var styles$B = {"button":"Button-module_button__c6nkW","primary":"Button-module_primary__pMqAs","secondary":"Button-module_secondary__mBWx9","outline":"Button-module_outline__NGGGN","ghost":"Button-module_ghost__u2QBF","danger":"Button-module_danger__2ewhr","icon":"Button-module_icon__JNzlJ","iconLeft":"Button-module_iconLeft__Fpz-y","iconRight":"Button-module_iconRight__kTfjS","small":"Button-module_small__ZI9RX","medium":"Button-module_medium__Wnf9t","large":"Button-module_large__cQCpA","fullWidth":"Button-module_fullWidth__N8vYg","loading":"Button-module_loading__hcSI4","spinner":"Button-module_spinner__HtM96","spin":"Button-module_spin__jblrj"};
 
 const SOUND_PACKS = {
     digital: {
@@ -595,10 +595,11 @@ function useComponentSound(config, options) {
  */
 const Button = ({ variant = 'primary', size = 'medium', fullWidth = false, loading = false, iconLeft, iconRight, children, className = '', disabled, motionProps, soundConfig, onClick, onMouseEnter, onFocus, ...rest }) => {
     const { handlers } = useComponentSound(soundConfig);
+    const isIcon = variant === 'icon';
     const buttonClasses = [
         styles$B.button,
         styles$B[variant],
-        styles$B[size],
+        !isIcon && styles$B[size],
         fullWidth && styles$B.fullWidth,
         loading && styles$B.loading,
         className
@@ -611,7 +612,7 @@ const Button = ({ variant = 'primary', size = 'medium', fullWidth = false, loadi
         handlers.onMouseEnter?.();
         onMouseEnter?.(e);
     };
-    return (jsxRuntime.jsxs(framerMotion.motion.button, { className: buttonClasses, disabled: disabled || loading, whileHover: { scale: disabled || loading ? 1 : 1.02 }, whileTap: { scale: disabled || loading ? 1 : 0.98 }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: handleClick, onMouseEnter: handleMouseEnter, onFocus: onFocus, ...motionProps, ...rest, children: [loading && jsxRuntime.jsx("span", { className: styles$B.spinner }), iconLeft && jsxRuntime.jsx("span", { className: styles$B.iconLeft, children: iconLeft }), children, iconRight && jsxRuntime.jsx("span", { className: styles$B.iconRight, children: iconRight })] }));
+    return (jsxRuntime.jsxs(framerMotion.motion.button, { className: buttonClasses, disabled: disabled || loading, whileHover: isIcon ? undefined : { scale: disabled || loading ? 1 : 1.02 }, whileTap: { scale: disabled || loading ? 1 : (isIcon ? 0.9 : 0.98) }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: handleClick, onMouseEnter: handleMouseEnter, onFocus: onFocus, ...motionProps, ...rest, children: [loading && jsxRuntime.jsx("span", { className: styles$B.spinner }), iconLeft && jsxRuntime.jsx("span", { className: styles$B.iconLeft, children: iconLeft }), children, iconRight && jsxRuntime.jsx("span", { className: styles$B.iconRight, children: iconRight })] }));
 };
 
 var styles$A = {"card":"Card-module_card__r2DB2","hoverable":"Card-module_hoverable__X3OpS","elevated":"Card-module_elevated__hGV6-","outlined":"Card-module_outlined__ngRag","flat":"Card-module_flat__xy-xt","glass":"Card-module_glass__Sv-Vs","imageContainer":"Card-module_imageContainer__L4ma6","image":"Card-module_image__bQBt6","header":"Card-module_header__0dtj3","headerContent":"Card-module_headerContent__W7-jD","expandButton":"Card-module_expandButton__I7f49","expandIcon":"Card-module_expandIcon__Lu-OY","expandableContent":"Card-module_expandableContent__BFgO5","expandable":"Card-module_expandable__GMXzo","body":"Card-module_body__K7eL3","footer":"Card-module_footer__L5wO-","title":"Card-module_title__pW9g8","subtitle":"Card-module_subtitle__gejH4","clickable":"Card-module_clickable__Y6fm8","padding":"Card-module_padding__wtyDo","noPadding":"Card-module_noPadding__r5Qq0","loading":"Card-module_loading__S4Wng","loadingShimmer":"Card-module_loadingShimmer__Q1Osr","loadingPulse":"Card-module_loadingPulse__bXQmC"};
@@ -892,7 +893,7 @@ const parseEuropeanDate = (dateString) => {
     return '';
 };
 
-var styles$w = {"dateInput":"DateInput-module_dateInput__54VPD","label":"DateInput-module_label__yDdUw","inputWrapper":"DateInput-module_inputWrapper__x-r1d","textInput":"DateInput-module_textInput__ToOSX","calendarButton":"DateInput-module_calendarButton__JzDGD","hiddenDateInput":"DateInput-module_hiddenDateInput__IWNg3","error":"DateInput-module_error__ieuPO","success":"DateInput-module_success__rPA93","loading":"DateInput-module_loading__1DAmD"};
+var styles$w = {"dateInput":"DateInput-module_dateInput__54VPD","label":"DateInput-module_label__yDdUw","inputWrapper":"DateInput-module_inputWrapper__x-r1d","textInput":"DateInput-module_textInput__ToOSX","calendarButton":"DateInput-module_calendarButton__JzDGD","nativeDateInput":"DateInput-module_nativeDateInput__tbi68","error":"DateInput-module_error__ieuPO","success":"DateInput-module_success__rPA93","loading":"DateInput-module_loading__1DAmD"};
 
 /**
  * DateInput component - European format date picker with manual input support
@@ -906,7 +907,7 @@ var styles$w = {"dateInput":"DateInput-module_dateInput__54VPD","label":"DateInp
  *
  * Features:
  * - Auto-formatting while typing (adds slashes automatically)
- * - Calendar icon for native date picker access
+ * - Calendar icon for native date picker access (Safari/iOS compatible)
  * - Seamless conversion between European display and ISO storage formats
  * - Mobile-optimized with proper touch targets
  *
@@ -918,19 +919,8 @@ var styles$w = {"dateInput":"DateInput-module_dateInput__54VPD","label":"DateInp
  *   onChange={setBirthDate}
  *   placeholder="31/12/2000"
  * />
- *
- * @example
- * // With focus handlers
- * <DateInput
- *   label="Event Date"
- *   value={eventDate}
- *   onChange={setEventDate}
- *   onFocus={() => console.log('Focused')}
- *   onBlur={() => validateDate(eventDate)}
- * />
  */
 function DateInput({ label, value, onChange, placeholder = "25/12/2024", onFocus, onBlur, error = false, success = false, loading = false, disabled = false, soundConfig }) {
-    const hiddenDateInputRef = React.useRef(null);
     const { handlers, playSound } = useComponentSound(soundConfig);
     const handleTextChange = (textValue) => {
         // Auto-format as user types
@@ -955,27 +945,9 @@ function DateInput({ label, value, onChange, placeholder = "25/12/2024", onFocus
             onChange(formatted);
         }
     };
-    const handleCalendarClick = () => {
-        playSound('click');
-        // Set the hidden input to current value for calendar
-        if (hiddenDateInputRef.current) {
-            // If value is already ISO format, use it directly
-            // If it's European format, convert it
-            const isoDate = value.includes('-') ? value : parseEuropeanDate(value);
-            if (isoDate) {
-                hiddenDateInputRef.current.value = isoDate;
-            }
-            // Try showPicker first (modern browsers), fallback to click
-            if (hiddenDateInputRef.current.showPicker) {
-                hiddenDateInputRef.current.showPicker();
-            }
-            else {
-                hiddenDateInputRef.current.click();
-            }
-        }
-    };
     const handleCalendarChange = (e) => {
         const isoDate = e.target.value;
+        playSound('click');
         if (isoDate) {
             onChange(isoDate);
         }
@@ -990,7 +962,9 @@ function DateInput({ label, value, onChange, placeholder = "25/12/2024", onFocus
             classes.push(styles$w.loading);
         return classes.join(' ');
     };
-    return (jsxRuntime.jsxs("div", { className: getClassName(), children: [jsxRuntime.jsx("label", { className: styles$w.label, children: label }), jsxRuntime.jsxs("div", { className: styles$w.inputWrapper, children: [jsxRuntime.jsx("input", { type: "text", value: value.includes('-') ? formatDateToEuropean(value) : value, onChange: (e) => handleTextChange(e.target.value), onFocus: onFocus, onBlur: onBlur, placeholder: placeholder, className: styles$w.textInput, disabled: disabled || loading, ...handlers }), jsxRuntime.jsx("button", { type: "button", onClick: handleCalendarClick, className: styles$w.calendarButton, title: "Select date from calendar", disabled: disabled || loading, children: jsxRuntime.jsx(lucideReact.Calendar, {}) }), jsxRuntime.jsx("input", { ref: hiddenDateInputRef, type: "date", onChange: handleCalendarChange, className: styles$w.hiddenDateInput, tabIndex: -1, disabled: disabled || loading })] })] }));
+    // Current ISO value for the native date input (or '' if empty/unparseable)
+    const isoValue = value.includes('-') ? value : (parseEuropeanDate(value) || '');
+    return (jsxRuntime.jsxs("div", { className: getClassName(), children: [jsxRuntime.jsx("label", { className: styles$w.label, children: label }), jsxRuntime.jsxs("div", { className: styles$w.inputWrapper, children: [jsxRuntime.jsx("input", { type: "text", value: value.includes('-') ? formatDateToEuropean(value) : value, onChange: (e) => handleTextChange(e.target.value), onFocus: onFocus, onBlur: onBlur, placeholder: placeholder, className: styles$w.textInput, disabled: disabled || loading, ...handlers }), jsxRuntime.jsxs("span", { className: styles$w.calendarButton, "aria-hidden": "true", children: [jsxRuntime.jsx(lucideReact.Calendar, {}), jsxRuntime.jsx("input", { type: "date", value: isoValue, onChange: handleCalendarChange, className: styles$w.nativeDateInput, title: "Select date from calendar", "aria-label": label ? `${label} calendar picker` : 'Calendar picker', disabled: disabled || loading })] })] })] }));
 }
 
 var styles$v = {"searchableDropdown":"SearchableDropdown-module_searchableDropdown__S2Nh5","dropdownTrigger":"SearchableDropdown-module_dropdownTrigger__dihdr","open":"SearchableDropdown-module_open__P7mRt","dropdownValue":"SearchableDropdown-module_dropdownValue__ydrc2","placeholder":"SearchableDropdown-module_placeholder__BwM2W","dropdownArrow":"SearchableDropdown-module_dropdownArrow__yd5fp","dropdownMenu":"SearchableDropdown-module_dropdownMenu__2Z5cc","dropdownSearch":"SearchableDropdown-module_dropdownSearch__NRk7j","searchInput":"SearchableDropdown-module_searchInput__VS2Hw","searchIcon":"SearchableDropdown-module_searchIcon__2vKFF","dropdownOptions":"SearchableDropdown-module_dropdownOptions__6YXqF","dropdownOption":"SearchableDropdown-module_dropdownOption__YwDr-","selected":"SearchableDropdown-module_selected__31JeB","highlighted":"SearchableDropdown-module_highlighted__P0bBq","checkIcon":"SearchableDropdown-module_checkIcon__YxowK","dropdownNoResults":"SearchableDropdown-module_dropdownNoResults__WW-Da","loading":"SearchableDropdown-module_loading__xlYf0"};