import locales_default from "./locales.js";
import useLanguage from "./hooks/useLanguage.js";
import store from "./store/store.js";
import useStore_default from "./hooks/useStore.js";
import useSymbol from "./hooks/useSymbol.js";
import Selector from "../../pro/Selector/index.js";
import { transformBundleGroup } from "./utils/transformBundleGroup.js";
import { transformOptionGroup } from "./utils/transformOptionGroup.js";
import { transformVariantGroup } from "./utils/transformVariantGroup.js";
import { transformValueToSelectorValue } from "./utils/transformValueToSelectorValue.js";
import { transformSelectorValueToValue } from "./utils/transformSelectorValueToValue.js";
import actions from "./store/actions.js";
import React, { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
import { locales } from "@pisell/utils";
import "./index.less";
//#region src/plus/skuOptionsSelection/index.tsx
const SelectorGroup = Selector.Group;
const SKUOptionsSelection = forwardRef((props, ref) => {
	const language = useLanguage();
	const symbol = useSymbol();
	locales.init(locales_default, language);
	const selectorGroupRef = useRef(null);
	const selectorDataSource = useStore_default((s) => s.selectorDataSource);
	const selectorValue = useStore_default((s) => s.selectorValue);
	useImperativeHandle(ref, () => {
		return {
			validate: () => {
				var _selectorGroupRef$cur;
				return (_selectorGroupRef$cur = selectorGroupRef.current) === null || _selectorGroupRef$cur === void 0 ? void 0 : _selectorGroupRef$cur.validate();
			},
			getValues: () => {
				var _selectorGroupRef$cur2;
				return (_selectorGroupRef$cur2 = selectorGroupRef.current) === null || _selectorGroupRef$cur2 === void 0 ? void 0 : _selectorGroupRef$cur2.getValues();
			},
			getTransformValues: () => {
				const _values = store.getState().selectorValue;
				return transformSelectorValueToValue(_values);
			}
		};
	});
	useEffect(() => {
		actions.updateSymbol(symbol);
	}, [symbol]);
	useEffect(() => {
		actions.updateConfig((props === null || props === void 0 ? void 0 : props.config) || {});
	}, [props === null || props === void 0 ? void 0 : props.config]);
	useEffect(() => {
		if (props === null || props === void 0 ? void 0 : props.skuCardConfig) actions.updateSkuCardConfig(props.skuCardConfig);
	}, [props === null || props === void 0 ? void 0 : props.skuCardConfig]);
	useEffect(() => {
		actions.updateCustomConfig((props === null || props === void 0 ? void 0 : props.customConfig) || {});
	}, [props === null || props === void 0 ? void 0 : props.customConfig]);
	useEffect(() => {
		actions.updateDataSource((props === null || props === void 0 ? void 0 : props.dataSource) || {});
	}, [props === null || props === void 0 ? void 0 : props.dataSource]);
	useEffect(() => {
		actions.updateValue((props === null || props === void 0 ? void 0 : props.value) || {});
	}, [props === null || props === void 0 ? void 0 : props.value]);
	useEffect(() => {
		const _transformValues = transformValueToSelectorValue((props === null || props === void 0 ? void 0 : props.value) || null, (props === null || props === void 0 ? void 0 : props.dataSource) || null);
		actions.updateSelectorValue(_transformValues);
	}, [props === null || props === void 0 ? void 0 : props.value, props === null || props === void 0 ? void 0 : props.dataSource]);
	useEffect(() => {
		var _props$dataSource, _props$dataSource3, _props$dataSource5;
		const _groupDataSource = [];
		if (props === null || props === void 0 || (_props$dataSource = props.dataSource) === null || _props$dataSource === void 0 ? void 0 : _props$dataSource.variant_group) {
			var _props$dataSource2;
			const renderVariantGroup = transformVariantGroup(props === null || props === void 0 || (_props$dataSource2 = props.dataSource) === null || _props$dataSource2 === void 0 ? void 0 : _props$dataSource2.variant_group);
			_groupDataSource.push(...renderVariantGroup);
		}
		if (props === null || props === void 0 || (_props$dataSource3 = props.dataSource) === null || _props$dataSource3 === void 0 ? void 0 : _props$dataSource3.option_group) {
			var _props$dataSource4;
			const renderOptionGroup = transformOptionGroup(props === null || props === void 0 || (_props$dataSource4 = props.dataSource) === null || _props$dataSource4 === void 0 ? void 0 : _props$dataSource4.option_group);
			_groupDataSource.push(...renderOptionGroup);
		}
		if (props === null || props === void 0 || (_props$dataSource5 = props.dataSource) === null || _props$dataSource5 === void 0 ? void 0 : _props$dataSource5.bundle_group) {
			var _props$dataSource6;
			const renderBundleGroup = transformBundleGroup(props === null || props === void 0 || (_props$dataSource6 = props.dataSource) === null || _props$dataSource6 === void 0 ? void 0 : _props$dataSource6.bundle_group);
			_groupDataSource.push(...renderBundleGroup);
		}
		actions.updateSelectorDataSource(_groupDataSource);
	}, [props === null || props === void 0 ? void 0 : props.dataSource]);
	useEffect(() => {
		return () => {
			var _selectorGroupRef$cur3, _selectorGroupRef$cur4;
			(_selectorGroupRef$cur3 = selectorGroupRef.current) === null || _selectorGroupRef$cur3 === void 0 || (_selectorGroupRef$cur4 = _selectorGroupRef$cur3.clear) === null || _selectorGroupRef$cur4 === void 0 || _selectorGroupRef$cur4.call(_selectorGroupRef$cur3);
			actions.clearStore();
		};
	}, []);
	return /* @__PURE__ */ React.createElement(SelectorGroup, {
		ref: selectorGroupRef,
		dataSource: selectorDataSource,
		value: selectorValue,
		onChange: (values) => {
			var _props$onChange;
			console.log("selector_onChange_values>>>>>>>", values);
			actions.updateSelectorValue(values);
			const transformValue = transformSelectorValueToValue(values);
			console.log("selector_onChange_transformValue>>>>>>>", transformValue);
			props === null || props === void 0 || (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, transformValue);
		},
		style: props === null || props === void 0 ? void 0 : props.style,
		customScrollParent: props === null || props === void 0 ? void 0 : props.customScrollParent,
		theme: props === null || props === void 0 ? void 0 : props.theme
	});
});
//#endregion
export { SKUOptionsSelection as default };
