@use 'sass:map';
@use 'sass:list';
@use '../context' as *;

$component-name: map.get($components-names, vv-input-text);
$component-map: $vv-input-text;
$component-selector: '.#{$component-name}';

@include spread-map-into-bem(
	$map: $component-map,
	$block: $component-name,
	$props: $use-custom-props-for-components,
	$zero-specificity: $zero-specificity-for-components,
	$bps: $breakpoints
);

// disabled and readonly
@each $state in ('disabled', 'readonly') {
	$selector: '#{$component-selector}:has(input[#{$state}])';

	@include wrap-with-where(
		$selector: $selector,
		$enabled: $zero-specificity-for-components
	) {
		@extend %#{$component-name}--#{$state} !optional;
	}

	// element
	@if map.get($component-map, 'state', $state, 'element') {
		@each $element,
			$map in map.get($component-map, 'state', $state, 'element')
		{
			$element-selector: (
				'#{$selector} #{$component-selector}__#{$element}'
			);
			$alias: map.get($component-map, 'element', $element, '_alias');

			@if $alias {
				$element-selector: list.append(
					$element-selector,
					('#{$selector} #{$alias}')
				);
			}

			@include wrap-with-where(
				$selector: $element-selector,
				$enabled: $zero-specificity-for-components
			) {
				@extend %#{$component-name}-state-#{$state}__#{$element}
						!optional;
			}

			// element state
			@each $elementState, $elementMap in map.get($map, 'state') {
				@if $elementState {
					$element-selector-state: ();

					@each $item in $element-selector {
						$element-selector-state: list.append(
							$element-selector-state,
							('#{$item}:#{$elementState}')
						);
					}

					@include wrap-with-where(
						$selector: $element-selector-state,
						$enabled: $zero-specificity-for-components
					) {
						@extend %#{$component-name}-state-#{$state}-element-#{$element}--#{$elementState}
								!optional;
					}
				}
			}

			// element pseudo
			@each $pseudo, $pseudoMap in map.get($map, 'pseudo') {
				@if $pseudo {
					$element-selector-pseudo: ();

					@each $item in $element-selector {
						$element-selector-pseudo: list.append(
							$element-selector-pseudo,
							('#{$item}::#{$pseudo}')
						);
					}

					@include wrap-with-where(
						$selector: $element-selector-pseudo,
						$enabled: $zero-specificity-for-components
					) {
						@extend %#{$component-name}-state-#{$state}-element-#{$element}--#{$pseudo}
								!optional;
					}
				}
			}
		}
	}
}