'use client';

import { useCodeContext } from "./CodeContext.mjs";
import { Select } from "../Select/Select.mjs";
import { jsx, jsxs } from "react/jsx-runtime";
import { useIntlayer } from "react-intlayer";

//#region src/components/IDE/ContentDeclarationFormatSelector.tsx
const ContentDeclarationFormatSelector = () => {
	const { contentDeclarationFormat, setContentDeclarationFormat } = useCodeContext();
	const content = useIntlayer("code-selectors");
	return /* @__PURE__ */ jsxs(Select, {
		value: contentDeclarationFormat,
		onValueChange: setContentDeclarationFormat,
		children: [/* @__PURE__ */ jsx(Select.Trigger, {
			className: "py-1!",
			"aria-label": content.contentDeclarationFormat.label.value,
			children: /* @__PURE__ */ jsx(Select.Value, { placeholder: content.contentDeclarationFormat.placeholder.value })
		}), /* @__PURE__ */ jsxs(Select.Content, { children: [
			/* @__PURE__ */ jsx(Select.Item, {
				value: "typescript",
				children: "TypeScript"
			}),
			/* @__PURE__ */ jsx(Select.Item, {
				value: "commonjs",
				children: "CommonJS"
			}),
			/* @__PURE__ */ jsx(Select.Item, {
				value: "esm",
				children: "ESM"
			}),
			/* @__PURE__ */ jsx(Select.Item, {
				value: "json",
				children: "JSON"
			})
		] })]
	});
};

//#endregion
export { ContentDeclarationFormatSelector };
//# sourceMappingURL=ContentDeclarationFormatSelector.mjs.map