FEAT: Add $strict-values option.

MatteuSan · Apr 24, 2024 · b452b60 · b452b60
1 parent 44a2846
commit b452b60
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 4 deletions.
diff --git a/packages/sentro/_index.scss b/packages/sentro/_index.scss
@@ -24,6 +24,7 @@ $prefix: '' !default;
 $context: '' !default;
 $separator: '-' !default;
 $verbose: false !default;
+$strict-values: false !default;
 $token-validation: true !default;
 $key-validation: true !default;
 $breakpoint-validation: true !default;
@@ -33,6 +34,7 @@ $breakpoint-validation: true !default;
   $context: $context,
   $separator: $separator,
   $verbose: $verbose,
+  $strict-values: $strict-values,
   $token-validation: $token-validation,
   $key-validation: $key-validation,
   $breakpoint-validation: $breakpoint-validation,

diff --git a/packages/sentro/core/_index.scss b/packages/sentro/core/_index.scss
@@ -24,6 +24,7 @@ $prefix: '' !default;
 $context: '' !default;
 $separator: '-' !default;
 $verbose: false !default;
+$strict-values: false !default;
 $token-validation: true !default;
 $key-validation: true !default;
 $breakpoint-validation: true !default;

diff --git a/packages/sentro/core/_keys.scss b/packages/sentro/core/_keys.scss
@@ -45,6 +45,10 @@ $validation: true !default;
 /// @access public
 $verbose: false !default;
 
+/// Switches the leniency of the passed values to the keys.
+/// @access public
+$strict-values: false !default;
+
 /// Stores the keys for getting raw values.
 /// @access private
 $_ds-key-registry: ();
@@ -54,8 +58,8 @@ $_ds-key-registry: ();
 /// @param {*} $value
 /// @return {string} returns var() with key and fallback value.
 @function create($key, $value) {
-  $_ds-key-registry: map.set($_ds-key-registry, $key, tokens.switch($value)) !global;
-  @return var(--#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}, #{tokens.switch($value)});
+  $_ds-key-registry: map.set($_ds-key-registry, $key, _sanitize-value($value)) !global;
+  @return var(--#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}, #{_sanitize-value($value)});
 }
 
 /// Retrieves an existing component key.
@@ -100,15 +104,26 @@ $_ds-key-registry: ();
 /// @return {string|*} returns an overrider css custom property with a new value.
 @mixin bind($key, $value, $important: false) {
   @if $important {
-    --#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}: #{tokens.switch($value)} !important;
+    --#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}: #{_sanitize-value($value)} !important;
   } @else {
-    --#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}: #{tokens.switch($value)};
+    --#{_sanitize-prefix($ds-prefix)}#{_sanitize-key-in-custom-property($key)}: #{_sanitize-value($value)};
   }
   @if not check($key) {
     @include _register-key($key, $value);
   }
 }
 
+/// Sanitizes the value passed to the key.
+/// @access private
+/// @param {*} $value
+/// @return {*} sanitized value.
+@function _sanitize-value($value) {
+  @if $strict-values {
+    @return tokens.get($value);
+  }
+  @return tokens.switch($value);
+}
+
 /// Sanitizes and verifies a prefix.
 /// @access private
 /// @param {string} $prefix