@multiplatform.one/components 7.4.0 → 7.5.0

package/dist/esm/Wheel/index.native.js

@@ -1,680 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useTranslation } from "../shared/i18n.native.js";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
-import { View, getTokens, isWeb, styled, Text } from "tamagui";
-function _type_of(obj) {
-  "@swc/helpers - typeof";
-
-  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-}
-var friction = 0.95;
-var minVelocity = 0.5;
-var momentumMultiplier = 0.8;
-var rubberBandConstant = 0.55;
-var tapSlopPx = 8;
-var diameterRatio = 1.07;
-var squeeze = 1.45;
-var perspectivePx = 400;
-var defaultColumnWidth = 88;
-var wheelFontBySize = {
-  small: "$6",
-  medium: "$8",
-  large: "$9"
-};
-var transitionDurationsMs = {
-  bouncy: 200,
-  lazy: 600,
-  slow: 500,
-  medium: 250,
-  quick: 100,
-  tooltip: 400,
-  snappy: 80,
-  gentle: 450
-};
-var WHEEL_FOCUS_STYLE_ID = "mp1-wheel-focus";
-function ensureWheelFocusStyles() {
-  if (!isWeb || typeof document === "undefined") return;
-  if (document.getElementById(WHEEL_FOCUS_STYLE_ID)) return;
-  var style = document.createElement("style");
-  style.id = WHEEL_FOCUS_STYLE_ID;
-  style.textContent = ".mp1-wheel-wrapper:focus-visible { outline: 2px solid var(--outlineColor, rgba(0,0,0,0.5)); outline-offset: -2px; }";
-  document.head.appendChild(style);
-}
-var wheelMaskStyle = isWeb ? {
-  WebkitMaskImage: "linear-gradient(to bottom, rgba(0,0,0,0.28) 0%, #000 32%, #000 68%, rgba(0,0,0,0.28) 100%)",
-  maskImage: "linear-gradient(to bottom, rgba(0,0,0,0.28) 0%, #000 32%, #000 68%, rgba(0,0,0,0.28) 100%)"
-} : void 0;
-var WheelContainer = styled(View, {
-  name: "Wheel",
-  position: "relative",
-  overflow: "hidden",
-  userSelect: "none"
-});
-var WheelItemContainer = styled(View, {
-  name: "WheelItem",
-  position: "absolute",
-  left: 0,
-  right: 0,
-  alignItems: "center",
-  justifyContent: "center",
-  userSelect: "none"
-});
-var SelectionIndicator = styled(View, {
-  name: "WheelSelectionIndicator",
-  position: "absolute",
-  left: 0,
-  right: 0,
-  pointerEvents: "none"
-});
-function normalizeItem(item) {
-  if ((typeof item === "undefined" ? "undefined" : _type_of(item)) === "object" && item !== null && "value" in item) {
-    return item;
-  }
-  return {
-    value: item,
-    label: String(item)
-  };
-}
-function getItemLabel(item) {
-  var _normalized_label;
-  var normalized = normalizeItem(item);
-  return (_normalized_label = normalized.label) !== null && _normalized_label !== void 0 ? _normalized_label : String(normalized.value);
-}
-function getItemValue(item) {
-  var normalized = normalizeItem(item);
-  return normalized.value;
-}
-function modIndex(row, n) {
-  if (n <= 0) return 0;
-  return (row % n + n) % n;
-}
-function equivalentOffsetNear(referenceOffset, targetOffset, n, itemHeight) {
-  if (n <= 0 || itemHeight <= 0) return targetOffset;
-  var rT = Math.round(targetOffset / itemHeight);
-  var m = modIndex(rT, n);
-  var span = n * itemHeight;
-  var base = m * itemHeight;
-  var k = Math.round((referenceOffset - base) / span);
-  return base + k * span;
-}
-function nearestRowForDataIndex(currentRow, targetDataIndex, n) {
-  var currentMod = modIndex(currentRow, n);
-  var delta = targetDataIndex - currentMod;
-  if (delta > n / 2) delta -= n;
-  if (delta < -n / 2) delta += n;
-  return currentRow + delta;
-}
-function rubberBand(offset, dimension) {
-  var c = rubberBandConstant;
-  var x = Math.abs(offset);
-  var result = x * dimension * c / (dimension + c * x);
-  return offset < 0 ? -result : result;
-}
-function getItemTransform(index, scrollOffset, itemHeight, containerHeight) {
-  var radius = containerHeight * diameterRatio / 2;
-  var angle = (index * itemHeight - scrollOffset) / squeeze / Math.max(radius, 1);
-  var clamped = Math.max(-Math.PI / 2, Math.min(Math.PI / 2, angle));
-  var centerTop = (containerHeight - itemHeight) / 2;
-  var translateY = centerTop + radius * Math.sin(clamped);
-  var rotateX = -(clamped * 180) / Math.PI;
-  var scale = Math.max(0.72, Math.min(1, Math.cos(clamped)));
-  return {
-    translateY,
-    rotateX,
-    scale,
-    opacity: 1
-  };
-}
-function tokenPx(token, scale) {
-  var _getTokens_scale_key, _getTokens_scale;
-  if (typeof token === "number") return token;
-  var key = String(token).replace(/^\$/, "");
-  var val = (_getTokens_scale = getTokens()[scale]) === null || _getTokens_scale === void 0 ? void 0 : (_getTokens_scale_key = _getTokens_scale[key]) === null || _getTokens_scale_key === void 0 ? void 0 : _getTokens_scale_key.val;
-  if (typeof val === "number") return val;
-  return scale === "radius" ? 9 : 8;
-}
-function highlightBandStyle(edges, radiusToken, pointy) {
-  var r = pointy ? 0 : tokenPx(radiusToken, "radius");
-  var inset = tokenPx("$2", "space");
-  var capStart = edges === "all" || edges === "start";
-  var capEnd = edges === "all" || edges === "end";
-  return {
-    borderStartStartRadius: capStart ? r : 0,
-    borderStartEndRadius: capEnd ? r : 0,
-    borderEndStartRadius: capStart ? r : 0,
-    borderEndEndRadius: capEnd ? r : 0,
-    marginInlineStart: capStart ? inset : 0,
-    marginInlineEnd: capEnd ? inset : 0
-  };
-}
-function Wheel(param) {
-  var {
-    items,
-    value,
-    onChange,
-    visibleItems = 5,
-    itemHeight: itemHeightProp,
-    width: widthProp,
-    renderItem,
-    disabled = false,
-    size: sizeProp,
-    loop = false,
-    highlightEdges = "all",
-    "aria-label": ariaLabel
-  } = param;
-  var _knobProps_size, _ref, _ref1, _transitionDurationsMs_motionTransition;
-  var {
-    t
-  } = useTranslation();
-  var {
-    knobProps
-  } = useResolvedKnobs();
-  var sizeKnob = (_knobProps_size = knobProps.size) !== null && _knobProps_size !== void 0 ? _knobProps_size : "medium";
-  var size = (_ref = sizeProp !== null && sizeProp !== void 0 ? sizeProp : wheelFontBySize[sizeKnob]) !== null && _ref !== void 0 ? _ref : "$8";
-  var itemHeight = (_ref1 = itemHeightProp !== null && itemHeightProp !== void 0 ? itemHeightProp : knobProps.nestedControl.px) !== null && _ref1 !== void 0 ? _ref1 : 32;
-  var columnWidth = widthProp !== null && widthProp !== void 0 ? widthProp : defaultColumnWidth;
-  ensureWheelFocusStyles();
-  var motionTransition = knobProps.transition;
-  var snapDurationMs = motionTransition ? (_transitionDurationsMs_motionTransition = transitionDurationsMs[motionTransition]) !== null && _transitionDurationsMs_motionTransition !== void 0 ? _transitionDurationsMs_motionTransition : 100 : 0;
-  var containerRef = useRef(null);
-  var [scrollOffset, setScrollOffset] = useState(0);
-  var [selectedIndex, setSelectedIndex] = useState(0);
-  var n = items.length;
-  var loopEnabled = Boolean(loop && n > 1);
-  var scrollOffsetRef = useRef(scrollOffset);
-  scrollOffsetRef.current = scrollOffset;
-  var animationRef = useRef(null);
-  var isAnimatingRef = useRef(false);
-  var hasMountedRef = useRef(false);
-  var selectedIndexRef = useRef(selectedIndex);
-  selectedIndexRef.current = selectedIndex;
-  var isDraggingRef = useRef(false);
-  var lastYRef = useRef(0);
-  var downYRef = useRef(0);
-  var dragDistanceRef = useRef(0);
-  var lastTimeRef = useRef(0);
-  var dragVelocitiesRef = useRef([]);
-  var containerHeight = itemHeight * visibleItems;
-  var paddingItems = Math.floor(visibleItems / 2);
-  var minOffset = 0;
-  var maxOffset = n > 0 ? (n - 1) * itemHeight : 0;
-  var liveDataIndex = n === 0 ? 0 : loopEnabled ? modIndex(Math.round(scrollOffset / itemHeight), n) : Math.max(0, Math.min(Math.round(scrollOffset / itemHeight), n - 1));
-  var runSnapComplete = useCallback(function (finalOffset, dataIndex) {
-    var safeIdx = Math.max(0, Math.min(dataIndex, n - 1));
-    var settled = loopEnabled && n > 0 ? equivalentOffsetNear(0, finalOffset, n, itemHeight) : finalOffset;
-    scrollOffsetRef.current = settled;
-    setScrollOffset(settled);
-    setSelectedIndex(safeIdx);
-    onChange === null || onChange === void 0 ? void 0 : onChange(getItemValue(items[safeIdx]));
-    isAnimatingRef.current = false;
-  }, [items, n, onChange, loopEnabled, itemHeight]);
-  var animateToOffset = useCallback(function (targetOffset, dataIndex, animated) {
-    var startOffset = scrollOffsetRef.current;
-    var goal = loopEnabled && n > 0 ? equivalentOffsetNear(startOffset, targetOffset, n, itemHeight) : targetOffset;
-    if (!animated || snapDurationMs <= 0) {
-      runSnapComplete(goal, dataIndex);
-      return;
-    }
-    var distance = goal - startOffset;
-    if (Math.abs(distance) < 0.5) {
-      runSnapComplete(goal, dataIndex);
-      return;
-    }
-    var duration = snapDurationMs;
-    var startTime = performance.now();
-    var animate = function animate1(currentTime) {
-      var elapsed = currentTime - startTime;
-      var progress = Math.min(elapsed / duration, 1);
-      var eased = 1 - Math.pow(1 - progress, 3);
-      var newOffset = startOffset + distance * eased;
-      scrollOffsetRef.current = newOffset;
-      setScrollOffset(newOffset);
-      if (progress < 1) {
-        animationRef.current = requestAnimationFrame(animate);
-      } else {
-        runSnapComplete(goal, dataIndex);
-      }
-    };
-    isAnimatingRef.current = true;
-    if (animationRef.current) cancelAnimationFrame(animationRef.current);
-    animationRef.current = requestAnimationFrame(animate);
-  }, [loopEnabled, n, itemHeight, runSnapComplete, snapDurationMs]);
-  var snapToIndex = useCallback(function (targetIndex) {
-    var animated = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-    if (n === 0) return;
-    var clampedData = Math.max(0, Math.min(targetIndex, n - 1));
-    if (!loopEnabled) {
-      var targetOffset = clampedData * itemHeight;
-      animateToOffset(targetOffset, clampedData, animated);
-      return;
-    }
-    var currentR = Math.round(scrollOffsetRef.current / itemHeight);
-    var targetR = nearestRowForDataIndex(currentR, clampedData, n);
-    var targetOffset1 = targetR * itemHeight;
-    var dataIdx = modIndex(targetR, n);
-    animateToOffset(targetOffset1, dataIdx, animated);
-  }, [n, itemHeight, loopEnabled, animateToOffset]);
-  useEffect(function () {
-    if (value === void 0) return;
-    var index = items.findIndex(function (item) {
-      return getItemValue(item) === value;
-    });
-    if (index === -1) return;
-    if (!hasMountedRef.current) {
-      hasMountedRef.current = true;
-      setSelectedIndex(index);
-      var raw = index * itemHeight;
-      var settled = loopEnabled && n > 1 ? equivalentOffsetNear(0, raw, n, itemHeight) : raw;
-      scrollOffsetRef.current = settled;
-      setScrollOffset(settled);
-      return;
-    }
-    if (isDraggingRef.current) {
-      setSelectedIndex(index);
-      return;
-    }
-    if (index === selectedIndexRef.current && !isAnimatingRef.current) {
-      return;
-    }
-    snapToIndex(index, true);
-  }, [value, items, itemHeight, loopEnabled, n, snapToIndex]);
-  var snapToNearestRow = useCallback(function () {
-    var animated = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-    if (n === 0) return;
-    var r = Math.round(scrollOffsetRef.current / itemHeight);
-    if (loopEnabled) {
-      var targetOffset = r * itemHeight;
-      var dataIdx = modIndex(r, n);
-      animateToOffset(targetOffset, dataIdx, animated);
-    } else {
-      var dataIdx1 = Math.max(0, Math.min(r, n - 1));
-      animateToOffset(dataIdx1 * itemHeight, dataIdx1, animated);
-    }
-  }, [n, itemHeight, loopEnabled, animateToOffset]);
-  var hitTestDataIndex = useCallback(function (tapY) {
-    if (n === 0) return null;
-    var offset = scrollOffsetRef.current;
-    var centerRow = Math.round(offset / itemHeight);
-    var rowBuffer = paddingItems + 5;
-    var best = null;
-    for (var vr = centerRow - rowBuffer; vr <= centerRow + rowBuffer; vr++) {
-      if (!loopEnabled && (vr < 0 || vr >= n)) continue;
-      var dataIndex = loopEnabled ? modIndex(vr, n) : vr;
-      var {
-        translateY
-      } = getItemTransform(vr, offset, itemHeight, containerHeight);
-      var dist = Math.abs(translateY + itemHeight / 2 - tapY);
-      if (!best || dist < best.dist) best = {
-        dataIndex,
-        dist
-      };
-    }
-    if (best && best.dist <= itemHeight) return best.dataIndex;
-    return null;
-  }, [n, itemHeight, paddingItems, loopEnabled, containerHeight]);
-  var startMomentum = useCallback(function (initialVelocity) {
-    if (snapDurationMs <= 0) {
-      snapToNearestRow(false);
-      return;
-    }
-    var velocity = initialVelocity * momentumMultiplier;
-    var offset = scrollOffsetRef.current;
-    var animate = function animate1() {
-      velocity *= friction;
-      offset += velocity;
-      if (!loopEnabled) {
-        if (offset < minOffset) {
-          offset = minOffset + rubberBand(offset - minOffset, containerHeight);
-          velocity *= 0.5;
-        } else if (offset > maxOffset) {
-          offset = maxOffset + rubberBand(offset - maxOffset, containerHeight);
-          velocity *= 0.5;
-        }
-      }
-      scrollOffsetRef.current = offset;
-      setScrollOffset(offset);
-      if (Math.abs(velocity) > minVelocity) {
-        animationRef.current = requestAnimationFrame(animate);
-      } else {
-        snapToNearestRow(true);
-      }
-    };
-    isAnimatingRef.current = true;
-    if (animationRef.current) cancelAnimationFrame(animationRef.current);
-    animationRef.current = requestAnimationFrame(animate);
-  }, [loopEnabled, minOffset, maxOffset, containerHeight, snapToNearestRow, snapDurationMs]);
-  var handlePointerDown = useCallback(function (e) {
-    if (disabled) return;
-    if (animationRef.current) {
-      cancelAnimationFrame(animationRef.current);
-      isAnimatingRef.current = false;
-    }
-    isDraggingRef.current = true;
-    lastYRef.current = e.clientY;
-    downYRef.current = e.clientY;
-    dragDistanceRef.current = 0;
-    lastTimeRef.current = performance.now();
-    dragVelocitiesRef.current = [];
-    if (isWeb && containerRef.current) {
-      containerRef.current.setPointerCapture(e.pointerId);
-      containerRef.current.style.cursor = "grabbing";
-    }
-  }, [disabled]);
-  var handlePointerMove = useCallback(function (e) {
-    if (!isDraggingRef.current || disabled) return;
-    var currentY = e.clientY;
-    var currentTime = performance.now();
-    var deltaY = lastYRef.current - currentY;
-    var deltaTime = currentTime - lastTimeRef.current;
-    dragDistanceRef.current += Math.abs(deltaY);
-    if (deltaTime > 0) {
-      var velocity = deltaY / deltaTime * 16;
-      dragVelocitiesRef.current.push(velocity);
-      if (dragVelocitiesRef.current.length > 5) {
-        dragVelocitiesRef.current.shift();
-      }
-    }
-    var newOffset = scrollOffsetRef.current + deltaY;
-    if (!loopEnabled) {
-      if (newOffset < minOffset) {
-        newOffset = minOffset + rubberBand(newOffset - minOffset, containerHeight);
-      } else if (newOffset > maxOffset) {
-        newOffset = maxOffset + rubberBand(newOffset - maxOffset, containerHeight);
-      }
-    }
-    scrollOffsetRef.current = newOffset;
-    setScrollOffset(newOffset);
-    lastYRef.current = currentY;
-    lastTimeRef.current = currentTime;
-  }, [disabled, loopEnabled, minOffset, maxOffset, containerHeight]);
-  var handlePointerUp = useCallback(function (e) {
-    if (!isDraggingRef.current) return;
-    isDraggingRef.current = false;
-    if (isWeb && containerRef.current) {
-      try {
-        containerRef.current.releasePointerCapture(e.pointerId);
-      } catch (unused) {}
-      containerRef.current.style.cursor = disabled ? "not-allowed" : "grab";
-    }
-    if (dragDistanceRef.current < tapSlopPx) {
-      var _ref2;
-      var _containerRef_current;
-      var rect = (_containerRef_current = containerRef.current) === null || _containerRef_current === void 0 ? void 0 : _containerRef_current.getBoundingClientRect();
-      var tapY = e.clientY - ((_ref2 = rect === null || rect === void 0 ? void 0 : rect.top) !== null && _ref2 !== void 0 ? _ref2 : 0);
-      var tapped = hitTestDataIndex(tapY);
-      if (tapped != null) {
-        snapToIndex(tapped, true);
-        return;
-      }
-    }
-    var velocities = dragVelocitiesRef.current;
-    if (velocities.length > 0) {
-      var avgVelocity = velocities.reduce(function (a, b) {
-        return a + b;
-      }, 0) / velocities.length;
-      if (Math.abs(avgVelocity) > minVelocity * 2) {
-        startMomentum(avgVelocity);
-      } else {
-        snapToNearestRow(true);
-      }
-    } else {
-      snapToNearestRow(true);
-    }
-  }, [snapToNearestRow, startMomentum, hitTestDataIndex, snapToIndex, disabled]);
-  var handleWheel = useCallback(function (e) {
-    if (disabled) return;
-    e.preventDefault();
-    if (animationRef.current) {
-      cancelAnimationFrame(animationRef.current);
-      isAnimatingRef.current = false;
-    }
-    var delta = e.deltaY;
-    var currentOffset = scrollOffsetRef.current;
-    var newOffset = currentOffset + delta;
-    if (!loopEnabled) {
-      if (newOffset < minOffset) {
-        newOffset = minOffset;
-      } else if (newOffset > maxOffset) {
-        newOffset = maxOffset;
-      }
-    }
-    scrollOffsetRef.current = newOffset;
-    setScrollOffset(newOffset);
-    if (animationRef.current) cancelAnimationFrame(animationRef.current);
-    animationRef.current = requestAnimationFrame(function () {
-      setTimeout(function () {
-        if (!isDraggingRef.current && !isAnimatingRef.current) {
-          snapToNearestRow(true);
-        }
-      }, 100);
-    });
-  }, [disabled, loopEnabled, minOffset, maxOffset, snapToNearestRow]);
-  var handleKeyDown = useCallback(function (e) {
-    if (disabled) return;
-    var delta = 0;
-    switch (e.key) {
-      case "ArrowUp":
-      case "k":
-        delta = -1;
-        break;
-      case "ArrowDown":
-      case "j":
-        delta = 1;
-        break;
-      case "PageUp":
-        delta = -visibleItems;
-        break;
-      case "PageDown":
-        delta = visibleItems;
-        break;
-      case "Home":
-        snapToIndex(0);
-        e.preventDefault();
-        return;
-      case "End":
-        snapToIndex(n - 1);
-        e.preventDefault();
-        return;
-      default:
-        return;
-    }
-    e.preventDefault();
-    if (loopEnabled) {
-      var newIndex = modIndex(selectedIndex + delta, n);
-      snapToIndex(newIndex);
-    } else {
-      var newIndex1 = Math.max(0, Math.min(selectedIndex + delta, n - 1));
-      snapToIndex(newIndex1);
-    }
-  }, [disabled, selectedIndex, n, visibleItems, snapToIndex, loopEnabled]);
-  useEffect(function () {
-    if (!isWeb) return;
-    var container = containerRef.current;
-    if (!container) return;
-    var wheelHandler = function wheelHandler2(e) {
-      return handleWheel(e);
-    };
-    container.addEventListener("wheel", wheelHandler, {
-      passive: false
-    });
-    return function () {
-      container.removeEventListener("wheel", wheelHandler);
-    };
-  }, [handleWheel]);
-  useEffect(function () {
-    return function () {
-      if (animationRef.current) {
-        cancelAnimationFrame(animationRef.current);
-      }
-    };
-  }, []);
-  var renderRows = useMemo(function () {
-    if (n === 0) return [];
-    if (loopEnabled) {
-      var centerRow = Math.round(scrollOffset / itemHeight);
-      var rowBuffer = paddingItems + 5;
-      var list = [];
-      for (var vr = centerRow - rowBuffer; vr <= centerRow + rowBuffer; vr++) {
-        list.push({
-          virtualRow: vr,
-          dataIndex: modIndex(vr, n)
-        });
-      }
-      return list;
-    }
-    var start = Math.max(0, Math.floor(scrollOffset / itemHeight) - paddingItems - 1);
-    var end = Math.min(n - 1, Math.ceil((scrollOffset + containerHeight) / itemHeight) + paddingItems + 1);
-    return Array.from({
-      length: end - start + 1
-    }, function (_, i) {
-      var virtualRow = start + i;
-      return {
-        virtualRow,
-        dataIndex: virtualRow
-      };
-    });
-  }, [n, loopEnabled, scrollOffset, itemHeight, paddingItems, containerHeight]);
-  var itemColor = function itemColor2(isSelected) {
-    return disabled ? "$color10" : isSelected ? "$color12" : "$color11";
-  };
-  var radiusToken = knobProps.borderRadius.borderRadius;
-  var highlightStyle = highlightBandStyle(highlightEdges, radiusToken, Boolean(knobProps.pointy));
-  var highlightSmoothClass = "className" in knobProps.borderRadius && typeof knobProps.borderRadius.className === "string" ? knobProps.borderRadius.className : void 0;
-  var renderItemNode = function renderItemNode2(dataIndex, isSelected) {
-    var item = items[dataIndex];
-    var itemValue = getItemValue(item);
-    if (renderItem) return renderItem(itemValue, dataIndex, isSelected);
-    return /* @__PURE__ */_jsx(Text, {
-      ...knobProps.body,
-      fontSize: size,
-      fontWeight: isSelected && !disabled ? "600" : "400",
-      color: itemColor(isSelected),
-      numberOfLines: 1,
-      ellipsizeMode: "tail",
-      maxWidth: "100%",
-      px: "$2",
-      children: getItemLabel(item)
-    });
-  };
-  return /* @__PURE__ */_jsxs(WheelContainer, {
-    height: containerHeight,
-    width: columnWidth,
-    minWidth: columnWidth,
-    ...knobProps.containerRadius,
-    "data-testid": "wheel",
-    "data-disabled": disabled ? true : void 0,
-    "aria-disabled": disabled || void 0,
-    opacity: 1,
-    children: [/* iOS 14+ selection fill — LC-71 selected=fill, never hairline borders */
-    /* @__PURE__ */_jsx(SelectionIndicator, {
-      className: highlightSmoothClass,
-      backgroundColor: "$color4",
-      top: paddingItems * itemHeight,
-      height: itemHeight,
-      style: highlightStyle,
-      "data-testid": "wheel-selection"
-    }), /* Interactive container */
-    isWeb ? /* @__PURE__ */_jsx("div", {
-      ref: containerRef,
-      className: "mp1-wheel-wrapper",
-      tabIndex: disabled ? -1 : 0,
-      role: "slider",
-      "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : t("Value picker"),
-      "aria-orientation": "vertical",
-      "aria-valuemin": 0,
-      "aria-valuemax": Math.max(0, n - 1),
-      "aria-valuenow": selectedIndex,
-      "aria-valuetext": items[selectedIndex] !== void 0 ? getItemLabel(items[selectedIndex]) : void 0,
-      "aria-disabled": disabled || void 0,
-      "data-disabled": disabled ? true : void 0,
-      style: {
-        width: "100%",
-        height: containerHeight,
-        position: "relative",
-        perspective: `${perspectivePx}px`,
-        perspectiveOrigin: "center center",
-        overflow: "hidden",
-        userSelect: "none",
-        touchAction: "none",
-        cursor: disabled ? "not-allowed" : "grab",
-        ...wheelMaskStyle
-      },
-      onPointerDown: handlePointerDown,
-      onPointerMove: handlePointerMove,
-      onPointerUp: handlePointerUp,
-      onPointerCancel: handlePointerUp,
-      onKeyDown: handleKeyDown,
-      "data-testid": "wheel-wrapper",
-      children: renderRows.map(function (param2) {
-        var {
-          virtualRow,
-          dataIndex
-        } = param2;
-        var isSelected = dataIndex === liveDataIndex;
-        var transform = getItemTransform(virtualRow, scrollOffset, itemHeight, containerHeight);
-        if (Math.abs(transform.rotateX) > 85) return null;
-        return /* @__PURE__ */_jsx("div", {
-          "data-testid": "wheel-item",
-          "data-index": dataIndex,
-          "data-selected": isSelected ? true : void 0,
-          "aria-hidden": isSelected ? void 0 : true,
-          style: {
-            position: "absolute",
-            left: 0,
-            right: 0,
-            height: itemHeight,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            transform: `translateY(${transform.translateY}px) rotateX(${transform.rotateX}deg) scale(${transform.scale})`,
-            opacity: transform.opacity,
-            pointerEvents: "none",
-            transformOrigin: "center center",
-            transformStyle: "preserve-3d",
-            backfaceVisibility: "hidden"
-          },
-          children: renderItemNode(dataIndex, isSelected)
-        }, `${dataIndex}-${virtualRow}`);
-      })
-    }) : /* @__PURE__ */_jsx(View, {
-      width: "100%",
-      height: containerHeight,
-      position: "relative",
-      overflow: "hidden",
-      cursor: disabled ? "not-allowed" : "grab",
-      "data-disabled": disabled ? true : void 0,
-      "aria-disabled": disabled || void 0,
-      onPointerDown: handlePointerDown,
-      onPointerMove: handlePointerMove,
-      onPointerUp: handlePointerUp,
-      onPointerCancel: handlePointerUp,
-      children: renderRows.map(function (param2) {
-        var {
-          virtualRow,
-          dataIndex
-        } = param2;
-        var isSelected = dataIndex === liveDataIndex;
-        var transform = getItemTransform(virtualRow, scrollOffset, itemHeight, containerHeight);
-        if (Math.abs(transform.rotateX) > 85) return null;
-        return /* @__PURE__ */_jsx(View, {
-          position: "absolute",
-          left: 0,
-          right: 0,
-          height: itemHeight,
-          alignItems: "center",
-          justifyContent: "center",
-          opacity: transform.opacity,
-          pointerEvents: "none",
-          y: transform.translateY,
-          scale: transform.scale,
-          rotateX: `${transform.rotateX}deg`,
-          children: renderItemNode(dataIndex, isSelected)
-        }, `${dataIndex}-${virtualRow}`);
-      })
-    })]
-  });
-}
-Wheel.Item = WheelItemContainer;
+import { Wheel } from "@multiplatform.one/forms";
 export { Wheel };
 //# sourceMappingURL=index.native.js.map