material-components_material-web/testing/table/lib/_test-table-theme.scss

//
// Copyright 2021 Google LLC
// SPDX-License-Identifier: Apache-2.0
//

// stylelint-disable selector-class-pattern --
// Selector '.md3-*' should only be used in this project.

// go/keep-sorted start
@use 'sass:map';
// go/keep-sorted end
// go/keep-sorted start
@use '../../../sass/resolvers';
@use '../../../sass/theme';
@use '../../../tokens';
// go/keep-sorted end

$_default-deps: (
  md-sys-color: tokens.md-sys-color-values-light(),
  md-sys-typescale: tokens.md-sys-typescale-values(),
);

@function values($deps: $_default-deps, $exclude-hardcoded-values: false) {
  @return (
    cell-color: map.get($deps, md-sys-color, surface),
    cell-padding: if($exclude-hardcoded-values, null, 16px),
    cell-text-color: map.get($deps, md-sys-color, on-surface),
    cell-text-type: map.get($deps, 'md-sys-typescale', 'body-medium'),
    cell-grid-color: map.get($deps, md-sys-color, surface-variant),
    cell-grid-size: if($exclude-hardcoded-values, null, 16px),
    header-cell-color: map.get($deps, md-sys-color, surface-variant),
    header-cell-padding: if($exclude-hardcoded-values, null, 8px),
    header-cell-text-color: map.get($deps, md-sys-color, on-surface-variant),
    header-cell-text-type: map.get($deps, 'md-sys-typescale', 'title-medium'),
    outline-color: map.get($deps, md-sys-color, outline)
  );
}

$light-theme: values();
$dark-theme: values(
  (
    md-sys-color: tokens.md-sys-color-values-dark(),
  ),
  $exclude-hardcoded-values: true
);

@mixin theme($theme, $resolvers: resolvers.$material) {
  $theme: theme.validate-theme($light-theme, $theme);
  $theme: theme.create-theme-vars($theme, test-table);

  @include theme.emit-theme-vars($theme);
}

@mixin theme-styles($theme, $resolvers: resolvers.$material) {
  $theme: theme.validate-theme-styles($light-theme, $theme);
  $theme: theme.create-theme-vars($theme, test-table);

  @include _cell-color(map.get($theme, cell-color));
  @include _cell-padding(map.get($theme, cell-padding));
  @include _cell-grid-color(map.get($theme, cell-grid-color));
  @include _cell-grid-size(map.get($theme, cell-grid-size));
  @include _cell-text-color(map.get($theme, 'cell-text-color'));
  @include _cell-text-font(map.get($theme, 'cell-text-type'));

  @include _header-cell-color(map.get($theme, header-cell-color));
  @include _header-cell-padding(map.get($theme, header-cell-padding));
  @include _header-cell-text-color(map.get($theme, header-cell-text-color));
  @include _header-cell-text-typography(
    (
      'type': map.get($theme, 'header-cell-text-type'),
      'tracking': map.get($theme, 'header-cell-text-tracking'),
    )
  );
  @include _outline-color(map.get($theme, outline-color));
}

@mixin _cell-color($color) {
  .md3-test-table__cell {
    &::before {
      background-color: $color;
    }
  }
}

@mixin _cell-text-color($color) {
  .md3-test-table__text {
    color: $color;
  }
}

@mixin _cell-text-font($font) {
  .md3-test-table__text {
    font: $font;
  }
}

@mixin _cell-padding($padding) {
  .md3-test-table__cell {
    padding: $padding;
  }
}

@mixin _cell-grid-color($color) {
  .md3-test-table__cell {
    &::before {
      background-image: linear-gradient(to right, $color 1px, transparent 1px),
        linear-gradient(to bottom, $color 1px, transparent 1px);
    }
  }
}

@mixin _cell-grid-size($size) {
  .md3-test-table__cell {
    &::before {
      background-size: $size $size;
    }
  }
}

@mixin _header-cell-color($color) {
  .md3-test-table__header {
    background: $color;
  }
}

@mixin _header-cell-padding($padding) {
  .md3-test-table__header {
    padding: $padding;
  }
}

@mixin _header-cell-text-color($color) {
  .md3-test-table__header {
    color: $color;
  }
}

@mixin _header-cell-text-typography($font) {
  .md3-test-table__header {
    font: map.get($font, 'type');
  }
}

@mixin _outline-color($color) {
  &,
  .md3-test-table__cell,
  .md3-test-table__header {
    border-color: $color;
  }
}