#hsml — Public Fediverse posts

#hsml #playground #opensource

https://hsml-lab.github.io/playground/#c:CYSwbgFAzgDghgYwKYFoCeKBMBKAUAAn1EgDMB7AOwBcUBbJUAV1u3wG838ASKiAcihIqVEBQDmUAHQwATmRIgANkklwYMJHBlwKyaXIXKA+vSpxgcM31YBfGwSLgIVJAA8aUWgBp8L9ykEESgsZNFYObl4BIRFxKVl5JRU1DS0dPQTDJBMhc0s4I2AkKAQ+HwBtWjhXAEEEIMZqADEQJEVgAGEyRqoAXVt7QmIIEmVXAF4AIgA-fCDFfDE1ABZJvEIhpzAUchkpkHxRfAU2zu7qSZ8ALgBrJDR9y+OxqdmlmABmJ5AXWigUZDUJAydYbQhdWi0SgAETkMGAZAA7hQIDIkCQpsA4QjkU8YIpEEh6NQpsoSFQ1g4weCyJDKAAVMhkRQiGAQK5BIEkyY8fhUJkskAwaQgBA3Iw6IyiyjWSnU6kAI0YwkozjQGimSpVFCeCqoFBQiBElBQ0oooPlYOGHIJUCgUxO7QAkpyoOUDih8ABGXr4AA+fvwfBAKBkICuAEdGMVjQaqjIbnw5ZbfvjLEgIABiGBkdTAi2W4ajNyvfCI7QwRZqFBep5VVwoREoABsAAYfLRMB2kF6C5b8BCoRRGczWRBtrsphAzT4-FRWEdEA1mq1na6nrd7vtORvOS5uXPk-2wamCS5x6aMZM5-gAITjcZBgBSZFEDCTfePhC1-JRVHVSCasqv66vqhoILGpqcj4AACCCKKKNxTAgAAWTKCC6qoet6s5uPOR5ftSwxzigriKNc8FwHa26UARhCiDAyoXlCRSKA6ZAyLQkiOsAUA1MIYZasU7r4J6PqSBQcD0E8-4ateeF4gSyBoe0wIoCRgTBFoaDXGmynMkUew8lEgjCKIEj6IkyiqHmaS6ComRJDkZgWGYRgEgqbSyj4DHKigCpUUgn6+bw2wsW07Gcdxq68fxVCCcqwnYeJYBwIo0YyQBUyHj4elICphnqXhARIJyIQ6fgVx5QVwJTLy0RmXEllZDZqTaPZzVOaYeRual6VIN5hwUIxNABYIeBAA

Sadly the GitHub org name `hsml` is already taken 😿
So today I created https://github.com/hsml-lab and moved all repos into it 🥳

In the next days I hopefully find some energy to setup a backlog and start from there working further on it.

#hsml

@ayo Absolutely crushed by #Vue #Amsterdam 🤯
But now I got energy again to tackle #hsml (I created a first PoC 2 years ago)
However that means I need to learn how to write an #lsp 😳

As you might have seen, I do a pause from #hsml right now
But this is just due to the awesome weather and I enjoy some other little things like starting a new journey in #nomanssky
Also at company work, it is right now totally frustrating and therefore I don’t need so much code right now outside of work 😖

Theoretically only some minor basic stuff is missing
1. doctype for the start of a file
2. comments behind attributes

Then everything basic is implemented and I can start working on other more advanced stuff like formatting and pretty compiled

#hsml

Text blocks are now a thing in #hsml :ablobcatattention:

