How can I execute a function from parent?
How does
ref work? I want to execute a function from parent, something like this:
```jsx
// Parent
function Parent () {...add keybinds to buttons
o/
i'd like to make my website possible to use using a keyboard only (similar to monkey type), so i came up with this (probably half-baked) solution to easily bind buttons to keyboard buttons using everything i know about solidjs
here it is: https://gist.github.com/Revxrsal/105163383fa6e84448ff0ad733301b9b
where i use it like this:
```html...
How do I pass props to child components which are accessed through props.children?
I'm coming upon this kind of issue a lot. In this particular case, I have a
<Tabs> component that can have an arbitrary number of <Tab> and <TabContent> children. There are other ways to do this, but this is the way I have chosen. I need to update props.index on the children from the parent; and also set their visibility either through a props.visible property.
1. Is there a way to pass props from parent to child by getting the child through props.children (or some other way)?...How to getUser without doing a server request on every page.
I am following the guide on https://tahazsh.com/blog/building-a-solidjs-app-from-scratch/ (expanding on the session in the https://start.solidjs.com/advanced/session) to create a authentication system in SolidJS Start. It works fine but it loads the if i want to use in a page, it dose a POST request to the backend server each time the page is loaded. How can i cache the user in the client, that also updates if the user logs out.
```export function routeData() {
const user = createServerData$(async (_, { request }) => {
const user = await getUser(request);...
can i propagate event to child?
is there a mechanism to propagate click event from parent to child?
or is there any alternative? for example by returning component and a signal
Accessor.
but todo so, i need factory function. i want to avoid the need for factory function....Interpolate percentage?
o/ I have this basic clock implementation (https://gist.github.com/Revxrsal/faf598ac48efb9db0b11769ce9ac408d)
and it renders like this: https://gyazo.com/804070195d25a5cc5baf4115af74f30a
I wonder if there's any way to make it smoother? I know other UI libraries (not in web dev tho) that achieve this with animating floats by interpolating them into certain values. maybe solid-transition-group can help?...
Reading localstorage theme value before rendering components not working
I'm setting up a theme toggle. It can successfully set the theme in localstorage. When loading a specific theme from storage, there is a brief "flash" of the default theme before converting to the desired theme.
Here is the function that loads the theme from localstorage. It's being loaded within the
<Head/> tag from Solid Start.
```jsx
function themeScript() {...Lazy loading routes instead of components
Hi,
I'd like to have a separate file for each main route, but I'm not sure how to do that using lazy
```js...
minimal ssr|ssg-setup, general pointers for solid on the server
I am hacking around with having a solid jsx-template generate a typescript-file describing the schema (https://codesandbox.io/p/github/bigmistqke/solid-three-parser/master?file=%2Fsrc%2FCMSApp.tsx be aware it's a bit unconventional).
I have the typing sorted, but I need to open the browser to generate them. Ideally it would generate those types and save them in a file everytime I change them (inspired by payloadcms), without having to open the browser, but I am a bit puzzled with what would be the best way to approach that. It does not need reactivity, so I believe it could be done in node and ssr-mode, but am a complete noob regarding solid on the server so could really use some points.
I thought a more minimal set-up, compared to solidstart, could help for me to play around with this, but can not immediately find anything when googling. if something like this would be possible in solidstart i would also be interested in these suggestions!...
Authorization still triggering fetch when using conditional routing for AuthProvider
Hi guys and girls, I'm currently running into an issue where I have some basic routing in an auth provider. On mount it checks if there is a user / session. If no session or user is present, I redirect to the
/login page. This all works. The minute I am not logged in, but visit / or /bookings it still runs any createResource present on that page. In my use case I'm actually using createCachedResource which is @lxsmnsyc library. In my case the cache is storing the empty results when I login again. Was wondering how you'd go about preventing anything from fetching until the auth is resolved.
What I see happening is, when you visit /bookings and you're not logged in, it runs that route figures out if you're logged in or not, then redirects to login. But at that point the fetcher has already started....Best way to Read JSON files (Locally Stored)
Hello all,
Just picked up Solid for the first time today after learning a little react.
1) Where is the best place to get the most up to date documentation? The SolidJS website is a little light on specific syntax and such compared to other languages and frameworks.
2) I have a locally stored JSON file which I want to read from (Displaying names, descriptions and pictures of items for e-commerce store.) What is the best way to get that info?...
Fetching resources only when logged in
```js
export default function Dashboard() {
const { createToast, styles } = useToast()
const { logged, user } = useAuth()...
Does mergeProps deep merge objects?
I have a syntax on my components where I define styles with an
atoms prop like <MyComponent atoms={{*some styles}} />. As I am building out by components, I want to be able to set base styles with this prop but also allow the consumer of the component to define an atoms prop and have it merge with the base styles. I'm currently using lodash merge for this but was wondering if the mergeProps function could help here.
Current Method: (<Text /> takes the atoms prop)
```jsx
import { merge } from 'lodash';...Smooth scroll
Hi, in react-router there is a smooth scroll href/link component. I cant find the alternative for solid. Does anybody know about smooth scroll for solid?
Like when navigating on the same page to an element with id it shouldsmooth scroll to it.
Thanks for any idea...
How to pass classes to custom component
Hi,
lets say I have this example component
```jsx
function Content(props) {...
Has anyone gotten AWS Amplify to work with Solid.js?
I've been relying on the Cognito Hosten UI, AWS provides, and I can start the correct sign up UI and will be redirected back to my Solid.js site.
Unfortunately neither using the
code myself nor using the AWS Amplify library to handle the code worked.
In the react apps I used previously, I used the withAuthenticator HOC provided by 'aws-amplify-react'...click outside directive in typescript
o/ i'm trying to implement https://www.solidjs.com/tutorial/bindings_directives?solved but in typescript. not sure what to fill types in (other than
any). any idea?