const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_useEngineContext = require("../../hooks/useEngineContext.js");
const require_index = require("./components/BrandPanel/index.js");
const require_index$1 = require("./components/LoginPanel/index.js");
const require_index$2 = require("./components/SelectDevice/index.js");
const require_index$3 = require("./components/SelectStore/index.js");
const require_index$4 = require("./components/UserFooter/index.js");
const require_locales = require("./locales.js");
const require_index$5 = require("../saasDevice/appDevicePlanning/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let _pisell_utils = require("@pisell/utils");
require("./WebPosLoginCpt.less");
//#region src/plus/webPosLogin/WebPosLoginCpt.tsx
/** 默认背景图片 */
const DEFAULT_BACKGROUND = "http://static.pisellcdn.com/defaultBg1.jpg";
/**
* WebPosLoginCpt 主组件
* @description WebPOS 登录流程组件，包含登录、店铺选择、设备选择三个步骤
*/
const WebPosLoginCpt = (0, react.memo)((props) => {
	var _context$appHelper;
	const { className = "", style, loginConfig, backgroundImage, brandConfig, step = "login", showBackButton = true, storeList = [], deviceList = [], userInfo, selectedStore, lastUsedStoreId, lastUsedDeviceId, locale = "en", loading = false, onStoreSelect, onDeviceSelect, onChangeAccount, onChangeStore, onBack, onLoginSuccess, onIotDeviceLinked, loginSlot, variant, onIotBack } = props;
	const isMobile = variant === "phone" || variant === "mobile";
	const context = require_useEngineContext.default();
	const { isIotLogin = false, iotKind } = (context === null || context === void 0 || (_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.constants) || {};
	console.log(props, onLoginSuccess, "onLoginSuccess");
	_pisell_utils.locales.init(require_locales.default, locale);
	/**
	* 获取当前步骤的标题
	*/
	const stepTitle = (0, react.useMemo)(() => {
		return {
			login: "",
			store: _pisell_utils.locales.getText("webpos-login-select-store-title"),
			device: _pisell_utils.locales.getText("webpos-login-select-device-title")
		}[step];
	}, [step, locale]);
	/**
	* 是否显示返回按钮
	* login 步骤默认不显示，其他步骤根据 showBackButton 配置
	*/
	const shouldShowBackButton = (0, react.useMemo)(() => {
		if (step === "login") return false;
		return showBackButton;
	}, [step, showBackButton]);
	/**
	* 渲染右侧交互区内容
	*/
	const renderRightContent = () => {
		switch (step) {
			case "login": return /* @__PURE__ */ react.default.createElement(require_index$1.default, {
				onLoginSuccess,
				config: loginConfig
			});
			case "store": return /* @__PURE__ */ react.default.createElement(require_index$3.default, {
				storeList,
				locale,
				loading,
				lastUsedStoreId,
				onSelect: onStoreSelect
			});
			case "device": return /* @__PURE__ */ react.default.createElement(require_index$2.default, {
				deviceList,
				locale,
				loading,
				lastUsedDeviceId,
				onSelect: onDeviceSelect
			});
			default: return null;
		}
	};
	/**
	* 渲染底部用户信息
	*/
	const renderFooter = () => {
		if (step === "login") return null;
		return /* @__PURE__ */ react.default.createElement(require_index$4.default, {
			isShowChangeStore: storeList.length > 1,
			userInfo,
			selectedStore,
			step,
			locale,
			onChangeAccount,
			onChangeStore
		});
	};
	console.log("xxxx=>>>>", isIotLogin, step);
	return isIotLogin && step === "device" ? /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__iot-device" }, /* @__PURE__ */ react.default.createElement(require_index$5.default, {
		kind: iotKind,
		onLinked: onIotDeviceLinked,
		showBack: true,
		onBack: onIotBack
	})) : /* @__PURE__ */ react.default.createElement("div", {
		className: `webpos-login ${isMobile ? "webpos-login--mobile" : ""} ${className}`.trim(),
		style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, style), {}, { backgroundImage: `url(${backgroundImage || DEFAULT_BACKGROUND})` })
	}, /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__backdrop" }), /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__card" }, /* @__PURE__ */ react.default.createElement(require_index.default, { config: brandConfig }), /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__right-panel" }, step === "login" ? loginSlot ? loginSlot : null : /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__header" }, shouldShowBackButton && /* @__PURE__ */ react.default.createElement("button", {
		className: "webpos-login__back-btn",
		onClick: onBack,
		type: "button",
		"aria-label": _pisell_utils.locales.getText("webpos-login-back")
	}, /* @__PURE__ */ react.default.createElement("svg", {
		width: "24",
		height: "24",
		viewBox: "0 0 24 24",
		fill: "none",
		xmlns: "http://www.w3.org/2000/svg"
	}, /* @__PURE__ */ react.default.createElement("path", {
		d: "M15 18L9 12L15 6",
		stroke: "currentColor",
		strokeWidth: "2",
		strokeLinecap: "round",
		strokeLinejoin: "round"
	}))), stepTitle && /* @__PURE__ */ react.default.createElement("h1", { className: "webpos-login__title" }, stepTitle)), /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__content" }, renderRightContent()), /* @__PURE__ */ react.default.createElement("div", { className: "webpos-login__footer" }, renderFooter()))));
});
WebPosLoginCpt.displayName = "WebPosLoginCpt";
//#endregion
exports.default = WebPosLoginCpt;
