@stfrigerio/sito-template 0.1.92 → 0.1.94

package/dist/index.js

@@ -1378,7 +1378,7 @@ function Toggle(props) {
                 }, onMouseEnter: () => handlers.onMouseEnter?.(), style: buttonStyle, children: [jsxRuntime.jsx(framerMotion.motion.div, { animate: { scale: isOn ? 1.1 : 1, rotate: isOn ? [0, 5, -5, 0] : 0 }, transition: { duration: 0.3 }, children: rightIcon }), rightLabel] })] }));
 }
 
-var styles$q = {"container":"NumberStepper-module_container__WSGlU","header":"NumberStepper-module_header__qXI1Y","icon":"NumberStepper-module_icon__vHgsw","label":"NumberStepper-module_label__AYr3g","stepper":"NumberStepper-module_stepper__oQhTp","disabled":"NumberStepper-module_disabled__kGB-g","button":"NumberStepper-module_button__YcjRt","buttonIcon":"NumberStepper-module_buttonIcon__odXec","valueContainer":"NumberStepper-module_valueContainer__87w2D","valueWrapper":"NumberStepper-module_valueWrapper__TH65N","value":"NumberStepper-module_value__BxJeD","limits":"NumberStepper-module_limits__-UrRE","limit":"NumberStepper-module_limit__7nbIP","small":"NumberStepper-module_small__P-k96","large":"NumberStepper-module_large__Lz6lk","outlined":"NumberStepper-module_outlined__CIXv7","filled":"NumberStepper-module_filled__IxOg-","minimal":"NumberStepper-module_minimal__y47-W","custom":"NumberStepper-module_custom__XGSVg","vertical":"NumberStepper-module_vertical__nBcL7","tally":"NumberStepper-module_tally__aO2zq","tallyRow":"NumberStepper-module_tallyRow__wcrtj","tallyIcon":"NumberStepper-module_tallyIcon__ynB4C","tallyLabel":"NumberStepper-module_tallyLabel__kjXos","tallyBody":"NumberStepper-module_tallyBody__wDBsU","tallyMarks":"NumberStepper-module_tallyMarks__RU5qJ","tallyGroup":"NumberStepper-module_tallyGroup__0qUNo","tallyHint":"NumberStepper-module_tallyHint__zi-GM","tallyValue":"NumberStepper-module_tallyValue__CFJDk","pulse":"NumberStepper-module_pulse__51oUo"};
+var styles$q = {"container":"NumberStepper-module_container__WSGlU","header":"NumberStepper-module_header__qXI1Y","icon":"NumberStepper-module_icon__vHgsw","label":"NumberStepper-module_label__AYr3g","stepper":"NumberStepper-module_stepper__oQhTp","disabled":"NumberStepper-module_disabled__kGB-g","button":"NumberStepper-module_button__YcjRt","buttonIcon":"NumberStepper-module_buttonIcon__odXec","valueContainer":"NumberStepper-module_valueContainer__87w2D","valueWrapper":"NumberStepper-module_valueWrapper__TH65N","value":"NumberStepper-module_value__BxJeD","limits":"NumberStepper-module_limits__-UrRE","limit":"NumberStepper-module_limit__7nbIP","small":"NumberStepper-module_small__P-k96","large":"NumberStepper-module_large__Lz6lk","outlined":"NumberStepper-module_outlined__CIXv7","filled":"NumberStepper-module_filled__IxOg-","minimal":"NumberStepper-module_minimal__y47-W","custom":"NumberStepper-module_custom__XGSVg","vertical":"NumberStepper-module_vertical__nBcL7","tally":"NumberStepper-module_tally__aO2zq","tallyRow":"NumberStepper-module_tallyRow__wcrtj","tallyButton":"NumberStepper-module_tallyButton__EUTXY","tallyButtonIcon":"NumberStepper-module_tallyButtonIcon__A3fDQ","tallyIcon":"NumberStepper-module_tallyIcon__ynB4C","tallyLabel":"NumberStepper-module_tallyLabel__kjXos","tallyBody":"NumberStepper-module_tallyBody__wDBsU","tallyMarks":"NumberStepper-module_tallyMarks__RU5qJ","tallyGroup":"NumberStepper-module_tallyGroup__0qUNo","tallyHint":"NumberStepper-module_tallyHint__zi-GM","tallyValue":"NumberStepper-module_tallyValue__CFJDk","pulse":"NumberStepper-module_pulse__51oUo"};
 
 /**
  * NumberStepper Component
@@ -1477,7 +1477,7 @@ var styles$q = {"container":"NumberStepper-module_container__WSGlU","header":"Nu
  * @param {NumberStepperProps} props - The props for the NumberStepper component
  * @returns {JSX.Element} The rendered NumberStepper component
  */
