#Konfiguration

Die konfiguration ist ein mächtiges Werkzeug im Sitekit. Es können mit ihrer Hilfe unterschiedliche Aufgaben erledigt werden, wie z.B. Überschreiben von Modellen, Komponenten und Renderer, beeinflusst die Darstellung der Ausgabe, Konfiguration der Session, hinzufügen, entfernen und austauschen von Komponenten, …

Für unterschiedliche Aufgaben gibt es auch unterschiedliche Konfigurationen:

• ContainerRenderer
• Formulare
• TypeMapping
• RenderPartial
• ReferenceResolver
• Teaser

Die Konfiguration kann immer von anderen Modulen wieder überschieben werden. Dafür ist die Reihenfolge, in der die Module geladen werden wichtig. (siehe WEB-IES/context.php im Key config -> bootstrap).

#Wo liegt die Konfiguration

// …

#Struktur der Konfiguration

// …

#Arten der Konfiguration

// Welche Keys können in welchem Bereich verwendet werden? TypeMapping vs Teaser vs Formulare vs TypeMapping vs ….

#Formulare

Um Formulare anzupassen, sollte das Formular an sich und auch alle enthaltenen Elemente einen configKey definiert haben. Dies ist ein eindeutiger Schlüssel, der im Formular definiert wird. Im folgenden Beispiel für ein fieldset. Es kann aber auf alle Elemente analog übertragen werden.

	private function getRawTermsAndConditionsConfirmFieldSet(): array {

		return [
			'type' => 'fieldset',
			'configKey' => 'shopTermsAndConditions',
			'items' => [
				// ...
			],
		];
	}

Der Key kann dann in der Datei renderer/html/arvedui/content/form/form.php hinterlegt werden:

<?php declare(strict_types=1);

return [
	'configKeys' => [
		'shopTermsAndConditions' => [
			'classes' => [
				'base' => 'SP-Field__annotation'
			]
		]
	]
];

Diese Konfiguration fügt dem Base Html Tag die CSS Klasse SP-Field__annotation hinzu.

Achtung: In der Konfigurationsdatei wird immer der configKeys (Mehrzahl) und in der Komponente configKey (Einzahl) verwendet.

// Kann mit einem ConfigKey auch auf Elemente innerhalb eines Containers/Fieldset zugegriffen werden? Ist dass sinnvoll? Order soll // dafür ein eigener Key angelegt werden? Was ist der präferierte weg?

#Partial Renderer

Mit dem Partial Renderer können Models in einem Renderer gerendert werden:

// Ergebnis zurückliefern
	$table = new \SP\SiteKit\Model\Table\Table();
	return $this->renderPartialAsString('cartTable', $table);

// Oder direkt ausgeben
	/** @var \SP\SiteKit\Model\Content\Link\Link $link */
	$link = $this->createModelByType(Link::TYPE);
	$link->setUrl('https://sitepark.com');
	$link->setLabel('Sitepark');
	$this->renderPartial('company', $link);

Wichtig für die Konfiguration ist der erste Parameter der renderPartialAsString und renderPartial Methoden. Dieser muss in der Konfiguration unter dem Namespace des Renderers abgelegt werden um zu greifen. Das bedeutet für den Renderer mt dem Namespace SP\Shop\Renderer\CartBasket muss im config Ordner die Datei renderer/shop/cartBasket.php erstellt werden. In der Datei muss der Key aus dem renderPartialAsString bzw. renderPartial Aufruf hinterlegt werden:

<?php declare(strict_types=1);

return [
	'cartTable' => [
		'classes' => [
			'base' => ['SP-Table--cart'],
		],
	],
];

#Konfiguration Keys

#Renderer

Alle Konfigurationen wirken sich immer auf die Komponente (1) aus die aus ein oder mehreren HTML Elementen bestehen. Die erste Ebene definiert, was (2) konfiguriert werden soll und die nächste Ebene, welches HTML Element(3).

return [
	'cartTable' => [ // (1) Komponente die Konfiguriert wird
		'classes' => [ // (2) Was soll konfiguriert werden
			'base' => [ // (3) HTML Element
				'SP-Table--cart'
			],
		],
	],
];

Viele Komponenten stellen zur Konfiguration der HTML Elemente folgende Eigenschaften zur Verfügung:

