@parallelworks/ui 0.61.0 → 0.62.0

package/dist/components/Field.js

@@ -49,6 +49,7 @@ var labelSizes = {
 };
 var labelClassName = "flex items-center gap-1 font-medium";
 var actionsClassName = "ml-auto flex shrink-0 items-center gap-1";
+var controlFirstExtrasClassName = "ms-1 inline-flex items-center gap-1 align-[-0.125em]";
 var errorTextClassName = "flex items-center gap-1.5 text-xs text-(--theme-error-text)";
 /** An error in the look a Field gives its own, for a control outside a Field, or for a part of
 *  one rather than the whole of it, such as a row of a list editor. Give it an `id` and name it
@@ -188,7 +189,7 @@ function Field$1({ label, hint, help, actions, description, error, invalid, requ
 				className: "w-52 shrink-0"
 			}), /* @__PURE__ */ jsxs("div", {
 				ref: help ? setControlBox : void 0,
-				className: cx("flex w-fit max-w-full min-w-0 items-start gap-2", lined && labelSize.inlineLine, inRow && "row-start-2"),
+				className: cx("flex w-fit max-w-full min-w-0 items-start gap-2", lined ? labelSize.inlineLine : "py-0.5", inRow && "row-start-2"),
 				children: [/* @__PURE__ */ jsx("div", {
 					className: cx("flex h-lh shrink-0 items-center", labelSize.text),
 					...helpFocus,
@@ -197,10 +198,21 @@ function Field$1({ label, hint, help, actions, description, error, invalid, requ
 					className: "flex min-w-0 flex-col gap-1",
 					children: [/* @__PURE__ */ jsxs("div", {
 						className: cx("font-medium", labelSize.text, disabled && "opacity-60"),
-						children: [fieldLabel(disabled ? "cursor-not-allowed" : "cursor-pointer"), (help || hint || actions) && /* @__PURE__ */ jsx("span", {
-							className: "ms-1 inline-flex items-center gap-1 align-[-0.125em]",
-							children: labelExtras
-						})]
+						children: [
+							fieldLabel(disabled ? "cursor-not-allowed" : "cursor-pointer"),
+							helpTip && /* @__PURE__ */ jsx("span", {
+								className: controlFirstExtrasClassName,
+								children: helpTip
+							}),
+							hint && /* @__PURE__ */ jsx("span", {
+								className: "ms-1",
+								children: hint
+							}),
+							actions && /* @__PURE__ */ jsx("span", {
+								className: controlFirstExtrasClassName,
+								children: actions
+							})
+						]
 					}), messages]
 				})]
 			})]

package/dist/form/Fields/BooleanField.js

@@ -16,10 +16,17 @@ function BooleanField(props) {
 	const onOption = field.options ? String(field.options.onOption ?? true) : true;
 	const offOption = field.options ? String(field.options.offOption ?? false) : false;
 	const checked = value === true || value === "true" || value === onOption;
-	const stateName = (option) => typeof option === "string" ? option.charAt(0).toUpperCase() + option.slice(1).toLowerCase() : void 0;
+	const option = checked ? onOption : offOption;
+	const stateName = typeof option === "string" ? /* @__PURE__ */ jsx("span", {
+		"aria-hidden": "true",
+		className: "font-normal text-(--theme-muted-text-color)",
+		children: option.charAt(0).toUpperCase() + option.slice(1).toLowerCase()
+	}) : void 0;
 	return /* @__PURE__ */ jsx(Field, {
 		...fieldFrame(props),
 		required: false,
+		controlFirst: true,
+		hint: stateName,
 		children: (control) => /* @__PURE__ */ jsx(Tooltip, {
 			content: field.disabled_message,
 			disabled: !disabled,
@@ -29,8 +36,6 @@ function BooleanField(props) {
 				render: /* @__PURE__ */ jsx("button", { type: "button" }),
 				checked,
 				onCheckedChange: (on) => handleChange(on ? onOption : offOption),
-				onLabel: stateName(onOption),
-				offLabel: stateName(offOption),
 				disabled
 			})
 		})

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parallelworks/ui",
-  "version": "0.61.0",
+  "version": "0.62.0",
   "description": "React UI components: a theme contract, icons, brand logos, primitives, lists, forms, a job graph, a code editor, a log viewer, a file explorer and an AI chat, each on its own subpath",
   "license": "Apache-2.0",
   "repository": {