{"version":3,"sources":["webpack:///./packages/mdc-tab-indicator/mdc-tab-indicator.scss","webpack:///./packages/material-components-web/node_modules/@material/theme/_css.scss"],"names":[],"mappings":";;;;;;;AAmIE,0DCjEI,qBAYF,+CD0FF,qDCtGI,cAYF,0CD+DF,0DAEI,oBAoDsB,CAjB1B,qDAEI,WAgBiB,CAfjB,cAeiB,CAnKrB,mBAEI,aACA,kBACA,MACA,OACA,uBACA,WACA,YACA,oBACA,UAIJ,4BAEI,oDACA,UAIJ,uCAEI,oBACA,sBACA,WACA,uBAIJ,kCAEI,kBACA,cAIJ,uDAEI,UAKJ,+CAEI,sOAKJ,8DAEI,gBAIJ,qDAEI,gCAKJ,+EAGI,uB","file":"mdc.tab-indicator.min.css","sourcesContent":["//\n// Copyright 2018 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n// stylelint-disable selector-class-pattern --\n// Selector '.mdc-*' should only be used in this project.\n\n@use '@material/animation/variables';\n@use '@material/theme/theme';\n@use '@material/feature-targeting/feature-targeting';\n\n@mixin static-styles($query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n  $feat-animation: feature-targeting.create-target($query, animation);\n\n  .mdc-tab-indicator {\n    @include feature-targeting.targets($feat-structure) {\n      display: flex;\n      position: absolute;\n      top: 0;\n      left: 0;\n      justify-content: center;\n      width: 100%;\n      height: 100%;\n      pointer-events: none;\n      z-index: 1;\n    }\n  }\n\n  .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-structure) {\n      transform-origin: left;\n      opacity: 0;\n    }\n  }\n\n  .mdc-tab-indicator__content--underline {\n    @include feature-targeting.targets($feat-structure) {\n      align-self: flex-end;\n      box-sizing: border-box;\n      width: 100%;\n      border-top-style: solid;\n    }\n  }\n\n  .mdc-tab-indicator__content--icon {\n    @include feature-targeting.targets($feat-structure) {\n      align-self: center;\n      margin: 0 auto;\n    }\n  }\n\n  .mdc-tab-indicator--active .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-structure) {\n      opacity: 1;\n    }\n  }\n\n  // Slide by default\n  .mdc-tab-indicator .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-animation) {\n      transition: 250ms transform variables.$standard-curve-timing-function;\n    }\n  }\n\n  // --no-transition is applied in cases where styles need to be applied immediately to set up a transition\n  .mdc-tab-indicator--no-transition .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-animation) {\n      transition: none;\n    }\n  }\n\n  .mdc-tab-indicator--fade .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-animation) {\n      transition: 150ms opacity linear;\n    }\n  }\n\n  // postcss-bem-linter: ignore\n  .mdc-tab-indicator--active.mdc-tab-indicator--fade\n    .mdc-tab-indicator__content {\n    @include feature-targeting.targets($feat-animation) {\n      transition-delay: 100ms;\n    }\n  }\n}\n\n@mixin core-styles($query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n  $feat-animation: feature-targeting.create-target($query, animation);\n\n  // postcss-bem-linter: define tab-indicator\n\n  .mdc-tab-indicator {\n    @include base_($query);\n  }\n\n  @include static-styles($query: $query);\n\n  // postcss-bem-linter: end\n}\n\n@mixin surface($query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n\n  @include feature-targeting.targets($feat-structure) {\n    position: relative;\n  }\n}\n\n@mixin underline-color($color, $query: feature-targeting.all()) {\n  $feat-color: feature-targeting.create-target($query, color);\n\n  .mdc-tab-indicator__content--underline {\n    @include feature-targeting.targets($feat-color) {\n      @include theme.property(border-color, $color);\n    }\n  }\n}\n\n@mixin underline-height($height, $query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n\n  .mdc-tab-indicator__content--underline {\n    @include feature-targeting.targets($feat-structure) {\n      border-top-width: $height;\n    }\n  }\n}\n\n@mixin underline-shape($radius) {\n  .mdc-tab-indicator__content--underline {\n    @include theme.property('border-radius', $radius);\n  }\n}\n\n@mixin underline-top-corner-radius($radius, $query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n\n  .mdc-tab-indicator__content--underline {\n    @include feature-targeting.targets($feat-structure) {\n      border-top-left-radius: $radius;\n      border-top-right-radius: $radius;\n    }\n  }\n}\n\n@mixin icon-color($color, $query: feature-targeting.all()) {\n  $feat-color: feature-targeting.create-target($query, color);\n\n  .mdc-tab-indicator__content--icon {\n    @include feature-targeting.targets($feat-color) {\n      @include theme.property(color, $color);\n    }\n  }\n}\n\n@mixin icon-height($height, $query: feature-targeting.all()) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n\n  .mdc-tab-indicator__content--icon {\n    @include feature-targeting.targets($feat-structure) {\n      height: $height;\n      font-size: $height;\n    }\n  }\n}\n\n//\n// Private\n//\n\n@mixin base_($query) {\n  $feat-structure: feature-targeting.create-target($query, structure);\n\n  @include underline-color(primary, $query);\n  @include icon-color(secondary, $query);\n  @include underline-height(2px, $query);\n  @include icon-height(34px, $query);\n}\n","//\n// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n@use './gss';\n\n/// When true, add an additional property/value declaration before declarations\n/// that use advanced features such as custom properties or CSS functions. This\n/// adds fallback support for older browsers such as IE11 that do not support\n/// these features at the cost of additional CSS. Set this variable to false to\n/// disable generating fallback declarations.\n$enable-fallback-declarations: true !default;\n\n/// Writes a CSS property/value declaration. This mixin is used throughout the\n/// theme package for consistency for dynamically setting CSS property values.\n///\n/// This mixin may optionally take a fallback value. For advanced features such\n/// as custom properties or CSS functions like min and max, a fallback value is\n/// recommended to support older browsers.\n///\n/// @param {String} $property - The CSS property of the declaration.\n/// @param {*} $value - The value of the CSS declaration. The value should be\n///     resolved by other theme functions first (i.e. custom property Maps and\n///     Material theme keys are not supported in this mixin). If the value is\n///     null, no declarations will be emitted.\n/// @param {*} $fallback - An optional fallback value for older browsers. If\n///     provided, a second property/value declaration will be added before the\n///     main property/value declaration.\n/// @param {Map} $gss - An optional Map of GSS annotations to add.\n/// @param {Bool} $important - If true, add `!important` to the declaration.\n@mixin declaration(\n  $property,\n  $value,\n  $fallback-value: null,\n  $gss: (),\n  $important: false\n) {\n  // Normally setting a null value to a property will not emit CSS, so mixins\n  // wouldn't need to check this. However, Sass will throw an error if the\n  // interpolated property is a custom property.\n  @if $value != null {\n    $important-rule: if($important, ' !important', '');\n\n    @if $fallback-value and $enable-fallback-declarations {\n      @include gss.annotate($gss);\n      #{$property}: #{$fallback-value} #{$important-rule};\n\n      // Add @alternate to annotations.\n      $gss: map.merge(\n        $gss,\n        (\n          alternate: true,\n        )\n      );\n    }\n\n    @include gss.annotate($gss);\n    #{$property}: #{$value}#{$important-rule};\n  }\n}\n\n/// Unpacks shorthand values for CSS properties (i.e. lists of 1-3 values).\n/// If a list of 4 values is given, it is returned as-is.\n///\n/// Examples:\n///\n/// unpack-value(4px) => 4px 4px 4px 4px\n/// unpack-value(4px 2px) => 4px 2px 4px 2px\n/// unpack-value(4px 2px 2px) => 4px 2px 2px 2px\n/// unpack-value(4px 2px 0 2px) => 4px 2px 0 2px\n///\n/// @param {Number | Map | List} $value - List of 1 to 4 value numbers.\n/// @return {List} a List of 4 value numbers.\n@function unpack-value($value) {\n  @if meta.type-of($value) == 'map' or list.length($value) == 1 {\n    @return $value $value $value $value;\n  } @else if list.length($value) == 4 {\n    @return $value;\n  } @else if list.length($value) == 3 {\n    @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 3)\n      list.nth($value, 2);\n  } @else if list.length($value) == 2 {\n    @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 1)\n      list.nth($value, 2);\n  }\n\n  @error \"Invalid CSS property value: '#{$value}' is more than 4 values\";\n}\n"],"sourceRoot":""}