SolidJS

S

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

Join

Is it possible to create a `createCustomAction$`?

@nksaraf is it technically possible to create a custom createCustomAction$ function that builds on createServerAction$ or server$? This would allow library authors to keep the API simple, making the code more concise. Specifically, I would like to provide a SolidStart integration for my form library Modular Forms to enable the creation of progressively enhanced forms. Below is a code example. ```tsx...

filebased routing for 'regular' csr solidjs

since filebased routing is a vite-plugin and afaik it's isomorphic too, is it possible to set it up in a 'regular' client side rendered solidjs project?

$server v. tRPC

Hello, I'm kicking the tires on solid start and it looks amazing! (been using svelte-kit for past couple months for a project, but decided to give solid-start a try before getting deep in). One noob question I have is being able to make rpc call by simply defining $server function is -- like I said -- A M A Z I N G !!! -- so, why are folks using tRPC? (unless to other server backend).

useBeforeLeave or similar for tracking route change in Start

I need to track route changes within Start. Solid Router comes with useBeforeLeave which I can use to track the page the user is moving to however Start doesn't export it. Is everyone else importing router directly in this case?

useParams doesn't auto decode URI component?

I am getting %20 instead of spaces in my app

How to send data between different pages using Solid js?

Hello! I need to send user's phone number between 2 different pages. I know I could use a browser's Session Storage to do that but I'm not sure it is a good practice. Is there smth like VueX in vue.js or other ideas?

How would I wrap over some p5.js code to create a solid component

I want to make confetti in Solid. I found this Codepen: https://codepen.io/Gthibaud/pen/ENzXbp I am thinking though how can I use it. Do I have to rewrite the js code to work for solid or can I wrap over p5.js somehow and put it inside my solid app? API wise I want to essentially create <Confetti /> and then have conditional render in one of the routes to render <Confetti /> for say 2 seconds after successful form submit....

onfocus or onFocus or onFocusIn?

It is probably not solid issue, but not sure which one to use. I upgraded latest solid-js and onFocus seems to be gone, not sure if it was even there before? I tried to use onFocusIn but it seem to work with playwright but not vitest i.e. fireEvent.focus?...

useMatch not updating?

Ive been stuck on this for quite some time, so I would appreciative some help 🙂

Strategies for not calling setters in effects

I'm helping train someone on the dos and donts of reactivity and I got stumped with a pretty basic question regarding calling setters in effects. Most of the time I'm able to design my reactivity to ensure I'm not calling a setter but there's one pattern that got me curious. Say I have a signal that exists at the root of the application. I want a child component deep down the tree to be able to temporarily effect that signal as an override. In my case when I display a modal I want the navigation elements on the page to be hidden then reappear when the modal is closed. This is basically what would seem like the only reasonable solution:...

Scrolling to id is not consistent

Clicking a <A href="/#some_id"> link does nothing if the current route already matches the link completely. Is there a way to fix this behavior, so clicking the link on the same page repeatedly would scroll the element into view?

Refs cleanup when element unmounts

I would have thought the ref update back to "undefined" oncethe element unmounts the same way it updates when the element is created anew. Like is there a way that I can know based on the ref signal, that the element no longer actually exists? Playground:...

Using routeData in context provider at root of page not working

When attempting to use a context provider at the root of the app, routeData doesn't work, and using createRouteData directly results in an error

False positive: `Make sure your app is wrapped in a <Router />` , @solidjs/router 0:7:0 - in npm lib

I have a npm component ( <O_Header) that assumes a router is wrapping it, ie, uses <A> tags wrapping the app in a router: ```jsx /* @refresh reload */ import { render } from 'solid-js/web';...

Weird 404 errors in `undefined:12`

Recently, I have been getting a lot of errors like:
GET http://localhost:3000/assets/index-b543198f.js net::ERR_ABORTED 404 (Not Found)
GET http://localhost:3000/assets/index-b543198f.js net::ERR_ABORTED 404 (Not Found)
...

Dinamyc inline svg

hi everyone, good night i have a question, i am new whit solid js and i want to make a component that can render svg dynamically, these svg are in my public directory, so an example of this cloud be react-svgr, his library can import the svg an render as a component, the result is a inline svg and ou can change his props https://react-svgr.com I saw this method in react to import dinamically a svg, it is posible to make this in solidjs ? ...

how to use useParams inside a ContextProvider

I have something like this ``` return ( <Router> <MyContextProvider>...

How do y'all handle mobile phones in landscape for mediaquery breakpoints

So, we'm using suid/mui that has builtin-breakpoints, so we can do: ``` const ActiveDotPopup = styled(Box)(({ theme }) => ({ // .. basic css...

Accessing child element size from parent.

I'm trying to use createElementSize from primitives. Problem is, It seems it doesn't wait until child is rendered. My page goes blank with error. How to get child element's size properly?...

Fetching data in root.jsx

I have solidStart connected to a local postgre database. I can fetch data from it in files in the "routes" folder using createServerData$ and useRouteData. But that doesn't work in root.jsx. I was hoping to populate a navbar with items from the database. Maybe there is another way to show a component on every route(in this case the nav bar) that can also useRouteData? Or maybe I need to setup an API route to fetch data fro root.jsx?...