-const NumberStepper = ({ value, onChange, min = -Infinity, max = Infinity, step = 1, label, icon, disabled = false, size = 'medium', variant = 'default', showPlusMinus = false, allowKeyboard = true, className = '', customStyles = {}, customButtons = {}, hideLimits = false, layout = 'horizontal', soundConfig, color, longPressMs = 500, tallyEmptyHint = '— tap to log' }) => {
+const NumberStepper = ({ value, onChange, min = -Infinity, max = Infinity, step = 1, label, icon, disabled = false, size = 'medium', variant = 'default', showPlusMinus = false, allowKeyboard = true, className = '', customStyles = {}, customButtons = {}, hideLimits = false, layout = 'horizontal', soundConfig, color, tallyEmptyHint = '—' }) => {
     const { handlers, playSound } = useComponentSound(soundConfig);
     const [isIncrementing, setIsIncrementing] = React.useState(false);
     const [isDecrementing, setIsDecrementing] = React.useState(false);
@@ -1583,9 +1583,9 @@ const NumberStepper = ({ value, onChange, min = -Infinity, max = Infinity, step
                     ...customStyles.button,
                     ...(isButtonHovered === 'increment' && customStyles.buttonHover)
                 }, onMouseEnter: () => setIsButtonHovered('increment'), onMouseLeave: () => setIsButtonHovered(null), onClick: handleIncrement, disabled: isIncrementDisabled, whileTap: !isIncrementDisabled ? { scale: 0.9 } : undefined, animate: isIncrementing ? { scale: [1, 1.2, 1] } : undefined, transition: { duration: 0.2 }, "aria-label": "Increase value", children: customButtons.increment || (showPlusMinus ? (jsxRuntime.jsx("span", { className: styles$q.buttonIcon, style: customStyles.buttonIcon, children: "+" })) : (jsxRuntime.jsx("svg", { className: styles$q.buttonIcon, style: customStyles.buttonIcon, viewBox: "0 0 24 24", fill: "none", children: jsxRuntime.jsx("path", { d: "M9 18L15 12L9 6", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }))) })] }));
