@ultraviolet/ui 3.11.1 → 3.12.0

package/dist/components/VerificationCode/index.js

@@ -1,159 +1,163 @@
 'use client';
-import { __name } from "../../_virtual/_rolldown/runtime.js";
-import { Text } from "../Text/index.js";
-import { Label } from "../Label/index.js";
-import { filedSetClass, inputClass, inputSizes } from "./styles.css.js";
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Text, init_Text } from "../Text/index.js";
+import { Label, init_Label } from "../Label/index.js";
+import { init_styles_css, verificationCodeStyle } from "./styles.css.js";
 import { createRef, useId, useMemo, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "@ultraviolet/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/VerificationCode/index.tsx
-const DEFAULT_ON_FUNCTION = () => {};
-const inputOnFocus = (event) => event.target.select();
-/**
-* Verification code allows you to enter a code in multiple fields (4 by default).
-*/
-const VerificationCode = ({ disabled = false, className, error = false, fields = 4, initialValue = "", inputId, size = "large", onChange = DEFAULT_ON_FUNCTION, onComplete = DEFAULT_ON_FUNCTION, placeholder = "", required = false, type = "number", "data-testid": dataTestId, "aria-label": ariaLabel = "Verification code", label, labelDescription, helper, success, style }) => {
-	var _ref;
-	const uniqueId = useId();
-	const id = inputId !== null && inputId !== void 0 ? inputId : uniqueId;
-	const [values, setValues] = useState(Object.assign(new Array(fields).fill(""), [...initialValue.substring(0, fields)]));
-	const inputRefs = Array.from({ length: fields }, () => createRef());
-	const triggerChange = (inputValues) => {
-		const stringValue = inputValues.join("");
-		if (onChange) onChange(stringValue);
-		if (onComplete && stringValue.length >= fields) onComplete(stringValue);
-	};
-	const inputOnChange = (index) => (event) => {
-		var _next$current;
-		let { value } = event.target;
-		if (type === "number") value = event.target.value.replace(/[^\d]/gi, "");
-		const newValues = [...values];
-		if (value === "" || type === "number" && !new RegExp(event.target.pattern).test(value)) {
-			newValues[index] = "";
+var DEFAULT_ON_FUNCTION, inputOnFocus, VerificationCode;
+var init_VerificationCode = __esmMin(() => {
+	init_Label();
+	init_Text();
+	init_styles_css();
+	DEFAULT_ON_FUNCTION = () => {};
+	inputOnFocus = (event) => event.target.select();
+	VerificationCode = ({ disabled = false, className, error = false, fields = 4, initialValue = "", inputId, size = "large", onChange = DEFAULT_ON_FUNCTION, onComplete = DEFAULT_ON_FUNCTION, placeholder = "", required = false, type = "number", "data-testid": dataTestId, "aria-label": ariaLabel = "Verification code", label, labelDescription, helper, success, style }) => {
+		var _ref;
+		const uniqueId = useId();
+		const id = inputId !== null && inputId !== void 0 ? inputId : uniqueId;
+		const [values, setValues] = useState(Object.assign(new Array(fields).fill(""), [...initialValue.substring(0, fields)]));
+		const inputRefs = Array.from({ length: fields }, () => createRef());
+		const triggerChange = (inputValues) => {
+			const stringValue = inputValues.join("");
+			if (onChange) onChange(stringValue);
+			if (onComplete && stringValue.length >= fields) onComplete(stringValue);
+		};
+		const inputOnChange = (index) => (event) => {
+			var _next$current;
+			let { value } = event.target;
+			if (type === "number") value = event.target.value.replace(/[^\d]/gi, "");
+			const newValues = [...values];
+			if (value === "" || type === "number" && !new RegExp(event.target.pattern).test(value)) {
+				newValues[index] = "";
+				setValues(newValues);
+				return;
+			}
+			const sanitizedValue = value[0];
+			newValues[index] = sanitizedValue !== null && sanitizedValue !== void 0 ? sanitizedValue : "";
 			setValues(newValues);
-			return;
-		}
-		const sanitizedValue = value[0];
-		newValues[index] = sanitizedValue !== null && sanitizedValue !== void 0 ? sanitizedValue : "";
-		setValues(newValues);
-		const next = inputRefs[Math.min(index + 1, fields - 1)];
-		next === null || next === void 0 || (_next$current = next.current) === null || _next$current === void 0 || _next$current.focus();
-		triggerChange(newValues);
-	};
-	const inputOnKeyDown = (index) => (event) => {
-		const prevIndex = index - 1;
-		const nextIndex = index + 1;
-		const first = inputRefs[0];
-		const last = inputRefs.at(-1);
-		const prev = inputRefs[prevIndex];
-		const next = inputRefs[nextIndex];
-		const vals = [...values];
-		switch (event.key) {
-			case "Backspace":
-				event.preventDefault();
-				if (values[index]) {
-					vals[index] = "";
-					setValues(vals);
-					triggerChange(vals);
-				} else if (prev) {
-					var _prev$current;
-					vals[prevIndex] = "";
-					prev === null || prev === void 0 || (_prev$current = prev.current) === null || _prev$current === void 0 || _prev$current.focus();
-					setValues(vals);
-					triggerChange(vals);
-				}
-				break;
-			case "ArrowLeft":
-				var _prev$current2;
-				event.preventDefault();
-				prev === null || prev === void 0 || (_prev$current2 = prev.current) === null || _prev$current2 === void 0 || _prev$current2.focus();
-				break;
-			case "ArrowRight":
-				var _next$current2;
-				event.preventDefault();
-				next === null || next === void 0 || (_next$current2 = next.current) === null || _next$current2 === void 0 || _next$current2.focus();
-				break;
-			case "ArrowUp":
-				var _first$current;
-				event.preventDefault();
-				first === null || first === void 0 || (_first$current = first.current) === null || _first$current === void 0 || _first$current.focus();
-				break;
-			case "ArrowDown":
-				var _last$current;
-				event.preventDefault();
-				last === null || last === void 0 || (_last$current = last.current) === null || _last$current === void 0 || _last$current.focus();
-				break;
-			default: break;
-		}
-	};
-	const inputOnPaste = (currentIndex) => (event) => {
-		var _next$current3;
-		event.preventDefault();
-		const pastedValue = [...event.clipboardData.getData("Text")].map((copiedValue) => type === "number" ? copiedValue.replace(/[^\d]/gi, "") : copiedValue);
-		pastedValue.splice(fields - currentIndex < pastedValue.length ? fields - currentIndex : pastedValue.length);
-		setValues((vals) => {
-			const newArray = structuredClone(vals);
-			newArray.splice(currentIndex, pastedValue.length, ...pastedValue);
-			return newArray;
+			const next = inputRefs[Math.min(index + 1, fields - 1)];
+			next === null || next === void 0 || (_next$current = next.current) === null || _next$current === void 0 || _next$current.focus();
+			triggerChange(newValues);
+		};
+		const inputOnKeyDown = (index) => (event) => {
+			const prevIndex = index - 1;
+			const nextIndex = index + 1;
+			const first = inputRefs[0];
+			const last = inputRefs.at(-1);
+			const prev = inputRefs[prevIndex];
+			const next = inputRefs[nextIndex];
+			const vals = [...values];
+			switch (event.key) {
+				case "Backspace":
+					event.preventDefault();
+					if (values[index]) {
+						vals[index] = "";
+						setValues(vals);
+						triggerChange(vals);
+					} else if (prev) {
+						var _prev$current;
+						vals[prevIndex] = "";
+						prev === null || prev === void 0 || (_prev$current = prev.current) === null || _prev$current === void 0 || _prev$current.focus();
+						setValues(vals);
+						triggerChange(vals);
+					}
+					break;
+				case "ArrowLeft":
+					var _prev$current2;
+					event.preventDefault();
+					prev === null || prev === void 0 || (_prev$current2 = prev.current) === null || _prev$current2 === void 0 || _prev$current2.focus();
+					break;
+				case "ArrowRight":
+					var _next$current2;
+					event.preventDefault();
+					next === null || next === void 0 || (_next$current2 = next.current) === null || _next$current2 === void 0 || _next$current2.focus();
+					break;
+				case "ArrowUp":
+					var _first$current;
+					event.preventDefault();
+					first === null || first === void 0 || (_first$current = first.current) === null || _first$current === void 0 || _first$current.focus();
+					break;
+				case "ArrowDown":
+					var _last$current;
+					event.preventDefault();
+					last === null || last === void 0 || (_last$current = last.current) === null || _last$current === void 0 || _last$current.focus();
+					break;
+				default: break;
+			}
+		};
+		const inputOnPaste = (currentIndex) => (event) => {
+			var _next$current3;
+			event.preventDefault();
+			const pastedValue = [...event.clipboardData.getData("Text")].map((copiedValue) => type === "number" ? copiedValue.replace(/[^\d]/gi, "") : copiedValue);
+			pastedValue.splice(fields - currentIndex < pastedValue.length ? fields - currentIndex : pastedValue.length);
+			setValues((vals) => {
+				const newArray = structuredClone(vals);
+				newArray.splice(currentIndex, pastedValue.length, ...pastedValue);
+				return newArray;
+			});
+			const next = inputRefs[Math.min(currentIndex + pastedValue.filter((item) => item !== "").length, inputRefs.length - 1)];
+			next === null || next === void 0 || (_next$current3 = next.current) === null || _next$current3 === void 0 || _next$current3.focus();
+			triggerChange(pastedValue);
+		};
+		const sentiment = useMemo(() => {
+			if (error) return "danger";
+			if (success) return "success";
+			return "neutral";
+		}, [error, success]);
+		return /* @__PURE__ */ jsxs("fieldset", {
+			className: cn(className, verificationCodeStyle.filedSetClass),
+			"data-testid": dataTestId,
+			style,
+			children: [
+				label || labelDescription ? /* @__PURE__ */ jsx(Label, {
+					htmlFor: `${id}-0`,
+					id: `${id}-label`,
+					labelDescription,
+					required,
+					size: size === "xlarge" ? "large" : size,
+					children: label
+				}) : null,
+				/* @__PURE__ */ jsx("div", { children: values.map((value, index) => {
+					var _placeholder$index;
+					return /* @__PURE__ */ jsx("input", {
+						"aria-invalid": !!error,
+						"aria-label": `${ariaLabel} ${index}`,
+						autoComplete: "off",
+						className: cn(verificationCodeStyle.inputSizes[size], verificationCodeStyle.input),
+						"data-success": !!success,
+						"data-testid": index,
+						disabled,
+						id: `${id}-${index}`,
+						onChange: inputOnChange(index),
+						onFocus: inputOnFocus,
+						onKeyDown: inputOnKeyDown(index),
+						onPaste: inputOnPaste(index),
+						pattern: type === "number" ? "[0-9]*" : void 0,
+						placeholder: (_placeholder$index = placeholder === null || placeholder === void 0 ? void 0 : placeholder[index]) !== null && _placeholder$index !== void 0 ? _placeholder$index : "",
+						ref: inputRefs[index],
+						required,
+						type: type === "number" ? "tel" : type,
+						value
+					}, `field-${index}`);
+				}) }),
+				error || typeof success === "string" || typeof helper === "string" ? /* @__PURE__ */ jsx(Text, {
+					as: "p",
+					disabled,
+					prominence: error || success ? "default" : "weak",
+					sentiment,
+					variant: "caption",
+					children: (_ref = error || success) !== null && _ref !== void 0 ? _ref : helper
+				}) : null,
+				!(error || success) && typeof helper !== "string" && helper ? helper : null
+			]
 		});
-		const next = inputRefs[Math.min(currentIndex + pastedValue.filter((item) => item !== "").length, inputRefs.length - 1)];
-		next === null || next === void 0 || (_next$current3 = next.current) === null || _next$current3 === void 0 || _next$current3.focus();
-		triggerChange(pastedValue);
 	};
-	const sentiment = useMemo(() => {
-		if (error) return "danger";
-		if (success) return "success";
-		return "neutral";
-	}, [error, success]);
-	return /* @__PURE__ */ jsxs("fieldset", {
-		className: cn(className, filedSetClass),
-		"data-testid": dataTestId,
-		style,
-		children: [
-			label || labelDescription ? /* @__PURE__ */ jsx(Label, {
-				htmlFor: `${id}-0`,
-				id: `${id}-label`,
-				labelDescription,
-				required,
-				size: size === "xlarge" ? "large" : size,
-				children: label
-			}) : null,
-			/* @__PURE__ */ jsx("div", { children: values.map((value, index) => {
-				var _placeholder$index;
-				return /* @__PURE__ */ jsx("input", {
-					"aria-invalid": !!error,
-					"aria-label": `${ariaLabel} ${index}`,
-					autoComplete: "off",
-					className: cn(inputSizes[size], inputClass),
-					"data-success": !!success,
-					"data-testid": index,
-					disabled,
-					id: `${id}-${index}`,
-					onChange: inputOnChange(index),
-					onFocus: inputOnFocus,
-					onKeyDown: inputOnKeyDown(index),
-					onPaste: inputOnPaste(index),
-					pattern: type === "number" ? "[0-9]*" : void 0,
-					placeholder: (_placeholder$index = placeholder === null || placeholder === void 0 ? void 0 : placeholder[index]) !== null && _placeholder$index !== void 0 ? _placeholder$index : "",
-					ref: inputRefs[index],
-					required,
-					type: type === "number" ? "tel" : type,
-					value
-				}, `field-${index}`);
-			}) }),
-			error || typeof success === "string" || typeof helper === "string" ? /* @__PURE__ */ jsx(Text, {
-				as: "p",
-				disabled,
-				prominence: error || success ? "default" : "weak",
-				sentiment,
-				variant: "caption",
-				children: (_ref = error || success) !== null && _ref !== void 0 ? _ref : helper
-			}) : null,
-			!(error || success) && typeof helper !== "string" && helper ? helper : null
-		]
-	});
-};
+});
 
 //#endregion
-export { VerificationCode };
+init_VerificationCode();
+export { VerificationCode, init_VerificationCode };

package/dist/components/VerificationCode/styles.css.d.ts

@@ -1,4 +1,6 @@
-export declare const inputSizes: Record<"large" | "medium" | "small" | "xlarge", string>;
-export declare const inputClass: string;
-export declare const filedSetClass: string;
+export declare const verificationCodeStyle: {
+    inputSizes: Record<"large" | "medium" | "small" | "xlarge", string>;
+    input: string;
+    filedSetClass: string;
+};
 //# sourceMappingURL=styles.css.d.ts.map

package/dist/components/VerificationCode/styles.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/VerificationCode/styles.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,UAAU,yDAyBrB,CAAA;AAEF,eAAO,MAAM,UAAU,QA4CrB,CAAA;AAEF,eAAO,MAAM,aAAa,QAOxB,CAAA"}
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/VerificationCode/styles.css.ts"],"names":[],"mappings":"AAsFA,eAAO,MAAM,qBAAqB;;;;CAIjC,CAAA"}

package/dist/components/VerificationCode/styles.css.js

@@ -1,14 +1,22 @@
-/* empty css                      */
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 
 //#region src/components/VerificationCode/styles.css.ts
-var inputSizes = {
-	large: "uv_1k9synd0",
-	medium: "uv_1k9synd1",
-	small: "uv_1k9synd2",
-	xlarge: "uv_1k9synd3"
-};
-var inputClass = "uv_1k9synd4";
-var filedSetClass = "uv_1k9synd5";
+var verificationCodeStyle;
+var init_styles_css = __esmMin(() => {
+	init_styles_css_ts_vanilla();
+	verificationCodeStyle = {
+		inputSizes: {
+			large: "uv_1k9synd0",
+			medium: "uv_1k9synd1",
+			small: "uv_1k9synd2",
+			xlarge: "uv_1k9synd3"
+		},
+		input: "uv_1k9synd4",
+		filedSetClass: "uv_1k9synd5"
+	};
+});
 
 //#endregion
-export { filedSetClass, inputClass, inputSizes };
+init_styles_css();
+export { init_styles_css, verificationCodeStyle };

package/dist/components/VerificationCode/styles.css.ts.vanilla.js

@@ -0,0 +1,8 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/VerificationCode/styles.css.ts.vanilla.css
+var init_styles_css_ts_vanilla = __esmMin(() => {});
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/compositions/CodeEditor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/CodeEditor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAA;AAExD,OAAO,UAAU,MAAM,uBAAuB,CAAA;AAI9C,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EAEb,SAAS,EAEV,MAAM,OAAO,CAAA;AAmBd,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,UAAU,CAAC,CAAA;IACvD,UAAU,EAAE,MAAM,OAAO,KAAK,CAAA;IAC9B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,gBAAgB,CAAC,EAAE,SAAS,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAsDD,eAAO,MAAM,UAAU,+UAkHtB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/CodeEditor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAA;AAExD,OAAO,UAAU,MAAM,uBAAuB,CAAA;AAI9C,OAAO,KAAK,EACV,cAAc,EACd,aAAa,EAEb,SAAS,EAEV,MAAM,OAAO,CAAA;AASd,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,UAAU,CAAC,CAAA;IACvD,UAAU,EAAE,MAAM,OAAO,KAAK,CAAA;IAC9B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,gBAAgB,CAAC,EAAE,SAAS,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAwDD,eAAO,MAAM,UAAU,+UAoHtB,CAAA"}

package/dist/components/compositions/CodeEditor/index.js

@@ -1,129 +1,139 @@
 'use client';
-import { __name } from "../../../_virtual/_rolldown/runtime.js";
-import { Stack } from "../../Stack/index.js";
-import { Text } from "../../Text/index.js";
-import { Expandable } from "../../Expandable/index.js";
-import { Label } from "../../Label/index.js";
-import { CopyButton } from "../../CopyButton/index.js";
-import { animatedArrowIcon, centeredText, codeEditor, codeEditorWrapper, copyButton, disabledStack, maxHeightVar, showMoreButton, showMoreContainer } from "./styles.css.js";
+import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
+import { Stack, init_Stack } from "../../Stack/index.js";
+import { Text, init_Text } from "../../Text/index.js";
+import { Expandable, init_Expandable } from "../../Expandable/index.js";
+import { Label, init_Label } from "../../Label/index.js";
+import { CopyButton, init_CopyButton } from "../../CopyButton/index.js";
+import { codeEditorStyle, disabledStack, init_styles_css, maxHeightVar } from "./styles.css.js";
 import { useState } from "react";
+import { cn } from "@ultraviolet/utils";
 import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "@ultraviolet/utils";
 import { ArrowDownIcon } from "@ultraviolet/icons/ArrowDownIcon";
 import { langs } from "@uiw/codemirror-extensions-langs";
 import { material } from "@uiw/codemirror-theme-material";
 import CodeMirror from "@uiw/react-codemirror";
 
 //#region src/components/compositions/CodeEditor/index.tsx
-const CodeEditorCopyButton = ({ copyButton: copyButton$1, value }) => /* @__PURE__ */ jsx(CopyButton, {
-	bordered: true,
-	className: copyButton,
-	sentiment: "neutral",
-	size: "small",
-	value,
-	children: typeof copyButton$1 === "string" ? copyButton$1 : void 0
-});
-const CodeEditorExpandable = ({ expanded, setExpanded, hideText, showText }) => /* @__PURE__ */ jsx("div", {
-	className: showMoreContainer({ expanded }),
-	children: /* @__PURE__ */ jsx("button", {
-		"aria-expanded": expanded,
-		className: showMoreButton,
-		onClick: () => setExpanded((prevState) => !prevState),
-		type: "button",
-		children: /* @__PURE__ */ jsxs(Text, {
-			as: "span",
-			className: centeredText,
-			sentiment: "neutral",
-			variant: "bodySmallStrong",
-			children: [
-				expanded ? hideText : showText,
-				"\xA0",
-				/* @__PURE__ */ jsx(ArrowDownIcon, { className: animatedArrowIcon[expanded ? "true" : "false"] })
-			]
-		})
-	})
-});
-const CodeEditor = ({ value, onChange, extensions, onBlur, height, readOnly, autoCompletion, disabled = false, label, copyButton, id, helper, labelDescription, expandableHeight, hideText = "Hide", showText = "Show", "aria-label": ariaLabel, "data-testid": dataTestId, className, error, lineNumbers = true, style, required }) => {
-	var _langs$extensions;
-	var _langs$extensions2;
-	const [expanded, setExpanded] = useState(false);
-	const expandableEnabled = expandableHeight !== void 0;
-	const isEditable = !(disabled && readOnly) && (!expandableEnabled || expanded);
-	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(CodeMirror, {
-		"aria-disabled": disabled,
-		"aria-label": ariaLabel,
-		basicSetup: {
-			autocompletion: autoCompletion,
-			highlightActiveLine: false,
-			highlightActiveLineGutter: false,
-			lineNumbers
-		},
-		className,
-		"data-testid": dataTestId,
-		editable: isEditable,
-		extensions: [(_langs$extensions = (_langs$extensions2 = langs[extensions]) === null || _langs$extensions2 === void 0 ? void 0 : _langs$extensions2.call(langs)) !== null && _langs$extensions !== void 0 ? _langs$extensions : langs["sh"]],
-		height: expandableEnabled ? void 0 : height,
-		id,
-		onBlur,
-		onChange,
-		onUpdate: () => {
-			if (disabled) {
-				var _document$getSelectio;
-				(_document$getSelectio = document.getSelection()) === null || _document$getSelectio === void 0 || _document$getSelectio.empty();
-			}
-		},
-		readOnly: readOnly || disabled,
-		theme: material,
+var CodeEditorCopyButton, CodeEditorExpandable, CodeEditor;
+var init_CodeEditor = __esmMin(() => {
+	init_CopyButton();
+	init_Expandable();
+	init_Label();
+	init_Stack();
+	init_Text();
+	init_styles_css();
+	CodeEditorCopyButton = ({ copyButton, value }) => /* @__PURE__ */ jsx(CopyButton, {
+		bordered: true,
+		className: codeEditorStyle.copyButton,
+		sentiment: "neutral",
+		size: "small",
 		value,
-		width: "100%"
-	}), copyButton && !disabled ? /* @__PURE__ */ jsx(CodeEditorCopyButton, {
-		copyButton,
-		value
-	}) : null] });
-	return /* @__PURE__ */ jsxs(Stack, {
-		className: cn(disabled ? disabledStack : ""),
-		gap: .5,
-		style,
-		children: [
-			label ? /* @__PURE__ */ jsx(Label, {
-				labelDescription,
-				required,
-				children: label
-			}) : null,
-			/* @__PURE__ */ jsxs("div", {
-				className: codeEditorWrapper,
-				children: [/* @__PURE__ */ jsx("div", {
-					className: cn(codeEditor[disabled ? "disabled" : "default"]),
-					style: assignInlineVars({ [maxHeightVar]: !expanded && expandableHeight ? `${expandableHeight}px` : "none" }),
-					children: expandableEnabled ? /* @__PURE__ */ jsx(Expandable, {
-						minHeight: expandableHeight,
-						opened: expanded,
-						children: content
-					}) : content
-				}), expandableEnabled ? /* @__PURE__ */ jsx(CodeEditorExpandable, {
-					expanded,
-					hideText,
-					setExpanded,
-					showText
-				}) : null]
-			}),
-			error && typeof error !== "boolean" ? /* @__PURE__ */ jsx(Text, {
-				as: "span",
-				sentiment: "danger",
-				variant: "caption",
-				children: error
-			}) : null,
-			!error && helper ? /* @__PURE__ */ jsx(Text, {
+		children: typeof copyButton === "string" ? copyButton : void 0
+	});
+	CodeEditorExpandable = ({ expanded, setExpanded, hideText, showText }) => /* @__PURE__ */ jsx("div", {
+		className: codeEditorStyle.showMoreContainer({ expanded }),
+		children: /* @__PURE__ */ jsx("button", {
+			"aria-expanded": expanded,
+			className: codeEditorStyle.showMoreButton,
+			onClick: () => setExpanded((prevState) => !prevState),
+			type: "button",
+			children: /* @__PURE__ */ jsxs(Text, {
 				as: "span",
-				prominence: "weak",
+				className: codeEditorStyle.centeredText,
 				sentiment: "neutral",
-				variant: "caption",
-				children: helper
-			}) : null
-		]
+				variant: "bodySmallStrong",
+				children: [
+					expanded ? hideText : showText,
+					"\xA0",
+					/* @__PURE__ */ jsx(ArrowDownIcon, { className: codeEditorStyle.animatedArrowIcon[expanded ? "true" : "false"] })
+				]
+			})
+		})
 	});
-};
+	CodeEditor = ({ value, onChange, extensions, onBlur, height, readOnly, autoCompletion, disabled = false, label, copyButton, id, helper, labelDescription, expandableHeight, hideText = "Hide", showText = "Show", "aria-label": ariaLabel, "data-testid": dataTestId, className, error, lineNumbers = true, style, required }) => {
+		var _langs$extensions;
+		var _langs$extensions2;
+		const [expanded, setExpanded] = useState(false);
+		const expandableEnabled = expandableHeight !== void 0;
+		const isEditable = !(disabled && readOnly) && (!expandableEnabled || expanded);
+		const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(CodeMirror, {
+			"aria-disabled": disabled,
+			"aria-label": ariaLabel,
+			basicSetup: {
+				autocompletion: autoCompletion,
+				highlightActiveLine: false,
+				highlightActiveLineGutter: false,
+				lineNumbers
+			},
+			className,
+			"data-testid": dataTestId,
+			editable: isEditable,
+			extensions: [(_langs$extensions = (_langs$extensions2 = langs[extensions]) === null || _langs$extensions2 === void 0 ? void 0 : _langs$extensions2.call(langs)) !== null && _langs$extensions !== void 0 ? _langs$extensions : langs["sh"]],
+			height: expandableEnabled ? void 0 : height,
+			id,
+			onBlur,
+			onChange,
+			onUpdate: () => {
+				if (disabled) {
+					var _document$getSelectio;
+					(_document$getSelectio = document.getSelection()) === null || _document$getSelectio === void 0 || _document$getSelectio.empty();
+				}
+			},
+			readOnly: readOnly || disabled,
+			theme: material,
+			value,
+			width: "100%"
+		}), copyButton && !disabled ? /* @__PURE__ */ jsx(CodeEditorCopyButton, {
+			copyButton,
+			value
+		}) : null] });
+		return /* @__PURE__ */ jsxs(Stack, {
+			className: cn(disabled ? disabledStack : ""),
+			gap: .5,
+			style,
+			children: [
+				label ? /* @__PURE__ */ jsx(Label, {
+					labelDescription,
+					required,
+					children: label
+				}) : null,
+				/* @__PURE__ */ jsxs("div", {
+					className: codeEditorStyle.wrapper,
+					children: [/* @__PURE__ */ jsx("div", {
+						className: cn(codeEditorStyle.codeEditor[disabled ? "disabled" : "default"]),
+						style: assignInlineVars({ [maxHeightVar]: !expanded && expandableHeight ? `${expandableHeight}px` : "none" }),
+						children: expandableEnabled ? /* @__PURE__ */ jsx(Expandable, {
+							minHeight: expandableHeight,
+							opened: expanded,
+							children: content
+						}) : content
+					}), expandableEnabled ? /* @__PURE__ */ jsx(CodeEditorExpandable, {
+						expanded,
+						hideText,
+						setExpanded,
+						showText
+					}) : null]
+				}),
+				error && typeof error !== "boolean" ? /* @__PURE__ */ jsx(Text, {
+					as: "span",
+					sentiment: "danger",
+					variant: "caption",
+					children: error
+				}) : null,
+				!error && helper ? /* @__PURE__ */ jsx(Text, {
+					as: "span",
+					prominence: "weak",
+					sentiment: "neutral",
+					variant: "caption",
+					children: helper
+				}) : null
+			]
+		});
+	};
+});
 
 //#endregion
-export { CodeEditor };
+init_CodeEditor();
+export { CodeEditor, init_CodeEditor };