tldr: new #csv #webcomponent dropped: https://www.getgrist.com/grist-csv-viewer/

@vanilla,
As of now the #webcomponent state is treated as 2nd class citizen by #w3c

. For now only state which is permitted on declarative syntax is either attributes or payload DOM. Which actually meant for visual and initial state, not the heavy-duty transactional model. If WC would be able to produce and consume the state without custom serialization, it would work on all tiers.

There is a proposal to make it a part of web stack.

Working on it as part of #DeclarativeWebApplication

#WebComponent debugging is fantastic.

Step 1: Open [browser] DevTools.

Step 2: Debug.

No extension necessary.

#webDev #html #javaScript #css

I should be finishing my post on web components but I've been carried away making the demo pretty and creating #Excalidraw diagrams 🙈

Also this is a little embarrassing, but I didn't know how to do flat box shadows until a couple days ago! Gonna put that on everything now 🤩

#webcomponent #WebComponents #webdev

I’m looking for (the holy grail) of a performant, accessible date picker ideally as a #WebComponent or #vanillaJs. The Scottish gov date picker seems to be pretty good - does anyone know of a better one? - https://designsystem.gov.scot/components/date-picker.

I've refactored the code in the original blog post into a fully fledged standalone #webcomponent

https://github.com/dpecos/mastodon-comments

Hopefully that will make it easier to use and integrate into other websites, as it's relying on web standards.

It will also facilitate providing feedback, issues and peeking into latest changes.

Hope you'd like it!

@paulhmason Here we go - a <web-sarcasam> #webComponent:

https://stackblitz.com/edit/sarcasam-and-satire?file=index.html

#webComponents #webDev

The only thing https://share-on-mastodon.social/ lacks is the respect of URLs without protocol specified. I would assume https by default.

#mastodon #javascript #webcomponent

@micahilbery@mastodon.online

I'm looking for a new position as a Software Engineer. I have 10+ years expierence, and I'm looking for Senior / Staff Roles, Node.js, React, JavaScript, Typescript! #webdev #software #engineer #jobhunt #hiring #nodejs #javascript #typescript #tech #layoff #programming #career #lookingforwork #coder #coding #nextjs #opensource #webcomponent #webcomponents #webDevelopment #softwareEngineering #react #reactjs

I think I need to fork preact-render-to--string and get an return value that also includes a list of all elements used, specifically hyphenated web-components. Then I can conditionally add the the #webcomponent dependency to the page. (this is for a #deno project)

cc thoughts @marvinh ?

https://github.com/preactjs/preact-render-to-string/issues

I tried building simple-mde as a #webcomponent and the bundle is almost a meg... 😭

I work for a company that provides a service to businesses. We give them a <script> which they add to their sites which scrapes the #DOM looking for buttons to hijack with a popup form that then provides our service.

From day one this has felt like an awful hack. Not only does it add to the page's load time, but it causes jank as the scripts DOM manipulation takes effect after load.

Now they are making me work on it and all I want to do is replace it with a #WebComponent.

#webDev #javascript

Just gave Share on Mastodon a go, pretty neat.

Share on Mastodon
A really neat customizable "Share on Mastodon" button for your pages or posts

https://share-on-mastodon.social/

#mastodon #javascript #webcomponent

@micahilbery

And this project has been a testing ground for a #webcomponent library that I've been building Tram-Lite. It's a simple view library, that is more inline with JSX, but is specifically made with vanilla #javascript in mind.

https://github.com/Tram-One/tram-lite

🔗 “HTML with Superpowers” by @davatron5000

#webComponent

⚓️ https://nicolas-hoizey.com/links/2023/05/06/html-with-superpowers/

I'm bothered that https://www.webcomponents.org/publish uses NPM packages as the main way to publish a web component. I want a better web-component "package manager", something that's simple, uses module imports, can use Tailwind and TypeScript, and just plops out a URL like Deno packages do. It would support LIT and webc. I'd want a storybook-like UI and sample code. #webcomponent #webcomponents #webdev #javascript #js #software #frontend #css #html

@francis @nosherwan

In my case, it was three days of dragging myself through the unbearable boilerplate harbor to achieve a somewhat reactive native #WebComponent base. Slot content updates, attributes, limited built-in elements extensibility, fulfilling accessibility considerations that gave only diminishing returns... it was not pretty.

I'm liking the idea of #Astro and I'd wish I jumped on this bandwagon without hesitation.

published a much simplified API for my #go board #WebComponent https://github.com/deebloo/go-board

I've officially released my first #webComponent on #npm - Formula - https://www.npmjs.com/package/@webhelpers/formula

It works with any static HTML5 form and turns into a Reactive Form, all you need to do is wrap the form in `<formula-form>` and it starts working - Demo here https://stackblitz.com/edit/vitejs-vite-skkuff?file=index.html

#webComponents #webDev #html #ReactiveForms

Probably one of the most useful things I’ve made on CodePen is a `<restart-animations>` #WebComponent which restarts all the animations in the pen.

```js
import {RestartAnimationsElement} from 'https://assets.codepen.io/508700/restart-animations.js';

RestartAnimationsElement.define();
```