@appfunnel-dev/sdk 0.10.0 → 0.12.0

package/dist/elements/index.d.cts

@@ -572,10 +572,12 @@ interface SingleSelectProps<T> {
     autoAdvance?: boolean;
     /** Delay in ms before auto-advancing (default: 200) */
     autoAdvanceDelay?: number;
+    /** Tap/click animation style (default: "none") */
+    clickAnimation?: 'none' | 'shrink' | 'grow';
     /** Container className */
     className?: string;
 }
-declare function SingleSelect<T>({ responseKey, options, keyExtractor, renderItem, autoAdvance, autoAdvanceDelay, className, }: SingleSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function SingleSelect<T>({ responseKey, options, keyExtractor, renderItem, autoAdvance, autoAdvanceDelay, clickAnimation, className, }: SingleSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface MultiSelectProps<T> {
     /** The response key to store the selected values under (in answers.*) */
@@ -594,10 +596,12 @@ interface MultiSelectProps<T> {
     min?: number;
     /** Maximum number of selections allowed (default: unlimited) */
     max?: number;
+    /** Tap/click animation style (default: "none") */
+    clickAnimation?: 'none' | 'shrink' | 'grow';
     /** Container className */
     className?: string;
 }
-declare function MultiSelect<T>({ responseKey, options, keyExtractor, renderItem, min, max, className, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function MultiSelect<T>({ responseKey, options, keyExtractor, renderItem, min, max, clickAnimation, className, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface LoadingProps {
     /** Spinner color (default: currentColor, inherits from parent) */

package/dist/elements/index.d.ts

@@ -572,10 +572,12 @@ interface SingleSelectProps<T> {
     autoAdvance?: boolean;
     /** Delay in ms before auto-advancing (default: 200) */
     autoAdvanceDelay?: number;
+    /** Tap/click animation style (default: "none") */
+    clickAnimation?: 'none' | 'shrink' | 'grow';
     /** Container className */
     className?: string;
 }
-declare function SingleSelect<T>({ responseKey, options, keyExtractor, renderItem, autoAdvance, autoAdvanceDelay, className, }: SingleSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function SingleSelect<T>({ responseKey, options, keyExtractor, renderItem, autoAdvance, autoAdvanceDelay, clickAnimation, className, }: SingleSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface MultiSelectProps<T> {
     /** The response key to store the selected values under (in answers.*) */
@@ -594,10 +596,12 @@ interface MultiSelectProps<T> {
     min?: number;
     /** Maximum number of selections allowed (default: unlimited) */
     max?: number;
+    /** Tap/click animation style (default: "none") */
+    clickAnimation?: 'none' | 'shrink' | 'grow';
     /** Container className */
     className?: string;
 }
-declare function MultiSelect<T>({ responseKey, options, keyExtractor, renderItem, min, max, className, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
+declare function MultiSelect<T>({ responseKey, options, keyExtractor, renderItem, min, max, clickAnimation, className, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
 interface LoadingProps {
     /** Spinner color (default: currentColor, inherits from parent) */

package/dist/elements/index.js

@@ -1,5 +1,5 @@
-import { useResponse, useNavigation } from '../chunk-P4SLDMWY.js';
-import { __require } from '../chunk-H3KHXZSI.js';
+import { useResponse, useNavigation } from '../chunk-GZKA33W2.js';
+import { __require } from '../chunk-DAHMOQ63.js';
 import * as React27 from 'react';
 import { forwardRef, useRef, useMemo, useCallback, useImperativeHandle, useEffect, useState, createContext, useId, useContext, useInsertionEffect, Children, isValidElement, useLayoutEffect, Fragment as Fragment$1, createElement, Component } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
@@ -12059,6 +12059,7 @@ function SingleSelect({
   renderItem,
   autoAdvance = true,
   autoAdvanceDelay = 200,
+  clickAnimation = "none",
   className
 }) {
   const [selected, setSelected] = useResponse(responseKey);
@@ -12085,7 +12086,16 @@ function SingleSelect({
   return /* @__PURE__ */ jsx("div", { className, children: options.map((item, index) => {
     const key = getKey(item, index);
     const active = selected === key;
-    return /* @__PURE__ */ jsx("div", { onClick: () => handleSelect(key), style: { cursor: "pointer" }, children: renderItem({ item, index, active }) }, key);
+    return /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        onClick: () => handleSelect(key),
+        style: { cursor: "pointer" },
+        ...clickAnimation !== "none" ? { whileTap: { scale: clickAnimation === "shrink" ? 0.95 : 1.05 }, transition: { duration: 0.15 } } : {},
+        children: renderItem({ item, index, active })
+      },
+      key
+    );
   }) });
 }
 function MultiSelect({
@@ -12095,6 +12105,7 @@ function MultiSelect({
   renderItem,
   min = 0,
   max,
+  clickAnimation = "none",
   className
 }) {
   const [selected, setSelected] = useResponse(responseKey);
@@ -12127,7 +12138,16 @@ function MultiSelect({
   return /* @__PURE__ */ jsx("div", { className, children: options.map((item, index) => {
     const key = getKey(item, index);
     const active = currentSelection.includes(key);
-    return /* @__PURE__ */ jsx("div", { onClick: () => handleToggle(key), style: { cursor: "pointer" }, children: renderItem({ item, index, active }) }, key);
+    return /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        onClick: () => handleToggle(key),
+        style: { cursor: "pointer" },
+        ...clickAnimation !== "none" ? { whileTap: { scale: clickAnimation === "shrink" ? 0.95 : 1.05 }, transition: { duration: 0.15 } } : {},
+        children: renderItem({ item, index, active })
+      },
+      key
+    );
   }) });
 }
 var SIZE = {