@limetech/lime-elements 38.32.0 → 38.33.0

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## [38.33.0](https://github.com/Lundalogik/lime-elements/compare/v38.32.0...v38.33.0) (2025-12-04)
+
+
+### Features
+
+
+* **form:** add `help` to sections ([747f906](https://github.com/Lundalogik/lime-elements/commit/747f906fa81470430543cae2cb3c6da431142eb1))
+
 ## [38.32.0](https://github.com/Lundalogik/lime-elements/compare/v38.31.2...v38.32.0) (2025-12-04)
 
 

package/dist/cjs/limel-form.cjs.entry.js

@@ -42535,6 +42535,24 @@ class RowLayout extends react.Component {
   }
 }
 
+/**
+ *
+ * @param schema
+ * @param extraProps - additional props to pass to the limel-help element
+ */
+function getHelpComponent(schema, extraProps) {
+  var _a;
+  const help = (_a = schema.lime) === null || _a === void 0 ? void 0 : _a.help;
+  if (!help) {
+    return;
+  }
+  if (typeof help === 'string') {
+    return react.createElement('limel-help', Object.assign({ value: help }, extraProps));
+  }
+  const helpProps = help;
+  return react.createElement('limel-help', Object.assign(Object.assign({}, helpProps), extraProps));
+}
+
 const ObjectFieldTemplate = (props) => {
   const id = props.idSchema.$id;
   if (id === 'root' || !isCollapsible(props.schema)) {
@@ -42546,15 +42564,25 @@ const ObjectFieldTemplate = (props) => {
   return renderProperties(props.properties, props.schema);
 };
 function renderFieldWithTitle(props) {
-  return react.createElement(react.Fragment, {}, renderTitle(props.title), renderDescription(props.description), renderProperties(props.properties, props.schema));
+  return react.createElement(react.Fragment, {}, renderSectionHeader(props), renderDescription(props.description), renderProperties(props.properties, props.schema));
+}
+function renderSectionHeader(props) {
+  const help = getHelpComponent(props.schema);
+  if (!help) {
+    return renderTitle(props.title);
+  }
+  return react.createElement(react.Fragment, {}, renderTitle(props.title), help);
 }
 function renderCollapsibleField(props) {
   const defaultOpen = !isCollapsed(props.schema);
+  const helpElement = getHelpComponent(props.schema, {
+    slot: 'header',
+  });
   return react.createElement('limel-collapsible-section', {
     header: props.title,
     id: getSchemaObjectPropertyPath(props.formContext.schema, props.idSchema),
     'is-open': defaultOpen,
-  }, renderDescription(props.description), renderProperties(props.properties, props.schema));
+  }, helpElement, renderDescription(props.description), renderProperties(props.properties, props.schema));
 }
 function getSchemaObjectPropertyPath(schema, subSchema) {
   var _a, _b;
@@ -47067,23 +47095,6 @@ function isAdditionalProperty(schema) {
   return schema[ADDITIONAL_PROPERTY_FLAG] === true;
 }
 
-/**
- *
- * @param schema
- */
-function getHelpComponent(schema) {
-  var _a;
-  const help = (_a = schema.lime) === null || _a === void 0 ? void 0 : _a.help;
-  if (!help) {
-    return;
-  }
-  if (typeof help === 'string') {
-    return react.createElement('limel-help', { value: help });
-  }
-  const helpProps = help;
-  return react.createElement('limel-help', helpProps);
-}
-
 /**
  * A widget is a concept in react-jsonschema-form (rjsf).
  * It represents a HTML tag for the user to enter data, eg. input, select, etc.