@use 'sass:map';
@use 'sass:string';

@use 'function' as *;
@use '../common/var' as *;
@use 'config' as *;

// forward mixins
@forward 'config';
@forward 'function';
@forward 'var';

// Break-points
@mixin res($key, $map: $breakpoints) {
	// loop breakpoint Map, return if present
	@if map.has-key($map, $key) {
		@media only screen and #{string.unquote(map.get($map, $key))} {
			@content;
		}
	} @else {
		@warn "Undefined points: `#{$map}`";
	}
}

// Scrollbar
@mixin scroll-bar {
	$scrollbar-thumb-background: getCssVar('text-color', 'disabled');
	$scrollbar-track-background: getCssVar('fill-color', 'blank');

	&::-webkit-scrollbar {
		z-index: 11;
		width: 6px;

		/* stylelint-disable-next-line selector-pseudo-class-no-unknown -- This problem is ignorable. */
		&:horizontal {
			height: 6px;
		}

		&-thumb {
			border-radius: 5px;
			width: 6px;
			background: $scrollbar-thumb-background;
		}

		&-corner {
			background: $scrollbar-track-background;
		}

		&-track {
			background: $scrollbar-track-background;

			&-piece {
				background: $scrollbar-track-background;
				width: 6px;
			}
		}
	}
}

// BEM
@mixin b($block) {
	$B: $namespace + $common-separator + $block !global;

	.#{$B} {
		@content;
	}
}

@mixin e($element) {
	$E: $element !global;
	$selector: &;
	$currentSelector: '';
	@each $unit in $element {
		$currentSelector: #{$currentSelector + '.' + $B + $element-separator + $unit + ','};
	}

	@if hitAllSpecialNestRule($selector) {
		@at-root {
			#{$selector} {
				#{$currentSelector} {
					@content;
				}
			}
		}
	} @else {
		@at-root {
			#{$currentSelector} {
				@content;
			}
		}
	}
}

@mixin m($modifier) {
	$selector: &;
	$currentSelector: '';
	@each $unit in $modifier {
		$currentSelector: #{$currentSelector + $selector + $modifier-separator + $unit + ','};
	}

	@at-root {
		#{$currentSelector} {
			@content;
		}
	}
}

@mixin configurable-m($modifier, $E-flag: false) {
	$selector: &;
	$interpolation: '';

	@if $E-flag {
		$interpolation: $element-separator + $E-flag;
	}

	@at-root {
		#{$selector} {
			.#{$B + $interpolation + $modifier-separator + $modifier} {
				@content;
			}
		}
	}
}

@mixin spec-selector($specSelector: '', $element: $E, $modifier: false, $block: $B) {
	$modifierCombo: '';

	@if $modifier {
		$modifierCombo: $modifier-separator + $modifier;
	}

	@at-root {
		#{&}#{$specSelector}.#{$block + $element-separator + $element + $modifierCombo} {
			@content;
		}
	}
}

@mixin meb($modifier: false, $element: $E, $block: $B) {
	$selector: &;
	$modifierCombo: '';

	@if $modifier {
		$modifierCombo: $modifier-separator + $modifier;
	}

	@at-root {
		#{$selector} {
			.#{$block + $element-separator + $element + $modifierCombo} {
				@content;
			}
		}
	}
}

@mixin when($state) {
	@at-root {
		&.#{$state-prefix + $state} {
			@content;
		}
	}
}

@mixin extend-rule($name) {
	@extend #{'%shared-' + $name} !optional;
}

@mixin share-rule($name) {
	$rule-name: '%shared-' + $name;

	@at-root #{$rule-name} {
		@content;
	}
}

@mixin pseudo($pseudo) {
	@at-root #{&}#{':#{$pseudo}'} {
		@content;
	}
}

@mixin picker-popper($background, $border, $box-shadow) {
	&.#{$namespace}-popper {
		background: $background;
		border: $border;
		box-shadow: $box-shadow;

		.#{$namespace}-popper__arrow {
			&::before {
				border: $border;
			}
		}

		@each $placement, $adjacency in ('top': 'left', 'bottom': 'right', 'left': 'bottom', 'right': 'top') {
			&[data-popper-placement^='#{$placement}'] {
				.#{$namespace}-popper__arrow::before {
					border-#{$placement}-color: transparent;
					border-#{$adjacency}-color: transparent;
				}
			}
		}
	}
}

// dark
@mixin dark($block) {
	html.dark {
		@include b($block) {
			@content;
		}
	}
}

@mixin inset-input-border($color, $important: false) {
	@if $important == true {
		box-shadow: 0 0 0 1px $color inset !important;
	} @else {
		box-shadow: 0 0 0 1px $color inset;
	}
}