alchemy-widget 0.3.0-alpha.1 → 0.3.0-alpha.2

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+## 0.3.0-alpha.2 (2025-07-10)
+
+* Make `main_class_names` widget config add classes to the first child of the wrapper
+* Add `li_class_names` config to List widgets
+* Don't return client-version of ToolbarManager on the server
+
 ## 0.3.0-alpha.1 (2024-02-15)
 
 * Upgrade to Alchemy v1.4.0

package/helper/widgets/00-widget.js

@@ -740,7 +740,7 @@ Widget.setMethod(function populateWidget() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.2.1
+ * @version  0.3.0
  */
 Widget.setMethod(function finalizePopulatedWidget() {
 
@@ -758,6 +758,22 @@ Widget.setMethod(function finalizePopulatedWidget() {
 		}
 	}
 
+	if (config.main_class_names) {
+		let main = this.widget?.children?.[0];
+
+		if (main) {
+			let name,
+				i;
+
+			let class_names = Array.cast(config.main_class_names);
+
+			for (i = 0; i < class_names.length; i++) {
+				name = class_names[i];
+				main.classList.add(name);
+			}
+		}
+	}
+
 	if (config.language) {
 		this.widget.setAttribute('lang', config.language);
 	} else {

package/helper/widgets/05-list.js

@@ -11,6 +11,23 @@
  */
 const List = Function.inherits('Alchemy.Widget.Container', 'List');
 
+/**
+ * Prepare the schema
+ *
+ * @author   Jelle De Loecker <jelle@elevenways.be>
+ * @since    0.3.0
+ * @version  0.3.0
+ */
+List.constitute(function prepareSchema() {
+
+	// Classnames for the li elements
+	this.schema.addField('li_class_names', 'String', {
+		title       : 'Li-element CSS classes',
+		description : 'Configure extra CSS classes for the list items', 
+		array: true,
+	});
+});
+
 /**
  * Get a list of elements that could be child widgets
  *
@@ -39,4 +56,38 @@ List.setMethod(function initContainer() {
 	this.widget.list_element = ul;
 
 	initContainer.super.call(this);
+});
+
+/**
+ * Populate the contents of the widget
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.3.0
+ * @version  0.3.0
+ */
+List.setMethod(function finalizePopulatedWidget() {
+
+	const config = this.config;
+
+	if (config?.li_class_names) {
+		let li_elements = this.widget.list_element.querySelectorAll(':scope > li');
+
+		if (li_elements.length) {
+			let name,
+				i;
+
+			let class_names = Array.cast(config.li_class_names);
+
+			for (i = 0; i < class_names.length; i++) {
+				name = class_names[i];
+				
+				for (let li_element of li_elements) {
+					li_element.classList.add(name);
+				}
+			}
+		}
+	}
+
+
+	return finalizePopulatedWidget.super.call(this);
 });

package/lib/conduit_extras.js

@@ -1,3 +1,5 @@
+const MANAGER = Symbol('toolbar_manager');
+
 /**
  * Add a method to the conduit class to set the toolbar manager
  *
@@ -13,6 +15,8 @@ Classes.Alchemy.Conduit.Conduit.setMethod(function setToolbarInfo(document_or_mo
 	} catch (err) {
 		console.error('Error setting toolbar info', err);
 	}
+
+	return this[MANAGER];
 });
 
 /**
@@ -30,11 +34,18 @@ function _setToolbarInfo(document_or_model, scenario = 'frontend') {
 		return;
 	}
 
-	let manager = Classes.Alchemy.Widget.EditorToolbarManager.create(this);
-	manager.scenario = scenario;
+	let manager = this[MANAGER] || this.set('toolbar_manager');
+	
+	if (!manager) {
+		manager = Classes.Alchemy.Widget.EditorToolbarManager.create(this);
+		this[MANAGER] = manager;
+		this.set('toolbar_manager', manager);
+		this.expose('toolbar_manager', manager);
+	}
 
-	this.set('toolbar_manager', manager);
-	this.expose('toolbar_manager', manager);
+	if (scenario !== undefined) {
+		manager.scenario = scenario;
+	}
 
 	let document_watcher,
 	    document,

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "alchemy-widget",
 	"description": "The widget plugin for the AlchemyMVC",
-	"version": "0.3.0-alpha.1",
+	"version": "0.3.0-alpha.2",
 	"author": "Jelle De Loecker <jelle@elevenways.be>",
 	"keywords": [
 		"alchemy",