Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Sass: Typed value with the descriptor. #sass
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
// Sass: Typed value with the descriptor.
//
// Typed value factory & validator using Map
// https://gist.github.com/whizark/b42f5d52c3caa2ad5f43
//
// Other ideas
// https://github.com/whizark/xass#ideas
// THIS IS JUST PSEUDO-CODE FOR THE INTERFACE.
// The storage for types.
//
// (
// <type-name>: (
// factory: null,
// getter: null,
// setter: null,
// validator: null
// ),
// ...
// )
$-types: ();
// Registers a type with the descriptor.
//
// @param {String} $type - The type name
// @param {Map} $descriptor - The type descriptor
// (
// factory: '<factory-function-name>',
// getter: '<getter-function-name>',
// setter: '<setter-function-name>',
// validator: '<validato-function-name>'
// )
@mixin register-type($type, $descriptor: ()) { /* @todo implements */ }
// Creates a value of a type.
//
// Validator, factory of the type is internally called by `call()`.
//
// @param {String} $type - The type name
// @param {*} $value - The value
//
// @return {Map} The typed-value
// (
// -type: '<type-name>',
// -value: '<value>'
// )
@function new($type, $value) { /* @todo implements */ @return null; }
// Returns the value of a typed-value.
//
// @param {Map} $typed-value - The typed-value
// (
// -type: '<type-name>',
// -value: '<value>'
// )
//
// @return {*} The value of `-value`
@function value-of($typed-value) { /* @todo implements */ @return null; }
// Sets a value to a typed-value.
//
// Validator of the type is internally called by `call()`.
//
// @param {Map} $typed-value - The typed-value
// (
// -type: '<type-name>',
// -value: '<value>'
// )
// @param {*} $value - The value
//
// @return {Map} The typed-value
// (
// -type: '<type-name>',
// -value: '<value>'
// )
@function set($typed-value, $value) { /* @todo implements */ @return null; }
// Use case
// Registers 'direction' type with the validator.
@include register-type(
// Type name
'direction',
// Type descriptor.
(
factory: null,
getter: null,
setter: null,
validator: 'validate-direction' // The function name of the validator
)
);
// The typed-value validator for 'direction'.
//
// The validator is automatically called from factory, setter.
//
// @param {*} $value - The value to validate
//
// @return {Bool} True if it is valid, a message otherwise.
@function validate-direction($value) {
@if not type-of($value) != 'string' {
// Returns a message if it isn't valid.
@return 'The Direction `#{$value}` should be a String.';
}
$index: index(('left', 'right'), $value);
@if $index == null {
@return 'The Direction `#{$value}` should be `left` or `right`.';
}
// Returns True if it is valid.
@return true;
}
// A helper function to check the value is valid.
//
// @param {*} $value - The value to check
//
// @return {Bool} True if it is valid, false otherwise.
@function is-direction($value) {
@return validate-direction($value) == true;
}
// Client code
.test {
// Creates a Direction value that is actually a Map.
//
// (
// -type : 'direction',
// -value: 'left'
// )
//
// new() internally calls the Validator & Factory of Direction type.
$direction: new('direction', 'left');
// Gets the value of $direction.
//
// value-of() internally calls the getter of Direction Type
// and returns the value from -value.
float: value-of($direction); // Returns 'left'.
// Sets another Direction value.
//
// set() internally calls the validator & setter of Direction type
// and sets the value to -value.
$direction: set($direction, 'right');
}
/* @todo implements */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment