Comments (2)
So thinking more on this I don't think it's actually a bug — when you modify the attr
directly you're literally adding the string $remove:text-orange
. There is no more parsing to be done. The parsed list is what is contained is classes.outer
.
Alternatives:
- Do your
$remove:
at the config level if possible - Do
$remove
via the component props which are part of the parsed pathway and end up becoming theclasses.outer
list. https://formkit.link/8126ad0dee4016979f9a62d0822701fb - Use a
feature
(a plugin that is not inherited by children) to make modifications to the node as part of its definition: https://formkit.link/cffe8a25420a66efc371c01bfaf1bb00
from formkit.
Got it, thank you for your answer!
I think it might be interesting to improve the DX here. Note that I use the conditional here, I'm still learning FormKit and it's totally possible there are very good reasons unknown to me why this is not possible.
First, the string concatenation is not very intuitive / cumbersome. "$classes.outer + ' other-class'"
works, but your brain really wants to write "$classes.outer other-class"
.
I was also sure it was possible to manipulate the $classes.outer
in a way or another... and I tested a lot of things before asking on Discord (you know, the there must be a way to do it feeling).
What came to my mind at first glance when I was looking for a solution was:
- Obviously,
$classes.outer $remove:text-orange
, but then the problem of "removetext-orange
from where?$classes.outer
? What if there are multiple class pools concatened? - So maybe something like
$classes.outer.replace('text-orange', '')
, but I know, it's not javascript, it's explained in the doc (Although it looks very much like JavaScript — schema expressions are not JavaScript. They are better thought of as a templating language) :p It's tempting through. - Maybe
$remove
could be available in$fns
? It's currently not, but since there are functions inside it, is there a way to implement something like$fns.remove($classes.outer, 'text-orange')
? - Maybe it could be possible to access the
$classes.outer
output in JS, manipulate it and then use it in theattrs.class
property. This point is interesting, I think accessing the final classes of a particular section could be awesome (using a helper function, a node function or anything else).
That was feedback as a newcomer writing his first inputs. For now I managed to progress without all that so it's obviously not mandatory :p
Have a nice day!
from formkit.
Related Issues (20)
- Listbox and deletion issues with autocomplete, dropdown, and taglist at FormKit Pro v0.125.0 HOT 2
- Prefix Icon not aligned in Datepicker HOT 2
- Multi-input validation fails to update when there are multiple rules
- Missing loading-state when using `multiple` and `optionLoader` on Autocomplete
- DatePicker selects disabled date by default HOT 6
- Not able To pass Validation condition On input Field
- When a dropdown field that's rendered before fetching the option is pre-filled, it displays the value instead of the label HOT 3
- Hovering dates in datepicker is very slow HOT 2
- Setting initial multi step activeStep does not work HOT 1
- LocalStorage plugin does not preserve uploaded files HOT 1
- Transferlist has accessibility issues. Can be seen by using dev tools lighthouse HOT 1
- Unable to use slots in custom components HOT 2
- Currency field doesn't fire dom-input-event on user's input
- Currency input - label slot not recognised by TS HOT 1
- Field IDs beginning with numbers not valid HOT 5
- Validation not working in currency input HOT 1
- Validation stop firing when custom rule used together with another rule (don't know if just in the described context) HOT 1
- Transfer List Input - Search should be implemented on target list HOT 1
- Form inputs marked as invalid after touch when resetting form HOT 2
- multi-step label attribute don't support i18n HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from formkit.