@use "sass:string";
@use "sass:selector";
@use "../core/string" as *;

/// 选择器扩展
/// @mixin limit-parent($selector, $limiter)
/// @mixin unify-parent($child)
///-----------------------------------------------------

/// 给指定父选择器增加限制符
/// @param {string} $selector 指定的父选择器
/// @param {string} $limiter 限制修饰符
///-----------------------------------------------------
@mixin limit-parent($selector, $limiter) {
  @if $selector and $limiter {
    // `&` 可以获取嵌套全路径
    $selectors: selector.unify(&, &);
    $limitSelector: selector.unify($selector, $limiter);
    $newSelectors: str-replace(#{$selectors}, $selector, $limitSelector);
    @at-root #{$newSelectors} {
      @content;
    }
  } @else {
    @error "[limit-parent]: Selector and limiter is required";
  }
}

/// 统一父选择器
/// @param {string} $child 子选择器
/// @example
///   .parent {
///     @include unify-parent('.child') {
///       color: red;
///     }
///   }
///   // .parent.child { color: red; }
/// @example
///   .parent {
///     @include unify-parent('&--modifier') {
///       color: blue;
///     }
///   }
///   // .parent--modifier{ color: blue; }
///-----------------------------------------------------
@mixin unify-parent($child) {
  @if string.slice($child, 1, 1) == "&" {
    // If $child starts with '&', it's already referencing the parent.
    // So, just use $child at the root, it will correctly resolve.
    // e.g., in .parent, unify-parent('&--modifier') -> &--modifier -> .parent--modifier
    @at-root #{$child} {
      @content;
    }
  } @else {
    // Otherwise, unify the current parent & with the $child selector.
    // e.g., in .parent, unify-parent('.child') -> selector.unify(.parent, .child) -> .parent.child
    @at-root #{selector.unify(&, $child)} {
      @content;
    }
  }
}