SolidJS

S

SolidJS

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

Join

Access dynamic route params in components outside of the FileRouter

In this structure: ``` <Body class="h-full bg-slate-900 text-slate-300"> <ErrorBoundary>...

classList not working on icons svg

```js import { IoCloseOutline } from 'solid-icons/io' <li class="text-dark flex items-center border-2 rounded-full w-auto">...

useParams not working

hey, I wanted to have my fetch functions for resources in separate file but when I use useParams inside of the fetch function it works just fine the first time but if I switch to different route it returns a proxy object with no params in my layout its not detecting the params even though its there SidePanel.jsx:...

SolidStart - Can't use 'os' module.

I just created solid-start project, Then I want to print 'os' homeDir in app. But I see this error. Error: Module "os" has been externalized for browser compatibility. Cannot access "os.homedir" in client code....

Solid Playground error in style tags

I am getting a weird error when using style tags in the solid playground. https://playground.solidjs.com/anonymous/99ed027e-f5e6-4861-9608-2de8b21acccf It feels like a bug because the styles are still applied correctly, its just showing an error in the editor....

How to change child child value?

https://stackblitz.com/edit/github-gp2gff?file=src%2FApp.tsx I'm trying to make some kind of parser, but I don't know how to fix this problem. Any help?...

Please remove Portal's div wrapper...

I don't understand why <Portal> wrap my component in new div... Is there no way to remove it??...

Keep 'DEV' in production-mode

I would like to make use of the $NAME-symbol from solid-js/store (for my experimentations at https://github.com/bigmistqke/solid-yjs-store, so i can allow multiple store-paths leading to the same reactive value). this is currently only exported as part of DEV afaik. Is there a way how to keep DEV available when doing a production-build?

setting getter in store on already defined key loses reactivity

```const [store, setStore] = createStore({ value: 0, alreadyDefinedKey: {}}); setStore('newKey', { get get() { return store.value...

Can I change the requested URL in a middleware?

I created a page middleware, and I'd like to update the requested URL from foo/bar to bim/bam/boum in the event object? Here's my skeleton code: ```ts export const useBackendPathResolver = ({ forward }: MiddlewareInput) => { return async (event: FetchEvent) => {...

How to set a cookie when using `createRouteData` or `createServerData$`?

For user authentication it may be necessary to set a cookie. In Remix, for example, it is solved so that a loader can either directly return a value or alternatively a Response. The Response can then be used to set the Set-Cookie header. Remix seems to recognize whether the values are returned directly or via a Response, e.g. with json({...}), and interprets the types correctly when calling useLoaderData<typeof loader>(). This does not seem to work with SolidStart. Is there an alte...

Reactive CSS's prefers-color-scheme ?

I want to detect CSS prefers-color-scheme's changed. I can make a event listener like `window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => { ...

Ref is undefined unless I wrap in createEffect, if, and setTimeout

I'm appending a ref to the end of an array. It's always undefined unless I do it like this: createEffect(() => { if (fetchedBookInfo.state === 'ready') setTimeout(() => setAllParagraphs([...allParagraphs(), bookInfoRef]))...

How to make createEffect to mutate two signals by condition?

I have two tabs component. Left tabs, Right Tabs. If user clicks left tabs's item, selected right tabs's item should be de-selected. vice-versa. I made this code. but it doesn't work....

How to recover scroll bar position with Show?

I'm using <Show> to render component. The component has scroll bar. But when I re-render if <Show when = { true } > I lost scroll bar position....

Better way of reusing event listeners for hooks

I have a hook for the window size. ``` import { Accessor, onCleanup, onMount } from 'solid-js'; import { createSignal } from 'solid-js';...

Route actions

So, route actions should be in route files and their dispatchers passed to components? If I want more route actions I just add them below? Is it possible to create route action outside of route file and import only [loading, echo]?...

problem with canvas

I'm having a quite weird problem currently. I am trying to port react-snowfall to solid (https://github.com/apollo79/solid-snowfall) and therefore working with a canvas. The code is, simplified like this: ```ts const [canvasRef, setCanvasRef] = createSignal<HTMLCanvasElement>(null as unknown as HTMLCanvasElement);...

Saving md to jsx files in a folder with vitejs & solid-jsx

hi, i have many md files in a folder and i want vite to convert all of them to jsx and store them in a folder, is this possible?