"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.AnimatedCheckbox = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
var _context = require("../../context");
var _core = require("../../core");
var _IOColors = require("../../core/IOColors");
var _accessibility = require("../../utils/accessibility");
var _AnimatedTick = require("../common/AnimatedTick");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const checkBoxRadius = 5;
const styles = _reactNative.StyleSheet.create({
  checkboxBorder: {
    borderWidth: _core.IOSelectionTickVisualParams.borderWidth,
    borderCurve: "continuous",
    position: "absolute",
    left: 0,
    top: 0
  },
  checkBoxSquare: {
    borderCurve: "continuous",
    position: "absolute",
    left: 0,
    top: 0
  }
});

/**
 * An animated checkbox. This can be used to implement a
 * standard {@link CheckBox} or other composite components.
 */
const AnimatedCheckbox = ({
  size,
  checked,
  onPress,
  disabled
}) => {
  const theme = (0, _context.useIOTheme)();
  const {
    dynamicFontScale
  } = (0, _accessibility.useIOFontDynamicScale)();
  const isChecked = checked ?? false;
  const borderColor = _IOColors.IOColors[theme["selection-border-off"]];
  const backgroundColor = _IOColors.IOColors[theme["selection-background-on"]];
  const squareAnimationProgress = (0, _reactNativeReanimated.useSharedValue)(checked ? 1 : 0);
  const tickAnimationProgress = (0, _reactNativeReanimated.useSharedValue)(checked ? 1 : 0);
  const checkboxSizeStyle = {
    width: size,
    height: size,
    borderRadius: checkBoxRadius * dynamicFontScale
  };
  const checkboxWrapperSizeStyle = {
    width: size,
    height: size
  };
  (0, _react.useEffect)(() => {
    // eslint-disable-next-line functional/immutable-data
    squareAnimationProgress.value = (0, _reactNativeReanimated.withSpring)(checked ? 1 : 0, _core.IOSpringValues.selection);
    // eslint-disable-next-line functional/immutable-data
    tickAnimationProgress.value = (0, _reactNativeReanimated.withTiming)(checked ? 1 : 0, {
      duration: 400,
      easing: _reactNativeReanimated.Easing.elastic(1)
    });
  }, [checked, squareAnimationProgress, tickAnimationProgress]);
  const animatedCheckboxSquare = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
    const scale = (0, _reactNativeReanimated.interpolate)(squareAnimationProgress.value, [0, 1], [0.5, 1]);
    const opacity = squareAnimationProgress.value;
    return {
      opacity,
      transform: [{
        scale
      }]
    };
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
    accessible: false,
    disabled: disabled,
    onPress: onPress,
    style: checkboxWrapperSizeStyle,
    testID: "AnimatedCheckboxInput",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
      style: [styles.checkboxBorder, checkboxSizeStyle, {
        borderColor
      }]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
      style: [styles.checkBoxSquare, checkboxSizeStyle, {
        backgroundColor
      }, animatedCheckboxSquare]
    }), isChecked && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
      style: {
        zIndex: 1
      },
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AnimatedTick.AnimatedTick, {
        size: size,
        progress: tickAnimationProgress,
        stroke: _IOColors.IOColors[theme["selection-tick"]]
      })
    })]
  });
};
exports.AnimatedCheckbox = AnimatedCheckbox;
//# sourceMappingURL=AnimatedCheckbox.js.map