-    // ── Tally variant: pen-stroke counter. Tap row = +step, long-press = -step.
+    // ── Tally variant: pen-stroke counter with explicit +/- buttons.
     if (variant === 'tally') {
-        return (jsxRuntime.jsx(TallyRow, { value: value, label: label, icon: icon, color: color, disabled: disabled, max: max, min: min, longPressMs: longPressMs, emptyHint: tallyEmptyHint, className: containerClasses, customStyles: customStyles, onIncrement: handleIncrement, onDecrement: handleDecrement, ariaLabel: label || 'Tally counter', isDecrementDisabled: isDecrementDisabled, isIncrementDisabled: isIncrementDisabled }));
+        return (jsxRuntime.jsx(TallyRow, { value: value, label: label, icon: icon, color: color, disabled: disabled, emptyHint: tallyEmptyHint, className: containerClasses, customStyles: customStyles, onIncrement: handleIncrement, onDecrement: handleDecrement, ariaLabel: label || 'Tally counter', isDecrementDisabled: isDecrementDisabled, isIncrementDisabled: isIncrementDisabled }));
     }
     // For custom variant with horizontal layout, render differently
     if (variant === 'custom' && (label || icon)) {
@@ -1603,57 +1603,9 @@ const TallyMarks = ({ count, color }) => {
     }
     return (jsxRuntime.jsx("div", { className: styles$q.tallyMarks, "aria-hidden": "true", children: groups.map((n, i) => (jsxRuntime.jsxs("svg", { className: styles$q.tallyGroup, width: "38", height: "22", viewBox: "0 0 38 22", children: [[0, 1, 2, 3].slice(0, Math.min(4, n)).map((j) => (jsxRuntime.jsx("line", { x1: 4 + j * 6, y1: "2", x2: 4 + j * 6, y2: "20", stroke: color, strokeWidth: "2", strokeLinecap: "round" }, j))), n === 5 && (jsxRuntime.jsx("line", { x1: "1", y1: "18", x2: "27", y2: "4", stroke: color, strokeWidth: "2", strokeLinecap: "round" }))] }, i))) }));
 };
