feat(core): ✨ add config to change overflow inherited classes

README.md

@@ -121,6 +121,7 @@ Name | Description | Values | Default
 `$wgCitizenEnableARFonts` | Enable included Noto Naskh Arabic for wikis that serve Arabic | `true` - enable; `false` - disable | `false`
 `$wgCitizenEnableCJKFonts` | Enable included Noto Sans CJK for wikis that serves CJK languages | `true` - enable; `false` - disable | `false`
 `$wgCitizenEnablePreferences` | Enable the preferences menu | `true` - enable; `false` - disable | `true`
+`$wgCitizenOverflowInheritedClasses` | Defines css classes inherited by the overflow wrapper | List of css classes. Extend with `$wgCitizenOverflowInheritedClasses[] = 'my_class';` | `["floatleft", "floatright" ]`
 `$wgCitizenOverflowNowrapClasses` | Defines css classes ignored by the overflow wrapper | List of css classes. Extend with `$wgCitizenOverflowNowrapClasses[] = 'my_class';` | `["citizen-table-nowrap", "diff", "mw-changeslist-line", "mw-recentchanges-table", "infobox", "cargoDynamicTable", "dataTable", "srf-datatable", "smw-datatable", "mw-capiunto-infobox" ]`
 
 ### Search suggestions

includes/Hooks/ResourceLoaderHooks.php

@@ -47,6 +47,7 @@ class ResourceLoaderHooks {
 	) {
 		return [
 			'wgCitizenEnablePreferences' => $config->get( 'CitizenEnablePreferences' ),
+			'wgCitizenOverflowInheritedClasses' => $config->get( 'CitizenOverflowInheritedClasses' ),
 			'wgCitizenOverflowNowrapClasses' => $config->get( 'CitizenOverflowNowrapClasses' ),
 			'wgCitizenSearchModule' => $config->get( 'CitizenSearchModule' )
 		];

resources/skins.citizen.scripts/overflowElements.js

@@ -98,10 +98,10 @@ class OverflowElement {
 	/**
 	 * Filters and adds inherited classes to the wrapper element.
 	 *
-	 * @param {Array} inheritedClasses - An array of inherited classes to handle.
 	 * @return {void}
 	 */
-	handleInheritedClasses( inheritedClasses ) {
+	handleInheritedClasses() {
+		const inheritedClasses = config.wgCitizenOverflowInheritedClasses;
 		const filteredClasses = inheritedClasses.filter( ( cls ) => this.element.classList.contains( cls ) );
 
 		filteredClasses.forEach( ( cls ) => {
@@ -146,7 +146,7 @@ class OverflowElement {
 			const wrapper = document.createElement( 'div' );
 			wrapper.className = 'citizen-overflow-wrapper';
 
-			this.handleInheritedClasses( [ 'floatleft', 'floatright' ] );
+			this.handleInheritedClasses();
 
 			parentNode.insertBefore( wrapper, this.element );
 			wrapper.appendChild( this.element );

skin.json

@@ -687,6 +687,15 @@
 			"descriptionmsg": "citizen-config-enablepreferences",
 			"public": true
 		},
+		"OverflowInheritedClasses": {
+			"value": [
+				"floatleft",
+				"floatright"
+			],
+			"description": "Defines css classes inherited by overflow wrapper",
+			"descriptionmsg": "citizen-config-overflowinheritedclasses",
+			"public": true
+		},
 		"OverflowNowrapClasses": {
 			"value": [
 				"citizen-table-nowrap",

tests/phpunit/integration/Hooks/ResourceLoaderHooksTest.php

@@ -19,6 +19,7 @@ class ResourceLoaderHooksTest extends MediaWikiIntegrationTestCase {
 	public function testCitizenResourceLoaderConfig() {
 		$this->overrideConfigValues( [
 			'CitizenEnablePreferences' => false,
+			'CitizenOverflowInheritedClasses' => false,
 			'CitizenOverflowNowrapClasses' => false,
 			'CitizenSearchModule' => false,
 		] );
@@ -33,6 +34,7 @@ class ResourceLoaderHooksTest extends MediaWikiIntegrationTestCase {
 		$this->assertArraySubmapSame( [
 			'wgCitizenEnablePreferences' => false,
 			'wgCitizenSearchModule' => false,
+			'wgCitizenOverflowInheritedClasses' => false,
 			'wgCitizenOverflowNowrapClasses' => false,
 		], $config );
 	}
@@ -44,6 +46,7 @@ class ResourceLoaderHooksTest extends MediaWikiIntegrationTestCase {
 	public function testCitizenResourceLoaderConfigAllTrue() {
 		$this->overrideConfigValues( [
 			'CitizenEnablePreferences' => true,
+			'CitizenOverflowInheritedClasses' => true,
 			'CitizenOverflowNowrapClasses' => true,
 			'CitizenSearchModule' => true,
 		] );
@@ -57,6 +60,7 @@ class ResourceLoaderHooksTest extends MediaWikiIntegrationTestCase {
 
 		$this->assertArraySubmapSame( [
 			'wgCitizenEnablePreferences' => true,
+			'whCitizenOverflowInheritedClasses' => true,
 			'wgCitizenOverflowNowrapClasses' => true,
 			'wgCitizenSearchModule' => true,
 		], $config );