"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.IconContained = void 0;
var _react = _interopRequireWildcard(require("react"));
var React = _react;
var _reactNative = require("react-native");
var _core = require("../../core");
var _Icon = require("./Icon");
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 tonalColorMap = {
  neutral: {
    background: "blueIO-50",
    foreground: "grey-450"
  }
};
const variantMap = {
  tonal: tonalColorMap
};
const IconContainedDefaultSize = _core.IOVisualCostants.iconContainedSizeDefault;
const styles = _reactNative.StyleSheet.create({
  iconContainedWrapper: {
    overflow: "hidden",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    width: IconContainedDefaultSize,
    height: IconContainedDefaultSize,
    borderRadius: IconContainedDefaultSize / 2
  }
});

/*
`IconContained` is just a special wrapper for the `Icon` component. 
It's also not an interactive component, unlike the `IconButton`.
When adding new styles, you should be aware of this context and be careful
not to add variants that look like interactive counterparts.
*/
const IconContained = ({
  variant,
  color,
  icon
}) => {
  const backgroundColor = (0, _react.useMemo)(() => variantMap[variant][color].background, [variant, color]);
  const foregroundColor = (0, _react.useMemo)(() => variantMap[variant][color].foreground, [variant, color]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
    style: [styles.iconContainedWrapper, {
      backgroundColor: _core.IOColors[backgroundColor]
    }],
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
      name: icon,
      color: foregroundColor
    })
  });
};
exports.IconContained = IconContained;
//# sourceMappingURL=IconContained.js.map