-const TallyRow = ({ value, label, icon, color, disabled, longPressMs, emptyHint, className, customStyles, onIncrement, onDecrement, ariaLabel, isDecrementDisabled, isIncrementDisabled }) => {
-    const timerRef = React.useRef(null);
-    const didLongPressRef = React.useRef(false);
+const TallyRow = ({ value, label, icon, color, disabled, emptyHint, className, customStyles, onIncrement, onDecrement, ariaLabel, isDecrementDisabled, isIncrementDisabled }) => {
     const resolvedColor = color || 'currentColor';
-    const clearTimer = () => {
-        if (timerRef.current !== null) {
-            clearTimeout(timerRef.current);
-            timerRef.current = null;
-        }
-    };
-    React.useEffect(() => () => clearTimer(), []);
-    const handlePointerDown = (e) => {
-        if (disabled)
-            return;
-        // only primary button
-        if (e.pointerType === 'mouse' && e.button !== 0)
-            return;
-        didLongPressRef.current = false;
-        clearTimer();
-        timerRef.current = setTimeout(() => {
-            didLongPressRef.current = true;
-            if (!isDecrementDisabled)
-                onDecrement();
-        }, longPressMs);
-    };
-    const handlePointerUp = () => {
-        if (disabled)
-            return;
-        const fired = didLongPressRef.current;
-        clearTimer();
-        if (!fired && !isIncrementDisabled)
-            onIncrement();
-    };
-    const handlePointerCancel = () => {
-        clearTimer();
-        didLongPressRef.current = false;
-    };
-    return (jsxRuntime.jsxs("div", { role: "button", tabIndex: disabled ? -1 : 0, "aria-label": ariaLabel, "aria-disabled": disabled || undefined, className: `${className} ${styles$q.tallyRow}`, style: customStyles.container, onPointerDown: handlePointerDown, onPointerUp: handlePointerUp, onPointerLeave: handlePointerCancel, onPointerCancel: handlePointerCancel, onContextMenu: (e) => e.preventDefault(), onKeyDown: (e) => {
-            if (disabled)
-                return;
-            if (e.key === 'Enter' || e.key === ' ') {
-                e.preventDefault();
-                if (!isIncrementDisabled)
-                    onIncrement();
-            }
-            else if (e.key === 'Backspace' || e.key === 'Delete') {
-                e.preventDefault();
-                if (!isDecrementDisabled)
-                    onDecrement();
-            }
-        }, children: [icon && (jsxRuntime.jsx("span", { className: styles$q.tallyIcon, style: { color: resolvedColor, ...customStyles.icon }, children: icon })), label && (jsxRuntime.jsx("span", { className: styles$q.tallyLabel, style: customStyles.label, children: label })), jsxRuntime.jsx("div", { className: styles$q.tallyBody, children: value <= 0 ? (jsxRuntime.jsx("span", { className: styles$q.tallyHint, children: emptyHint })) : (jsxRuntime.jsx(TallyMarks, { count: value, color: resolvedColor })) }), jsxRuntime.jsx("span", { className: styles$q.tallyValue, style: { color: resolvedColor, ...customStyles.value }, "aria-hidden": "true", children: value })] }));
+    return (jsxRuntime.jsxs("div", { "aria-label": ariaLabel, "aria-disabled": disabled || undefined, className: `${className} ${styles$q.tallyRow}`, style: customStyles.container, children: [icon && (jsxRuntime.jsx("span", { className: styles$q.tallyIcon, style: { color: resolvedColor, ...customStyles.icon }, children: icon })), label && (jsxRuntime.jsx("span", { className: styles$q.tallyLabel, style: customStyles.label, children: label })), jsxRuntime.jsx("div", { className: styles$q.tallyBody, children: value <= 0 ? (jsxRuntime.jsx("span", { className: styles$q.tallyHint, children: emptyHint })) : (jsxRuntime.jsx(TallyMarks, { count: value, color: resolvedColor })) }), jsxRuntime.jsx("button", { type: "button", className: styles$q.tallyButton, onClick: onDecrement, disabled: isDecrementDisabled, "aria-label": `Decrease ${label || 'value'}`, children: jsxRuntime.jsx("span", { className: styles$q.tallyButtonIcon, children: "\u2212" }) }), jsxRuntime.jsx("span", { className: styles$q.tallyValue, style: { color: resolvedColor, ...customStyles.value }, "aria-hidden": "true", children: value }), jsxRuntime.jsx("button", { type: "button", className: styles$q.tallyButton, onClick: onIncrement, disabled: isIncrementDisabled, "aria-label": `Increase ${label || 'value'}`, children: jsxRuntime.jsx("span", { className: styles$q.tallyButtonIcon, children: "+" }) })] }));
 };
 
 var styles$p = {"button":"ToggleButton-module_button__DTuyY","background":"ToggleButton-module_background__NwfTp","content":"ToggleButton-module_content__NHqIN","iconWrapper":"ToggleButton-module_iconWrapper__yN4sP","icon":"ToggleButton-module_icon__r8juX","label":"ToggleButton-module_label__4mPJP","hideMobile":"ToggleButton-module_hideMobile__GFAc3","checkmark":"ToggleButton-module_checkmark__ZJwf-","ripple":"ToggleButton-module_ripple__2-faB","small":"ToggleButton-module_small__MhfoN","large":"ToggleButton-module_large__A3naL","default":"ToggleButton-module_default__q8QaZ","active":"ToggleButton-module_active__4DjlR","outlined":"ToggleButton-module_outlined__OtqJB","filled":"ToggleButton-module_filled__LySNn","ghost":"ToggleButton-module_ghost__9KXcb","active-primary":"ToggleButton-module_active-primary__vXMP7","active-secondary":"ToggleButton-module_active-secondary__9Ttdx","active-success":"ToggleButton-module_active-success__oi0rr","active-danger":"ToggleButton-module_active-danger__VUdxr","active-warning":"ToggleButton-module_active-warning__77nSu","animation-scale":"ToggleButton-module_animation-scale__j-3mJ","scaleAnimation":"ToggleButton-module_scaleAnimation__Ms1j2","animation-rotate":"ToggleButton-module_animation-rotate__pBmfc","rotateAnimation":"ToggleButton-module_rotateAnimation__xWZJ5","animation-flip":"ToggleButton-module_animation-flip__ErAbm","flipAnimation":"ToggleButton-module_flipAnimation__qwDTb","disabled":"ToggleButton-module_disabled__Gv5ji"};