@use 'sass:map';
@use '../utils/constants.scss';
@use '../utils/tokens.scss' as tokens;
@use '@viasat/beam-tokens/typography/typography.classes';

$textBaseClass: '#{constants.$prefix}text';

$colors: (
  'primary': tokens.$bm-sem-color-text-primary,
  'secondary': tokens.$bm-sem-color-text-secondary,
  'positive': tokens.$bm-sem-color-text-positive,
  'warning': tokens.$bm-sem-color-text-warning,
  'negative': tokens.$bm-sem-color-text-negative,
  'infoPrimary': tokens.$bm-sem-color-text-info-primary,
  'infoSecondary': tokens.$bm-sem-color-text-info-secondary,
  'selected': tokens.$bm-sem-color-text-selected,
  'disabled': tokens.$bm-sem-color-text-disabled,
  'primaryInverse': tokens.$bm-sem-color-text-primary-inverse,
  'secondaryInverse': tokens.$bm-sem-color-text-secondary-inverse,
  'expressive': tokens.$bm-expressive-color-fg,
  'expressiveStronger': tokens.$bm-expressive-color-fg-stronger,
  'expressiveInverse': tokens.$bm-expressive-color-inverse-fg,
  'expressiveInverseStronger': tokens.$bm-expressive-color-inverse-fg-stronger,
);

// Weights, we only use body-bold the rest are take care by the kind prop
$weights: (
  'heading-regular': tokens.$bm-sem-font-weight-heading,
  'heading-bold': tokens.$bm-sem-font-weight-heading-alt,
  'body-regular': tokens.$bm-sem-font-weight-body,
  'body-bold': tokens.$bm-sem-font-weight-body-bold,
);

.#{$textBaseClass} {
  padding: tokens.$bm-sem-space-0;
  margin: tokens.$bm-sem-space-0;

  // Word Breaks
  &--normal {
    word-break: normal;
  }

  &--breakAll {
    word-break: break-all;
  }

  &--breakWord {
    word-break: break-word;
  }

  // Text Alignments
  &--start {
    text-align: start;
  }

  &--center {
    text-align: center;
  }

  &--end {
    text-align: end;
  }

  // Booleans
  &--block {
    display: block;
  }

  &--truncate {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    ::slotted(*) {
      display: block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }

  &--italic {
    font-style: italic;
  }

  &--underline#{&}--strikethrough {
    text-decoration: underline line-through;
  }

  &--underline {
    text-decoration: underline;
  }

  &--strikethrough {
    text-decoration: line-through;
  }

  // Weights
  @each $weightName, $weightValue in $weights {
    &--#{$weightName} {
      font-weight: $weightValue;
    }
  }

  // Colors
  @each $colorName, $colorValue in $colors {
    &--#{$colorName} {
      color: $colorValue;
    }
  }
}