They can be used to write rich text *like longer lorem ipsum stuff* or **embedded** #css or #javascript!
The text will **not** escaped (#pugjs does this), so you can do stuff like:

```html
.alert.
<span class="closebtn">×</span>
<strong>Danger!</strong> Indicates a dangerous or potentially negative action.
```

This would result in valid #html (*by design*)

https://github.com/Shinigami92/hsml/commit/25a563687464994e9d0cd31c0b9ec604c176f46b

This is a first working example using #vscode with https://github.com/Shinigami92/vscode-hsml

I'm learning how **tmLanguage** is working

#hsml

I made some minimal first steps with #wasm using #wasmpack in #Rust so I can call #hsml in #nodejs 🚀

Now I can try to implement a `vite-plugin-vue-hsml` to support
```
<template lang="hsml"/>
h1 This is hsml :)
</template>
```
in `.vue` files

https://github.com/Shinigami92/hsml/pull/6/files

When using a #cli, what would you prefer?

1. Using `hsml compile .` explicitly and get a warning/error when not providing an input file/folder?

or

2. Using `hsml compile` without an input and it will use the current working directory as default/fallback?

Feel also free to comment why you prefer the one over the other 🙂

#hsml

@surma Ah okay, good to know 👍
In this case I think I will just add a compile flag later on if requested and fill fail by default on duplicate `id`/attribute.
Also I will merge class literals with normal classes.

#hsml

@surma you told us some day that #html can contain multiple same attributes. But is this also possible for `id` or `class`?
I'm currently researching a bit (for #hsml) about this topic and some tools like JSFiddle fails with duplicate `id` not allowed (as same as for `class`).

I wrote down what I have in mind to plan the #cli for #hsml

https://github.com/Shinigami92/hsml/discussions/4

Please do not hesitate to communicate additions or suggested changes

#hsml now supports more complex arbitrary #tailwindcss values 🥳

https://www.youtube.com/watch?v=-nW2j_nVuNk&ab_channel=Shinigami

I'm thinking about how I could design a good #cli for #hsml
I may orientate on existing CLIs like #Rust, #deno or #pnpm

so e.g.

```bash
hsml compile # compiles all .hsml files to .html inside current folder and recursive below
hsml compile ./example.hsml # just compiles the given file
hsml fmt # formats
hsml fmt # just formats given file
hsml parse ./example.hsml # parses the given file and std::out as json AST
```

But I'm not sure if this fulfills all need or if I need to change something

Today I started implementing standalone comments in #hsml
So, it is now possible to add native comments and developer comments
```
// this is a root dev comment
//! this is a root native comment (will get rendered)
div
// this is a child comment
p another tag
//! this is a child comment that gets rendered
```
Comments behind tags in the same line do not work yet, as do comments within attributes, but are definitely planned 🙂

#hsml now has the ability to read a file from the command line and create an HTML file from it 🥳

At the current stage 🚧 of the project, I don't want to release the crate just yet, so you'll need to clone the repo if you want to try it

Then just run e.g. `cargo run -- example.hsml` and an `example.html` will be written (or panic 😜)

*The #cli arguments are subject to change at any time before an official release*

*It uses #clap under the hoo*d

https://github.com/Shinigami92/hsml

#Rust #html #wip

While working on #hsml in #Rust I start to love string slices (`&str`), because it forces me to rethink about how to work with passed strings in functions and that these functions don't just generate new strings in memory that are then returned out of the function.
In #javascript I e.g. just pass strings around and create new ones, that are just polluting the memory, while I could originally just reuse e.g. sub-slices of the original passed slice.

The #Rust community as well as #chatgpt helped me today again to implement attribute parsing for #hsml
Open #todo is to support multi-line attribute values, but that's a task for another day 🙌

also #til a bit more about how to use `&mut` reference passing

The forth day in my entire life I wrote some #Rust 🦀

I started implemented the class parser for arbitrary #tailwind values

`.bg-[#1da1f2]#name Text` already works and results in `("#name Text", ".bg-[#1da1f2]")`

More complex classes like `lg:[&:nth-child(3)]:hover:underline` or `bg-[url('/what_a_rush.png')]` needs to be implemented as well and is not working right now

But for today I will take a break 🙂

#hsml

I asked for help in the #Rust community #discord server about how I could implement a #hsml #parser in the best way and if there is something I should take into account while developing

The two helpers `@Insomnia` and `@Sir Toastie` were really helpful 🧡
They explained some stuff and told me about the #nom #crate

https://docs.rs/nom

This is just perfect for what I need 🙌

I will open the #github repo when I feel more confident about making it public 😉

I have some project ideas, but don't know if they are worth to make them.

One would be a theoretically rewrite of #PugJS in #Rust called #hsml (HyperShortMarkupLanguage). It wont have all features that pug has, but only support native #html syntax without the template engine stuff. So it could be used in #vue or #angular, and it would have some special features over pug like comments in attributes and support for more complex tailwindcss classes, but wont have support for e.g. mixin.