• header
• base
• content
• footer
• inner

Manche stellen aber auch spezielle Eigenschaften bereit wie z.B. headline, list und item in der SP\SiteKit\Renderer\Html\Arvedui\CommonList. Andere wiederum haben auch dynamische Eigenschaften wie z.B. bodyCellLevel4 um die vierte Zelle im Inhalt der SP\SiteKit\Renderer\Html\Arvedui\Html\Table zu konfigurieren.

Mögliche Keys die zum Konfigurieren eines Items zur Verfügung stehen:

Key	Beschreibung
attributes	Ist eine Map mit der HTML Attribute an eine HTML Tag geschrieben werden können.
classes	Kann an die HTML Tags der Komponente Klassen hinzufügen. Typische Bereiche sind base, header, footer. Wird aber von jeden Komponente definiert.
innerWrapper	Definiert den HTML Tag für das innere HTML Element.
itemConfig
stateAttributes
stateClasses	Hat die gleichen Möglichkeiten wie classes. Enthält auf der ersten Ebene einen Key der den Zustand definiert. Wird der State aktiviert werden die Klassen hinzugefügt.
statePrefixes
stateStyles
stateTag	Wenn die Komponente in einem bestimmten State ist, wird diese HTML Element verwendet
tag	Erlaubt das überschreiben des Tags. Es kann in der Ausgabe anstatt eines div ein section ausgegeben werden.

Jeder Key enthält erst das HTML Element, auf welches sich die Konfiguration bezieht und dann die eigentliche Konfiguration.

Hinweis: Es ist möglich, dass ein Item weitere Möglichkeiten zum Konfigurieren bereitstellt.

#attributes

<?php declare(strict_types=1);

return [
	// ...
	'attributes' => [
		'base' => [
			'role' => 'doc-toc'
		],
		'list' => [
			'role' => 'directory'
		]
	]
	// ...
];

#classes

<?php declare(strict_types=1);

return [
	// ...
	'htmlLabel' => [
		'link' => [
			'classes' => [
				'base' => ['SP-Link'],
				'text' => ['SP-Link__text'],
				'icon' => ['SP-Link__icon'],
			],
		],
	],
	// ...
];

#innerWrapper

<?php declare(strict_types=1);

return [
	// ...
	'innerWrapper' => [
		'base' => 'p'
	]
	// ...
];

#itemConfig

<?php declare(strict_types=1);

return [
	// ...
	'itemConfig' => [
		'field.annotation' => [
			'classes' => [
				'base' => ['SP-Annotation','SP-Paragraph','SP-Annotation--mandatoryFields']
			]
		]
	]
	// ...
];

#stateAttributes

<?php declare(strict_types=1);

return [
	// ...
	'stateAttributes' => [
		'completed' => [
			'true' => [
				'button' => [
					'disabled' => true
				]
			]
		]
	]
	// ...
];

#stateClasses

<?php declare(strict_types=1);

return [
	// ...
	'stateClasses' => [
		'hasImage' => [
			'true' => [
				'base' => ['SP-BusinessCircle--illustrated', 'SP-Grid__full']
			],
			'false' => [
				'base' => ['SP-BusinessCircle--hasText']
			]
		]
	],
	// ...
];

#statePrefixes

<?php declare(strict_types=1);

return [
	// ...
	'statePrefixes' => [
		'visibility' => 'SP-Separator--'
	],
	// ...
];

#stateStyles

// Deprecated? Wird nur im Bonn Modul verwendet. Kann mit Sicherheit auch anders gelöst werden. SourceGraph

<?php declare(strict_types=1);

return [
	// ...
	'stateStyles' => [
		'color' => [
			'*' => [
				'content' => [
					'background-color' => '${state}'
				]
			]
		]
	],
	// ...
];

#stateTag

<?php declare(strict_types=1);

return [
	// ...
	'stateTag' => [
		'isIllustrated' => [
			'true' => [
				'fixedSizeHeadline' => 'div',
				'fixedSizeRaiser' => 'div',
				'fixedSizeContent' => 'div'
			]
		]
	],
	// ...
];

#tag

<?php declare(strict_types=1);

return [
	// ...
	'tag' => [
		'base' => 'section'
	],
	// ...
];