const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_Color = require("./Color.js");
const require_IconPanel = require("./IconPanel.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_materials = require("@pisell/materials");
require("./index.less");
//#region src/components/workSpaceList/components/AppearanceEdit/index.tsx
const AppearanceEdit = (props, ref) => {
	const { colorTitle, isShowName = true, name: propsName, color: propsColor, icon: propsIcon, style } = props;
	const inputRef = (0, react.useRef)(null);
	const [name, setName] = (0, react.useState)("Untitled Base");
	const [color, setColor] = (0, react.useState)("#7F56D9");
	const [icon, setIcon] = (0, react.useState)("");
	(0, react.useEffect)(() => {
		propsName && setName(propsName);
		propsColor && setColor(propsColor);
		propsIcon && setIcon(propsIcon);
	}, [
		propsName,
		propsColor,
		propsIcon
	]);
	(0, react.useEffect)(() => {
		var _inputRef$current;
		inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus({ cursor: "all" });
	}, []);
	(0, react.useImperativeHandle)(ref, () => ({ getDetail: () => {
		return {
			name,
			color,
			icon
		};
	} }));
	return /* @__PURE__ */ react.default.createElement("div", {
		className: "appearance-edit-wrap",
		style
	}, isShowName && /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, /* @__PURE__ */ react.default.createElement(_pisell_materials.Input, {
		value: name,
		onChange: (e) => setName(e.target.value),
		ref: inputRef
	}), /* @__PURE__ */ react.default.createElement(antd.Divider, null)), /* @__PURE__ */ react.default.createElement("div", null, colorTitle && /* @__PURE__ */ react.default.createElement("div", { className: "color-title" }, colorTitle), /* @__PURE__ */ react.default.createElement(require_Color.default, {
		value: color,
		onChange: setColor
	})), /* @__PURE__ */ react.default.createElement(antd.Divider, null), /* @__PURE__ */ react.default.createElement("div", null, /* @__PURE__ */ react.default.createElement(require_IconPanel.default, {
		value: icon,
		onChange: setIcon,
		color,
		name
	})));
};
var AppearanceEdit_default = (0, react.forwardRef)(AppearanceEdit);
//#endregion
exports.default = AppearanceEdit_default;
