@carbon/element-styles 0.3.6 → 0.3.7

package/scss/utilities/_carbon.scss

@@ -5,38 +5,38 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use 'sass:meta';
-@use 'sass:map';
+@use "sass:meta";
+@use "sass:map";
 
-@use '@carbon/styles/scss/colors';
-@use '@carbon/styles/scss/theme';
-@use '@carbon/styles/scss/themes' as carbon-themes;
-@use '@carbon/styles/scss/type';
-@use '@carbon/styles/scss/config' as carbon-config;
-@use '@carbon/styles/scss/breakpoint';
-@use '@carbon/styles/scss/components/button/tokens' as carbon-button;
-@use '@carbon/styles/scss/components/tag/tokens' as carbon-tag;
-@use '@carbon/styles/scss/components/content-switcher/tokens' as carbon-content-switcher;
-@use '@carbon/styles/scss/utilities/custom-property';
-@use '@carbon/styles/scss/layer/layer-tokens';
+@use "@carbon/styles/scss/colors";
+@use "@carbon/styles/scss/theme";
+@use "@carbon/styles/scss/themes" as carbon-themes;
+@use "@carbon/styles/scss/type";
+@use "@carbon/styles/scss/config" as carbon-config;
+@use "@carbon/styles/scss/breakpoint";
+@use "@carbon/styles/scss/components/button/tokens" as carbon-button;
+@use "@carbon/styles/scss/components/tag/tokens" as carbon-tag;
+@use "@carbon/styles/scss/components/content-switcher/tokens" as carbon-content-switcher;
+@use "@carbon/styles/scss/utilities/custom-property";
+@use "@carbon/styles/scss/layer/layer-tokens";
 
 $-themes: (
-  'white': carbon-themes.$white,
-  'g10': carbon-themes.$g10,
-  'g90': carbon-themes.$g90,
-  'g100': carbon-themes.$g100,
+  "white": carbon-themes.$white,
+  "g10": carbon-themes.$g10,
+  "g90": carbon-themes.$g90,
+  "g100": carbon-themes.$g100,
 );
 
 $-component-token-groups: (
   carbon-button.$button-tokens,
   carbon-tag.$tag-tokens,
-  carbon-content-switcher.$content-switcher-tokens,
+  carbon-content-switcher.$content-switcher-tokens
 );
 
 /// Emits all style and necessary component tokens for a given Carbon theme as css custom properties
 /// @group layout--mode
 /// @param {'white' | 'g10' | 'g90' | 'g100'} theme-name ['white']
-@mixin emit-carbon-tokens($theme-name: 'white') {
+@mixin emit-carbon-tokens($theme-name: "white") {
   $theme: map.get($-themes, $theme-name);
 
   @if $theme {
@@ -51,7 +51,10 @@ $-component-token-groups: (
           @each $theme-value in $theme-values {
             $value: map.get($theme-value, value);
 
-            @if theme.matches(map.get($theme-value, theme), $theme) and meta.type-of($value) == color {
+            @if theme.matches(map.get($theme-value, theme), $theme) and
+              meta.type-of($value) ==
+              color
+            {
               $tokens: map.set($tokens, $key, $value);
             }
           }
@@ -63,7 +66,7 @@ $-component-token-groups: (
 
     @include theme.theme($tokens);
   } @else {
-    @error '#{$theme-name} not found';
+    @error "#{$theme-name} not found";
   }
 
   @include layer-tokens.emit-layer-tokens(1);
@@ -71,12 +74,12 @@ $-component-token-groups: (
   @each $breakpoint in map.keys(carbon-config.$grid-breakpoints) {
     @include breakpoint.breakpoint-up($breakpoint) {
       @each $type-name, $type-styles in type.$tokens {
-        @if map.has-key($type-styles, 'breakpoints') {
-          $type-properties: map.get($type-styles, 'breakpoints', $breakpoint);
+        @if map.has-key($type-styles, "breakpoints") {
+          $type-properties: map.get($type-styles, "breakpoints", $breakpoint);
 
           @if $type-properties != null {
             @each $property, $value in $type-properties {
-              @include custom-property.declaration('#{$type-name}-#{$property}', $value);
+              @include custom-property.declaration("#{$type-name}-#{$property}", $value);
             }
           }
         }
@@ -90,7 +93,7 @@ $-component-token-groups: (
 @mixin emit-carbon-colors() {
   @each $palette, $values in colors.$colors {
     @each $shade, $value in $values {
-      @include custom-property.declaration('#{$palette}-#{$shade}', $value);
+      @include custom-property.declaration("#{$palette}-#{$shade}", $value);
     }
   }
 }

package/scss/utilities/_icons.scss

@@ -1,6 +1,6 @@
 /**
  * Copyright IBM Corp. 2026
- * 
+ *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */

package/scss/utilities/_tokens.scss

@@ -5,16 +5,16 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-@use '@carbon/styles/scss/utilities/custom-property';
+@use "@carbon/styles/scss/utilities/custom-property";
 
-@use '../config';
+@use "../config";
 
 /// Sets a css custom property
 /// @group tokens
 /// @param {String} name
 /// @param {String} value
 @mixin set($name, $value) {
-  @include custom-property.declaration('#{config.$prefix}--#{$name}', $value);
+  @include custom-property.declaration("#{config.$prefix}--#{$name}", $value);
 }
 
 /// Gets a css custom property value
@@ -23,7 +23,7 @@
 /// @param {Bool} fallback [false] - Optionally provide a fallback value if the css custom property isn't set.
 /// @return {String} - The css custom property accessor (`var(--…)`)
 @function get($name, $fallback: false) {
-  @return custom-property.get-var('#{config.$prefix}--#{$name}', $fallback);
+  @return custom-property.get-var("#{config.$prefix}--#{$name}", $fallback);
 }
 
 /// Gets a css custom property name
@@ -31,5 +31,5 @@
 /// @param {String} name
 /// @return {String} - The css custom property name (`--…`)
 @function get-name($name) {
-  @return custom-property.get-name('#{config.$prefix}--#{$name}');
+  @return custom-property.get-name("#{config.$prefix}--#{$name}");
 }