import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";

var _templateObject;

import React from 'react';
import styled from 'styled-components';
import { SelectSizeModal } from '../../../Common/';
import { useProductState, useProductFunctions, useSizesReducer } from '@sentecacommerce-theme/lib';
export var SizeSelector = (_ref) => {
  var {
    openSelectSizeModal,
    handleClose,
    variantId
  } = _ref;
  var {
    metaData
  } = useProductState();
  var {
    selectVariantById
  } = useProductFunctions();
  React.useEffect(() => {
    selectVariantById(variantId);
  }, [variantId]);
  var {
    state,
    setSize,
    clearSize
  } = useSizesReducer();

  var onClose = () => {
    handleClose();
    clearSize();
  };

  return /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectSizeModal, {
    open: openSelectSizeModal,
    handleClose: onClose,
    title: metaData.name,
    stateSizeId: state.sizeId,
    setStateSizeId: setSize
  })));
};
var Container = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
//# sourceMappingURL=index.js.map