@use 'sass:list';
@use 'vars' as *;

$namespace: 'u' !default;

// 引用主题注入的 alpha token，如 color-a(color, 8, primary) → var(--u-color-primary-a-8)
@function color-a($basename, $alpha, $nodes...) {
  $suffix: '';

  @each $node in $nodes {
    $suffix: $suffix + '-' + $node;
  }

  @return var(--#{$namespace}-#{$basename}#{$suffix}-a-#{$alpha});
}

// 使用单个变量（全局主题 token，`--u-*`）
@function use-var($basename, $nodes...) {
  $suffix: '';

  @each $node in $nodes {
    $suffix: $suffix + '-' + $node;
  }

  @return var(--#{$namespace}-#{$basename}#{$suffix});
}

// 组件级 token：`var(--u-{component}-{property}[, fallback])`
@function component-var($component, $property, $fallback: null) {
  @if $fallback == null {
    @return var(--#{$namespace}-#{$component}-#{$property});
  }

  @return var(--#{$namespace}-#{$component}-#{$property}, #{$fallback});
}

// 使用多个变量
@function use-vars($vars, $separator: ' ') {
  $result: '';
  $len: list.length($vars);
  @for $i from 1 to $len {
    $result: $result + use-var(list.nth($vars, $i)) + $separator;
  }

  $result: $result + use-var(list.nth($vars, $len));

  @return $result;
}

// bem的函数
@function bem($b, $e: null, $m: null) {
  $b: '.' + $namespace + '-' + $b;
  @if ($e != null) {
    $b: $b + '__' + $e;
  }

  @if ($m != null) {
    $b: $b + '--' + $m;
  }

  @return $b;
}