@ultraviolet/ui 3.12.2 → 3.13.0

package/dist/components/TimeInput/index.js

@@ -1,27 +1,25 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
 import { Stack, init_Stack } from "../Stack/index.js";
 import { Text, init_Text } from "../Text/index.js";
-import { Button, init_Button } from "../Button/index.js";
 import { Label, init_Label } from "../Label/index.js";
 import { DEFAULT_DATE, DEFAULT_PLACEHOLDER, TIME_KEYS, init_constants } from "./constants.js";
 import { canConcat, format, getLastTypedChar, getValueByType, init_helpers, isAOrP, isCompleteHour, isNumber, setValueByType } from "./helpers.js";
+import { RightIcon, init_RightIcon } from "./RightIcon.js";
 import { init_styles_css, timeInputStyle } from "./styles.css.js";
 import { useEffect, useId, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { AlertCircleIcon } from "@ultraviolet/icons/AlertCircleIcon";
-import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
 
 //#region src/components/TimeInput/index.tsx
 var TimeInput;
 var init_TimeInput = __esmMin(() => {
-	init_Button();
 	init_Label();
 	init_Stack();
 	init_Text();
 	init_constants();
 	init_helpers();
+	init_RightIcon();
 	init_styles_css();
 	init_objectSpread2();
 	TimeInput = ({ label, timeFormat = 24, value, clearable, required, labelDescription, helper, size = "large", disabled = false, readOnly = false, error = false, onChange, onBlur, onFocus, className, id, autoFocus, style, "data-testid": dataTestId, placeholder = DEFAULT_PLACEHOLDER, "aria-label": ariaLabel }) => {
@@ -143,6 +141,8 @@ var init_TimeInput = __esmMin(() => {
 				(_refMinutes$current3 = refMinutes.current) === null || _refMinutes$current3 === void 0 || _refMinutes$current3.focus();
 			}
 		};
+		const bottomText = error || helper;
+		const isEditable = readOnly || disabled;
 		return /* @__PURE__ */ jsxs(Stack, {
 			className,
 			gap: .5,
@@ -207,7 +207,7 @@ var init_TimeInput = __esmMin(() => {
 									"data-testid": `${fullName()}-input`,
 									disabled,
 									onChange: (event) => {
-										if (!(readOnly || disabled)) {
+										if (!isEditable) {
 											const key = getLastTypedChar(event.target.value, getValueByType(type, time));
 											if (isNumber(key)) handleChange(type, Number.parseInt(key, 10));
 										}
@@ -216,7 +216,7 @@ var init_TimeInput = __esmMin(() => {
 										event.stopPropagation();
 									},
 									onKeyDown: (event) => {
-										if (!(readOnly || disabled)) {
+										if (!isEditable) {
 											if (event.key === "ArrowUp") {
 												event.preventDefault();
 												handleIncrease(type);
@@ -258,14 +258,14 @@ var init_TimeInput = __esmMin(() => {
 							"data-testid": "am-pm-input",
 							disabled,
 							onChange: (event) => {
-								if (!(readOnly || disabled)) {
+								if (!isEditable) {
 									const key = event.target.value.slice(-1);
 									if (isAOrP(key)) handleChangePeriod(key);
 								}
 							},
 							onClick: (event) => event.stopPropagation(),
 							onKeyDown: (event) => {
-								if (!(readOnly || disabled)) {
+								if (!isEditable) {
 									if (event.key === "ArrowUp" || event.key === "ArrowDown") {
 										event.preventDefault();
 										handleChangePeriod(period === "am" ? "p" : "a");
@@ -282,33 +282,21 @@ var init_TimeInput = __esmMin(() => {
 							role: "spinbutton",
 							value: period === null || period === void 0 ? void 0 : period.toUpperCase()
 						}) : null]
-					}), error || clearable ? /* @__PURE__ */ jsxs(Stack, {
-						alignItems: "center",
-						direction: "row",
-						gap: "1",
-						children: [error ? /* @__PURE__ */ jsx(AlertCircleIcon, { sentiment: "danger" }) : null, clearable ? /* @__PURE__ */ jsx(Button, {
-							"aria-label": "clear value",
-							"data-testid": "clear",
-							disabled: disabled || readOnly,
-							onClick: (event) => {
-								event.stopPropagation();
-								setTime(void 0);
-								onChange === null || onChange === void 0 || onChange(void 0);
-							},
-							sentiment: "neutral",
-							size: "small",
-							variant: "ghost",
-							children: /* @__PURE__ */ jsx(CloseIcon, {})
-						}) : null]
+					}), error || clearable ? /* @__PURE__ */ jsx(RightIcon, {
+						clearable,
+						error: !!error,
+						isEditable,
+						onChange,
+						setTime
 					}) : null]
 				}),
-				helper || error ? /* @__PURE__ */ jsx(Text, {
+				bottomText ? /* @__PURE__ */ jsx(Text, {
 					as: "p",
 					disabled,
 					prominence: error ? "default" : "weak",
 					sentiment: error ? "danger" : "neutral",
 					variant: "caption",
-					children: error || helper
+					children: bottomText
 				}) : null
 			]
 		});

package/dist/components/Toaster/Toaster.js

@@ -1,6 +1,6 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
 import { CloseButton, init_CloseButton } from "./components/CloseButton.js";
 import { Content, init_Content } from "./components/Content.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/ToggleGroup/Context.d.ts

@@ -0,0 +1,9 @@
+import type { InputHTMLAttributes } from 'react';
+type ToggleGroupContextType = {
+    groupName: string;
+    groupValues: string[];
+    error: boolean;
+} & Required<Pick<InputHTMLAttributes<HTMLInputElement>, 'onChange'>> & Pick<InputHTMLAttributes<HTMLInputElement>, 'required'>;
+export declare const ToggleGroupContext: import("react").Context<ToggleGroupContextType | undefined>;
+export {};
+//# sourceMappingURL=Context.d.ts.map

package/dist/components/ToggleGroup/Context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Context.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleGroup/Context.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAEhD,KAAK,sBAAsB,GAAG;IAC5B,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,EAAE,CAAA;IACrB,KAAK,EAAE,OAAO,CAAA;CACf,GAAG,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,CAAC,GACnE,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,CAAA;AAEzD,eAAO,MAAM,kBAAkB,6DAEnB,CAAA"}

package/dist/components/ToggleGroup/Context.js

@@ -0,0 +1,13 @@
+'use client';
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { createContext } from "react";
+
+//#region src/components/ToggleGroup/Context.tsx
+var ToggleGroupContext;
+var init_Context = __esmMin(() => {
+	ToggleGroupContext = createContext(void 0);
+});
+
+//#endregion
+init_Context();
+export { ToggleGroupContext, init_Context };

package/dist/components/ToggleGroup/SingleToggle.d.ts

@@ -0,0 +1,11 @@
+import { Toggle } from '../Toggle';
+import type { ComponentProps } from 'react';
+type ToggleGroupToggleProps = Omit<ComponentProps<typeof Toggle>, 'onChange' | 'checked' | 'required'> & {
+    value: string;
+};
+/**
+ * ToggleGroup is a component that allows you to group a set of Toggle components together under the same legend.
+ */
+export declare const ToggleGroupToggle: ({ disabled, name, value, label, helper, error, className, 'data-testid': dataTestId, style, }: ToggleGroupToggleProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SingleToggle.d.ts.map

package/dist/components/ToggleGroup/SingleToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleToggle.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleGroup/SingleToggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAIlC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,KAAK,sBAAsB,GAAG,IAAI,CAChC,cAAc,CAAC,OAAO,MAAM,CAAC,EAC7B,UAAU,GAAG,SAAS,GAAG,UAAU,CACpC,GAAG;IACF,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,oKAqC7B,CAAA"}

package/dist/components/ToggleGroup/SingleToggle.js

@@ -0,0 +1,37 @@
+'use client';
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import { Toggle, init_Toggle } from "../Toggle/index.js";
+import { ToggleGroupContext, init_Context } from "./Context.js";
+import { useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/ToggleGroup/SingleToggle.tsx
+var ToggleGroupToggle;
+var init_SingleToggle = __esmMin(() => {
+	init_Toggle();
+	init_Context();
+	ToggleGroupToggle = ({ disabled, name, value, label, helper, error, className, "data-testid": dataTestId, style }) => {
+		const context = useContext(ToggleGroupContext);
+		if (!context) throw new Error("ToggleGroup.Toggle can only be used inside a ToggleGroup");
+		const { groupName, onChange, groupValues, error: contextError } = context;
+		const ToggleName = `${groupName}.${name}`;
+		const ToggleValue = value.toString();
+		return /* @__PURE__ */ jsx(Toggle, {
+			checked: groupValues === null || groupValues === void 0 ? void 0 : groupValues.includes(ToggleValue),
+			className,
+			"data-testid": dataTestId,
+			disabled,
+			error: error || contextError,
+			helper,
+			label,
+			name: ToggleName,
+			onChange,
+			style,
+			value: ToggleValue
+		});
+	};
+});
+
+//#endregion
+init_SingleToggle();
+export { ToggleGroupToggle, init_SingleToggle };

package/dist/components/ToggleGroup/index.d.ts

@@ -1,12 +1,5 @@
-import { Toggle } from '../Toggle';
-import type { ComponentProps, InputHTMLAttributes, ReactNode } from 'react';
-type ToggleGroupToggleProps = Omit<ComponentProps<typeof Toggle>, 'onChange' | 'checked' | 'required'> & {
-    value: string;
-};
-/**
- * ToggleGroup is a component that allows you to group a set of Toggle components together under the same legend.
- */
-export declare const ToggleGroupToggle: ({ disabled, name, value, label, helper, error, className, 'data-testid': dataTestId, style, }: ToggleGroupToggleProps) => import("react/jsx-runtime").JSX.Element;
+import { ToggleGroupToggle } from './SingleToggle';
+import type { InputHTMLAttributes, ReactNode } from 'react';
 type ToggleGroupProps = {
     legend?: string;
     legendDescription?: ReactNode;

package/dist/components/ToggleGroup/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleGroup/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAIlC,OAAO,KAAK,EAAE,cAAc,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAa3E,KAAK,sBAAsB,GAAG,IAAI,CAChC,cAAc,CAAC,OAAO,MAAM,CAAC,EAC7B,UAAU,GAAG,SAAS,GAAG,UAAU,CACpC,GAAG;IACF,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,oKAqC7B,CAAA;AAED,KAAK,gBAAgB,GAAG;IACtB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC5B,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB,GAAG,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,CAAC,GAC5E,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAA;AAEnE,QAAA,MAAM,oBAAoB,mMA0EzB,CAAA;AAED,KAAK,6BAA6B,GAAG,OAAO,oBAAoB,GAAG;IACjE,MAAM,EAAE,OAAO,iBAAiB,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,6BAKzB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleGroup/index.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAGlD,OAAO,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE3D,KAAK,gBAAgB,GAAG;IACtB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iBAAiB,CAAC,EAAE,SAAS,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC5B,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,SAAS,CAAA;CACxB,GAAG,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,CAAC,GAC5E,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,CAAA;AAEnE,QAAA,MAAM,oBAAoB,mMA0EzB,CAAA;AAED,KAAK,6BAA6B,GAAG,OAAO,oBAAoB,GAAG;IACjE,MAAM,EAAE,OAAO,iBAAiB,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,6BAKzB,CAAA"}

package/dist/components/ToggleGroup/index.js

@@ -3,41 +3,22 @@ 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 { Label, init_Label } from "../Label/index.js";
-import { Toggle, init_Toggle } from "../Toggle/index.js";
+import { ToggleGroupContext, init_Context } from "./Context.js";
+import { ToggleGroupToggle, init_SingleToggle } from "./SingleToggle.js";
 import { init_styles_css, toggleGroupStyle } from "./styles.css.js";
-import { createContext, useContext, useMemo } from "react";
+import { useMemo } from "react";
 import { cn } from "@ultraviolet/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/ToggleGroup/index.tsx
-var ToggleGroupContext, ToggleGroupToggle, ToggleGroupComponent, ToggleGroup;
+var ToggleGroupComponent, ToggleGroup;
 var init_ToggleGroup = __esmMin(() => {
 	init_Label();
 	init_Stack();
 	init_Text();
-	init_Toggle();
+	init_Context();
+	init_SingleToggle();
 	init_styles_css();
-	ToggleGroupContext = createContext(void 0);
-	ToggleGroupToggle = ({ disabled, name, value, label, helper, error, className, "data-testid": dataTestId, style }) => {
-		const context = useContext(ToggleGroupContext);
-		if (!context) throw new Error("ToggleGroup.Toggle can only be used inside a ToggleGroup");
-		const { groupName, onChange, groupValues, error: contextError } = context;
-		const ToggleName = `${groupName}.${name}`;
-		const ToggleValue = value.toString();
-		return /* @__PURE__ */ jsx(Toggle, {
-			checked: groupValues === null || groupValues === void 0 ? void 0 : groupValues.includes(ToggleValue),
-			className,
-			"data-testid": dataTestId,
-			disabled,
-			error: error || contextError,
-			helper,
-			label,
-			name: ToggleName,
-			onChange,
-			style,
-			value: ToggleValue
-		});
-	};
 	ToggleGroupComponent = ({ legend, legendDescription, value, className, helper, error, direction = "column", children, onChange, name, description, required = false, style }) => {
 		const contextValue = useMemo(() => ({
 			error: !!error,

package/dist/components/TreeMapChart/index.js

@@ -1,6 +1,6 @@
 'use client';
 import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
+import { _objectSpread2, init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js";
 import { getDataColors, init_treeMap } from "../../helpers/treeMap.js";
 import { init_styles_css, treeMapChartStyle } from "./styles.css.js";
 import { Tooltip, init_Tooltip } from "./Tooltip.js";

package/dist/components/VerificationCode/index.js

@@ -46,7 +46,6 @@ var init_VerificationCode = __esmMin(() => {
 		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];
@@ -77,9 +76,9 @@ var init_VerificationCode = __esmMin(() => {
 					next === null || next === void 0 || (_next$current2 = next.current) === null || _next$current2 === void 0 || _next$current2.focus();
 					break;
 				case "ArrowUp":
-					var _first$current;
+					var _inputRefs$;
 					event.preventDefault();
-					first === null || first === void 0 || (_first$current = first.current) === null || _first$current === void 0 || _first$current.focus();
+					(_inputRefs$ = inputRefs[0]) === null || _inputRefs$ === void 0 || (_inputRefs$ = _inputRefs$.current) === null || _inputRefs$ === void 0 || _inputRefs$.focus();
 					break;
 				case "ArrowDown":
 					var _last$current;

package/dist/components/compositions/CodeEditor/components/CopyButton.d.ts

@@ -0,0 +1,5 @@
+export declare const CodeEditorCopyButton: ({ copyButton, value, }: {
+    copyButton: string | boolean | undefined;
+    value: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CopyButton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CopyButton.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/CodeEditor/components/CopyButton.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,oBAAoB;;;6CAgBhC,CAAA"}

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

@@ -0,0 +1,24 @@
+'use client';
+import { __esmMin, __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { CopyButton, init_CopyButton as init_CopyButton$1 } from "../../../CopyButton/index.js";
+import { codeEditorStyle, init_styles_css } from "../styles.css.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/compositions/CodeEditor/components/CopyButton.tsx
+var CodeEditorCopyButton;
+var init_CopyButton = __esmMin(() => {
+	init_CopyButton$1();
+	init_styles_css();
+	CodeEditorCopyButton = ({ copyButton, value }) => /* @__PURE__ */ jsx(CopyButton, {
+		bordered: true,
+		className: codeEditorStyle.copyButton,
+		sentiment: "neutral",
+		size: "small",
+		value,
+		children: typeof copyButton === "string" ? copyButton : void 0
+	});
+});
+
+//#endregion
+init_CopyButton();
+export { CodeEditorCopyButton, init_CopyButton };

package/dist/components/compositions/CodeEditor/components/Expandable.d.ts

@@ -0,0 +1,8 @@
+import type { Dispatch, SetStateAction } from 'react';
+export declare const CodeEditorExpandable: ({ expanded, setExpanded, hideText, showText, }: {
+    expanded: boolean;
+    setExpanded: Dispatch<SetStateAction<boolean>>;
+    hideText: string;
+    showText: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Expandable.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Expandable.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/CodeEditor/components/Expandable.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAErD,eAAO,MAAM,oBAAoB;;;;;6CAkChC,CAAA"}

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

@@ -0,0 +1,37 @@
+'use client';
+import { __esmMin, __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { Text, init_Text } from "../../../Text/index.js";
+import { codeEditorStyle, init_styles_css } from "../styles.css.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowDownIcon } from "@ultraviolet/icons/ArrowDownIcon";
+
+//#region src/components/compositions/CodeEditor/components/Expandable.tsx
+var CodeEditorExpandable;
+var init_Expandable = __esmMin(() => {
+	init_Text();
+	init_styles_css();
+	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",
+				className: codeEditorStyle.centeredText,
+				sentiment: "neutral",
+				variant: "bodySmallStrong",
+				children: [
+					expanded ? hideText : showText,
+					"\xA0",
+					/* @__PURE__ */ jsx(ArrowDownIcon, { className: codeEditorStyle.animatedArrowIcon[expanded ? "true" : "false"] })
+				]
+			})
+		})
+	});
+});
+
+//#endregion
+init_Expandable();
+export { CodeEditorExpandable, init_Expandable };

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

@@ -1,40 +1,6 @@
-import { langs } from '@uiw/codemirror-extensions-langs';
-import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
-import type { CSSProperties, ReactNode } from 'react';
-type CodeEditorProps = {
-    value: string;
-    onChange: ReactCodeMirrorProps['onChange'];
-    extensions: keyof typeof langs;
-    onBlur?: () => void;
-    height?: string;
-    readOnly?: boolean;
-    autoCompletion?: boolean;
-    disabled?: boolean;
-    helper?: ReactNode;
-    /**
-     * When set to true, a copy button is displayed in the top right corner of the editor.
-     * If a string is provided, it is used as the button's label. Otherwise, no label is displayed.
-     */
-    copyButton?: boolean | string;
-    label?: string;
-    /**
-     * Defines a max height and adds an expand button to see the full content of the component
-     */
-    expandableHeight?: number;
-    /** Text for the "show" button when maxLines is defined */
-    showText?: string;
-    /** Text for the "hide" button when maxLines is defined */
-    hideText?: string;
-    id?: string;
-    labelDescription?: ReactNode;
-    'aria-label'?: string;
-    'data-testid'?: string;
-    className?: string;
-    error?: string;
-    lineNumbers?: boolean;
-    style?: CSSProperties;
-    required?: boolean;
-};
+import type { CodeEditorProps } from './type';
+/**
+ * A code editor is a specialized tool designed to help developers write, edit, and manage code efficiently.
+ */
 export declare const CodeEditor: ({ value, onChange, extensions, onBlur, height, readOnly, autoCompletion, disabled, label, copyButton, id, helper, labelDescription, expandableHeight, hideText, showText, 'aria-label': ariaLabel, 'data-testid': dataTestId, className, error, lineNumbers, style, required, }: CodeEditorProps) => import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=index.d.ts.map

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;AAgBxD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAA;AACjE,OAAO,KAAK,EAAE,aAAa,EAAY,SAAS,EAAkB,MAAM,OAAO,CAAA;AAE/E,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAA;IAC1C,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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/CodeEditor/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAA;AAE7C;;GAEG;AACH,eAAO,MAAM,UAAU,+UAoHtB,CAAA"}

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

@@ -2,56 +2,29 @@
 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 { Expandable, init_Expandable } from "../../Expandable/index.js";
 import { codeEditorStyle, disabledStack, init_styles_css, maxHeightVar } from "./styles.css.js";
+import { CodeEditorCopyButton, init_CopyButton } from "./components/CopyButton.js";
+import { CodeEditorExpandable, init_Expandable as init_Expandable$1 } from "./components/Expandable.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 { 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
-var CodeEditorCopyButton, CodeEditorExpandable, CodeEditor;
+var CodeEditor;
 var init_CodeEditor = __esmMin(() => {
-	init_CopyButton();
 	init_Expandable();
 	init_Label();
 	init_Stack();
 	init_Text();
+	init_CopyButton();
+	init_Expandable$1();
 	init_styles_css();
-	CodeEditorCopyButton = ({ copyButton, value }) => /* @__PURE__ */ jsx(CopyButton, {
-		bordered: true,
-		className: codeEditorStyle.copyButton,
-		sentiment: "neutral",
-		size: "small",
-		value,
-		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",
-				className: codeEditorStyle.centeredText,
-				sentiment: "neutral",
-				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;

package/dist/components/compositions/CodeEditor/styles.css.js

@@ -1,10 +1,12 @@
 import { __esmMin } from "../../../_virtual/_rolldown/runtime.js";
+import { init_themes_css_js_vanilla } from "../../../themes/dist/vanilla/themes.css.js.vanilla.js";
 import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 
 //#region src/components/compositions/CodeEditor/styles.css.ts
 var maxHeightVar, disabledStack, codeEditorStyle;
 var init_styles_css = __esmMin(() => {
+	init_themes_css_js_vanilla();
 	init_styles_css_ts_vanilla();
 	maxHeightVar = "var(--uv_q4eszs0)";
 	disabledStack = "uv_q4eszs1";

package/dist/components/compositions/CodeEditor/type.d.ts

@@ -0,0 +1,38 @@
+import type { langs } from '@uiw/codemirror-extensions-langs';
+import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
+import type { CSSProperties, ReactNode } from 'react';
+export type CodeEditorProps = {
+    value: string;
+    onChange: ReactCodeMirrorProps['onChange'];
+    extensions: keyof typeof langs;
+    onBlur?: () => void;
+    height?: string;
+    readOnly?: boolean;
+    autoCompletion?: boolean;
+    disabled?: boolean;
+    helper?: ReactNode;
+    /**
+     * When set to true, a copy button is displayed in the top right corner of the editor.
+     * If a string is provided, it is used as the button's label. Otherwise, no label is displayed.
+     */
+    copyButton?: boolean | string;
+    label?: string;
+    /**
+     * Defines a max height and adds an expand button to see the full content of the component
+     */
+    expandableHeight?: number;
+    /** Text for the "show" button when maxLines is defined */
+    showText?: string;
+    /** Text for the "hide" button when maxLines is defined */
+    hideText?: string;
+    id?: string;
+    labelDescription?: ReactNode;
+    'aria-label'?: string;
+    'data-testid'?: string;
+    className?: string;
+    error?: string;
+    lineNumbers?: boolean;
+    style?: CSSProperties;
+    required?: boolean;
+};
+//# sourceMappingURL=type.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/CodeEditor/type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAA;AAC7D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAA;AACjE,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAA;IAC1C,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"}

package/dist/components/compositions/ContentCard/Content.d.ts

@@ -1,13 +1,3 @@
 import type { ContentCardProps } from './type';
-export declare const LinkContent: ({ direction, disabled, }: {
-    direction: "column" | "row";
-    disabled?: boolean | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
 export declare const CardContent: ({ title, subtitle, disabled, headingTag, description, children, }: ContentCardProps) => import("react/jsx-runtime").JSX.Element;
-export declare const ImageContent: ({ disabled, image, direction, subContainerHeight, }: {
-    disabled?: boolean | undefined;
-    image?: string | undefined;
-    direction: "column" | "row";
-    subContainerHeight: string;
-}) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Content.d.ts.map

package/dist/components/compositions/ContentCard/Content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Content.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/ContentCard/Content.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAA;AAE9C,eAAO,MAAM,WAAW;;;6CAkBvB,CAAA;AAED,eAAO,MAAM,WAAW,kIA4CvB,CAAA;AAED,eAAO,MAAM,YAAY;;;;;6CAsBxB,CAAA"}
+{"version":3,"file":"Content.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/ContentCard/Content.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAA;AAE9C,eAAO,MAAM,WAAW,kIA4CvB,CAAA"}