Struct ListValues 

pub struct ListValues<Str, ArrayStr, MapStr> {
    pub prop: PropertyName<Str, ArrayStr>,
    pub values: MapStr,
    pub namespace: Option<Str>,
    pub extra_rule_css: Option<ArrayStr>,
    pub extra_css: Option<MapStr>,
    pub extra_class: Option<Str>,
    pub extra_slash: Option<ExtraSlash<Str, MapStr>>,
}

Define a plugin using a map between utility classes and the values of a single CSS property.

If you instead need to generate several CSS properties or to have more control on the CSS lines generated, use ListProperties.

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

const PLUGIN: StaticPlugin = Plugin::ListValues(ListValues {
    prop: SingleProp("width"),
    values: map! {
        "w-fit" => "fit-content",
        "w-max" => "max-content",
        "w-min" => "min-content",
    },
    ..ListValues::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["w-max"], &config);

assert!(generated.ends_with(r".w-max {
  width: max-content;
}"));

Example in TOML

[[custom_plugins]]

[custom_plugins.ListValues]
prop = "width"

[custom_plugins.ListValues.values]
w-fit = "fit-content"
w-max = "max-content"
w-min = "min-content"

Fields

prop: PropertyName<Str, ArrayStr>

The CSS property name of the generated CSS rule.

It can be a single property using PropertyName::SingleProp or a list of properties using PropertyName::MultipleProps, in which case the value will be copied for all properties.

This field should be assigned separately after calling ListValues::default (or ListValues::default_dynamic).

values: MapStr

The map between utility classes and the CSS values of the property ListValues::prop.

This field should be assigned separately after calling ListValues::default (or ListValues::default_dynamic).

namespace: Option<Str>

Define a namespace (i.e a prefix) common to all utility classes declared in the map keys.

The last dash character (-) should be omitted due to the way the parsing of utility classes work (e.g in the example below, overflow is correct while overflow- is incorrect).

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

const PLUGIN: StaticPlugin = Plugin::ListValues(ListValues {
    namespace: Some("w"),
    prop: SingleProp("width"),
    values: map! {
        "fit" => "fit-content",
        "max" => "max-content",
        "min" => "min-content",
    },
    ..ListValues::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["w-max"], &config);

assert!(generated.ends_with(r".w-max {
  width: max-content;
}"));

extra_rule_css: Option<ArrayStr>

Add one or several extra CSS line(s) inside the CSS rule generated for the utility class.

This field takes an array which represents the CSS lines that will be properly indented and added, one after another, in the order they are defined, to the CSS rule.

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

const PLUGIN: StaticPlugin = Plugin::Spacing(Spacing {
    namespace: "custom-translate-x",
    prop: SingleProp("--translate-x"),
    extra_rule_css: Some(&["transform: translate(var(--translate-x), 12px);"]),
    ..Spacing::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["custom-translate-x-8"], &config);

assert!(generated.ends_with(".custom-translate-x-8 {
  --translate-x: 2rem;
  transform: translate(var(--translate-x), 12px);
}"));

Example in TOML

[[custom_plugins]]

[custom_plugins.Spacing]
namespace = "custom-translate-x"
prop = "--translate-x"
extra_rule_css = ["transform: translate(var(--translate-x), 12px);"]

extra_css: Option<MapStr>

Add one or several extra CSS line(s) outside the CSS rule generated for the utility class.

The argument is a map which allows choosing the added CSS based on the modifier value.

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

const SPIN_ANIMATION: &str = "@keyframes anim-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}\n\n";

const FADE_IN_ANIMATION: &str = "@keyframes anim-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}\n\n";

const PLUGIN: StaticPlugin = Plugin::ListValues(ListValues {
    prop: SingleProp("animation"),
    values: map! {
        "custom-animate-spin" => "anim-spin",
        "custom-animate-fade-in" => "anim-fade-in",
    },
    extra_css: Some(map! {
        "custom-animate-spin" => SPIN_ANIMATION,
        "custom-animate-fade-in" => FADE_IN_ANIMATION,
    }),
    ..ListValues::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["custom-animate-spin"], &config);

assert!(generated.ends_with("@keyframes anim-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.custom-animate-spin {
  animation: anim-spin;
}"));

Example in TOML

[[custom_plugins]]

[custom_plugins.ListValues]
prop = "animation"

[custom_plugins.ListValues.values]
custom-animate-spin = "anim-spin"
custom-animate-fade-in = "anim-fade-in"

[custom_plugins.ListValues.extra_css]
custom-animate-spin = """@keyframes anim-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}\n\n"""
custom-animate-fade-in = """@keyframes anim-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}\n\n"""

extra_class: Option<Str>

Add a suffix string to the class selector of the generated CSS rule.

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

pub(crate) const PLUGIN: StaticPlugin = Plugin::Spacing(Spacing {
    namespace: "custom-divide",
    prop: SingleProp("margin-inline"),
    extra_class: Some(" > :not(:last-child)"),
    ..Spacing::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["custom-divide-2"], &config);

assert!(generated.ends_with(".custom-divide-2 > :not(:last-child) {
  margin-inline: 0.5rem;
}"));

Example in TOML

[[custom_plugins]]

[custom_plugins.Spacing]
namespace = "custom-divide"
prop = "margin-inline"
extra_class = " > :not(:last-child)"

extra_slash: Option<ExtraSlash<Str, MapStr>>

Add support for an extra slash (/) followed by a value for the utility classes handled by this plugin.

In practice, you give it a map with the accepted values after the slash as keys and the values you need to insert into the CSS value as values, as well as a default value in case no slash is found. Then, you add the placeholder {/} to your CSS values (or templates) and it will be replaced with the specified value.

Example

use encre_css::{Config, generate};
use encre_css::prelude::build_plugin::*;

pub(crate) const PLUGIN: StaticPlugin = Plugin::ListValues(ListValues {
    prop: SingleProp("background-image"),
    values: map! {
        "custom-bg-img" => "linear-gradient(to top in {/}, #00aaff, #00ffaa)",
    },
    extra_slash: Some(ExtraSlash {
        values: map! {
            "increasing" => "oklch increasing hue",
            "oklab" => "oklab",
        },
        default: "oklab",
    }),
    ..ListValues::default()
});

let mut config = Config::default();
config.register_plugin(&PLUGIN);

let generated = generate(["custom-bg-img", "custom-bg-img/increasing"], &config);

assert!(generated.ends_with(".custom-bg-img {
  background-image: linear-gradient(to top in oklab, #00aaff, #00ffaa);
}

.custom-bg-img\\/increasing {
  background-image: linear-gradient(to top in oklch increasing hue, #00aaff, #00ffaa);
}"));

Example in TOML

[[custom_plugins]]

[custom_plugins.ListValues]
prop = "background-image"

[custom_plugins.ListValues.values]
custom-bg-img = "linear-gradient(to top in {/}, #00aaff, #00ffaa)"

[custom_plugins.ListValues.extra_slash]
default = "oklab"

[custom_plugins.ListValues.extra_slash.values]
increasing = "oklch increasing hue"
oklab = "oklab"

Implementations

impl<ArrayStr> ListValues<&'static str, ArrayStr, Map<&'static str, &'static str>>

pub const fn default() -> Self

Make a default ListValues plugin kind.

All required fields are initialized with empty values and optional fields are initialized with None.

You should at least set ListValues::prop and ListValues::values after calling this function.

This function is intended to be used as an automatic filler for default values using the struct update syntax.

The difference with ListValues::default_dynamic is that this function can only be used to build a plugin using static structures like &[]s, &'static strs.

Example

use encre_css::prelude::build_plugin::*;

const PLUGIN: StaticPlugin = Plugin::ListValues(ListValues {
    prop: SingleProp("width"),
    values: map! {
        "w-fit" => "fit-content",
        "w-max" => "max-content",
        "w-min" => "min-content",
    },
    ..ListValues::default()
});

impl<ArrayStr> ListValues<String, ArrayStr, HashMap<String, String>>

pub fn default_dynamic() -> Self

Make a default ListValues plugin kind.

All required fields are initialized with empty values and optional fields are initialized with None.

You should at least set ListValues::prop and ListValues::values after calling this function.

This function is intended to be used as an automatic filler for default values using the struct update syntax.

The difference with ListProperties::default is that this function can only be used to build a plugin using heap-allocated structures like Strings, Vecs.

Example

use std::collections::HashMap;
use encre_css::prelude::build_plugin::*;

fn main() {
    let values = HashMap::from_iter(
        ["fit", "max", "min"].iter().map(|v| {
            (format!("w-{v}"), format!("width: {v}-content;"))
        })
    );

    // Note: the DynamicPlugin type hint is required to help the compiler
    // find the concrete types of type parameters
    let _plugin: DynamicPlugin = Plugin::ListValues(ListValues {
        prop: SingleProp("width".to_string()),
        values,
        ..ListValues::default_dynamic()
    });
}

This example is equivalent to the one of ListValues::default.

Trait Implementations

impl<Str: Clone, ArrayStr: Clone, MapStr: Clone> Clone for ListValues<Str, ArrayStr, MapStr>

fn clone(&self) -> ListValues<Str, ArrayStr, MapStr>

Returns a duplicate of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl<Str: Debug, ArrayStr: Debug, MapStr: Debug> Debug for ListValues<Str, ArrayStr, MapStr>

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl<'de, Str, ArrayStr, MapStr> Deserialize<'de> for ListValues<Str, ArrayStr, MapStr>

where Str: Deserialize<'de>, ArrayStr: Deserialize<'de>, MapStr: Deserialize<'de>,

fn deserialize<__D>(__deserializer: __D) -> Result<Self, __D::Error>

where __D: Deserializer<'de>,

Deserialize this value from the given Serde deserializer.

impl<Str, ArrayStr, MapStr> Serialize for ListValues<Str, ArrayStr, MapStr>

where Str: Serialize, ArrayStr: Serialize, MapStr: Serialize,

fn serialize<__S>(&self, __serializer: __S) -> Result<__S::Ok, __S::Error>

where __S: Serializer,

Serialize this value into the given Serde serializer.