Re: [csswg-drafts] [css-mixins] custom mixins & functions should have some access to custom properties on the calling element. How much? (#9938)

Second thought: **Custom function do not need external variable access at all!**

From my experience in other languages, external variables are a must only in two scenarios:

1. The function needs to maintain a mutable state across multiple calls. However, there are no mutable variables in CSS. I can't imagine adding mutable variables into a declarative language like CSS.

2. The function (let's call it `f`) is passed to a high order function (`g`), and `g` invokes `f` with fewer parameters than `f`'s original signature. Then we need to wrap `f` in a lambda that captures some external variables. But I don't think we need to introduce higher order functions and lambdas to CSS, at least for now.

So, in the end, an external variable is equivalent to another parameter. For example, we can convert the former into the latter below to eliminate external variable access:

```css
@function --fun(--x) {
  result: calc(var(--x) + var(--y));
}
.elem {
  --y: 10;
  width: calc(--fun(5)) * 1px;
}
```

```css
@function --fun(--x, --y) {
  result: calc(var(--x) + var(--y));
}
.elem {
  --y: 10;
  width: calc(--fun(5, --y)) * 1px;
}
```

Therefore, functions do not need external variables. They must list all their input as parameters. Then dependency analysis remains simple and clear, as the dependency of `--func(--x, --y)` is the same as `var(--x), var(--y)`. Functions themselves don't introduce any extra dependency.

---

And if there are verbosity concerns, we can add some sugar by introducing default values and allowing callers to omit one or more trailing parameters. For example, if a function `@function --fun(--x, --y)` is often called as `--fun(something, --y)`, then the caller can call it simply as `--fun(something)`, and it will be automatically expanded into `--fun(something, --y)`.

-- 
GitHub Notification of comment by xiaochengh
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9938#issuecomment-1974175846 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Saturday, 2 March 2024 01:39:44 UTC