import localeValues from "../../../locale/en_US.js";
import useLocale from "../../../locale/useLocale.js";
import { createVNode, defineComponent } from "vue";
//#region components/sender/components/SpeechButton/RecordingIcon.tsx
var SIZE = 1e3;
var COUNT = 4;
var RECT_WIDTH = 140;
var RECT_RADIUS = RECT_WIDTH / 2;
var RECT_HEIGHT_MIN = 250;
var RECT_HEIGHT_MAX = 500;
var DURATION = .8;
var RecordingIcon_default = /* @__PURE__ */ defineComponent({
	name: "RecordingIcon",
	props: { class: {
		type: String,
		default: void 0
	} },
	setup(props) {
		const [contextLocale] = useLocale("Sender", localeValues.Sender);
		return () => createVNode("svg", {
			"color": "currentColor",
			"viewBox": `0 0 ${SIZE} ${SIZE}`,
			"xmlns": "http://www.w3.org/2000/svg",
			"class": props.class
		}, [createVNode("title", null, [contextLocale.value.speechRecording]), Array.from({ length: COUNT }).map((_, index) => {
			const x = index * ((SIZE - RECT_WIDTH * COUNT) / (COUNT - 1) + RECT_WIDTH);
			const yMin = SIZE / 2 - RECT_HEIGHT_MIN / 2;
			const yMax = SIZE / 2 - RECT_HEIGHT_MAX / 2;
			return createVNode("rect", {
				"fill": "currentColor",
				"rx": RECT_RADIUS,
				"ry": RECT_RADIUS,
				"height": RECT_HEIGHT_MIN,
				"width": RECT_WIDTH,
				"x": x,
				"y": yMin,
				"key": index
			}, [createVNode("animate", {
				"attributeName": "height",
				"values": `${RECT_HEIGHT_MIN}; ${RECT_HEIGHT_MAX}; ${RECT_HEIGHT_MIN}`,
				"keyTimes": "0; 0.5; 1",
				"dur": `${DURATION}s`,
				"begin": `${DURATION / COUNT * index}s`,
				"repeatCount": "indefinite"
			}, null), createVNode("animate", {
				"attributeName": "y",
				"values": `${yMin}; ${yMax}; ${yMin}`,
				"keyTimes": "0; 0.5; 1",
				"dur": `${DURATION}s`,
				"begin": `${DURATION / COUNT * index}s`,
				"repeatCount": "indefinite"
			}, null)]);
		})]);
	}
});
//#endregion
export { RecordingIcon_default as default };
